From 16027678ee20db5cfacc71bc761604201cc55947 Mon Sep 17 00:00:00 2001
From: Zack Pollard <zackpollard@ymail.com>
Date: Thu, 31 Oct 2024 15:06:53 +0000
Subject: [PATCH] chore: move library settings cron expression to setting
 select element (#13856)

---
 .../library-settings/library-settings.svelte  | 35 +++++++------------
 1 file changed, 12 insertions(+), 23 deletions(-)

diff --git a/web/src/lib/components/admin-page/settings/library-settings/library-settings.svelte b/web/src/lib/components/admin-page/settings/library-settings/library-settings.svelte
index 6cf5505d5b..b494dca53f 100644
--- a/web/src/lib/components/admin-page/settings/library-settings/library-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/library-settings/library-settings.svelte
@@ -11,6 +11,7 @@
   import SettingButtonsRow from '$lib/components/shared-components/settings/setting-buttons-row.svelte';
   import { t } from 'svelte-i18n';
   import FormatMessage from '$lib/components/i18n/format-message.svelte';
+  import SettingSelect from '$lib/components/shared-components/settings/setting-select.svelte';
 
   export let savedConfig: SystemConfigDto;
   export let defaultConfig: SystemConfigDto;
@@ -21,10 +22,10 @@
   export let openByDefault = false;
 
   $: 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 * * *' },
-    { title: $t('interval.hours', { values: { hours: 6 } }), expression: '0 */6 * * *' },
+    { text: $t('interval.night_at_midnight'), value: '0 0 * * *' },
+    { text: $t('interval.night_at_twoam'), value: '0 2 * * *' },
+    { text: $t('interval.day_at_onepm'), value: '0 13 * * *' },
+    { text: $t('interval.hours', { values: { hours: 6 } }), value: '0 */6 * * *' },
   ];
 </script>
 
@@ -60,25 +61,13 @@
               bind:checked={config.library.scan.enabled}
             />
 
-            <div class="flex flex-col my-2 dark:text-immich-dark-fg">
-              <label
-                class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm"
-                for="expression-select"
-              >
-                {$t('admin.cron_expression_presets')}
-              </label>
-              <select
-                class="p-2 mt-2 text-sm rounded-lg bg-slate-200 hover:cursor-pointer dark:bg-gray-600"
-                disabled={disabled || !config.library.scan.enabled}
-                name="expression"
-                id="expression-select"
-                bind:value={config.library.scan.cronExpression}
-              >
-                {#each cronExpressionOptions as { title, expression }}
-                  <option value={expression}>{title}</option>
-                {/each}
-              </select>
-            </div>
+            <SettingSelect
+              options={cronExpressionOptions}
+              disabled={disabled || !config.library.scan.enabled}
+              name="expression"
+              label={$t('admin.cron_expression_presets')}
+              bind:value={config.library.scan.cronExpression}
+            />
 
             <SettingInputField
               inputType={SettingInputFieldType.TEXT}