chore(web): another missing translations (#10274)

* chore(web): another missing translations

* unused removed

* more keys

* lint fix

* test fixed

* dynamic translation fix

* fixes

* people search translation

* params fixed

* keep filter setting fix

* lint fix

* $t fixes

* Update web/src/lib/i18n/en.json

Co-authored-by: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>

* another missing

* activity translation

* link sharing translations

* expiration dropdown fix - didn't work localized

* notification title

* device logout

* search results

* reset to default

* unsaved change

* select from computer

* selected

* select-2

* select-3

* unmerge

* pluralize, force icu message

* Update web/src/lib/components/asset-viewer/asset-viewer.svelte

Co-authored-by: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>

* review fixes

* remove user

* plural fixes

* ffmpeg settings

* fixes

* error title

* plural fixes

* onboarding

* change password

* more more

* console log fix

* another

* api key desc

* map marker

* format fix

* key fix

* asset-utils

* utils

* misc

---------

Co-authored-by: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>

web/src/lib/components/faces-page/merge-face-selector.svelte

@@ -82,7 +82,7 @@
       const mergedPerson = await getPerson({ id: person.id });
       const count = results.filter(({ success }) => success).length;
       notificationController.show({
-        message: `Merged ${count} ${count === 1 ? 'person' : 'people'}`,
+        message: $t('merged_people_count', { values: { count: count } }),
         type: NotificationType.Info,
       });
       dispatch('merge', mergedPerson);
@@ -101,7 +101,7 @@
   <ControlAppBar on:close={onClose}>
     <svelte:fragment slot="leading">
       {#if hasSelection}
-        {$t('selected')} {selectedPeople.length}
+        {$t('selected_count', { values: { count: selectedPeople.length } })}
       {:else}
         {$t('merge_people')}
       {/if}

web/src/lib/components/faces-page/merge-suggestion-modal.svelte

@@ -99,10 +99,10 @@
   </div>
 
   <div class="flex px-4 md:pt-4">
-    <h1 class="text-xl text-gray-500 dark:text-gray-300">Are these the same person?</h1>
+    <h1 class="text-xl text-gray-500 dark:text-gray-300">{$t('are_these_the_same_person')}</h1>
   </div>
   <div class="flex px-4 pt-2">
-    <p class="text-sm text-gray-500 dark:text-gray-300">They will be merged together</p>
+    <p class="text-sm text-gray-500 dark:text-gray-300">{$t('they_will_be_merged_together')}</p>
   </div>
   <svelte:fragment slot="sticky-bottom">
     <Button fullwidth color="gray" on:click={() => dispatch('reject')}>{$t('no')}</Button>

web/src/lib/components/faces-page/people-search.svelte

@@ -62,7 +62,7 @@
       searchedPeople = data;
       searchWord = searchName;
     } catch (error) {
-      handleError(error, $t('cant_search_people'));
+      handleError(error, $t('errors.cant_search_people'));
     } finally {
       clearTimeout(timeout);
       timeout = null;

web/src/lib/components/faces-page/person-side-panel.svelte

@@ -68,7 +68,7 @@
       allPeople = people;
       peopleWithFaces = await getFaces({ id: assetId });
     } catch (error) {
-      handleError(error, $t('cant_get_faces'));
+      handleError(error, $t('errors.cant_get_faces'));
     } finally {
       clearTimeout(timeout);
     }
@@ -142,11 +142,11 @@
         }
 
         notificationController.show({
-          message: `Edited ${numberOfChanges} ${numberOfChanges > 1 ? 'people' : 'person'}`,
+          message: $t('people_edits_count', { values: { count: numberOfChanges } }),
           type: NotificationType.Info,
         });
       } catch (error) {
-        handleError(error, $t('cant_apply_changes'));
+        handleError(error, $t('errors.cant_apply_changes'));
       }
     }
 
@@ -194,7 +194,7 @@
         class="justify-self-end rounded-lg p-2 hover:bg-immich-dark-primary hover:dark:bg-immich-dark-primary/50"
         on:click={() => handleEditFaces()}
       >
-        Done
+        {$t('done')}
       </button>
     {:else}
       <LoadingSpinner />
@@ -299,7 +299,7 @@
                   <CircleIconButton
                     color="primary"
                     icon={mdiRestart}
-                    title="Reset"
+                    title={$t('reset')}
                     size="18"
                     padding="1"
                     class="absolute left-1/2 top-1/2 translate-x-[-50%] translate-y-[-50%] transform"

web/src/lib/components/faces-page/set-birth-date-modal.svelte

@@ -24,7 +24,7 @@
 <FullScreenModal title={$t('set_date_of_birth')} icon={mdiCake} onClose={handleCancel}>
   <div class="text-immich-primary dark:text-immich-dark-primary">
     <p class="text-sm dark:text-immich-dark-fg">
-      Date of birth is used to calculate the age of this person at the time of a photo.
+      {$t('birthdate_set_description')}
     </p>
   </div>
 

web/src/lib/components/faces-page/unmerge-face-selector.svelte

@@ -19,7 +19,7 @@
   import { NotificationType, notificationController } from '../shared-components/notification/notification';
   import FaceThumbnail from './face-thumbnail.svelte';
   import PeopleList from './people-list.svelte';
-  import { s } from '$lib/utils';
+  import { t } from 'svelte-i18n';
 
   export let assetIds: string[];
   export let personAssets: PersonResponseDto;
@@ -77,11 +77,11 @@
       await reassignFaces({ id: data.id, assetFaceUpdateDto: { data: selectedPeople } });
 
       notificationController.show({
-        message: `Re-assigned ${assetIds.length} asset${s(assetIds.length)} to a new person`,
+        message: $t('reassigned_assets_to_new_person', { values: { count: assetIds.length } }),
         type: NotificationType.Info,
       });
     } catch (error) {
-      handleError(error, 'Unable to reassign assets to a new person');
+      handleError(error, $t('errors.unable_to_reassign_assets_new_person'));
     } finally {
       clearTimeout(timeout);
     }
@@ -97,14 +97,17 @@
       if (selectedPerson) {
         await reassignFaces({ id: selectedPerson.id, assetFaceUpdateDto: { data: selectedPeople } });
         notificationController.show({
-          message: `Re-assigned ${assetIds.length} asset${s(assetIds.length)} to ${
-            selectedPerson.name || 'an existing person'
-          }`,
+          message: $t('reassigned_assets_to_existing_person', {
+            values: { count: assetIds.length, name: selectedPerson.name || null },
+          }),
           type: NotificationType.Info,
         });
       }
     } catch (error) {
-      handleError(error, `Unable to reassign assets to ${selectedPerson?.name || 'an existing person'}`);
+      handleError(
+        error,
+        $t('errors.unable_to_reassign_assets_existing_person', { values: { name: selectedPerson?.name || null } }),
+      );
     } finally {
       clearTimeout(timeout);
     }
@@ -128,7 +131,7 @@
     <svelte:fragment slot="trailing">
       <div class="flex gap-4">
         <Button
-          title={'Assign selected assets to a new person'}
+          title={$t('create_new_person_hint')}
           size={'sm'}
           disabled={disableButtons || hasSelection}
           on:click={handleCreate}
@@ -138,11 +141,11 @@
           {:else}
             <LoadingSpinner />
           {/if}
-          <span class="ml-2"> Create new Person</span></Button
+          <span class="ml-2"> {$t('create_new_person')}</span></Button
         >
         <Button
           size={'sm'}
-          title={'Assign selected assets to an existing person'}
+          title={$t('reassing_hint')}
           disabled={disableButtons || !hasSelection}
           on:click={handleReassign}
         >
@@ -153,7 +156,7 @@
           {:else}
             <LoadingSpinner />
           {/if}
-          <span class="ml-2"> Reassign</span></Button
+          <span class="ml-2"> {$t('reassign')}</span></Button
         >
       </div>
     </svelte:fragment>