fix: translate hardcoded strings

frontend/components/Domain/Recipe/RecipeOcrEditorPage/RecipeOcrEditorPage.vue

@@ -190,6 +190,8 @@ export default defineComponent({
 
     const drag = ref(false);
 
+    const { i18n } = useContext();
+
     const { recipeAssetPath } = useStaticRoutes();
 
     function assetURL(assetName: string) {
@@ -198,7 +200,7 @@ export default defineComponent({
 
     const state = reactive({
       loading: true,
-      loadingText: "Loading recipe...",
+      loadingText: i18n.tc("general.loading-recipe"),
       tab: null,
       selectedRecipeField: "" as SelectedRecipeLeaves | "",
       canvasSelectedText: "",
@@ -260,7 +262,7 @@ export default defineComponent({
     onMounted(() => {
       invoke(async () => {
         await until(props.recipe).not.toBeNull();
-        state.loadingText = "Loading OCR data...";
+        state.loadingText = i18n.tc("general.loading-ocr-data");
 
         const assetName = props.recipe.assets[0].fileName;
         const imagesrc = assetURL(assetName);

frontend/components/Domain/Recipe/RecipeOcrEditorPage/RecipeOcrEditorPageParts/RecipeOcrEditorPageCanvas.vue

@@ -379,7 +379,7 @@ export default defineComponent({
 
     const toolbarIcons = ref<ToolbarIcons<CanvasModes | SelectedTextSplitModes>>([
       {
-        sectionTitle: "Toolbar",
+        sectionTitle: i18n.tc("ocr-editor.toolbar"),
         eventHandler: switchCanvasMode,
         highlight: state.canvasMode,
         icons: [

frontend/components/Domain/Recipe/RecipeOcrEditorPage/RecipeOcrEditorPageParts/RecipeOcrEditorPageHelp.vue

@@ -4,11 +4,11 @@
       <v-icon large left>
         {{ $globals.icons.help }}
       </v-icon>
-      <v-toolbar-title class="headline"> Help </v-toolbar-title>
+      <v-toolbar-title class="headline"> {{ $t("ocr-editor.help.help") }} </v-toolbar-title>
       <v-spacer></v-spacer>
     </v-app-bar>
     <v-card-text>
-      <h1>Mouse modes</h1>
+      <h1> {{ $t("ocr-editor.help.mouse-modes") }}</h1>
       <v-divider class="mb-2 mt-1" />
       <h2 class="my-2">
         <v-icon> {{ $globals.icons.selectMode }} </v-icon>{{ $t("ocr-editor.help.selection-mode") }}

frontend/components/Domain/Recipe/RecipeOrganizerPage.vue

@@ -15,7 +15,7 @@
 
     <BaseDialog v-if="updateTarget" v-model="dialogs.update" :title="$t('general.update')" @confirm="updateOne()">
       <v-card-text>
-        <v-text-field v-model="updateTarget.name" label="Name"> </v-text-field>
+        <v-text-field v-model="updateTarget.name" label="$t('general.name')"> </v-text-field>
         <v-checkbox v-if="itemType === Organizer.Tool" v-model="updateTarget.onHand" :label="$t('tool.on-hand')"></v-checkbox>
       </v-card-text>
     </BaseDialog>

frontend/components/Domain/Recipe/RecipePage/RecipePage.vue

@@ -142,7 +142,7 @@ export default defineComponent({
     },
   },
   setup(props) {
-    const { $auth, $vuetify } = useContext();
+    const { $auth } = useContext();
     const route = useRoute();
     const groupSlug = computed(() => route.value.params.groupSlug || $auth.user?.groupSlug || "");
     const { isOwnGroup } = useLoggedInState();
@@ -168,8 +168,8 @@ export default defineComponent({
       const isSame = JSON.stringify(props.recipe) === JSON.stringify(originalRecipe.value);
       if (isEditMode.value && !isSame && props.recipe?.slug !== undefined) {
         const save = window.confirm(
-          "You have unsaved changes. Do you want to save before leaving?\n\nOkay to save, Cancel to discard changes."
-        );
+          i18n.tc("general.unsaved-changes"),
+          );
 
         if (save) {
           await api.recipes.updateOne(props.recipe.slug, props.recipe);
@@ -247,6 +247,7 @@ export default defineComponent({
     /** =============================================================
      * View Preferences
      */
+    const { $vuetify, i18n } = useContext();
 
     const landscape = computed(() => {
       const preferLandscape = props.recipe.settings.landscapeView;

frontend/components/Domain/SearchFilter.vue

@@ -10,7 +10,7 @@
       </template>
       <v-card width="400">
         <v-card-text>
-          <v-text-field v-model="state.search" class="mb-2" hide-details dense label="Search" clearable />
+          <v-text-field v-model="state.search" class="mb-2" hide-details dense :label="$tc('search.search')" clearable />
           <v-switch
             v-if="requireAll != undefined"
             v-model="requireAllValue"
@@ -35,7 +35,7 @@
             </v-virtual-scroll>
           </v-card>
           <div v-else>
-            <v-alert type="info" text> No results found </v-alert>
+            <v-alert type="info" text> {{ $tc('search.no-results') }} </v-alert>
           </div>
         </v-card-text>
       </v-card>

frontend/components/global/DropZone.vue

@@ -2,7 +2,7 @@
   <div ref="el" :class="isOverDropZone ? 'over' : ''">
     <div v-if="isOverDropZone" class="overlay"></div>
     <div v-if="isOverDropZone" class="absolute text-container">
-      <p class="text-center drop-text">Drop Image</p>
+      <p class="text-center drop-text"> {{ $t("recipe.drop-image") }} </p>
     </div>
     <slot></slot>
   </div>

frontend/lang/messages/en-US.json

@@ -76,7 +76,8 @@
     "cookbook-events": "Cookbook Events",
     "tag-events": "Tag Events",
     "category-events": "Category Events",
-    "when-a-new-user-joins-your-group": "When a new user joins your group"
+    "when-a-new-user-joins-your-group": "When a new user joins your group",
+    "recipe-events": "Recipe Events"
   },
   "general": {
     "cancel": "Cancel",
@@ -114,6 +115,8 @@
     "keyword": "Keyword",
     "link-copied": "Link Copied",
     "loading-events": "Loading Events",
+    "loading-recipe": "Loading recipe...",
+    "loading-ocr-data": "Loading OCR data...",
     "loading-recipes": "Loading Recipes",
     "message": "Message",
     "monday": "Monday",
@@ -193,7 +196,8 @@
     "export-all": "Export All",
     "refresh": "Refresh",
     "upload-file": "Upload File",
-    "created-on-date": "Created on: {0}"
+    "created-on-date": "Created on: {0}",
+    "unsaved-changes": "You have unsaved changes. Do you want to save before leaving? Okay to save, Cancel to discard changes."
   },
   "group": {
     "are-you-sure-you-want-to-delete-the-group": "Are you sure you want to delete <b>{groupName}<b/>?",
@@ -208,6 +212,7 @@
     "group-id-with-value": "Group ID: {groupID}",
     "group-name": "Group Name",
     "group-not-found": "Group not found",
+    "group-token": "Group Token",
     "group-with-value": "Group: {groupID}",
     "groups": "Groups",
     "manage-groups": "Manage Groups",
@@ -243,6 +248,7 @@
     "general-preferences": "General Preferences",
     "group-recipe-preferences": "Group Recipe Preferences",
     "report": "Report",
+    "report-with-id": "Report ID: {id}",
     "group-management": "Group Management",
     "admin-group-management": "Admin Group Management",
     "admin-group-management-text": "Changes to this group will be reflected immediately.",
@@ -507,6 +513,7 @@
     "message-key": "Message Key",
     "parse": "Parse",
     "attach-images-hint": "Attach images by dragging & dropping them into the editor",
+    "drop-image": "Drop image",
     "enable-ingredient-amounts-to-use-this-feature": "Enable ingredient amounts to use this feature",
     "recipes-with-units-or-foods-defined-cannot-be-parsed": "Recipes with units or foods defined cannot be parsed.",
     "parse-ingredients": "Parse ingredients",
@@ -564,14 +571,17 @@
     "tag-filter": "Tag Filter",
     "search-hint": "Press '/'",
     "advanced": "Advanced",
-    "auto-search": "Auto Search"
+    "auto-search": "Auto Search",
+    "no-results": "No results found"
   },
   "settings": {
     "add-a-new-theme": "Add a New Theme",
     "admin-settings": "Admin Settings",
     "backup": {
+      "backup-created": "Backup created successfully",
       "backup-created-at-response-export_path": "Backup Created at {path}",
       "backup-deleted": "Backup deleted",
+      "restore-success": "Restore successful",
       "backup-tag": "Backup Tag",
       "create-heading": "Create A Backup",
       "delete-backup": "Delete Backup",
@@ -680,11 +690,13 @@
     "configuration": "Configuration",
     "docker-volume": "Docker Volume",
     "docker-volume-help": "Mealie requires that the frontend container and the backend share the same docker volume or storage. This ensures that the frontend container can properly access the images and assets stored on disk.",
-    "volumes-are-misconfigured": "Volumes are misconfigured",
+    "volumes-are-misconfigured": "Volumes are misconfigured.",
     "volumes-are-configured-correctly": "Volumes are configured correctly.",
     "status-unknown-try-running-a-validation": "Status Unknown. Try running a validation.",
     "validate": "Validate",
     "email-configuration-status": "Email Configuration Status",
+    "email-configured": "Email Configured",
+    "email-test-results": "Email Test Results",
     "ready": "Ready",
     "not-ready": "Not Ready - Check Environmental Variables",
     "succeeded": "Succeeded",
@@ -819,6 +831,7 @@
     "password-updated": "Password updated",
     "password": "Password",
     "password-strength": "Password is {strength}",
+    "please-enter-password": "Please enter your new password.",
     "register": "Register",
     "reset-password": "Reset Password",
     "sign-in": "Sign in",
@@ -839,6 +852,7 @@
     "username": "Username",
     "users-header": "USERS",
     "users": "Users",
+    "user-not-found": "User not found",
     "webhook-time": "Webhook Time",
     "webhooks-enabled": "Webhooks Enabled",
     "you-are-not-allowed-to-create-a-user": "You are not allowed to create a user",
@@ -861,6 +875,7 @@
     "user-management": "User Management",
     "reset-locked-users": "Reset Locked Users",
     "admin-user-creation": "Admin User Creation",
+    "admin-user-management": "Admin User Management",
     "user-details": "User Details",
     "user-name": "User Name",
     "authentication-method": "Authentication Method",
@@ -872,7 +887,10 @@
     "user-can-organize-group-data": "User can organize group data",
     "enable-advanced-features": "Enable advanced features",
     "it-looks-like-this-is-your-first-time-logging-in": "It looks like this is your first time logging in.",
-    "dont-want-to-see-this-anymore-be-sure-to-change-your-email": "Don't want to see this anymore? Be sure to change your email in your user settings!"
+    "dont-want-to-see-this-anymore-be-sure-to-change-your-email": "Don't want to see this anymore? Be sure to change your email in your user settings!",
+    "forgot-password": "Forgot Password",
+    "forgot-password-text": "Please enter your email address and we will send you a link to reset your password.",
+    "changes-reflected-immediately": "Changes to this user will be reflected immediately."
   },
   "language-dialog": {
     "translated": "translated",
@@ -974,6 +992,7 @@
   },
   "user-registration": {
     "user-registration": "User Registration",
+    "registration-success": "Registration Success",
     "join-a-group": "Join a Group",
     "create-a-new-group": "Create a New Group",
     "provide-registration-token-description": "Please provide the registration token associated with the group that you'd like to join. You'll need to obtain this from an existing group member.",
@@ -1020,13 +1039,16 @@
   },
   "ocr-editor": {
     "ocr-editor": "Ocr editor",
+    "toolbar": "Toolbar",
     "selection-mode": "Selection mode",
     "pan-and-zoom-picture": "Pan and zoom picture",
     "split-text": "Split text",
     "preserve-line-breaks": "Preserve original line breaks",
     "split-by-block": "Split by text block",
     "flatten": "Flatten regardless of original formating",
     "help": {
+      "help": "Help",
+      "mouse-modes": "Mouse modes",
       "selection-mode": "Selection Mode (default)",
       "selection-mode-desc": "The selection mode is the main mode that can be used to enter data:",
       "selection-mode-steps": {

frontend/pages/admin/maintenance/index.vue

@@ -27,7 +27,7 @@
     </div>
 
     <section>
-      <BaseCardSectionTitle class="pb-0" :icon="$globals.icons.wrench" :title="$t('admin.maintenance.summary-title')">
+      <BaseCardSectionTitle class="pb-0" :icon="$globals.icons.wrench" :title="$tc('admin.maintenance.summary-title')">
       </BaseCardSectionTitle>
       <div class="mb-6 ml-2 d-flex" style="gap: 0.3rem">
         <BaseButton color="info" @click="getSummary">
@@ -55,7 +55,7 @@
       <BaseCardSectionTitle
         class="pb-0 mt-8"
         :icon="$globals.icons.wrench"
-        :title="$t('admin.mainentance.actions-title')"
+        :title="$tc('admin.mainentance.actions-title')"
       >
         <i18n path="admin.maintenance.actions-description">
           <template #destructive-in-bold>
@@ -103,13 +103,14 @@ export default defineComponent({
     });
 
     const adminApi = useAdminApi();
+    const { i18n } = useContext();
 
     // ==========================================================================
     // General Info
 
     const infoResults = ref<MaintenanceSummary>({
-      dataDirSize: "unknown",
-      logFileSize: "unknown",
+      dataDirSize: i18n.tc("about.unknown-version"),
+      logFileSize: i18n.tc("about.unknown-version"),
       cleanableDirs: 0,
       cleanableImages: 0,
     });
@@ -119,16 +120,15 @@ export default defineComponent({
       const { data } = await adminApi.maintenance.getInfo();
 
       infoResults.value = data ?? {
-        dataDirSize: "unknown",
-        logFileSize: "unknown",
+        dataDirSize: i18n.tc("about.unknown-version"),
+        logFileSize: i18n.tc("about.unknown-version"),
         cleanableDirs: 0,
         cleanableImages: 0,
       };
 
       state.fetchingInfo = false;
     }
 
-    const { i18n } = useContext();
 
     const info = computed(() => {
       return [
@@ -163,7 +163,7 @@ export default defineComponent({
     };
 
     function storageDetailsText(key: string) {
-      return storageTitles[key] ?? "unknown";
+      return storageTitles[key] ?? i18n.tc("about.unknown-version");
     }
 
     const storageDetails = ref<MaintenanceStorageDetails | null>(null);

frontend/pages/admin/manage/groups/_id.vue

@@ -24,7 +24,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, useRoute, onMounted, ref } from "@nuxtjs/composition-api";
+import { defineComponent, useRoute, onMounted, ref, useContext } from "@nuxtjs/composition-api";
 import GroupPreferencesEditor from "~/components/Domain/Group/GroupPreferencesEditor.vue";
 import { useAdminApi } from "~/composables/api";
 import { alert } from "~/composables/use-toast";
@@ -39,6 +39,8 @@ export default defineComponent({
   setup() {
     const route = useRoute();
 
+    const { i18n } = useContext();
+
     const groupId = route.value.params.id;
 
     // ==============================================
@@ -56,7 +58,7 @@ export default defineComponent({
       const { data, error } = await adminApi.groups.getOne(groupId);
 
       if (error?.response?.status === 404) {
-        alert.error("User Not Found");
+        alert.error(i18n.tc("user.user-not-found"));
         userError.value = true;
       }