chore(deps): update dependency eslint-plugin-svelte to v3 (#16532)

* chore(deps): update dependency eslint-plugin-svelte to v3

* chore: linting

* chore: rebase

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Daniel Dietzler <mail@ddietzler.dev>
Co-authored-by: Zack Pollard <zackpollard@ymail.com>

web/src/lib/components/admin-page/jobs/jobs-panel.svelte

@@ -169,7 +169,7 @@
 </script>
 
 <div class="flex flex-col gap-7">
-  {#each jobList as [jobName, { title, subtitle, description, disabled, allText, refreshText, missingText, icon, handleCommand: handleCommandOverride }]}
+  {#each jobList as [jobName, { title, subtitle, description, disabled, allText, refreshText, missingText, icon, handleCommand: handleCommandOverride }] (jobName)}
     {@const { jobCounts, queueStatus } = jobs[jobName]}
     <JobTile
       {icon}

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

@@ -46,7 +46,7 @@
 <div>
   <div in:fade={{ duration: 500 }}>
     <form autocomplete="off" {onsubmit}>
-      {#each jobNames as jobName}
+      {#each jobNames as jobName (jobName)}
         <div class="ml-4 mt-4 flex flex-col gap-4">
           {#if isSystemConfigJobDto(jobName)}
             <SettingInputField

web/src/lib/components/admin-page/settings/machine-learning-settings/machine-learning-settings.svelte

@@ -46,7 +46,7 @@
         <hr />
 
         <div>
-          {#each config.machineLearning.urls as _, i}
+          {#each config.machineLearning.urls as _, i (i)}
             {#snippet removeButton()}
               {#if config.machineLearning.urls.length > 1}
                 <CircleIconButton

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

@@ -225,7 +225,7 @@
                   bind:value={selectedPreset}
                   onchange={handlePresetSelection}
                 >
-                  {#each templateOptions.presetOptions as preset}
+                  {#each templateOptions.presetOptions as preset (preset)}
                     <option value={preset}>{renderTemplate(preset)}</option>
                   {/each}
                 </select>
@@ -246,7 +246,7 @@
                 <SettingInputField
                   label={$t('extension')}
                   inputType={SettingInputFieldType.TEXT}
-                  value={'.jpg'}
+                  value=".jpg"
                   disabled
                 />
               </div>

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

@@ -19,6 +19,7 @@
   <h4>{$t('date_and_time').toUpperCase()}</h4>
 </div>
 
+<!-- eslint-disable svelte/no-useless-mustaches -->
 <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>{$t('admin.storage_template_date_time_description')}</p>
@@ -28,7 +29,7 @@
     <div>
       <p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('year').toUpperCase()}</p>
       <ul>
-        {#each options.yearOptions as yearFormat}
+        {#each options.yearOptions as yearFormat, index (index)}
           <li>{'{{'}{yearFormat}{'}}'} - {getLuxonExample(yearFormat)}</li>
         {/each}
       </ul>
@@ -37,7 +38,7 @@
     <div>
       <p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('month').toUpperCase()}</p>
       <ul>
-        {#each options.monthOptions as monthFormat}
+        {#each options.monthOptions as monthFormat, index (index)}
           <li>{'{{'}{monthFormat}{'}}'} - {getLuxonExample(monthFormat)}</li>
         {/each}
       </ul>
@@ -46,7 +47,7 @@
     <div>
       <p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('week').toUpperCase()}</p>
       <ul>
-        {#each options.weekOptions as weekFormat}
+        {#each options.weekOptions as weekFormat, index (index)}
           <li>{'{{'}{weekFormat}{'}}'} - {getLuxonExample(weekFormat)}</li>
         {/each}
       </ul>
@@ -55,7 +56,7 @@
     <div>
       <p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('day').toUpperCase()}</p>
       <ul>
-        {#each options.dayOptions as dayFormat}
+        {#each options.dayOptions as dayFormat, index (index)}
           <li>{'{{'}{dayFormat}{'}}'} - {getLuxonExample(dayFormat)}</li>
         {/each}
       </ul>
@@ -64,7 +65,7 @@
     <div>
       <p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('hour').toUpperCase()}</p>
       <ul>
-        {#each options.hourOptions as dayFormat}
+        {#each options.hourOptions as dayFormat, index (index)}
           <li>{'{{'}{dayFormat}{'}}'} - {getLuxonExample(dayFormat)}</li>
         {/each}
       </ul>
@@ -73,7 +74,7 @@
     <div>
       <p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('minute').toUpperCase()}</p>
       <ul>
-        {#each options.minuteOptions as dayFormat}
+        {#each options.minuteOptions as dayFormat, index (index)}
           <li>{'{{'}{dayFormat}{'}}'} - {getLuxonExample(dayFormat)}</li>
         {/each}
       </ul>
@@ -82,7 +83,7 @@
     <div>
       <p class="font-medium text-immich-primary dark:text-immich-dark-primary">{$t('second').toUpperCase()}</p>
       <ul>
-        {#each options.secondOptions as dayFormat}
+        {#each options.secondOptions as dayFormat, index (index)}
           <li>{'{{'}{dayFormat}{'}}'} - {getLuxonExample(dayFormat)}</li>
         {/each}
       </ul>

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

@@ -92,7 +92,7 @@
               <LoadingSpinner />
             {/if}
 
-            {#each templateConfigs as { label, templateKey, descriptionTags, templateName }}
+            {#each templateConfigs as { label, templateKey, descriptionTags, templateName } (templateKey)}
               <SettingTextarea
                 {label}
                 description={$t('admin.template_email_available_tags', { values: { tags: descriptionTags } })}