From 7187634f184b360764b7d1db8861869248ebdfc3 Mon Sep 17 00:00:00 2001
From: sephrat <34862846+sephrat@users.noreply.github.com>
Date: Mon, 28 Jun 2021 22:28:17 +0200
Subject: [PATCH] Localization (#596)

* Localize recipe import popup

* Add Italian language

* Use named formatting

* Remove unused strings

* Use dedicated strings for the sidebar

This will allow for shorter texts, so the text is not truncated,
without impacting other uses
---
 frontend/src/components/UI/TheRecipeFab.vue   | 12 ++++-----
 frontend/src/components/UI/TheSidebar.vue     | 22 +++++++--------
 frontend/src/locales/messages/en-US.json      | 27 ++++++++++++++-----
 frontend/src/pages/Admin/Profile/UserCard.vue |  2 +-
 frontend/src/plugins/vuetify.js               |  2 ++
 frontend/src/store/modules/language.js        |  4 +++
 6 files changed, 45 insertions(+), 24 deletions(-)

diff --git a/frontend/src/components/UI/TheRecipeFab.vue b/frontend/src/components/UI/TheRecipeFab.vue
index 05e603df7..e9e6cb46d 100644
--- a/frontend/src/components/UI/TheRecipeFab.vue
+++ b/frontend/src/components/UI/TheRecipeFab.vue
@@ -44,13 +44,13 @@
                     target="_blank"
                     rel="noreferrer nofollow"
                   >
-                    Google ld+json Info
+                    {{ $t('new-recipe.google-ld-json-info') }}
                   </a>
                   <a href="https://github.com/hay-kot/mealie/issues" target="_blank" rel="noreferrer nofollow">
-                    GitHub Issues
+                    {{ $t('new-recipe.github-issues') }}
                   </a>
                   <a href="https://schema.org/Recipe" target="_blank" rel="noreferrer nofollow">
-                    Recipe Markup Specification
+                    {{ $t('new-recipe.recipe-markup-specification') }}
                   </a>
                 </div>
                 <div class="d-flex justify-end">
@@ -61,7 +61,7 @@
                     @click="addRecipe = false"
                   >
                     <v-icon left> {{ $globals.icons.externalLink }} </v-icon>
-                    View Scraped Data
+                    {{ $t('new-recipe.view-scraped-data') }}
                   </v-btn>
                 </div>
               </v-alert>
@@ -85,7 +85,7 @@
       </v-card>
     </v-dialog>
     <BaseDialog
-      title="Upload a Recipe"
+      :title="$t('new-recipe.upload-a-recipe')"
       :titleIcon="$globals.icons.zip"
       :submit-text="$t('general.import')"
       ref="uploadZipDialog"
@@ -233,7 +233,7 @@ export default {
     },
     isValidWebUrl(url) {
       let regEx = /^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,256}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)$/gm;
-      return regEx.test(url) ? true : "Must be a Valid URL";
+      return regEx.test(url) ? true : this.$t('new-recipe.must-be-a-valid-url');
     },
   },
 };
diff --git a/frontend/src/components/UI/TheSidebar.vue b/frontend/src/components/UI/TheSidebar.vue
index effe1338d..5d64acde2 100644
--- a/frontend/src/components/UI/TheSidebar.vue
+++ b/frontend/src/components/UI/TheSidebar.vue
@@ -107,27 +107,27 @@ export default {
         {
           icon: this.$globals.icons.home,
           to: "/",
-          title: this.$t("page.home-page"),
+          title: this.$t("sidebar.home-page"),
         },
         {
           icon: this.$globals.icons.search,
           to: "/search",
-          title: this.$t("search.search"),
+          title: this.$t("sidebar.search"),
         },
         {
           icon: this.$globals.icons.viewModule,
           to: "/recipes/all",
-          title: this.$t("page.all-recipes"),
+          title: this.$t("sidebar.all-recipes"),
         },
         {
           icon: this.$globals.icons.tags,
           to: "/recipes/category",
-          title: this.$t("recipe.categories"),
+          title: this.$t("sidebar.categories"),
         },
         {
           icon: this.$globals.icons.tags,
           to: "/recipes/tag",
-          title: this.$t("tag.tags"),
+          title: this.$t("sidebar.tags"),
         },
       ];
     },
@@ -151,7 +151,7 @@ export default {
         {
           icon: this.$globals.icons.user,
           to: "/admin/profile",
-          title: this.$t("settings.profile"),
+          title: this.$t("sidebar.profile"),
         },
       ];
     },
@@ -160,27 +160,27 @@ export default {
         {
           icon: this.$globals.icons.viewDashboard,
           to: "/admin/dashboard",
-          title: this.$t("general.dashboard"),
+          title: this.$t("sidebar.dashboard"),
         },
         {
           icon: this.$globals.icons.cog,
           to: "/admin/settings",
-          title: this.$t("settings.site-settings"),
+          title: this.$t("sidebar.site-settings"),
         },
         {
           icon: this.$globals.icons.tools,
           to: "/admin/toolbox",
-          title: this.$t("settings.toolbox.toolbox"),
+          title: this.$t("sidebar.toolbox"),
         },
         {
           icon: this.$globals.icons.group,
           to: "/admin/manage-users",
-          title: this.$t("user.manage-users"),
+          title: this.$t("sidebar.manage-users"),
         },
         {
           icon: this.$globals.icons.import,
           to: "/admin/migrations",
-          title: this.$t("settings.migrations"),
+          title: this.$t("sidebar.migrations"),
         },
       ];
     },
diff --git a/frontend/src/locales/messages/en-US.json b/frontend/src/locales/messages/en-US.json
index 8162cf7c9..379773eb6 100644
--- a/frontend/src/locales/messages/en-US.json
+++ b/frontend/src/locales/messages/en-US.json
@@ -33,7 +33,6 @@
     "show-assets": "Show Assets"
   },
   "category": {
-    "category": "Category",
     "category-created": "Category created",
     "category-creation-failed": "Category creation failed",
     "category-deleted": "Category Deleted",
@@ -65,7 +64,6 @@
     "copied": "Copied",
     "create": "Create",
     "created": "Created",
-    "current-parenthesis": "(Current)",
     "custom": "Custom",
     "dashboard": "Dashboard",
     "delete": "Delete",
@@ -146,6 +144,7 @@
     "group-id-with-value": "Group ID: {groupID}",
     "group-name": "Group Name",
     "group-not-found": "Group not found",
+    "group-with-value": "Group: {groupID}",
     "groups": "Groups",
     "manage-groups": "Manage Groups",
     "user-group": "User Group",
@@ -198,15 +197,20 @@
     "error-details": "Only websites containing ld+json or microdata can be imported by Mealie. Most major recipe websites support this data structure. If your site cannot be imported but there is json data in the log, please submit a github issue with the URL and data.",
     "error-title": "Looks Like We Couldn't Find Anything",
     "from-url": "Import a Recipe",
+    "github-issues": "GitHub Issues",
+    "google-ld-json-info": "Google ld+json Info",
+    "must-be-a-valid-url": "Must be a Valid URL",
     "paste-in-your-recipe-data-each-line-will-be-treated-as-an-item-in-a-list": "Paste in your recipe data. Each line will be treated as an item in a list",
+    "recipe-markup-specification": "Recipe Markup Specification",
     "recipe-url": "Recipe URL",
+    "upload-a-recipe": "Upload a Recipe",
     "upload-individual-zip-file": "Upload an individual .zip file exported from another Mealie instance.",
-    "url-form-hint": "Copy and paste a link from your favorite recipe website"
+    "url-form-hint": "Copy and paste a link from your favorite recipe website",
+    "view-scraped-data": "View Scraped Data"
   },
   "page": {
     "404-page-not-found": "404 Page not found",
     "all-recipes": "All Recipes",
-    "home-page": "Home Page",
     "new-page-created": "New page created",
     "page": "Page",
     "page-creation-failed": "Page creation failed",
@@ -350,11 +354,9 @@
       "light": "Light",
       "primary": "Primary",
       "secondary": "Secondary",
-      "select-a-theme-from-the-dropdown-or-create-a-new-theme-note-that-the-default-theme-will-be-served-to-all-users-who-have-not-set-a-theme-preference": "Select a theme from the dropdown or create a new theme. Note that the default theme will be served to all users who have not set a theme preference.",
       "success": "Success",
       "switch-to-dark-mode": "Switch to dark mode",
       "switch-to-light-mode": "Switch to light mode",
-      "theme": "Theme",
       "theme-deleted": "Theme deleted",
       "theme-name": "Theme Name",
       "theme-name-is-required": "Theme Name is required.",
@@ -398,6 +400,19 @@
     "shopping-list": "Shopping List",
     "shopping-lists": "Shopping Lists"
   },
+  "sidebar": {
+    "all-recipes": "All Recipes",
+    "categories": "Categories",
+    "dashboard": "Dashboard",
+    "home-page": "Home Page",
+    "manage-users": "Manage Users",
+    "migrations": "Migrations",
+    "profile": "Profile",
+    "search": "Search",
+    "site-settings": "Site Settings",
+    "tags": "Tags",
+    "toolbox": "Toolbox"
+  },
   "signup": {
     "error-signing-up": "Error Signing Up",
     "sign-up": "Sign Up",
diff --git a/frontend/src/pages/Admin/Profile/UserCard.vue b/frontend/src/pages/Admin/Profile/UserCard.vue
index 6f716d184..0432dd56b 100644
--- a/frontend/src/pages/Admin/Profile/UserCard.vue
+++ b/frontend/src/pages/Admin/Profile/UserCard.vue
@@ -13,7 +13,7 @@
         <div class="body-3 grey--text font-weight-light" v-text="$t('user.user-id-with-value', { id: user.id })" />
 
         <h3 class="display-2 font-weight-light text--primary">
-          <small> {{ $t("group.group") }}: {{ user.group }} </small>
+          <small> {{ $t("group.group-with-value", { groupID: user.group }) }}</small>
         </h3>
       </div>
     </template>
diff --git a/frontend/src/plugins/vuetify.js b/frontend/src/plugins/vuetify.js
index b43f388f9..85c19acd7 100644
--- a/frontend/src/plugins/vuetify.js
+++ b/frontend/src/plugins/vuetify.js
@@ -7,6 +7,7 @@ import de from "vuetify/es5/locale/de";
 import en from "vuetify/es5/locale/en";
 import es from "vuetify/es5/locale/es";
 import fr from "vuetify/es5/locale/fr";
+import it from "vuetify/es5/locale/it";
 import nl from "vuetify/es5/locale/nl";
 import pl from "vuetify/es5/locale/pl";
 import sv from "vuetify/es5/locale/sv";
@@ -44,6 +45,7 @@ const vuetify = new Vuetify({
       "en-US": en,
       "es-ES": es,
       "fr-FR": fr,
+      "it-IT": it,
       "nl-NL": nl,
       "pl-PL": pl,
       "sv-SE": sv,
diff --git a/frontend/src/store/modules/language.js b/frontend/src/store/modules/language.js
index d1416609a..8928bd65a 100644
--- a/frontend/src/store/modules/language.js
+++ b/frontend/src/store/modules/language.js
@@ -17,6 +17,10 @@ const state = {
       name: "Français (French)",
       value: "fr-FR",
     },
+    {
+      name: "Italiano (Italian)",
+      value: "it-IT",
+    },
     {
       name: "Nederlands (Dutch)",
       value: "nl-NL",