feat(web): add more translations (#10700)

* feat(web): add more translations

* formatting

web/src/lib/components/admin-page/delete-confirm-dialogue.svelte

@@ -74,7 +74,7 @@
       <div class="flex justify-center m-4 gap-2">
         <Checkbox
           id="queue-user-deletion-checkbox"
-          label="Queue user and assets for immediate deletion"
+          label={$t('admin.user_delete_immediately_checkbox')}
           labelClass="text-sm dark:text-immich-dark-fg"
           bind:checked={forceDelete}
           on:change={() => {

web/src/lib/components/admin-page/settings/auth/auth-settings.svelte

@@ -51,7 +51,7 @@
   >
     <svelte:fragment slot="prompt">
       <div class="flex flex-col gap-4">
-        <p>Are you sure you want to disable all login methods? Login will be completely disabled.</p>
+        <p>{$t('admin.authentication_settings_disable_all')}</p>
         <p>
           <FormatMessage key="admin.authentication_settings_reenable" let:message>
             <a

web/src/lib/components/admin-page/settings/library-settings/library-settings.svelte

@@ -18,7 +18,7 @@
   export let config: SystemConfigDto; // this is the config that is being edited
   export let disabled = false;
 
-  const cronExpressionOptions = [
+  $: cronExpressionOptions = [
     { title: $t('interval.night_at_midnight'), expression: '0 0 * * *' },
     { title: $t('interval.night_at_twoam'), expression: '0 2 * * *' },
     { title: $t('interval.day_at_onepm'), expression: '0 13 * * *' },

web/src/lib/components/admin-page/settings/map-settings/map-settings.svelte

@@ -11,6 +11,7 @@
     SettingInputFieldType,
   } from '$lib/components/shared-components/settings/setting-input-field.svelte';
   import { t } from 'svelte-i18n';
+  import FormatMessage from '$lib/components/i18n/format-message.svelte';
 
   export let savedConfig: SystemConfigDto;
   export let defaultConfig: SystemConfigDto;
@@ -52,12 +53,16 @@
         <SettingAccordion key="reverse-geocoding" title={$t('admin.map_reverse_geocoding_settings')}>
           <svelte:fragment slot="subtitle">
             <p class="text-sm dark:text-immich-dark-fg">
-              Manage <a
-                href="https://immich.app/docs/features/reverse-geocoding"
-                class="underline"
-                target="_blank"
-                rel="noreferrer">{$t('admin.map_reverse_geocoding')}</a
-              > settings
+              <FormatMessage key="admin.map_manage_reverse_geocoding_settings" let:message>
+                <a
+                  href="https://immich.app/docs/features/reverse-geocoding"
+                  class="underline"
+                  target="_blank"
+                  rel="noreferrer"
+                >
+                  {message}
+                </a>
+              </FormatMessage>
             </p>
           </svelte:fragment>
           <div class="ml-4 mt-4 flex flex-col gap-4">

web/src/lib/components/admin-page/settings/storage-template/supported-datetime-panel.svelte

@@ -12,13 +12,13 @@
 </script>
 
 <div class="mt-2 text-sm">
-  <h4>DATE & TIME</h4>
+  <h4>{$t('date_and_time').toUpperCase()}</h4>
 </div>
 
 <div class="mt-2 rounded-lg bg-gray-200 p-4 text-xs dark:bg-gray-700 dark:text-immich-dark-fg">
   <div class="mb-2 text-gray-600 dark:text-immich-dark-fg">
-    <p>Asset's creation timestamp is used for the datetime information</p>
-    <p>Sample time 2022-02-03T04:56:05.250</p>
+    <p>{$t('admin.storage_template_date_time_description')}</p>
+    <p>{$t('admin.storage_template_date_time_sample', { values: { date: '2022-02-03T04:56:05.250' } })}</p>
   </div>
   <div class="flex gap-[40px]">
     <div>