From 2c9dd18f1b4d5697adcd5bdbfd094f7c9557064b Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Thu, 22 Feb 2024 09:58:48 -0800
Subject: [PATCH 01/28] fix: upgrade SvelteKit to 2.5.1 (#7351)

---
 web/package-lock.json | 8 ++++----
 web/package.json      | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/web/package-lock.json b/web/package-lock.json
index 84bd64d3e..78e5caf7c 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -32,7 +32,7 @@
         "@socket.io/component-emitter": "^3.1.0",
         "@sveltejs/adapter-static": "^3.0.1",
         "@sveltejs/enhanced-img": "^0.1.8",
-        "@sveltejs/kit": "^2.5.0",
+        "@sveltejs/kit": "^2.5.1",
         "@sveltejs/vite-plugin-svelte": "^3.0.2",
         "@testing-library/jest-dom": "^6.1.5",
         "@testing-library/svelte": "^4.0.3",
@@ -1859,9 +1859,9 @@
       }
     },
     "node_modules/@sveltejs/kit": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-2.5.0.tgz",
-      "integrity": "sha512-1uyXvzC2Lu1FZa30T4y5jUAC21R309ZMRG0TPt+PPPbNUoDpy8zSmSNVWYaBWxYDqLGQ5oPNWvjvvF2IjJ1jmA==",
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-2.5.1.tgz",
+      "integrity": "sha512-TKj08o3mJCoQNLTdRdGkHPePTCPUGTgkew65RDqjVU3MtPVxljsofXQYfXndHfq0P7KoPRO/0/reF6HesU0Djw==",
       "dev": true,
       "hasInstallScript": true,
       "dependencies": {
diff --git a/web/package.json b/web/package.json
index 1542acc2d..2b53d0645 100644
--- a/web/package.json
+++ b/web/package.json
@@ -27,7 +27,7 @@
     "@socket.io/component-emitter": "^3.1.0",
     "@sveltejs/adapter-static": "^3.0.1",
     "@sveltejs/enhanced-img": "^0.1.8",
-    "@sveltejs/kit": "^2.5.0",
+    "@sveltejs/kit": "^2.5.1",
     "@sveltejs/vite-plugin-svelte": "^3.0.2",
     "@testing-library/jest-dom": "^6.1.5",
     "@testing-library/svelte": "^4.0.3",

From 6bb30291de0a41bcd941d9b8dc6bfe0c3f0feb00 Mon Sep 17 00:00:00 2001
From: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>
Date: Thu, 22 Feb 2024 19:08:55 +0100
Subject: [PATCH 02/28] fix(web): consistent combobox style + improve color
 contrast (#7353)

---
 web/src/lib/components/shared-components/combobox.svelte      | 4 ++--
 .../components/user-settings-page/appearance-settings.svelte  | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/web/src/lib/components/shared-components/combobox.svelte b/web/src/lib/components/shared-components/combobox.svelte
index 45ea116e3..7c1e1f68d 100644
--- a/web/src/lib/components/shared-components/combobox.svelte
+++ b/web/src/lib/components/shared-components/combobox.svelte
@@ -52,7 +52,7 @@
   };
 </script>
 
-<div class="relative w-full" use:clickOutside on:outclick={handleOutClick}>
+<div class="relative w-full dark:text-gray-300 text-gray-700 text-base" use:clickOutside on:outclick={handleOutClick}>
   <div>
     {#if isOpen}
       <div class="absolute inset-y-0 left-0 flex items-center pl-3">
@@ -96,7 +96,7 @@
     <div
       role="listbox"
       transition:fly={{ duration: 250 }}
-      class="absolute text-left w-full max-h-64 overflow-y-auto bg-white dark:bg-gray-800 rounded-b-lg border border-t-0 border-gray-300 dark:border-gray-900 z-10"
+      class="absolute text-left text-sm w-full max-h-64 overflow-y-auto bg-white dark:bg-gray-800 rounded-b-lg border border-t-0 border-gray-300 dark:border-gray-900 z-10"
     >
       {#if filteredOptions.length === 0}
         <div class="px-4 py-2 font-medium">No results</div>
diff --git a/web/src/lib/components/user-settings-page/appearance-settings.svelte b/web/src/lib/components/user-settings-page/appearance-settings.svelte
index db6f28a36..0326cab41 100644
--- a/web/src/lib/components/user-settings-page/appearance-settings.svelte
+++ b/web/src/lib/components/user-settings-page/appearance-settings.svelte
@@ -80,7 +80,7 @@
           checked={$locale == undefined}
           on:toggle={handleToggleLocaleBrowser}
         >
-          <p class="mt-2">{selectedDate}</p>
+          <p class="mt-2 dark:text-gray-400">{selectedDate}</p>
         </SettingSwitch>
       </div>
       {#if $locale !== undefined}

From b3b6426695f222ebc220d307c53cfe8d6caccab4 Mon Sep 17 00:00:00 2001
From: martin <74269598+martabal@users.noreply.github.com>
Date: Fri, 23 Feb 2024 06:01:19 +0100
Subject: [PATCH 03/28] feat(web): configure slideshow (#7219)

* feat: configure slideshow delay

* feat: show/hide progressbar

* fix: slider

* refactor: use grid instead of flex

* fix: default delay

* refactor: progress bar props

* refactor: slideshow settings

* fix: enforce min/max value

* chore: linting

---------

Co-authored-by: Jason Rasmussen <jrasm91@gmail.com>
---
 .../machine-learning-settings.svelte          | 10 +--
 .../asset-viewer/slideshow-bar.svelte         | 39 +++++-----
 web/src/lib/components/elements/slider.svelte | 72 +++++++++++++++++++
 .../components/photos-page/asset-grid.svelte  |  6 +-
 .../progress-bar/progress-bar.svelte          | 45 ++++++------
 .../settings/setting-input-field.svelte       | 20 ++++--
 .../settings/setting-select.svelte            |  4 +-
 .../settings/setting-switch.svelte            | 64 +----------------
 .../lib/components/slideshow-settings.svelte  | 37 ++++++++++
 web/src/lib/stores/slideshow.store.ts         |  5 ++
 10 files changed, 183 insertions(+), 119 deletions(-)
 create mode 100644 web/src/lib/components/elements/slider.svelte
 create mode 100644 web/src/lib/components/slideshow-settings.svelte

diff --git a/web/src/lib/components/admin-page/settings/machine-learning-settings/machine-learning-settings.svelte b/web/src/lib/components/admin-page/settings/machine-learning-settings/machine-learning-settings.svelte
index 6a542d81d..ba24f3aab 100644
--- a/web/src/lib/components/admin-page/settings/machine-learning-settings/machine-learning-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/machine-learning-settings/machine-learning-settings.svelte
@@ -112,8 +112,8 @@
             desc="Minimum confidence score for a face to be detected from 0-1. Lower values will detect more faces but may result in false positives."
             bind:value={config.machineLearning.facialRecognition.minScore}
             step="0.1"
-            min="0"
-            max="1"
+            min={0}
+            max={1}
             disabled={disabled || !config.machineLearning.enabled || !config.machineLearning.facialRecognition.enabled}
             isEdited={config.machineLearning.facialRecognition.minScore !==
               savedConfig.machineLearning.facialRecognition.minScore}
@@ -125,8 +125,8 @@
             desc="Maximum distance between two faces to be considered the same person, ranging from 0-2. Lowering this can prevent labeling two people as the same person, while raising it can prevent labeling the same person as two different people. Note that it is easier to merge two people than to split one person in two, so err on the side of a lower threshold when possible."
             bind:value={config.machineLearning.facialRecognition.maxDistance}
             step="0.1"
-            min="0"
-            max="2"
+            min={0}
+            max={2}
             disabled={disabled || !config.machineLearning.enabled || !config.machineLearning.facialRecognition.enabled}
             isEdited={config.machineLearning.facialRecognition.maxDistance !==
               savedConfig.machineLearning.facialRecognition.maxDistance}
@@ -138,7 +138,7 @@
             desc="The minimum number of recognized faces for a person to be created. Increasing this makes Facial Recognition more precise at the cost of increasing the chance that a face is not assigned to a person."
             bind:value={config.machineLearning.facialRecognition.minFaces}
             step="1"
-            min="1"
+            min={1}
             disabled={disabled || !config.machineLearning.enabled || !config.machineLearning.facialRecognition.enabled}
             isEdited={config.machineLearning.facialRecognition.minFaces !==
               savedConfig.machineLearning.facialRecognition.minFaces}
diff --git a/web/src/lib/components/asset-viewer/slideshow-bar.svelte b/web/src/lib/components/asset-viewer/slideshow-bar.svelte
index c099ae79c..164b0a791 100644
--- a/web/src/lib/components/asset-viewer/slideshow-bar.svelte
+++ b/web/src/lib/components/asset-viewer/slideshow-bar.svelte
@@ -1,23 +1,16 @@
 <script lang="ts">
-  import CircleIconButton from '../elements/buttons/circle-icon-button.svelte';
-  import ProgressBar, { ProgressBarStatus } from '../shared-components/progress-bar/progress-bar.svelte';
+  import CircleIconButton from '$lib/components/elements/buttons/circle-icon-button.svelte';
+  import ProgressBar, { ProgressBarStatus } from '$lib/components/shared-components/progress-bar/progress-bar.svelte';
+  import SlideshowSettings from '$lib/components/slideshow-settings.svelte';
   import { slideshowStore } from '$lib/stores/slideshow.store';
+  import { mdiChevronLeft, mdiChevronRight, mdiClose, mdiCog, mdiPause, mdiPlay } from '@mdi/js';
   import { createEventDispatcher, onDestroy, onMount } from 'svelte';
-  import {
-    mdiChevronLeft,
-    mdiChevronRight,
-    mdiClose,
-    mdiPause,
-    mdiPlay,
-    mdiShuffle,
-    mdiShuffleDisabled,
-  } from '@mdi/js';
 
-  const { slideshowShuffle } = slideshowStore;
-  const { restartProgress, stopProgress } = slideshowStore;
+  const { restartProgress, stopProgress, slideshowDelay, showProgressBar } = slideshowStore;
 
   let progressBarStatus: ProgressBarStatus;
   let progressBar: ProgressBar;
+  let showSettings = false;
 
   let unsubscribeRestart: () => void;
   let unsubscribeStop: () => void;
@@ -54,25 +47,27 @@
 </script>
 
 <div class="m-4 flex gap-2">
-  <CircleIconButton icon={mdiClose} on:click={() => dispatch('close')} title="Exit Slideshow" />
-  {#if $slideshowShuffle}
-    <CircleIconButton icon={mdiShuffle} on:click={() => ($slideshowShuffle = false)} title="Shuffle" />
-  {:else}
-    <CircleIconButton icon={mdiShuffleDisabled} on:click={() => ($slideshowShuffle = true)} title="No shuffle" />
-  {/if}
+  <CircleIconButton buttonSize="50" icon={mdiClose} on:click={() => dispatch('close')} title="Exit Slideshow" />
   <CircleIconButton
+    buttonSize="50"
     icon={progressBarStatus === ProgressBarStatus.Paused ? mdiPlay : mdiPause}
     on:click={() => (progressBarStatus === ProgressBarStatus.Paused ? progressBar.play() : progressBar.pause())}
     title={progressBarStatus === ProgressBarStatus.Paused ? 'Play' : 'Pause'}
   />
-  <CircleIconButton icon={mdiChevronLeft} on:click={() => dispatch('prev')} title="Previous" />
-  <CircleIconButton icon={mdiChevronRight} on:click={() => dispatch('next')} title="Next" />
+  <CircleIconButton buttonSize="50" icon={mdiChevronLeft} on:click={() => dispatch('prev')} title="Previous" />
+  <CircleIconButton buttonSize="50" icon={mdiChevronRight} on:click={() => dispatch('next')} title="Next" />
+  <CircleIconButton buttonSize="50" icon={mdiCog} on:click={() => (showSettings = !showSettings)} title="Next" />
 </div>
 
+{#if showSettings}
+  <SlideshowSettings onClose={() => (showSettings = false)} />
+{/if}
+
 <ProgressBar
   autoplay
+  hidden={!$showProgressBar}
+  duration={$slideshowDelay}
   bind:this={progressBar}
   bind:status={progressBarStatus}
   on:done={() => dispatch('next')}
-  duration={5000}
 />
diff --git a/web/src/lib/components/elements/slider.svelte b/web/src/lib/components/elements/slider.svelte
new file mode 100644
index 000000000..77fe3da94
--- /dev/null
+++ b/web/src/lib/components/elements/slider.svelte
@@ -0,0 +1,72 @@
+<script lang="ts">
+  import { createEventDispatcher } from 'svelte';
+
+  export let checked = false;
+  export let disabled = false;
+
+  const dispatch = createEventDispatcher<{ toggle: boolean }>();
+  const onToggle = (event: Event) => dispatch('toggle', (event.target as HTMLInputElement).checked);
+</script>
+
+<label class="relative inline-block h-[10px] w-[36px] flex-none">
+  <input
+    class="disabled::cursor-not-allowed h-0 w-0 opacity-0"
+    type="checkbox"
+    bind:checked
+    on:click={onToggle}
+    {disabled}
+  />
+
+  {#if disabled}
+    <span class="slider slider-disabled cursor-not-allowed" />
+  {:else}
+    <span class="slider slider-enabled cursor-pointer" />
+  {/if}
+</label>
+
+<style>
+  .slider {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: #ccc;
+    -webkit-transition: 0.4s;
+    transition: 0.4s;
+    border-radius: 34px;
+  }
+
+  input:disabled {
+    cursor: not-allowed;
+  }
+
+  .slider:before {
+    position: absolute;
+    content: '';
+    height: 20px;
+    width: 20px;
+    left: 0px;
+    right: 0px;
+    bottom: -4px;
+    background-color: gray;
+    -webkit-transition: 0.4s;
+    transition: 0.4s;
+    border-radius: 50%;
+  }
+
+  input:checked + .slider:before {
+    -webkit-transform: translateX(18px);
+    -ms-transform: translateX(18px);
+    transform: translateX(18px);
+    background-color: #4250af;
+  }
+
+  input:checked + .slider-disabled {
+    background-color: gray;
+  }
+
+  input:checked + .slider-enabled {
+    background-color: #adcbfa;
+  }
+</style>
diff --git a/web/src/lib/components/photos-page/asset-grid.svelte b/web/src/lib/components/photos-page/asset-grid.svelte
index 60f311129..bfb0edd7e 100644
--- a/web/src/lib/components/photos-page/asset-grid.svelte
+++ b/web/src/lib/components/photos-page/asset-grid.svelte
@@ -456,9 +456,9 @@
       asset={$viewingAsset}
       {isShared}
       {album}
-      on:previous={() => handlePrevious()}
-      on:next={() => handleNext()}
-      on:close={() => handleClose()}
+      on:previous={handlePrevious}
+      on:next={handleNext}
+      on:close={handleClose}
       on:action={({ detail: action }) => handleAction(action.type, action.asset)}
     />
   {/if}
diff --git a/web/src/lib/components/shared-components/progress-bar/progress-bar.svelte b/web/src/lib/components/shared-components/progress-bar/progress-bar.svelte
index ca99f7759..dfc556d71 100644
--- a/web/src/lib/components/shared-components/progress-bar/progress-bar.svelte
+++ b/web/src/lib/components/shared-components/progress-bar/progress-bar.svelte
@@ -15,20 +15,29 @@
    */
   export let autoplay = false;
 
-  /**
-   * Duration in milliseconds
-   * @default 5000
-   */
-  export let duration = 5000;
-
   /**
    * Progress bar status
    */
   export let status: ProgressBarStatus = ProgressBarStatus.Paused;
 
-  let progress = tweened<number>(0, {
-    duration: (from: number, to: number) => (to ? duration * (to - from) : 0),
-  });
+  export let hidden = false;
+
+  export let duration = 5;
+
+  const onChange = () => {
+    progress = setDuration(duration);
+    play();
+  };
+
+  let progress = setDuration(duration);
+
+  $: duration, onChange();
+
+  $: {
+    if ($progress === 1) {
+      dispatch('done');
+    }
+  }
 
   const dispatch = createEventDispatcher<{
     done: void;
@@ -67,17 +76,13 @@
     progress.set(0);
   };
 
-  export const setDuration = (newDuration: number) => {
-    progress = tweened<number>(0, {
-      duration: (from: number, to: number) => (to ? newDuration * (to - from) : 0),
+  function setDuration(newDuration: number) {
+    return tweened<number>(0, {
+      duration: (from: number, to: number) => (to ? newDuration * 1000 * (to - from) : 0),
     });
-  };
-
-  progress.subscribe((value) => {
-    if (value === 1) {
-      dispatch('done');
-    }
-  });
+  }
 </script>
 
-<span class="absolute left-0 h-[3px] bg-immich-primary shadow-2xl" style:width={`${$progress * 100}%`} />
+{#if !hidden}
+  <span class="absolute left-0 h-[3px] bg-immich-primary shadow-2xl" style:width={`${$progress * 100}%`} />
+{/if}
diff --git a/web/src/lib/components/shared-components/settings/setting-input-field.svelte b/web/src/lib/components/shared-components/settings/setting-input-field.svelte
index 3f16cdd43..83cd0e71e 100644
--- a/web/src/lib/components/shared-components/settings/setting-input-field.svelte
+++ b/web/src/lib/components/shared-components/settings/setting-input-field.svelte
@@ -13,8 +13,8 @@
 
   export let inputType: SettingInputFieldType;
   export let value: string | number;
-  export let min = Number.MIN_SAFE_INTEGER.toString();
-  export let max = Number.MAX_SAFE_INTEGER.toString();
+  export let min = Number.MIN_SAFE_INTEGER;
+  export let max = Number.MAX_SAFE_INTEGER;
   export let step = '1';
   export let label = '';
   export let desc = '';
@@ -25,15 +25,23 @@
 
   const handleInput = (e: Event) => {
     value = (e.target as HTMLInputElement).value;
+
     if (inputType === SettingInputFieldType.NUMBER) {
-      value = Number(value) || 0;
+      let newValue = Number(value) || 0;
+      if (newValue < min) {
+        newValue = min;
+      }
+      if (newValue > max) {
+        newValue = max;
+      }
+      value = newValue;
     }
   };
 </script>
 
 <div class="mb-4 w-full">
   <div class={`flex h-[26px] place-items-center gap-1`}>
-    <label class={`immich-form-label text-sm`} for={label}>{label}</label>
+    <label class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm" for={label}>{label}</label>
     {#if required}
       <div class="text-red-400">*</div>
     {/if}
@@ -63,8 +71,8 @@
     id={label}
     name={label}
     type={inputType}
-    {min}
-    {max}
+    min={min.toString()}
+    max={max.toString()}
     {step}
     {required}
     {value}
diff --git a/web/src/lib/components/shared-components/settings/setting-select.svelte b/web/src/lib/components/shared-components/settings/setting-select.svelte
index d79f60a2a..99aa36445 100644
--- a/web/src/lib/components/shared-components/settings/setting-select.svelte
+++ b/web/src/lib/components/shared-components/settings/setting-select.svelte
@@ -25,7 +25,9 @@
 
 <div class="mb-4 w-full">
   <div class={`flex h-[26px] place-items-center gap-1`}>
-    <label class={`immich-form-label text-sm`} for="{name}-select">{label}</label>
+    <label class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm" for="{name}-select"
+      >{label}</label
+    >
 
     {#if isEdited}
       <div
diff --git a/web/src/lib/components/shared-components/settings/setting-switch.svelte b/web/src/lib/components/shared-components/settings/setting-switch.svelte
index 2a06b272c..6bbac760a 100644
--- a/web/src/lib/components/shared-components/settings/setting-switch.svelte
+++ b/web/src/lib/components/shared-components/settings/setting-switch.svelte
@@ -2,6 +2,7 @@
   import { quintOut } from 'svelte/easing';
   import { fly } from 'svelte/transition';
   import { createEventDispatcher } from 'svelte';
+  import Slider from '$lib/components/elements/slider.svelte';
 
   export let title: string;
   export let subtitle = '';
@@ -33,66 +34,5 @@
     <slot />
   </div>
 
-  <label class="relative inline-block h-[10px] w-[36px] flex-none">
-    <input
-      class="disabled::cursor-not-allowed h-0 w-0 opacity-0"
-      type="checkbox"
-      bind:checked
-      on:click={onToggle}
-      {disabled}
-    />
-
-    {#if disabled}
-      <span class="slider slider-disabled cursor-not-allowed" />
-    {:else}
-      <span class="slider slider-enabled cursor-pointer" />
-    {/if}
-  </label>
+  <Slider bind:checked {disabled} on:click={onToggle} />
 </div>
-
-<style>
-  .slider {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    background-color: #ccc;
-    -webkit-transition: 0.4s;
-    transition: 0.4s;
-    border-radius: 34px;
-  }
-
-  input:disabled {
-    cursor: not-allowed;
-  }
-
-  .slider:before {
-    position: absolute;
-    content: '';
-    height: 20px;
-    width: 20px;
-    left: 0px;
-    right: 0px;
-    bottom: -4px;
-    background-color: gray;
-    -webkit-transition: 0.4s;
-    transition: 0.4s;
-    border-radius: 50%;
-  }
-
-  input:checked + .slider:before {
-    -webkit-transform: translateX(18px);
-    -ms-transform: translateX(18px);
-    transform: translateX(18px);
-    background-color: #4250af;
-  }
-
-  input:checked + .slider-disabled {
-    background-color: gray;
-  }
-
-  input:checked + .slider-enabled {
-    background-color: #adcbfa;
-  }
-</style>
diff --git a/web/src/lib/components/slideshow-settings.svelte b/web/src/lib/components/slideshow-settings.svelte
new file mode 100644
index 000000000..0bc970a64
--- /dev/null
+++ b/web/src/lib/components/slideshow-settings.svelte
@@ -0,0 +1,37 @@
+<script lang="ts">
+  import FullScreenModal from '$lib/components/shared-components/full-screen-modal.svelte';
+  import SettingInputField, {
+    SettingInputFieldType,
+  } from '$lib/components/shared-components/settings/setting-input-field.svelte';
+  import SettingSwitch from '$lib/components/shared-components/settings/setting-switch.svelte';
+  import { slideshowStore } from '../stores/slideshow.store';
+  import Button from './elements/buttons/button.svelte';
+
+  const { slideshowShuffle, slideshowDelay, showProgressBar } = slideshowStore;
+
+  export let onClose = () => {};
+</script>
+
+<FullScreenModal on:clickOutside={onClose} on:escape={onClose}>
+  <div
+    class="flex w-96 max-w-lg flex-col gap-8 rounded-3xl border bg-white p-8 shadow-sm dark:border-immich-dark-gray dark:bg-immich-dark-gray"
+  >
+    <h1 class="self-center text-2xl font-medium text-immich-primary dark:text-immich-dark-primary">
+      Slideshow Settings
+    </h1>
+
+    <div class="flex flex-col gap-4 text-immich-primary dark:text-immich-dark-primary">
+      <SettingSwitch title="Shuffle" bind:checked={$slideshowShuffle} />
+      <SettingSwitch title="Show Progress Bar" bind:checked={$showProgressBar} />
+      <SettingInputField
+        inputType={SettingInputFieldType.NUMBER}
+        label="Delay"
+        desc="Number of seconds to display each image"
+        min={1}
+        bind:value={$slideshowDelay}
+      />
+
+      <Button class="w-full" color="gray" on:click={onClose}>Done</Button>
+    </div>
+  </div>
+</FullScreenModal>
diff --git a/web/src/lib/stores/slideshow.store.ts b/web/src/lib/stores/slideshow.store.ts
index 45b570c2e..5b10d6b41 100644
--- a/web/src/lib/stores/slideshow.store.ts
+++ b/web/src/lib/stores/slideshow.store.ts
@@ -14,6 +14,9 @@ function createSlideshowStore() {
   const slideshowShuffle = persisted<boolean>('slideshow-shuffle', true);
   const slideshowState = writable<SlideshowState>(SlideshowState.None);
 
+  const showProgressBar = persisted<boolean>('slideshow-show-progressbar', true);
+  const slideshowDelay = persisted<number>('slideshow-delay', 5, {});
+
   return {
     restartProgress: {
       subscribe: restartState.subscribe,
@@ -39,6 +42,8 @@ function createSlideshowStore() {
     },
     slideshowShuffle,
     slideshowState,
+    slideshowDelay,
+    showProgressBar,
   };
 }
 

From 3cd3411c1f5f5d9fd14218f31a391b3ed9351bae Mon Sep 17 00:00:00 2001
From: martyfuhry <martyfuhry@gmail.com>
Date: Fri, 23 Feb 2024 00:18:02 -0500
Subject: [PATCH 04/28] refactor(mobile): Use hooks to manage Chewie controller
 for video (#7008)

* video loading delayed

* Chewie controller implemented in hook

* fixing look and feel

* Finalizing delay and animations

* Fixes issue with immersive mode showing immediately in videos

* format fix

* Fixes bug where video controls would hide immediately after showing while playing and reverts hide controls timer to 5 seconds

* Fixed rebase issues

---------

Co-authored-by: Alex Tran <alex.tran1502@gmail.com>
---
 .../hooks/chewiew_controller_hook.dart        | 179 ++++++++++++
 .../ui/video_player_controls.dart             |  22 +-
 .../asset_viewer/views/gallery_viewer.dart    |  16 +-
 .../asset_viewer/views/video_viewer_page.dart | 256 +++---------------
 mobile/lib/routing/router.gr.dart             |   4 +-
 mobile/lib/shared/models/asset.dart           |   5 +
 .../shared/ui/delayed_loading_indicator.dart  |  40 +++
 .../shared/views/immich_loading_overlay.dart  |  29 +-
 8 files changed, 313 insertions(+), 238 deletions(-)
 create mode 100644 mobile/lib/modules/asset_viewer/hooks/chewiew_controller_hook.dart
 create mode 100644 mobile/lib/shared/ui/delayed_loading_indicator.dart

diff --git a/mobile/lib/modules/asset_viewer/hooks/chewiew_controller_hook.dart b/mobile/lib/modules/asset_viewer/hooks/chewiew_controller_hook.dart
new file mode 100644
index 000000000..224eb838e
--- /dev/null
+++ b/mobile/lib/modules/asset_viewer/hooks/chewiew_controller_hook.dart
@@ -0,0 +1,179 @@
+import 'dart:async';
+
+import 'package:chewie/chewie.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
+import 'package:immich_mobile/shared/models/asset.dart';
+import 'package:immich_mobile/shared/models/store.dart';
+import 'package:video_player/video_player.dart';
+import 'package:immich_mobile/shared/models/store.dart' as store;
+import 'package:wakelock_plus/wakelock_plus.dart';
+
+/// Provides the initialized video player controller
+/// If the asset is local, use the local file
+/// Otherwise, use a video player with a URL
+ChewieController? useChewieController(
+  Asset asset, {
+  EdgeInsets controlsSafeAreaMinimum = const EdgeInsets.only(
+    bottom: 100,
+  ),
+  bool showOptions = true,
+  bool showControlsOnInitialize = false,
+  bool autoPlay = true,
+  bool autoInitialize = true,
+  bool allowFullScreen = false,
+  bool allowedScreenSleep = false,
+  bool showControls = true,
+  Widget? customControls,
+  Widget? placeholder,
+  Duration hideControlsTimer = const Duration(seconds: 1),
+  VoidCallback? onPlaying,
+  VoidCallback? onPaused,
+  VoidCallback? onVideoEnded,
+}) {
+  return use(
+    _ChewieControllerHook(
+      asset: asset,
+      placeholder: placeholder,
+      showOptions: showOptions,
+      controlsSafeAreaMinimum: controlsSafeAreaMinimum,
+      autoPlay: autoPlay,
+      allowFullScreen: allowFullScreen,
+      customControls: customControls,
+      hideControlsTimer: hideControlsTimer,
+      showControlsOnInitialize: showControlsOnInitialize,
+      showControls: showControls,
+      autoInitialize: autoInitialize,
+      allowedScreenSleep: allowedScreenSleep,
+      onPlaying: onPlaying,
+      onPaused: onPaused,
+      onVideoEnded: onVideoEnded,
+    ),
+  );
+}
+
+class _ChewieControllerHook extends Hook<ChewieController?> {
+  final Asset asset;
+  final EdgeInsets controlsSafeAreaMinimum;
+  final bool showOptions;
+  final bool showControlsOnInitialize;
+  final bool autoPlay;
+  final bool autoInitialize;
+  final bool allowFullScreen;
+  final bool allowedScreenSleep;
+  final bool showControls;
+  final Widget? customControls;
+  final Widget? placeholder;
+  final Duration hideControlsTimer;
+  final VoidCallback? onPlaying;
+  final VoidCallback? onPaused;
+  final VoidCallback? onVideoEnded;
+
+  const _ChewieControllerHook({
+    required this.asset,
+    this.controlsSafeAreaMinimum = const EdgeInsets.only(
+      bottom: 100,
+    ),
+    this.showOptions = true,
+    this.showControlsOnInitialize = false,
+    this.autoPlay = true,
+    this.autoInitialize = true,
+    this.allowFullScreen = false,
+    this.allowedScreenSleep = false,
+    this.showControls = true,
+    this.customControls,
+    this.placeholder,
+    this.hideControlsTimer = const Duration(seconds: 3),
+    this.onPlaying,
+    this.onPaused,
+    this.onVideoEnded,
+  });
+
+  @override
+  createState() => _ChewieControllerHookState();
+}
+
+class _ChewieControllerHookState
+    extends HookState<ChewieController?, _ChewieControllerHook> {
+  ChewieController? chewieController;
+  VideoPlayerController? videoPlayerController;
+
+  @override
+  void initHook() async {
+    super.initHook();
+    unawaited(_initialize());
+  }
+
+  @override
+  void dispose() {
+    chewieController?.dispose();
+    videoPlayerController?.dispose();
+    super.dispose();
+  }
+
+  @override
+  ChewieController? build(BuildContext context) {
+    return chewieController;
+  }
+
+  /// Initializes the chewie controller and video player controller
+  Future<void> _initialize() async {
+    if (hook.asset.isLocal && hook.asset.livePhotoVideoId == null) {
+      // Use a local file for the video player controller
+      final file = await hook.asset.local!.file;
+      if (file == null) {
+        throw Exception('No file found for the video');
+      }
+      videoPlayerController = VideoPlayerController.file(file);
+    } else {
+      // Use a network URL for the video player controller
+      final serverEndpoint = store.Store.get(store.StoreKey.serverEndpoint);
+      final String videoUrl = hook.asset.livePhotoVideoId != null
+          ? '$serverEndpoint/asset/file/${hook.asset.livePhotoVideoId}'
+          : '$serverEndpoint/asset/file/${hook.asset.remoteId}';
+
+      final url = Uri.parse(videoUrl);
+      final accessToken = store.Store.get(StoreKey.accessToken);
+
+      videoPlayerController = VideoPlayerController.networkUrl(
+        url,
+        httpHeaders: {"x-immich-user-token": accessToken},
+      );
+    }
+
+    videoPlayerController!.addListener(() {
+      final value = videoPlayerController!.value;
+      if (value.isPlaying) {
+        WakelockPlus.enable();
+        hook.onPlaying?.call();
+      } else if (!value.isPlaying) {
+        WakelockPlus.disable();
+        hook.onPaused?.call();
+      }
+
+      if (value.position == value.duration) {
+        WakelockPlus.disable();
+        hook.onVideoEnded?.call();
+      }
+    });
+
+    await videoPlayerController!.initialize();
+
+    setState(() {
+      chewieController = ChewieController(
+        videoPlayerController: videoPlayerController!,
+        controlsSafeAreaMinimum: hook.controlsSafeAreaMinimum,
+        showOptions: hook.showOptions,
+        showControlsOnInitialize: hook.showControlsOnInitialize,
+        autoPlay: hook.autoPlay,
+        autoInitialize: hook.autoInitialize,
+        allowFullScreen: hook.allowFullScreen,
+        allowedScreenSleep: hook.allowedScreenSleep,
+        showControls: hook.showControls,
+        customControls: hook.customControls,
+        placeholder: hook.placeholder,
+        hideControlsTimer: hook.hideControlsTimer,
+      );
+    });
+  }
+}
diff --git a/mobile/lib/modules/asset_viewer/ui/video_player_controls.dart b/mobile/lib/modules/asset_viewer/ui/video_player_controls.dart
index 781e84e45..bfc45b8a3 100644
--- a/mobile/lib/modules/asset_viewer/ui/video_player_controls.dart
+++ b/mobile/lib/modules/asset_viewer/ui/video_player_controls.dart
@@ -7,7 +7,7 @@ import 'package:immich_mobile/modules/asset_viewer/providers/show_controls.provi
 import 'package:immich_mobile/modules/asset_viewer/providers/video_player_controls_provider.dart';
 import 'package:immich_mobile/modules/asset_viewer/providers/video_player_value_provider.dart';
 import 'package:immich_mobile/modules/asset_viewer/ui/center_play_button.dart';
-import 'package:immich_mobile/shared/ui/immich_loading_indicator.dart';
+import 'package:immich_mobile/shared/ui/delayed_loading_indicator.dart';
 import 'package:video_player/video_player.dart';
 
 class VideoPlayerControls extends ConsumerStatefulWidget {
@@ -66,7 +66,9 @@ class VideoPlayerControlsState extends ConsumerState<VideoPlayerControls>
           children: [
             if (_displayBufferingIndicator)
               const Center(
-                child: ImmichLoadingIndicator(),
+                child: DelayedLoadingIndicator(
+                  fadeInDuration: Duration(milliseconds: 400),
+                ),
               )
             else
               _buildHitArea(),
@@ -79,6 +81,7 @@ class VideoPlayerControlsState extends ConsumerState<VideoPlayerControls>
   @override
   void dispose() {
     _dispose();
+
     super.dispose();
   }
 
@@ -92,6 +95,7 @@ class VideoPlayerControlsState extends ConsumerState<VideoPlayerControls>
     final oldController = _chewieController;
     _chewieController = ChewieController.of(context);
     controller = chewieController.videoPlayerController;
+    _latestValue = controller.value;
 
     if (oldController != chewieController) {
       _dispose();
@@ -106,12 +110,10 @@ class VideoPlayerControlsState extends ConsumerState<VideoPlayerControls>
 
     return GestureDetector(
       onTap: () {
-        if (_latestValue.isPlaying) {
-          ref.read(showControlsProvider.notifier).show = false;
-        } else {
+        if (!_latestValue.isPlaying) {
           _playPause();
-          ref.read(showControlsProvider.notifier).show = false;
         }
+        ref.read(showControlsProvider.notifier).show = false;
       },
       child: CenterPlayButton(
         backgroundColor: Colors.black54,
@@ -131,10 +133,11 @@ class VideoPlayerControlsState extends ConsumerState<VideoPlayerControls>
   }
 
   Future<void> _initialize() async {
+    ref.read(showControlsProvider.notifier).show = false;
     _mute(ref.read(videoPlayerControlsProvider.select((value) => value.mute)));
 
-    controller.addListener(_updateState);
     _latestValue = controller.value;
+    controller.addListener(_updateState);
 
     if (controller.value.isPlaying || chewieController.autoPlay) {
       _startHideTimer();
@@ -167,9 +170,8 @@ class VideoPlayerControlsState extends ConsumerState<VideoPlayerControls>
   }
 
   void _startHideTimer() {
-    final hideControlsTimer = chewieController.hideControlsTimer.isNegative
-        ? ChewieController.defaultHideControlsTimer
-        : chewieController.hideControlsTimer;
+    final hideControlsTimer = chewieController.hideControlsTimer;
+    _hideTimer?.cancel();
     _hideTimer = Timer(hideControlsTimer, () {
       ref.read(showControlsProvider.notifier).show = false;
     });
diff --git a/mobile/lib/modules/asset_viewer/views/gallery_viewer.dart b/mobile/lib/modules/asset_viewer/views/gallery_viewer.dart
index 59dfef816..a78c085de 100644
--- a/mobile/lib/modules/asset_viewer/views/gallery_viewer.dart
+++ b/mobile/lib/modules/asset_viewer/views/gallery_viewer.dart
@@ -704,6 +704,18 @@ class GalleryViewerPage extends HookConsumerWidget {
       );
     }
 
+    useEffect(
+      () {
+        if (ref.read(showControlsProvider)) {
+          SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge);
+        } else {
+          SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersive);
+        }
+        return null;
+      },
+      [],
+    );
+
     ref.listen(showControlsProvider, (_, show) {
       if (show) {
         SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge);
@@ -794,7 +806,9 @@ class GalleryViewerPage extends HookConsumerWidget {
                     minScale: 1.0,
                     basePosition: Alignment.center,
                     child: VideoViewerPage(
-                      onPlaying: () => isPlayingVideo.value = true,
+                      onPlaying: () {
+                        isPlayingVideo.value = true;
+                      },
                       onPaused: () =>
                           WidgetsBinding.instance.addPostFrameCallback(
                         (_) => isPlayingVideo.value = false,
diff --git a/mobile/lib/modules/asset_viewer/views/video_viewer_page.dart b/mobile/lib/modules/asset_viewer/views/video_viewer_page.dart
index 72aa397f6..0967bf52a 100644
--- a/mobile/lib/modules/asset_viewer/views/video_viewer_page.dart
+++ b/mobile/lib/modules/asset_viewer/views/video_viewer_page.dart
@@ -1,23 +1,15 @@
-import 'dart:io';
-
 import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart';
-import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:chewie/chewie.dart';
-import 'package:immich_mobile/extensions/build_context_extensions.dart';
-import 'package:immich_mobile/modules/asset_viewer/models/image_viewer_page_state.model.dart';
-import 'package:immich_mobile/modules/asset_viewer/providers/image_viewer_page_state.provider.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
+import 'package:immich_mobile/modules/asset_viewer/hooks/chewiew_controller_hook.dart';
 import 'package:immich_mobile/modules/asset_viewer/ui/video_player_controls.dart';
 import 'package:immich_mobile/shared/models/asset.dart';
-import 'package:immich_mobile/shared/models/store.dart';
-import 'package:immich_mobile/shared/ui/immich_loading_indicator.dart';
-import 'package:photo_manager/photo_manager.dart';
-import 'package:video_player/video_player.dart';
-import 'package:wakelock_plus/wakelock_plus.dart';
+import 'package:immich_mobile/shared/ui/delayed_loading_indicator.dart';
 
 @RoutePage()
 // ignore: must_be_immutable
-class VideoViewerPage extends HookConsumerWidget {
+class VideoViewerPage extends HookWidget {
   final Asset asset;
   final bool isMotionVideo;
   final Widget? placeholder;
@@ -42,211 +34,49 @@ class VideoViewerPage extends HookConsumerWidget {
   });
 
   @override
-  Widget build(BuildContext context, WidgetRef ref) {
-    if (asset.isLocal && asset.livePhotoVideoId == null) {
-      final AsyncValue<File> videoFile = ref.watch(_fileFamily(asset.local!));
-      return AnimatedSwitcher(
-        duration: const Duration(milliseconds: 200),
-        child: videoFile.when(
-          data: (data) => VideoPlayer(
-            file: data,
-            isMotionVideo: false,
-            onVideoEnded: () {},
-          ),
-          error: (error, stackTrace) => Icon(
-            Icons.image_not_supported_outlined,
-            color: context.primaryColor,
-          ),
-          loading: () => showDownloadingIndicator
-              ? const Center(child: ImmichLoadingIndicator())
-              : Container(),
-        ),
-      );
-    }
-    final downloadAssetStatus =
-        ref.watch(imageViewerStateProvider).downloadAssetStatus;
-    final String videoUrl = isMotionVideo
-        ? '${Store.get(StoreKey.serverEndpoint)}/asset/file/${asset.livePhotoVideoId}'
-        : '${Store.get(StoreKey.serverEndpoint)}/asset/file/${asset.remoteId}';
-
-    return Stack(
-      children: [
-        VideoPlayer(
-          url: videoUrl,
-          accessToken: Store.get(StoreKey.accessToken),
-          isMotionVideo: isMotionVideo,
-          onVideoEnded: onVideoEnded,
-          onPaused: onPaused,
-          onPlaying: onPlaying,
-          placeholder: placeholder,
-          hideControlsTimer: hideControlsTimer,
-          showControls: showControls,
-          showDownloadingIndicator: showDownloadingIndicator,
-        ),
-        AnimatedOpacity(
-          duration: const Duration(milliseconds: 400),
-          opacity: (downloadAssetStatus == DownloadAssetStatus.loading &&
-                  showDownloadingIndicator)
-              ? 1.0
-              : 0.0,
-          child: SizedBox(
-            height: context.height,
-            width: context.width,
-            child: const Center(
-              child: ImmichLoadingIndicator(),
-            ),
-          ),
-        ),
-      ],
-    );
-  }
-}
-
-final _fileFamily =
-    FutureProvider.family<File, AssetEntity>((ref, entity) async {
-  final file = await entity.file;
-  if (file == null) {
-    throw Exception();
-  }
-  return file;
-});
-
-class VideoPlayer extends StatefulWidget {
-  final String? url;
-  final String? accessToken;
-  final File? file;
-  final bool isMotionVideo;
-  final VoidCallback? onVideoEnded;
-  final Duration hideControlsTimer;
-  final bool showControls;
-
-  final Function()? onPlaying;
-  final Function()? onPaused;
-
-  /// The placeholder to show while the video is loading
-  /// usually, a thumbnail of the video
-  final Widget? placeholder;
-
-  final bool showDownloadingIndicator;
-
-  const VideoPlayer({
-    super.key,
-    this.url,
-    this.accessToken,
-    this.file,
-    this.onVideoEnded,
-    required this.isMotionVideo,
-    this.onPlaying,
-    this.onPaused,
-    this.placeholder,
-    this.hideControlsTimer = const Duration(
-      seconds: 5,
-    ),
-    this.showControls = true,
-    this.showDownloadingIndicator = true,
-  });
-
-  @override
-  State<VideoPlayer> createState() => _VideoPlayerState();
-}
-
-class _VideoPlayerState extends State<VideoPlayer> {
-  late VideoPlayerController videoPlayerController;
-  ChewieController? chewieController;
-
-  @override
-  void initState() {
-    super.initState();
-    initializePlayer();
-
-    videoPlayerController.addListener(() {
-      if (videoPlayerController.value.isInitialized) {
-        if (videoPlayerController.value.isPlaying) {
-          WakelockPlus.enable();
-          widget.onPlaying?.call();
-        } else if (!videoPlayerController.value.isPlaying) {
-          WakelockPlus.disable();
-          widget.onPaused?.call();
-        }
-
-        if (videoPlayerController.value.position ==
-            videoPlayerController.value.duration) {
-          WakelockPlus.disable();
-          widget.onVideoEnded?.call();
-        }
-      }
-    });
-  }
-
-  Future<void> initializePlayer() async {
-    try {
-      videoPlayerController = widget.file == null
-          ? VideoPlayerController.networkUrl(
-              Uri.parse(widget.url!),
-              httpHeaders: {"x-immich-user-token": widget.accessToken ?? ""},
-            )
-          : VideoPlayerController.file(widget.file!);
-
-      await videoPlayerController.initialize();
-      _createChewieController();
-      setState(() {});
-    } catch (e) {
-      debugPrint("ERROR initialize video player $e");
-    }
-  }
-
-  _createChewieController() {
-    chewieController = ChewieController(
+  Widget build(BuildContext context) {
+    final controller = useChewieController(
+      asset,
       controlsSafeAreaMinimum: const EdgeInsets.only(
         bottom: 100,
       ),
-      showOptions: true,
-      showControlsOnInitialize: false,
-      videoPlayerController: videoPlayerController,
-      autoPlay: true,
-      autoInitialize: true,
-      allowFullScreen: false,
-      allowedScreenSleep: false,
-      showControls: widget.showControls && !widget.isMotionVideo,
+      placeholder: placeholder,
+      showControls: showControls && !isMotionVideo,
+      hideControlsTimer: hideControlsTimer,
       customControls: const VideoPlayerControls(),
-      hideControlsTimer: widget.hideControlsTimer,
+      onPlaying: onPlaying,
+      onPaused: onPaused,
+      onVideoEnded: onVideoEnded,
+    );
+
+    // Loading
+    return PopScope(
+      child: AnimatedSwitcher(
+        duration: const Duration(milliseconds: 400),
+        child: Builder(
+          builder: (context) {
+            if (controller == null) {
+              return Stack(
+                children: [
+                  if (placeholder != null) placeholder!,
+                  const DelayedLoadingIndicator(
+                    fadeInDuration: Duration(milliseconds: 500),
+                  ),
+                ],
+              );
+            }
+
+            final size = MediaQuery.of(context).size;
+            return SizedBox(
+              height: size.height,
+              width: size.width,
+              child: Chewie(
+                controller: controller,
+              ),
+            );
+          },
+        ),
+      ),
     );
   }
-
-  @override
-  void dispose() {
-    super.dispose();
-    videoPlayerController.pause();
-    videoPlayerController.dispose();
-    chewieController?.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    if (chewieController?.videoPlayerController.value.isInitialized == true) {
-      return SizedBox(
-        height: context.height,
-        width: context.width,
-        child: Chewie(
-          controller: chewieController!,
-        ),
-      );
-    } else {
-      return SizedBox(
-        height: context.height,
-        width: context.width,
-        child: Center(
-          child: Stack(
-            children: [
-              if (widget.placeholder != null) widget.placeholder!,
-              if (widget.showDownloadingIndicator)
-                const Center(
-                  child: ImmichLoadingIndicator(),
-                ),
-            ],
-          ),
-        ),
-      );
-    }
-  }
 }
diff --git a/mobile/lib/routing/router.gr.dart b/mobile/lib/routing/router.gr.dart
index f6968dafe..16ac5efb0 100644
--- a/mobile/lib/routing/router.gr.dart
+++ b/mobile/lib/routing/router.gr.dart
@@ -1393,7 +1393,7 @@ class VideoViewerRoute extends PageRouteInfo<VideoViewerRouteArgs> {
     void Function()? onPaused,
     Widget? placeholder,
     bool showControls = true,
-    Duration hideControlsTimer = const Duration(seconds: 5),
+    Duration hideControlsTimer = const Duration(milliseconds: 1500),
     bool showDownloadingIndicator = true,
     List<PageRouteInfo>? children,
   }) : super(
@@ -1429,7 +1429,7 @@ class VideoViewerRouteArgs {
     this.onPaused,
     this.placeholder,
     this.showControls = true,
-    this.hideControlsTimer = const Duration(seconds: 5),
+    this.hideControlsTimer = const Duration(milliseconds: 1500),
     this.showDownloadingIndicator = true,
   });
 
diff --git a/mobile/lib/shared/models/asset.dart b/mobile/lib/shared/models/asset.dart
index afd49adc6..dd38b050b 100644
--- a/mobile/lib/shared/models/asset.dart
+++ b/mobile/lib/shared/models/asset.dart
@@ -171,6 +171,11 @@ class Asset {
 
   int? stackCount;
 
+  /// Aspect ratio of the asset
+  @ignore
+  double? get aspectRatio =>
+      width == null || height == null ? 0 : width! / height!;
+
   /// `true` if this [Asset] is present on the device
   @ignore
   bool get isLocal => localId != null;
diff --git a/mobile/lib/shared/ui/delayed_loading_indicator.dart b/mobile/lib/shared/ui/delayed_loading_indicator.dart
new file mode 100644
index 000000000..b4d9f4c80
--- /dev/null
+++ b/mobile/lib/shared/ui/delayed_loading_indicator.dart
@@ -0,0 +1,40 @@
+import 'package:flutter/material.dart';
+import 'package:immich_mobile/shared/ui/immich_loading_indicator.dart';
+
+class DelayedLoadingIndicator extends StatelessWidget {
+  /// The delay to avoid showing the loading indicator
+  final Duration delay;
+
+  /// Defaults to using the [ImmichLoadingIndicator]
+  final Widget? child;
+
+  /// An optional fade in duration to animate the loading
+  final Duration? fadeInDuration;
+
+  const DelayedLoadingIndicator({
+    super.key,
+    this.delay = const Duration(seconds: 3),
+    this.child,
+    this.fadeInDuration,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return AnimatedSwitcher(
+      duration: fadeInDuration ?? Duration.zero,
+      child: FutureBuilder(
+        future: Future.delayed(delay),
+        builder: (context, snapshot) {
+          if (snapshot.connectionState == ConnectionState.done) {
+            return child ??
+                const ImmichLoadingIndicator(
+                  key: ValueKey('loading'),
+                );
+          }
+
+          return Container(key: const ValueKey('hiding'));
+        },
+      ),
+    );
+  }
+}
diff --git a/mobile/lib/shared/views/immich_loading_overlay.dart b/mobile/lib/shared/views/immich_loading_overlay.dart
index 85f0123ed..c600d2a72 100644
--- a/mobile/lib/shared/views/immich_loading_overlay.dart
+++ b/mobile/lib/shared/views/immich_loading_overlay.dart
@@ -1,7 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:immich_mobile/extensions/build_context_extensions.dart';
-import 'package:immich_mobile/shared/ui/immich_loading_indicator.dart';
+import 'package:immich_mobile/shared/ui/delayed_loading_indicator.dart';
 
 final _loadingEntry = OverlayEntry(
   builder: (context) => SizedBox.square(
@@ -9,7 +9,12 @@ final _loadingEntry = OverlayEntry(
     child: DecoratedBox(
       decoration:
           BoxDecoration(color: context.colorScheme.surface.withAlpha(200)),
-      child: const Center(child: ImmichLoadingIndicator()),
+      child: const Center(
+        child: DelayedLoadingIndicator(
+          delay: Duration(seconds: 1),
+          fadeInDuration: Duration(milliseconds: 400),
+        ),
+      ),
     ),
   ),
 );
@@ -27,19 +32,19 @@ class _LoadingOverlay extends Hook<ValueNotifier<bool>> {
 
 class _LoadingOverlayState
     extends HookState<ValueNotifier<bool>, _LoadingOverlay> {
-  late final _isProcessing = ValueNotifier(false)..addListener(_listener);
-  OverlayEntry? overlayEntry;
+  late final _isLoading = ValueNotifier(false)..addListener(_listener);
+  OverlayEntry? _loadingOverlay;
 
   void _listener() {
     setState(() {
       WidgetsBinding.instance.addPostFrameCallback((_) {
-        if (_isProcessing.value) {
-          overlayEntry?.remove();
-          overlayEntry = _loadingEntry;
+        if (_isLoading.value) {
+          _loadingOverlay?.remove();
+          _loadingOverlay = _loadingEntry;
           Overlay.of(context).insert(_loadingEntry);
         } else {
-          overlayEntry?.remove();
-          overlayEntry = null;
+          _loadingOverlay?.remove();
+          _loadingOverlay = null;
         }
       });
     });
@@ -47,17 +52,17 @@ class _LoadingOverlayState
 
   @override
   ValueNotifier<bool> build(BuildContext context) {
-    return _isProcessing;
+    return _isLoading;
   }
 
   @override
   void dispose() {
-    _isProcessing.dispose();
+    _isLoading.dispose();
     super.dispose();
   }
 
   @override
-  Object? get debugValue => _isProcessing.value;
+  Object? get debugValue => _isLoading.value;
 
   @override
   String get debugLabel => 'useProcessingOverlay<>';

From 07d747221e170e73473edbdc673a8cb2bd5ffd20 Mon Sep 17 00:00:00 2001
From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com>
Date: Fri, 23 Feb 2024 16:10:49 +0000
Subject: [PATCH 05/28] fix(deps): update dependency geolocator to v11 (#7249)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
---
 mobile/pubspec.lock | 72 ++++++++++++++++++++++++++++++---------------
 mobile/pubspec.yaml |  2 +-
 2 files changed, 49 insertions(+), 25 deletions(-)

diff --git a/mobile/pubspec.lock b/mobile/pubspec.lock
index ffa57f826..4dab649a1 100644
--- a/mobile/pubspec.lock
+++ b/mobile/pubspec.lock
@@ -413,10 +413,10 @@ packages:
     dependency: transitive
     description:
       name: file
-      sha256: "1b92bec4fc2a72f59a8e15af5f52cd441e4a7860b49499d69dfa817af20e925d"
+      sha256: "5fc22d7c25582e38ad9a8515372cd9a93834027aacf1801cf01164dac0ffa08c"
       url: "https://pub.dev"
     source: hosted
-    version: "6.1.4"
+    version: "7.0.0"
   file_selector_linux:
     dependency: transitive
     description:
@@ -619,10 +619,10 @@ packages:
     dependency: "direct main"
     description:
       name: geolocator
-      sha256: e946395fc608842bb2f6c914807e9183f86f3cb787f6b8f832753e5251036f02
+      sha256: "694ec58afe97787b5b72b8a0ab78c1a9244811c3c10e72c4362ef3c0ceb005cd"
       url: "https://pub.dev"
     source: hosted
-    version: "10.1.0"
+    version: "11.0.0"
   geolocator_android:
     dependency: transitive
     description:
@@ -651,10 +651,10 @@ packages:
     dependency: transitive
     description:
       name: geolocator_web
-      sha256: "59083f7e0871b78299918d92bf930a14377f711d2d1156c558cd5ebae6c20d58"
+      sha256: "49d8f846ebeb5e2b6641fe477a7e97e5dd73f03cbfef3fd5c42177b7300fb0ed"
       url: "https://pub.dev"
     source: hosted
-    version: "2.2.0"
+    version: "3.0.0"
   geolocator_windows:
     dependency: transitive
     description:
@@ -860,6 +860,30 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "4.8.1"
+  leak_tracker:
+    dependency: transitive
+    description:
+      name: leak_tracker
+      sha256: "78eb209deea09858f5269f5a5b02be4049535f568c07b275096836f01ea323fa"
+      url: "https://pub.dev"
+    source: hosted
+    version: "10.0.0"
+  leak_tracker_flutter_testing:
+    dependency: transitive
+    description:
+      name: leak_tracker_flutter_testing
+      sha256: b46c5e37c19120a8a01918cfaf293547f47269f7cb4b0058f21531c2465d6ef0
+      url: "https://pub.dev"
+    source: hosted
+    version: "2.0.1"
+  leak_tracker_testing:
+    dependency: transitive
+    description:
+      name: leak_tracker_testing
+      sha256: a597f72a664dbd293f3bfc51f9ba69816f84dcd403cdac7066cb3f6003f3ab47
+      url: "https://pub.dev"
+    source: hosted
+    version: "2.0.1"
   lints:
     dependency: transitive
     description:
@@ -907,18 +931,18 @@ packages:
     dependency: transitive
     description:
       name: matcher
-      sha256: "1803e76e6653768d64ed8ff2e1e67bea3ad4b923eb5c56a295c3e634bad5960e"
+      sha256: d2323aa2060500f906aa31a895b4030b6da3ebdcc5619d14ce1aada65cd161cb
       url: "https://pub.dev"
     source: hosted
-    version: "0.12.16"
+    version: "0.12.16+1"
   material_color_utilities:
     dependency: transitive
     description:
       name: material_color_utilities
-      sha256: "9528f2f296073ff54cb9fee677df673ace1218163c3bc7628093e7eed5203d41"
+      sha256: "0e0a020085b65b6083975e499759762399b4475f766c21668c4ecca34ea74e5a"
       url: "https://pub.dev"
     source: hosted
-    version: "0.5.0"
+    version: "0.8.0"
   meta:
     dependency: "direct overridden"
     description:
@@ -1002,10 +1026,10 @@ packages:
     dependency: "direct main"
     description:
       name: path
-      sha256: "8829d8a55c13fc0e37127c29fedf290c102f4e40ae94ada574091fe0ff96c917"
+      sha256: "087ce49c3f0dc39180befefc60fdb4acd8f8620e5682fe2476afd0b3688bb4af"
       url: "https://pub.dev"
     source: hosted
-    version: "1.8.3"
+    version: "1.9.0"
   path_provider:
     dependency: "direct main"
     description:
@@ -1138,10 +1162,10 @@ packages:
     dependency: transitive
     description:
       name: platform
-      sha256: ae68c7bfcd7383af3629daafb32fb4e8681c7154428da4febcff06200585f102
+      sha256: "12220bb4b65720483f8fa9450b4332347737cf8213dd2840d8b2c823e47243ec"
       url: "https://pub.dev"
     source: hosted
-    version: "3.1.2"
+    version: "3.1.4"
   plugin_platform_interface:
     dependency: transitive
     description:
@@ -1170,10 +1194,10 @@ packages:
     dependency: transitive
     description:
       name: process
-      sha256: "53fd8db9cec1d37b0574e12f07520d582019cb6c44abf5479a01505099a34a09"
+      sha256: "21e54fd2faf1b5bdd5102afd25012184a6793927648ea81eea80552ac9405b32"
       url: "https://pub.dev"
     source: hosted
-    version: "4.2.4"
+    version: "5.0.2"
   provider:
     dependency: transitive
     description:
@@ -1298,10 +1322,10 @@ packages:
     dependency: transitive
     description:
       name: shared_preferences_linux
-      sha256: "71d6806d1449b0a9d4e85e0c7a917771e672a3d5dc61149cc9fac871115018e1"
+      sha256: "9f2cbcf46d4270ea8be39fa156d86379077c8a5228d9dfdb1164ae0bb93f1faa"
       url: "https://pub.dev"
     source: hosted
-    version: "2.3.0"
+    version: "2.3.2"
   shared_preferences_platform_interface:
     dependency: transitive
     description:
@@ -1322,10 +1346,10 @@ packages:
     dependency: transitive
     description:
       name: shared_preferences_windows
-      sha256: f95e6a43162bce43c9c3405f3eb6f39e5b5d11f65fab19196cf8225e2777624d
+      sha256: "841ad54f3c8381c480d0c9b508b89a34036f512482c407e6df7a9c4aa2ef8f59"
       url: "https://pub.dev"
     source: hosted
-    version: "2.3.0"
+    version: "2.3.2"
   shelf:
     dependency: transitive
     description:
@@ -1631,10 +1655,10 @@ packages:
     dependency: transitive
     description:
       name: vm_service
-      sha256: c538be99af830f478718b51630ec1b6bee5e74e52c8a802d328d9e71d35d2583
+      sha256: b3d56ff4341b8f182b96aceb2fa20e3dcb336b9f867bc0eafc0de10f1048e957
       url: "https://pub.dev"
     source: hosted
-    version: "11.10.0"
+    version: "13.0.0"
   wakelock_plus:
     dependency: "direct main"
     description:
@@ -1679,10 +1703,10 @@ packages:
     dependency: transitive
     description:
       name: webdriver
-      sha256: "3c923e918918feeb90c4c9fdf1fe39220fa4c0e8e2c0fffaded174498ef86c49"
+      sha256: "003d7da9519e1e5f329422b36c4dcdf18d7d2978d1ba099ea4e45ba490ed845e"
       url: "https://pub.dev"
     source: hosted
-    version: "3.0.2"
+    version: "3.0.3"
   win32:
     dependency: transitive
     description:
diff --git a/mobile/pubspec.yaml b/mobile/pubspec.yaml
index 47a4d3805..7fb01791c 100644
--- a/mobile/pubspec.yaml
+++ b/mobile/pubspec.yaml
@@ -32,7 +32,7 @@ dependencies:
     git:
       url: https://github.com/maplibre/flutter-maplibre-gl.git
       ref: acb428a005efd9832a0a8e7ef0945f899dfb3ca5
-  geolocator: ^10.1.0 # used to move to current location in map view
+  geolocator: ^11.0.0 # used to move to current location in map view
   flutter_udid: ^2.1.1
   package_info_plus: ^5.0.1
   url_launcher: ^6.2.4

From ee58569b4218dac6580a03d93c98157429d7ccc6 Mon Sep 17 00:00:00 2001
From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com>
Date: Fri, 23 Feb 2024 16:25:25 +0000
Subject: [PATCH 06/28] fix(deps): update dependency flutter_udid to v3 (#7248)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
---
 mobile/pubspec.lock | 4 ++--
 mobile/pubspec.yaml | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/mobile/pubspec.lock b/mobile/pubspec.lock
index 4dab649a1..6bc37c922 100644
--- a/mobile/pubspec.lock
+++ b/mobile/pubspec.lock
@@ -569,10 +569,10 @@ packages:
     dependency: "direct main"
     description:
       name: flutter_udid
-      sha256: "666412097b86d9a6f9803073d0f0ba70de9b198fe6493d89d352a1f8cd6c5c84"
+      sha256: "63384bd96203aaefccfd7137fab642edda18afede12b0e9e1a2c96fe2589fd07"
       url: "https://pub.dev"
     source: hosted
-    version: "2.1.1"
+    version: "3.0.0"
   flutter_web_auth:
     dependency: "direct main"
     description:
diff --git a/mobile/pubspec.yaml b/mobile/pubspec.yaml
index 7fb01791c..0869d3973 100644
--- a/mobile/pubspec.yaml
+++ b/mobile/pubspec.yaml
@@ -33,7 +33,7 @@ dependencies:
       url: https://github.com/maplibre/flutter-maplibre-gl.git
       ref: acb428a005efd9832a0a8e7ef0945f899dfb3ca5
   geolocator: ^11.0.0 # used to move to current location in map view
-  flutter_udid: ^2.1.1
+  flutter_udid: ^3.0.0
   package_info_plus: ^5.0.1
   url_launcher: ^6.2.4
   http: 0.13.5

From 78ece4ced9dc11f6a7ac6bedf64efc11e0664b32 Mon Sep 17 00:00:00 2001
From: Sebastian Mahr <sebbi08@users.noreply.github.com>
Date: Fri, 23 Feb 2024 18:05:09 +0100
Subject: [PATCH 07/28] fix(web): dark mode uploading font color (#7372)

* fix: dark mode uploading font color

* chore: remove dark text by default
---
 .../components/shared-components/upload-asset-preview.svelte   | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/web/src/lib/components/shared-components/upload-asset-preview.svelte b/web/src/lib/components/shared-components/upload-asset-preview.svelte
index de3307f93..7d5a634fb 100644
--- a/web/src/lib/components/shared-components/upload-asset-preview.svelte
+++ b/web/src/lib/components/shared-components/upload-asset-preview.svelte
@@ -45,7 +45,8 @@
       />
 
       <div
-        class="relative mt-[5px] h-[15px] w-full rounded-md bg-gray-300 text-white dark:bg-immich-dark-gray dark:text-black"
+        class="relative mt-[5px] h-[15px] w-full rounded-md bg-gray-300 text-white dark:bg-immich-dark-gray"
+        class:dark:text-black={uploadAsset.state === UploadState.STARTED}
       >
         {#if uploadAsset.state === UploadState.STARTED}
           <div class="h-[15px] rounded-md bg-immich-primary transition-all" style={`width: ${uploadAsset.progress}%`} />

From cc6de7d1f14b1a8602353649f2e052028752279a Mon Sep 17 00:00:00 2001
From: hrdl <31923882+hrdl-github@users.noreply.github.com>
Date: Fri, 23 Feb 2024 18:05:36 +0100
Subject: [PATCH 08/28] fix(mobile): don't crop memories in landscape mode
 (#6907)

Don't crop memories in landscape mode unless aspect ratios are close

Co-authored-by: hrdl <7808331-hrdl@users.noreply.gitlab.com>
---
 mobile/lib/modules/memories/ui/memory_card.dart | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/mobile/lib/modules/memories/ui/memory_card.dart b/mobile/lib/modules/memories/ui/memory_card.dart
index 7c998e8f5..7a9355044 100644
--- a/mobile/lib/modules/memories/ui/memory_card.dart
+++ b/mobile/lib/modules/memories/ui/memory_card.dart
@@ -55,9 +55,9 @@ class MemoryCard extends StatelessWidget {
           LayoutBuilder(
             builder: (context, constraints) {
               // Determine the fit using the aspect ratio
-              BoxFit fit = BoxFit.fitWidth;
+              BoxFit fit = BoxFit.contain;
               if (asset.width != null && asset.height != null) {
-                final aspectRatio = asset.height! / asset.width!;
+                final aspectRatio = asset.width! / asset.height!;
                 final phoneAspectRatio =
                     constraints.maxWidth / constraints.maxHeight;
                 // Look for a 25% difference in either direction

From 719dbcc4d05bd937f344ba8441c45130a84a3817 Mon Sep 17 00:00:00 2001
From: AndyPro720 <42208057+AndyPro720@users.noreply.github.com>
Date: Fri, 23 Feb 2024 22:48:19 +0530
Subject: [PATCH 09/28] Web: Revamp message for Storage Template Engine in
 admin pannel (#7359)

* Web: Revamp message for Storage Template Engine in admin pannel

* Web: Revamp message for Storage Template Engine in admin pannel: removed unnessary code
---
 .../storage-template-settings.svelte          | 21 ++++++++++++++++++-
 1 file changed, 20 insertions(+), 1 deletion(-)

diff --git a/web/src/lib/components/admin-page/settings/storage-template/storage-template-settings.svelte b/web/src/lib/components/admin-page/settings/storage-template/storage-template-settings.svelte
index 5fc3b3e22..11e07d002 100644
--- a/web/src/lib/components/admin-page/settings/storage-template/storage-template-settings.svelte
+++ b/web/src/lib/components/admin-page/settings/storage-template/storage-template-settings.svelte
@@ -84,7 +84,26 @@
   };
 </script>
 
-<section class="dark:text-immich-dark-fg">
+<section class="dark:text-immich-dark-fg mt-2">
+  <div in:fade={{ duration: 500 }} class="mx-4 flex flex-col gap-4 py-4">
+    <p class="text-sm dark:text-immich-dark-fg">
+      For more details about this feature, refer to the <a
+        href="https://immich.app/docs/administration/storage-template"
+        class="underline"
+        target="_blank"
+        rel="noreferrer"
+        >Storage Template
+      </a>
+      and its
+      <a
+        href="https://immich.app/docs/administration/backup-and-restore#asset-types-and-storage-locations"
+        class="underline"
+        target="_blank"
+        rel="noreferrer"
+        >implications
+      </a>
+    </p>
+  </div>
   {#await getTemplateOptions() then}
     <div id="directory-path-builder" class="flex flex-col gap-4 {minified ? '' : 'ml-4 mt-4'}">
       <SettingSwitch

From a2934b88301d350489d390e52be85dc2c489e006 Mon Sep 17 00:00:00 2001
From: martin <74269598+martabal@users.noreply.github.com>
Date: Sat, 24 Feb 2024 01:42:37 +0100
Subject: [PATCH 10/28] feat(server, web): search location (#7139)

* feat: search location

* fix: tests

* feat: outclick

* location search index

* update query

* fixed query

* updated sql

* update query

* Update search.dto.ts

Co-authored-by: Daniel Dietzler <36593685+danieldietzler@users.noreply.github.com>

* coalesce

* fix: tests

* feat: add alternate names

* fix: generate sql files

* single table, add alternate names to query, cleanup

* merge main

* update sql

* pr feedback

* pr feedback

* chore: fix merge

---------

Co-authored-by: mertalev <101130780+mertalev@users.noreply.github.com>
Co-authored-by: Daniel Dietzler <36593685+danieldietzler@users.noreply.github.com>
---
 mobile/openapi/.openapi-generator/FILES       |   3 +
 mobile/openapi/README.md                      |   2 +
 mobile/openapi/doc/PlacesResponseDto.md       |  19 +++
 mobile/openapi/doc/SearchApi.md               |  56 +++++++
 mobile/openapi/lib/api.dart                   |   1 +
 mobile/openapi/lib/api/search_api.dart        |  52 ++++++
 mobile/openapi/lib/api_client.dart            |   2 +
 .../lib/model/places_response_dto.dart        | 148 +++++++++++++++++
 .../test/places_response_dto_test.dart        |  47 ++++++
 mobile/openapi/test/search_api_test.dart      |   5 +
 open-api/immich-openapi-specs.json            |  69 ++++++++
 open-api/typescript-sdk/axios-client/api.ts   | 128 +++++++++++++++
 open-api/typescript-sdk/fetch-client.ts       |  19 +++
 server/src/domain/domain.constant.ts          |   2 +-
 .../domain/repositories/search.repository.ts  |   3 +-
 server/src/domain/search/dto/search.dto.ts    |  26 ++-
 server/src/domain/search/search.service.ts    |  15 +-
 .../immich/controllers/search.controller.ts   |   7 +
 .../infra/entities/geodata-admin1.entity.ts   |  10 --
 .../infra/entities/geodata-admin2.entity.ts   |  10 --
 .../infra/entities/geodata-places.entity.ts   |  31 +---
 server/src/infra/entities/index.ts            |   6 -
 .../1708059341865-GeodataLocationSearch.ts    | 152 ++++++++++++++++++
 .../1708116312820-GeonamesEnhancement.ts      |  18 +++
 .../infra/repositories/metadata.repository.ts | 109 ++++++-------
 .../infra/repositories/search.repository.ts   |  30 +++-
 server/src/infra/sql/search.repository.sql    |  34 ++++
 .../repositories/search.repository.mock.ts    |   1 +
 .../lib/components/elements/search-bar.svelte |   7 +-
 .../shared-components/change-location.svelte  | 134 ++++++++++++++-
 .../shared-components/map/map.svelte          |  11 ++
 31 files changed, 1040 insertions(+), 117 deletions(-)
 create mode 100644 mobile/openapi/doc/PlacesResponseDto.md
 create mode 100644 mobile/openapi/lib/model/places_response_dto.dart
 create mode 100644 mobile/openapi/test/places_response_dto_test.dart
 delete mode 100644 server/src/infra/entities/geodata-admin1.entity.ts
 delete mode 100644 server/src/infra/entities/geodata-admin2.entity.ts
 create mode 100644 server/src/infra/migrations/1708059341865-GeodataLocationSearch.ts
 create mode 100644 server/src/infra/migrations/1708116312820-GeonamesEnhancement.ts

diff --git a/mobile/openapi/.openapi-generator/FILES b/mobile/openapi/.openapi-generator/FILES
index 0679a1749..ea413b487 100644
--- a/mobile/openapi/.openapi-generator/FILES
+++ b/mobile/openapi/.openapi-generator/FILES
@@ -108,6 +108,7 @@ doc/PersonResponseDto.md
 doc/PersonStatisticsResponseDto.md
 doc/PersonUpdateDto.md
 doc/PersonWithFacesResponseDto.md
+doc/PlacesResponseDto.md
 doc/QueueStatusDto.md
 doc/ReactionLevel.md
 doc/ReactionType.md
@@ -308,6 +309,7 @@ lib/model/person_response_dto.dart
 lib/model/person_statistics_response_dto.dart
 lib/model/person_update_dto.dart
 lib/model/person_with_faces_response_dto.dart
+lib/model/places_response_dto.dart
 lib/model/queue_status_dto.dart
 lib/model/reaction_level.dart
 lib/model/reaction_type.dart
@@ -485,6 +487,7 @@ test/person_response_dto_test.dart
 test/person_statistics_response_dto_test.dart
 test/person_update_dto_test.dart
 test/person_with_faces_response_dto_test.dart
+test/places_response_dto_test.dart
 test/queue_status_dto_test.dart
 test/reaction_level_test.dart
 test/reaction_type_test.dart
diff --git a/mobile/openapi/README.md b/mobile/openapi/README.md
index 5dd6d196d..41e65ee8b 100644
--- a/mobile/openapi/README.md
+++ b/mobile/openapi/README.md
@@ -166,6 +166,7 @@ Class | Method | HTTP request | Description
 *SearchApi* | [**search**](doc//SearchApi.md#search) | **GET** /search | 
 *SearchApi* | [**searchMetadata**](doc//SearchApi.md#searchmetadata) | **POST** /search/metadata | 
 *SearchApi* | [**searchPerson**](doc//SearchApi.md#searchperson) | **GET** /search/person | 
+*SearchApi* | [**searchPlaces**](doc//SearchApi.md#searchplaces) | **GET** /search/places | 
 *SearchApi* | [**searchSmart**](doc//SearchApi.md#searchsmart) | **POST** /search/smart | 
 *ServerInfoApi* | [**getServerConfig**](doc//ServerInfoApi.md#getserverconfig) | **GET** /server-info/config | 
 *ServerInfoApi* | [**getServerFeatures**](doc//ServerInfoApi.md#getserverfeatures) | **GET** /server-info/features | 
@@ -306,6 +307,7 @@ Class | Method | HTTP request | Description
  - [PersonStatisticsResponseDto](doc//PersonStatisticsResponseDto.md)
  - [PersonUpdateDto](doc//PersonUpdateDto.md)
  - [PersonWithFacesResponseDto](doc//PersonWithFacesResponseDto.md)
+ - [PlacesResponseDto](doc//PlacesResponseDto.md)
  - [QueueStatusDto](doc//QueueStatusDto.md)
  - [ReactionLevel](doc//ReactionLevel.md)
  - [ReactionType](doc//ReactionType.md)
diff --git a/mobile/openapi/doc/PlacesResponseDto.md b/mobile/openapi/doc/PlacesResponseDto.md
new file mode 100644
index 000000000..a4bf36493
--- /dev/null
+++ b/mobile/openapi/doc/PlacesResponseDto.md
@@ -0,0 +1,19 @@
+# openapi.model.PlacesResponseDto
+
+## Load the model package
+```dart
+import 'package:openapi/api.dart';
+```
+
+## Properties
+Name | Type | Description | Notes
+------------ | ------------- | ------------- | -------------
+**admin1name** | **String** |  | [optional] 
+**admin2name** | **String** |  | [optional] 
+**latitude** | **num** |  | 
+**longitude** | **num** |  | 
+**name** | **String** |  | 
+
+[[Back to Model list]](../README.md#documentation-for-models) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to README]](../README.md)
+
+
diff --git a/mobile/openapi/doc/SearchApi.md b/mobile/openapi/doc/SearchApi.md
index f975e9448..f63488222 100644
--- a/mobile/openapi/doc/SearchApi.md
+++ b/mobile/openapi/doc/SearchApi.md
@@ -14,6 +14,7 @@ Method | HTTP request | Description
 [**search**](SearchApi.md#search) | **GET** /search | 
 [**searchMetadata**](SearchApi.md#searchmetadata) | **POST** /search/metadata | 
 [**searchPerson**](SearchApi.md#searchperson) | **GET** /search/person | 
+[**searchPlaces**](SearchApi.md#searchplaces) | **GET** /search/places | 
 [**searchSmart**](SearchApi.md#searchsmart) | **POST** /search/smart | 
 
 
@@ -316,6 +317,61 @@ Name | Type | Description  | Notes
 
 [[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)
 
+# **searchPlaces**
+> List<PlacesResponseDto> searchPlaces(name)
+
+
+
+### Example
+```dart
+import 'package:openapi/api.dart';
+// TODO Configure API key authorization: cookie
+//defaultApiClient.getAuthentication<ApiKeyAuth>('cookie').apiKey = 'YOUR_API_KEY';
+// uncomment below to setup prefix (e.g. Bearer) for API key, if needed
+//defaultApiClient.getAuthentication<ApiKeyAuth>('cookie').apiKeyPrefix = 'Bearer';
+// TODO Configure API key authorization: api_key
+//defaultApiClient.getAuthentication<ApiKeyAuth>('api_key').apiKey = 'YOUR_API_KEY';
+// uncomment below to setup prefix (e.g. Bearer) for API key, if needed
+//defaultApiClient.getAuthentication<ApiKeyAuth>('api_key').apiKeyPrefix = 'Bearer';
+// TODO Configure HTTP Bearer authorization: bearer
+// Case 1. Use String Token
+//defaultApiClient.getAuthentication<HttpBearerAuth>('bearer').setAccessToken('YOUR_ACCESS_TOKEN');
+// Case 2. Use Function which generate token.
+// String yourTokenGeneratorFunction() { ... }
+//defaultApiClient.getAuthentication<HttpBearerAuth>('bearer').setAccessToken(yourTokenGeneratorFunction);
+
+final api_instance = SearchApi();
+final name = name_example; // String | 
+
+try {
+    final result = api_instance.searchPlaces(name);
+    print(result);
+} catch (e) {
+    print('Exception when calling SearchApi->searchPlaces: $e\n');
+}
+```
+
+### Parameters
+
+Name | Type | Description  | Notes
+------------- | ------------- | ------------- | -------------
+ **name** | **String**|  | 
+
+### Return type
+
+[**List<PlacesResponseDto>**](PlacesResponseDto.md)
+
+### Authorization
+
+[cookie](../README.md#cookie), [api_key](../README.md#api_key), [bearer](../README.md#bearer)
+
+### HTTP request headers
+
+ - **Content-Type**: Not defined
+ - **Accept**: application/json
+
+[[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)
+
 # **searchSmart**
 > SearchResponseDto searchSmart(smartSearchDto)
 
diff --git a/mobile/openapi/lib/api.dart b/mobile/openapi/lib/api.dart
index 72a656764..56bd907e0 100644
--- a/mobile/openapi/lib/api.dart
+++ b/mobile/openapi/lib/api.dart
@@ -142,6 +142,7 @@ part 'model/person_response_dto.dart';
 part 'model/person_statistics_response_dto.dart';
 part 'model/person_update_dto.dart';
 part 'model/person_with_faces_response_dto.dart';
+part 'model/places_response_dto.dart';
 part 'model/queue_status_dto.dart';
 part 'model/reaction_level.dart';
 part 'model/reaction_type.dart';
diff --git a/mobile/openapi/lib/api/search_api.dart b/mobile/openapi/lib/api/search_api.dart
index 062ca4a50..3a0bc56bb 100644
--- a/mobile/openapi/lib/api/search_api.dart
+++ b/mobile/openapi/lib/api/search_api.dart
@@ -360,6 +360,58 @@ class SearchApi {
     return null;
   }
 
+  /// Performs an HTTP 'GET /search/places' operation and returns the [Response].
+  /// Parameters:
+  ///
+  /// * [String] name (required):
+  Future<Response> searchPlacesWithHttpInfo(String name,) async {
+    // ignore: prefer_const_declarations
+    final path = r'/search/places';
+
+    // ignore: prefer_final_locals
+    Object? postBody;
+
+    final queryParams = <QueryParam>[];
+    final headerParams = <String, String>{};
+    final formParams = <String, String>{};
+
+      queryParams.addAll(_queryParams('', 'name', name));
+
+    const contentTypes = <String>[];
+
+
+    return apiClient.invokeAPI(
+      path,
+      'GET',
+      queryParams,
+      postBody,
+      headerParams,
+      formParams,
+      contentTypes.isEmpty ? null : contentTypes.first,
+    );
+  }
+
+  /// Parameters:
+  ///
+  /// * [String] name (required):
+  Future<List<PlacesResponseDto>?> searchPlaces(String name,) async {
+    final response = await searchPlacesWithHttpInfo(name,);
+    if (response.statusCode >= HttpStatus.badRequest) {
+      throw ApiException(response.statusCode, await _decodeBodyBytes(response));
+    }
+    // When a remote server returns no body with a status of 204, we shall not decode it.
+    // At the time of writing this, `dart:convert` will throw an "Unexpected end of input"
+    // FormatException when trying to decode an empty string.
+    if (response.body.isNotEmpty && response.statusCode != HttpStatus.noContent) {
+      final responseBody = await _decodeBodyBytes(response);
+      return (await apiClient.deserializeAsync(responseBody, 'List<PlacesResponseDto>') as List)
+        .cast<PlacesResponseDto>()
+        .toList(growable: false);
+
+    }
+    return null;
+  }
+
   /// Performs an HTTP 'POST /search/smart' operation and returns the [Response].
   /// Parameters:
   ///
diff --git a/mobile/openapi/lib/api_client.dart b/mobile/openapi/lib/api_client.dart
index 2df5e6711..24cffb7cf 100644
--- a/mobile/openapi/lib/api_client.dart
+++ b/mobile/openapi/lib/api_client.dart
@@ -366,6 +366,8 @@ class ApiClient {
           return PersonUpdateDto.fromJson(value);
         case 'PersonWithFacesResponseDto':
           return PersonWithFacesResponseDto.fromJson(value);
+        case 'PlacesResponseDto':
+          return PlacesResponseDto.fromJson(value);
         case 'QueueStatusDto':
           return QueueStatusDto.fromJson(value);
         case 'ReactionLevel':
diff --git a/mobile/openapi/lib/model/places_response_dto.dart b/mobile/openapi/lib/model/places_response_dto.dart
new file mode 100644
index 000000000..a2d837888
--- /dev/null
+++ b/mobile/openapi/lib/model/places_response_dto.dart
@@ -0,0 +1,148 @@
+//
+// AUTO-GENERATED FILE, DO NOT MODIFY!
+//
+// @dart=2.12
+
+// ignore_for_file: unused_element, unused_import
+// ignore_for_file: always_put_required_named_parameters_first
+// ignore_for_file: constant_identifier_names
+// ignore_for_file: lines_longer_than_80_chars
+
+part of openapi.api;
+
+class PlacesResponseDto {
+  /// Returns a new [PlacesResponseDto] instance.
+  PlacesResponseDto({
+    this.admin1name,
+    this.admin2name,
+    required this.latitude,
+    required this.longitude,
+    required this.name,
+  });
+
+  ///
+  /// Please note: This property should have been non-nullable! Since the specification file
+  /// does not include a default value (using the "default:" property), however, the generated
+  /// source code must fall back to having a nullable type.
+  /// Consider adding a "default:" property in the specification file to hide this note.
+  ///
+  String? admin1name;
+
+  ///
+  /// Please note: This property should have been non-nullable! Since the specification file
+  /// does not include a default value (using the "default:" property), however, the generated
+  /// source code must fall back to having a nullable type.
+  /// Consider adding a "default:" property in the specification file to hide this note.
+  ///
+  String? admin2name;
+
+  num latitude;
+
+  num longitude;
+
+  String name;
+
+  @override
+  bool operator ==(Object other) => identical(this, other) || other is PlacesResponseDto &&
+    other.admin1name == admin1name &&
+    other.admin2name == admin2name &&
+    other.latitude == latitude &&
+    other.longitude == longitude &&
+    other.name == name;
+
+  @override
+  int get hashCode =>
+    // ignore: unnecessary_parenthesis
+    (admin1name == null ? 0 : admin1name!.hashCode) +
+    (admin2name == null ? 0 : admin2name!.hashCode) +
+    (latitude.hashCode) +
+    (longitude.hashCode) +
+    (name.hashCode);
+
+  @override
+  String toString() => 'PlacesResponseDto[admin1name=$admin1name, admin2name=$admin2name, latitude=$latitude, longitude=$longitude, name=$name]';
+
+  Map<String, dynamic> toJson() {
+    final json = <String, dynamic>{};
+    if (this.admin1name != null) {
+      json[r'admin1name'] = this.admin1name;
+    } else {
+    //  json[r'admin1name'] = null;
+    }
+    if (this.admin2name != null) {
+      json[r'admin2name'] = this.admin2name;
+    } else {
+    //  json[r'admin2name'] = null;
+    }
+      json[r'latitude'] = this.latitude;
+      json[r'longitude'] = this.longitude;
+      json[r'name'] = this.name;
+    return json;
+  }
+
+  /// Returns a new [PlacesResponseDto] instance and imports its values from
+  /// [value] if it's a [Map], null otherwise.
+  // ignore: prefer_constructors_over_static_methods
+  static PlacesResponseDto? fromJson(dynamic value) {
+    if (value is Map) {
+      final json = value.cast<String, dynamic>();
+
+      return PlacesResponseDto(
+        admin1name: mapValueOfType<String>(json, r'admin1name'),
+        admin2name: mapValueOfType<String>(json, r'admin2name'),
+        latitude: num.parse('${json[r'latitude']}'),
+        longitude: num.parse('${json[r'longitude']}'),
+        name: mapValueOfType<String>(json, r'name')!,
+      );
+    }
+    return null;
+  }
+
+  static List<PlacesResponseDto> listFromJson(dynamic json, {bool growable = false,}) {
+    final result = <PlacesResponseDto>[];
+    if (json is List && json.isNotEmpty) {
+      for (final row in json) {
+        final value = PlacesResponseDto.fromJson(row);
+        if (value != null) {
+          result.add(value);
+        }
+      }
+    }
+    return result.toList(growable: growable);
+  }
+
+  static Map<String, PlacesResponseDto> mapFromJson(dynamic json) {
+    final map = <String, PlacesResponseDto>{};
+    if (json is Map && json.isNotEmpty) {
+      json = json.cast<String, dynamic>(); // ignore: parameter_assignments
+      for (final entry in json.entries) {
+        final value = PlacesResponseDto.fromJson(entry.value);
+        if (value != null) {
+          map[entry.key] = value;
+        }
+      }
+    }
+    return map;
+  }
+
+  // maps a json object with a list of PlacesResponseDto-objects as value to a dart map
+  static Map<String, List<PlacesResponseDto>> mapListFromJson(dynamic json, {bool growable = false,}) {
+    final map = <String, List<PlacesResponseDto>>{};
+    if (json is Map && json.isNotEmpty) {
+      // ignore: parameter_assignments
+      json = json.cast<String, dynamic>();
+      for (final entry in json.entries) {
+        map[entry.key] = PlacesResponseDto.listFromJson(entry.value, growable: growable,);
+      }
+    }
+    return map;
+  }
+
+  /// The list of required keys that must be present in a JSON.
+  static const requiredKeys = <String>{
+    'latitude',
+    'longitude',
+    'name',
+  };
+}
+
diff --git a/mobile/openapi/test/places_response_dto_test.dart b/mobile/openapi/test/places_response_dto_test.dart
new file mode 100644
index 000000000..5a320fce6
--- /dev/null
+++ b/mobile/openapi/test/places_response_dto_test.dart
@@ -0,0 +1,47 @@
+//
+// AUTO-GENERATED FILE, DO NOT MODIFY!
+//
+// @dart=2.12
+
+// ignore_for_file: unused_element, unused_import
+// ignore_for_file: always_put_required_named_parameters_first
+// ignore_for_file: constant_identifier_names
+// ignore_for_file: lines_longer_than_80_chars
+
+import 'package:openapi/api.dart';
+import 'package:test/test.dart';
+
+// tests for PlacesResponseDto
+void main() {
+  // final instance = PlacesResponseDto();
+
+  group('test PlacesResponseDto', () {
+    // String admin1name
+    test('to test the property `admin1name`', () async {
+      // TODO
+    });
+
+    // String admin2name
+    test('to test the property `admin2name`', () async {
+      // TODO
+    });
+
+    // num latitude
+    test('to test the property `latitude`', () async {
+      // TODO
+    });
+
+    // num longitude
+    test('to test the property `longitude`', () async {
+      // TODO
+    });
+
+    // String name
+    test('to test the property `name`', () async {
+      // TODO
+    });
+
+
+  });
+
+}
diff --git a/mobile/openapi/test/search_api_test.dart b/mobile/openapi/test/search_api_test.dart
index 14169e461..aa4a94847 100644
--- a/mobile/openapi/test/search_api_test.dart
+++ b/mobile/openapi/test/search_api_test.dart
@@ -42,6 +42,11 @@ void main() {
       // TODO
     });
 
+    //Future<List<PlacesResponseDto>> searchPlaces(String name) async
+    test('test searchPlaces', () async {
+      // TODO
+    });
+
     //Future<SearchResponseDto> searchSmart(SmartSearchDto smartSearchDto) async
     test('test searchSmart', () async {
       // TODO
diff --git a/open-api/immich-openapi-specs.json b/open-api/immich-openapi-specs.json
index cac1d663b..8fec89327 100644
--- a/open-api/immich-openapi-specs.json
+++ b/open-api/immich-openapi-specs.json
@@ -4691,6 +4691,50 @@
         ]
       }
     },
+    "/search/places": {
+      "get": {
+        "operationId": "searchPlaces",
+        "parameters": [
+          {
+            "name": "name",
+            "required": true,
+            "in": "query",
+            "schema": {
+              "type": "string"
+            }
+          }
+        ],
+        "responses": {
+          "200": {
+            "content": {
+              "application/json": {
+                "schema": {
+                  "items": {
+                    "$ref": "#/components/schemas/PlacesResponseDto"
+                  },
+                  "type": "array"
+                }
+              }
+            },
+            "description": ""
+          }
+        },
+        "security": [
+          {
+            "bearer": []
+          },
+          {
+            "cookie": []
+          },
+          {
+            "api_key": []
+          }
+        ],
+        "tags": [
+          "Search"
+        ]
+      }
+    },
     "/search/smart": {
       "post": {
         "operationId": "searchSmart",
@@ -8756,6 +8800,31 @@
         ],
         "type": "object"
       },
+      "PlacesResponseDto": {
+        "properties": {
+          "admin1name": {
+            "type": "string"
+          },
+          "admin2name": {
+            "type": "string"
+          },
+          "latitude": {
+            "type": "number"
+          },
+          "longitude": {
+            "type": "number"
+          },
+          "name": {
+            "type": "string"
+          }
+        },
+        "required": [
+          "latitude",
+          "longitude",
+          "name"
+        ],
+        "type": "object"
+      },
       "QueueStatusDto": {
         "properties": {
           "isActive": {
diff --git a/open-api/typescript-sdk/axios-client/api.ts b/open-api/typescript-sdk/axios-client/api.ts
index c01b200d0..ad36bb493 100644
--- a/open-api/typescript-sdk/axios-client/api.ts
+++ b/open-api/typescript-sdk/axios-client/api.ts
@@ -2994,6 +2994,43 @@ export interface PersonWithFacesResponseDto {
      */
     'thumbnailPath': string;
 }
+/**
+ * 
+ * @export
+ * @interface PlacesResponseDto
+ */
+export interface PlacesResponseDto {
+    /**
+     * 
+     * @type {string}
+     * @memberof PlacesResponseDto
+     */
+    'admin1name'?: string;
+    /**
+     * 
+     * @type {string}
+     * @memberof PlacesResponseDto
+     */
+    'admin2name'?: string;
+    /**
+     * 
+     * @type {number}
+     * @memberof PlacesResponseDto
+     */
+    'latitude': number;
+    /**
+     * 
+     * @type {number}
+     * @memberof PlacesResponseDto
+     */
+    'longitude': number;
+    /**
+     * 
+     * @type {string}
+     * @memberof PlacesResponseDto
+     */
+    'name': string;
+}
 /**
  * 
  * @export
@@ -15447,6 +15484,51 @@ export const SearchApiAxiosParamCreator = function (configuration?: Configuratio
 
 
     
+            setSearchParams(localVarUrlObj, localVarQueryParameter);
+            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
+            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
+
+            return {
+                url: toPathString(localVarUrlObj),
+                options: localVarRequestOptions,
+            };
+        },
+        /**
+         * 
+         * @param {string} name 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        searchPlaces: async (name: string, options: RawAxiosRequestConfig = {}): Promise<RequestArgs> => {
+            // verify required parameter 'name' is not null or undefined
+            assertParamExists('searchPlaces', 'name', name)
+            const localVarPath = `/search/places`;
+            // use dummy base URL string because the URL constructor only accepts absolute URLs.
+            const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
+            let baseOptions;
+            if (configuration) {
+                baseOptions = configuration.baseOptions;
+            }
+
+            const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
+            const localVarHeaderParameter = {} as any;
+            const localVarQueryParameter = {} as any;
+
+            // authentication cookie required
+
+            // authentication api_key required
+            await setApiKeyToObject(localVarHeaderParameter, "x-api-key", configuration)
+
+            // authentication bearer required
+            // http bearer authentication required
+            await setBearerAuthToObject(localVarHeaderParameter, configuration)
+
+            if (name !== undefined) {
+                localVarQueryParameter['name'] = name;
+            }
+
+
+    
             setSearchParams(localVarUrlObj, localVarQueryParameter);
             let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
             localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
@@ -15584,6 +15666,18 @@ export const SearchApiFp = function(configuration?: Configuration) {
             const operationBasePath = operationServerMap['SearchApi.searchPerson']?.[index]?.url;
             return (axios, basePath) => createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration)(axios, operationBasePath || basePath);
         },
+        /**
+         * 
+         * @param {string} name 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        async searchPlaces(name: string, options?: RawAxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<Array<PlacesResponseDto>>> {
+            const localVarAxiosArgs = await localVarAxiosParamCreator.searchPlaces(name, options);
+            const index = configuration?.serverIndex ?? 0;
+            const operationBasePath = operationServerMap['SearchApi.searchPlaces']?.[index]?.url;
+            return (axios, basePath) => createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration)(axios, operationBasePath || basePath);
+        },
         /**
          * 
          * @param {SmartSearchDto} smartSearchDto 
@@ -15651,6 +15745,15 @@ export const SearchApiFactory = function (configuration?: Configuration, basePat
         searchPerson(requestParameters: SearchApiSearchPersonRequest, options?: RawAxiosRequestConfig): AxiosPromise<Array<PersonResponseDto>> {
             return localVarFp.searchPerson(requestParameters.name, requestParameters.withHidden, options).then((request) => request(axios, basePath));
         },
+        /**
+         * 
+         * @param {SearchApiSearchPlacesRequest} requestParameters Request parameters.
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        searchPlaces(requestParameters: SearchApiSearchPlacesRequest, options?: RawAxiosRequestConfig): AxiosPromise<Array<PlacesResponseDto>> {
+            return localVarFp.searchPlaces(requestParameters.name, options).then((request) => request(axios, basePath));
+        },
         /**
          * 
          * @param {SearchApiSearchSmartRequest} requestParameters Request parameters.
@@ -15817,6 +15920,20 @@ export interface SearchApiSearchPersonRequest {
     readonly withHidden?: boolean
 }
 
+/**
+ * Request parameters for searchPlaces operation in SearchApi.
+ * @export
+ * @interface SearchApiSearchPlacesRequest
+ */
+export interface SearchApiSearchPlacesRequest {
+    /**
+     * 
+     * @type {string}
+     * @memberof SearchApiSearchPlaces
+     */
+    readonly name: string
+}
+
 /**
  * Request parameters for searchSmart operation in SearchApi.
  * @export
@@ -15893,6 +16010,17 @@ export class SearchApi extends BaseAPI {
         return SearchApiFp(this.configuration).searchPerson(requestParameters.name, requestParameters.withHidden, options).then((request) => request(this.axios, this.basePath));
     }
 
+    /**
+     * 
+     * @param {SearchApiSearchPlacesRequest} requestParameters Request parameters.
+     * @param {*} [options] Override http request option.
+     * @throws {RequiredError}
+     * @memberof SearchApi
+     */
+    public searchPlaces(requestParameters: SearchApiSearchPlacesRequest, options?: RawAxiosRequestConfig) {
+        return SearchApiFp(this.configuration).searchPlaces(requestParameters.name, options).then((request) => request(this.axios, this.basePath));
+    }
+
     /**
      * 
      * @param {SearchApiSearchSmartRequest} requestParameters Request parameters.
diff --git a/open-api/typescript-sdk/fetch-client.ts b/open-api/typescript-sdk/fetch-client.ts
index 0ee871ca6..d023f8ef0 100644
--- a/open-api/typescript-sdk/fetch-client.ts
+++ b/open-api/typescript-sdk/fetch-client.ts
@@ -646,6 +646,13 @@ export type MetadataSearchDto = {
     withPeople?: boolean;
     withStacked?: boolean;
 };
+export type PlacesResponseDto = {
+    admin1name?: string;
+    admin2name?: string;
+    latitude: number;
+    longitude: number;
+    name: string;
+};
 export type SmartSearchDto = {
     city?: string;
     country?: string;
@@ -2198,6 +2205,18 @@ export function searchPerson({ name, withHidden }: {
         ...opts
     }));
 }
+export function searchPlaces({ name }: {
+    name: string;
+}, opts?: Oazapfts.RequestOpts) {
+    return oazapfts.ok(oazapfts.fetchJson<{
+        status: 200;
+        data: PlacesResponseDto[];
+    }>(`/search/places${QS.query(QS.explode({
+        name
+    }))}`, {
+        ...opts
+    }));
+}
 export function searchSmart({ smartSearchDto }: {
     smartSearchDto: SmartSearchDto;
 }, opts?: Oazapfts.RequestOpts) {
diff --git a/server/src/domain/domain.constant.ts b/server/src/domain/domain.constant.ts
index 4e7c4d552..0dc9c5414 100644
--- a/server/src/domain/domain.constant.ts
+++ b/server/src/domain/domain.constant.ts
@@ -91,7 +91,7 @@ export const citiesFile = 'cities500.txt';
 export const geodataDatePath = join(GEODATA_ROOT_PATH, 'geodata-date.txt');
 export const geodataAdmin1Path = join(GEODATA_ROOT_PATH, 'admin1CodesASCII.txt');
 export const geodataAdmin2Path = join(GEODATA_ROOT_PATH, 'admin2Codes.txt');
-export const geodataCitites500Path = join(GEODATA_ROOT_PATH, citiesFile);
+export const geodataCities500Path = join(GEODATA_ROOT_PATH, citiesFile);
 
 const image: Record<string, string[]> = {
   '.3fr': ['image/3fr', 'image/x-hasselblad-3fr'],
diff --git a/server/src/domain/repositories/search.repository.ts b/server/src/domain/repositories/search.repository.ts
index 7183e9e3f..8566fcd8e 100644
--- a/server/src/domain/repositories/search.repository.ts
+++ b/server/src/domain/repositories/search.repository.ts
@@ -1,4 +1,4 @@
-import { AssetEntity, AssetFaceEntity, AssetType, SmartInfoEntity } from '@app/infra/entities';
+import { AssetEntity, AssetFaceEntity, AssetType, GeodataPlacesEntity, SmartInfoEntity } from '@app/infra/entities';
 import { Paginated } from '../domain.util';
 
 export const ISearchRepository = 'ISearchRepository';
@@ -186,4 +186,5 @@ export interface ISearchRepository {
   searchSmart(pagination: SearchPaginationOptions, options: SmartSearchOptions): Paginated<AssetEntity>;
   searchFaces(search: FaceEmbeddingSearch): Promise<FaceSearchResult[]>;
   upsert(smartInfo: Partial<SmartInfoEntity>, embedding?: Embedding): Promise<void>;
+  searchPlaces(placeName: string): Promise<GeodataPlacesEntity[]>;
 }
diff --git a/server/src/domain/search/dto/search.dto.ts b/server/src/domain/search/dto/search.dto.ts
index 4f2aa1819..877a494e4 100644
--- a/server/src/domain/search/dto/search.dto.ts
+++ b/server/src/domain/search/dto/search.dto.ts
@@ -1,5 +1,5 @@
 import { AssetOrder } from '@app/domain/asset/dto/asset.dto';
-import { AssetType } from '@app/infra/entities';
+import { AssetType, GeodataPlacesEntity } from '@app/infra/entities';
 import { ApiProperty } from '@nestjs/swagger';
 import { Transform, Type } from 'class-transformer';
 import { IsBoolean, IsEnum, IsInt, IsNotEmpty, IsString, Max, Min } from 'class-validator';
@@ -241,6 +241,12 @@ export class SearchDto {
   size?: number;
 }
 
+export class SearchPlacesDto {
+  @IsString()
+  @IsNotEmpty()
+  name!: string;
+}
+
 export class SearchPeopleDto {
   @IsString()
   @IsNotEmpty()
@@ -251,3 +257,21 @@ export class SearchPeopleDto {
   @Optional()
   withHidden?: boolean;
 }
+
+export class PlacesResponseDto {
+  name!: string;
+  latitude!: number;
+  longitude!: number;
+  admin1name?: string;
+  admin2name?: string;
+}
+
+export function mapPlaces(place: GeodataPlacesEntity): PlacesResponseDto {
+  return {
+    name: place.name,
+    latitude: place.latitude,
+    longitude: place.longitude,
+    admin1name: place.admin1Name,
+    admin2name: place.admin2Name,
+  };
+}
diff --git a/server/src/domain/search/search.service.ts b/server/src/domain/search/search.service.ts
index 452c556f4..95ad848e2 100644
--- a/server/src/domain/search/search.service.ts
+++ b/server/src/domain/search/search.service.ts
@@ -16,7 +16,15 @@ import {
   SearchStrategy,
 } from '../repositories';
 import { FeatureFlag, SystemConfigCore } from '../system-config';
-import { MetadataSearchDto, SearchDto, SearchPeopleDto, SmartSearchDto } from './dto';
+import {
+  MetadataSearchDto,
+  PlacesResponseDto,
+  SearchDto,
+  SearchPeopleDto,
+  SearchPlacesDto,
+  SmartSearchDto,
+  mapPlaces,
+} from './dto';
 import { SearchSuggestionRequestDto, SearchSuggestionType } from './dto/search-suggestion.dto';
 import { SearchResponseDto } from './response-dto';
 
@@ -41,6 +49,11 @@ export class SearchService {
     return this.personRepository.getByName(auth.user.id, dto.name, { withHidden: dto.withHidden });
   }
 
+  async searchPlaces(dto: SearchPlacesDto): Promise<PlacesResponseDto[]> {
+    const places = await this.searchRepository.searchPlaces(dto.name);
+    return places.map((place) => mapPlaces(place));
+  }
+
   async getExploreData(auth: AuthDto): Promise<SearchExploreItem<AssetResponseDto>[]> {
     await this.configCore.requireFeature(FeatureFlag.SEARCH);
     const options = { maxFields: 12, minAssetsPerField: 5 };
diff --git a/server/src/immich/controllers/search.controller.ts b/server/src/immich/controllers/search.controller.ts
index 4e57cfaa6..b807da966 100644
--- a/server/src/immich/controllers/search.controller.ts
+++ b/server/src/immich/controllers/search.controller.ts
@@ -2,9 +2,11 @@ import {
   AuthDto,
   MetadataSearchDto,
   PersonResponseDto,
+  PlacesResponseDto,
   SearchDto,
   SearchExploreResponseDto,
   SearchPeopleDto,
+  SearchPlacesDto,
   SearchResponseDto,
   SearchService,
   SmartSearchDto,
@@ -48,6 +50,11 @@ export class SearchController {
     return this.service.searchPerson(auth, dto);
   }
 
+  @Get('places')
+  searchPlaces(@Query() dto: SearchPlacesDto): Promise<PlacesResponseDto[]> {
+    return this.service.searchPlaces(dto);
+  }
+
   @Get('suggestions')
   getSearchSuggestions(@Auth() auth: AuthDto, @Query() dto: SearchSuggestionRequestDto): Promise<string[]> {
     return this.service.getSearchSuggestions(auth, dto);
diff --git a/server/src/infra/entities/geodata-admin1.entity.ts b/server/src/infra/entities/geodata-admin1.entity.ts
deleted file mode 100644
index 36cf0a805..000000000
--- a/server/src/infra/entities/geodata-admin1.entity.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { Column, Entity, PrimaryColumn } from 'typeorm';
-
-@Entity('geodata_admin1')
-export class GeodataAdmin1Entity {
-  @PrimaryColumn({ type: 'varchar' })
-  key!: string;
-
-  @Column({ type: 'varchar' })
-  name!: string;
-}
diff --git a/server/src/infra/entities/geodata-admin2.entity.ts b/server/src/infra/entities/geodata-admin2.entity.ts
deleted file mode 100644
index bd03e8377..000000000
--- a/server/src/infra/entities/geodata-admin2.entity.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { Column, Entity, PrimaryColumn } from 'typeorm';
-
-@Entity('geodata_admin2')
-export class GeodataAdmin2Entity {
-  @PrimaryColumn({ type: 'varchar' })
-  key!: string;
-
-  @Column({ type: 'varchar' })
-  name!: string;
-}
diff --git a/server/src/infra/entities/geodata-places.entity.ts b/server/src/infra/entities/geodata-places.entity.ts
index 244e4261b..966a50d5c 100644
--- a/server/src/infra/entities/geodata-places.entity.ts
+++ b/server/src/infra/entities/geodata-places.entity.ts
@@ -1,6 +1,4 @@
-import { GeodataAdmin1Entity } from '@app/infra/entities/geodata-admin1.entity';
-import { GeodataAdmin2Entity } from '@app/infra/entities/geodata-admin2.entity';
-import { Column, Entity, ManyToOne, PrimaryColumn } from 'typeorm';
+import { Column, Entity, PrimaryColumn } from 'typeorm';
 
 @Entity('geodata_places', { synchronize: false })
 export class GeodataPlacesEntity {
@@ -21,7 +19,7 @@ export class GeodataPlacesEntity {
   //   asExpression: 'll_to_earth((latitude)::double precision, (longitude)::double precision)',
   //   type: 'earth',
   // })
-  earthCoord!: unknown;
+  // earthCoord!: unknown;
 
   @Column({ type: 'char', length: 2 })
   countryCode!: string;
@@ -32,27 +30,14 @@ export class GeodataPlacesEntity {
   @Column({ type: 'varchar', length: 80, nullable: true })
   admin2Code!: string;
 
-  @Column({
-    type: 'varchar',
-    generatedType: 'STORED',
-    asExpression: `"countryCode" || '.' || "admin1Code"`,
-    nullable: true,
-  })
-  admin1Key!: string;
+  @Column({ type: 'varchar', nullable: true })
+  admin1Name!: string;
 
-  @ManyToOne(() => GeodataAdmin1Entity, { eager: true, nullable: true, createForeignKeyConstraints: false })
-  admin1!: GeodataAdmin1Entity;
+  @Column({ type: 'varchar', nullable: true })
+  admin2Name!: string;
 
-  @Column({
-    type: 'varchar',
-    generatedType: 'STORED',
-    asExpression: `"countryCode" || '.' || "admin1Code" || '.' || "admin2Code"`,
-    nullable: true,
-  })
-  admin2Key!: string;
-
-  @ManyToOne(() => GeodataAdmin2Entity, { eager: true, nullable: true, createForeignKeyConstraints: false })
-  admin2!: GeodataAdmin2Entity;
+  @Column({ type: 'varchar', nullable: true })
+  alternateNames!: string;
 
   @Column({ type: 'date' })
   modificationDate!: Date;
diff --git a/server/src/infra/entities/index.ts b/server/src/infra/entities/index.ts
index 957e15a88..af620790e 100644
--- a/server/src/infra/entities/index.ts
+++ b/server/src/infra/entities/index.ts
@@ -7,8 +7,6 @@ import { AssetStackEntity } from './asset-stack.entity';
 import { AssetEntity } from './asset.entity';
 import { AuditEntity } from './audit.entity';
 import { ExifEntity } from './exif.entity';
-import { GeodataAdmin1Entity } from './geodata-admin1.entity';
-import { GeodataAdmin2Entity } from './geodata-admin2.entity';
 import { GeodataPlacesEntity } from './geodata-places.entity';
 import { LibraryEntity } from './library.entity';
 import { MoveEntity } from './move.entity';
@@ -32,8 +30,6 @@ export * from './asset-stack.entity';
 export * from './asset.entity';
 export * from './audit.entity';
 export * from './exif.entity';
-export * from './geodata-admin1.entity';
-export * from './geodata-admin2.entity';
 export * from './geodata-places.entity';
 export * from './library.entity';
 export * from './move.entity';
@@ -59,8 +55,6 @@ export const databaseEntities = [
   AuditEntity,
   ExifEntity,
   GeodataPlacesEntity,
-  GeodataAdmin1Entity,
-  GeodataAdmin2Entity,
   MoveEntity,
   PartnerEntity,
   PersonEntity,
diff --git a/server/src/infra/migrations/1708059341865-GeodataLocationSearch.ts b/server/src/infra/migrations/1708059341865-GeodataLocationSearch.ts
new file mode 100644
index 000000000..136ca2598
--- /dev/null
+++ b/server/src/infra/migrations/1708059341865-GeodataLocationSearch.ts
@@ -0,0 +1,152 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class GeodataLocationSearch1708059341865 implements MigrationInterface {
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`CREATE EXTENSION IF NOT EXISTS pg_trgm`);
+    await queryRunner.query(`CREATE EXTENSION IF NOT EXISTS unaccent`);
+
+    // https://stackoverflow.com/a/11007216
+    await queryRunner.query(`
+        CREATE OR REPLACE FUNCTION f_unaccent(text)
+            RETURNS text
+            LANGUAGE sql IMMUTABLE PARALLEL SAFE STRICT
+        RETURN unaccent('unaccent', $1)`);
+
+    await queryRunner.query(`ALTER TABLE geodata_places ADD COLUMN "admin1Name" varchar`);
+    await queryRunner.query(`ALTER TABLE geodata_places ADD COLUMN "admin2Name" varchar`);
+
+    await queryRunner.query(`
+        UPDATE geodata_places
+        SET "admin1Name" = admin1.name
+        FROM geodata_admin1 admin1
+        WHERE admin1.key = "admin1Key"`);
+
+    await queryRunner.query(`
+        UPDATE geodata_places
+        SET "admin2Name" = admin2.name
+        FROM geodata_admin2 admin2
+        WHERE admin2.key = "admin2Key"`);
+
+    await queryRunner.query(`DROP TABLE geodata_admin1 CASCADE`);
+    await queryRunner.query(`DROP TABLE geodata_admin2 CASCADE`);
+
+    await queryRunner.query(`
+        ALTER TABLE geodata_places
+            DROP COLUMN "admin1Key",
+            DROP COLUMN "admin2Key"`);
+
+    await queryRunner.query(`
+        CREATE INDEX idx_geodata_places_name
+            ON geodata_places
+        USING gin (f_unaccent(name) gin_trgm_ops)`);
+
+    await queryRunner.query(`
+        CREATE INDEX idx_geodata_places_admin1_name
+            ON geodata_places
+        USING gin (f_unaccent("admin1Name") gin_trgm_ops)`);
+
+    await queryRunner.query(`
+        CREATE INDEX idx_geodata_places_admin2_name
+            ON geodata_places
+        USING gin (f_unaccent("admin2Name") gin_trgm_ops)`);
+
+    await queryRunner.query(
+      `
+        DELETE FROM "typeorm_metadata"
+        WHERE
+            "type" = $1 AND
+            "name" = $2 AND
+            "database" = $3 AND
+            "schema" = $4 AND
+            "table" = $5`,
+      ['GENERATED_COLUMN', 'admin1Key', 'immich', 'public', 'geodata_places'],
+    );
+
+    await queryRunner.query(
+      `
+        DELETE FROM "typeorm_metadata"
+        WHERE
+            "type" = $1 AND 
+            "name" = $2 AND
+            "database" = $3 AND
+            "schema" = $4 AND
+            "table" = $5`,
+      ['GENERATED_COLUMN', 'admin2Key', 'immich', 'public', 'geodata_places'],
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`
+        CREATE TABLE "geodata_admin1" (
+            "key" character varying NOT NULL,
+            "name" character varying NOT NULL,
+            CONSTRAINT "PK_3fe3a89c5aac789d365871cb172" PRIMARY KEY ("key")
+        )`);
+
+    await queryRunner.query(`
+        CREATE TABLE "geodata_admin2" (
+            "key" character varying NOT NULL,
+            "name" character varying NOT NULL,
+            CONSTRAINT "PK_1e3886455dbb684d6f6b4756726" PRIMARY KEY ("key")
+        )`);
+
+    await queryRunner.query(`
+        ALTER TABLE geodata_places 
+            ADD COLUMN "admin1Key" character varying
+                GENERATED ALWAYS AS ("countryCode" || '.' || "admin1Code") STORED,
+            ADD COLUMN "admin2Key" character varying
+                GENERATED ALWAYS AS ("countryCode" || '.' || "admin1Code" || '.' || "admin2Code") STORED`);
+
+    await queryRunner.query(
+      `
+        INSERT INTO "geodata_admin1"
+        SELECT DISTINCT
+            "admin1Key" AS "key",
+            "admin1Name" AS "name"
+        FROM geodata_places
+        WHERE "admin1Name" IS NOT NULL`,
+    );
+
+    await queryRunner.query(
+      `
+          INSERT INTO "geodata_admin2"
+          SELECT DISTINCT
+              "admin2Key" AS "key",
+              "admin2Name" AS "name"
+          FROM geodata_places
+          WHERE "admin2Name" IS NOT NULL`,
+    );
+
+    await queryRunner.query(`
+            UPDATE geodata_places
+            SET "admin1Name" = admin1.name
+            FROM geodata_admin1 admin1
+            WHERE admin1.key = "admin1Key"`);
+
+    await queryRunner.query(`
+            UPDATE geodata_places
+            SET "admin2Name" = admin2.name
+            FROM geodata_admin2 admin2
+            WHERE admin2.key = "admin2Key";`);
+
+    await queryRunner.query(
+      `
+        INSERT INTO "typeorm_metadata"("database", "schema", "table", "type", "name", "value")
+        VALUES ($1, $2, $3, $4, $5, $6)`,
+      ['immich', 'public', 'geodata_places', 'GENERATED_COLUMN', 'admin1Key', '"countryCode" || \'.\' || "admin1Code"'],
+    );
+
+    await queryRunner.query(
+      `INSERT INTO "typeorm_metadata"("database", "schema", "table", "type", "name", "value")
+        VALUES ($1, $2, $3, $4, $5, $6)`,
+      [
+        'immich',
+        'public',
+        'geodata_places',
+        'GENERATED_COLUMN',
+        'admin2Key',
+        '"countryCode" || \'.\' || "admin1Code" || \'.\' || "admin2Code"',
+      ],
+    );
+  }
+}
diff --git a/server/src/infra/migrations/1708116312820-GeonamesEnhancement.ts b/server/src/infra/migrations/1708116312820-GeonamesEnhancement.ts
new file mode 100644
index 000000000..0cea9a041
--- /dev/null
+++ b/server/src/infra/migrations/1708116312820-GeonamesEnhancement.ts
@@ -0,0 +1,18 @@
+import { MigrationInterface, QueryRunner } from "typeorm";
+
+export class GeonamesEnhancement1708116312820 implements MigrationInterface {
+    name = 'GeonamesEnhancement1708116312820'
+
+    public async up(queryRunner: QueryRunner): Promise<void> {
+        await queryRunner.query(`ALTER TABLE geodata_places ADD COLUMN "alternateNames" varchar`);
+        await queryRunner.query(`
+        CREATE INDEX idx_geodata_places_admin2_alternate_names
+            ON geodata_places
+        USING gin (f_unaccent("alternateNames") gin_trgm_ops)`);
+    }
+
+    public async down(queryRunner: QueryRunner): Promise<void> {
+        await queryRunner.query(`ALTER TABLE geodata_places DROP COLUMN "alternateNames"`);
+    }
+
+}
diff --git a/server/src/infra/repositories/metadata.repository.ts b/server/src/infra/repositories/metadata.repository.ts
index 6a90ad108..4abfe0eac 100644
--- a/server/src/infra/repositories/metadata.repository.ts
+++ b/server/src/infra/repositories/metadata.repository.ts
@@ -2,7 +2,7 @@ import {
   citiesFile,
   geodataAdmin1Path,
   geodataAdmin2Path,
-  geodataCitites500Path,
+  geodataCities500Path,
   geodataDatePath,
   GeoPoint,
   IMetadataRepository,
@@ -10,13 +10,7 @@ import {
   ISystemMetadataRepository,
   ReverseGeocodeResult,
 } from '@app/domain';
-import {
-  ExifEntity,
-  GeodataAdmin1Entity,
-  GeodataAdmin2Entity,
-  GeodataPlacesEntity,
-  SystemMetadataKey,
-} from '@app/infra/entities';
+import { ExifEntity, GeodataPlacesEntity, SystemMetadataKey } from '@app/infra/entities';
 import { ImmichLogger } from '@app/infra/logger';
 import { Inject } from '@nestjs/common';
 import { InjectDataSource, InjectRepository } from '@nestjs/typeorm';
@@ -26,19 +20,16 @@ import { getName } from 'i18n-iso-countries';
 import { createReadStream, existsSync } from 'node:fs';
 import { readFile } from 'node:fs/promises';
 import * as readLine from 'node:readline';
-import { DataSource, DeepPartial, QueryRunner, Repository } from 'typeorm';
+import { DataSource, QueryRunner, Repository } from 'typeorm';
+import { QueryDeepPartialEntity } from 'typeorm/query-builder/QueryPartialEntity.js';
 import { DummyValue, GenerateSql } from '../infra.util';
 
-type GeoEntity = GeodataPlacesEntity | GeodataAdmin1Entity | GeodataAdmin2Entity;
-type GeoEntityClass = typeof GeodataPlacesEntity | typeof GeodataAdmin1Entity | typeof GeodataAdmin2Entity;
-
 export class MetadataRepository implements IMetadataRepository {
   constructor(
     @InjectRepository(ExifEntity) private exifRepository: Repository<ExifEntity>,
     @InjectRepository(GeodataPlacesEntity) private readonly geodataPlacesRepository: Repository<GeodataPlacesEntity>,
-    @InjectRepository(GeodataAdmin1Entity) private readonly geodataAdmin1Repository: Repository<GeodataAdmin1Entity>,
-    @InjectRepository(GeodataAdmin2Entity) private readonly geodataAdmin2Repository: Repository<GeodataAdmin2Entity>,
-    @Inject(ISystemMetadataRepository) private readonly systemMetadataRepository: ISystemMetadataRepository,
+    @Inject(ISystemMetadataRepository)
+    private readonly systemMetadataRepository: ISystemMetadataRepository,
     @InjectDataSource() private dataSource: DataSource,
   ) {}
 
@@ -54,7 +45,6 @@ export class MetadataRepository implements IMetadataRepository {
       return;
     }
 
-    this.logger.log('Importing geodata to database from file');
     await this.importGeodata();
 
     await this.systemMetadataRepository.set(SystemMetadataKey.REVERSE_GEOCODING_STATE, {
@@ -69,12 +59,14 @@ export class MetadataRepository implements IMetadataRepository {
     const queryRunner = this.dataSource.createQueryRunner();
     await queryRunner.connect();
 
+    const admin1 = await this.loadAdmin(geodataAdmin1Path);
+    const admin2 = await this.loadAdmin(geodataAdmin2Path);
+
     try {
       await queryRunner.startTransaction();
 
-      await this.loadCities500(queryRunner);
-      await this.loadAdmin1(queryRunner);
-      await this.loadAdmin2(queryRunner);
+      await queryRunner.manager.clear(GeodataPlacesEntity);
+      await this.loadCities500(queryRunner, admin1, admin2);
 
       await queryRunner.commitTransaction();
     } catch (error) {
@@ -86,76 +78,73 @@ export class MetadataRepository implements IMetadataRepository {
     }
   }
 
-  private async loadGeodataToTableFromFile<T extends GeoEntity>(
+  private async loadGeodataToTableFromFile(
     queryRunner: QueryRunner,
-    lineToEntityMapper: (lineSplit: string[]) => T,
+    lineToEntityMapper: (lineSplit: string[]) => GeodataPlacesEntity,
     filePath: string,
-    entity: GeoEntityClass,
   ) {
     if (!existsSync(filePath)) {
       this.logger.error(`Geodata file ${filePath} not found`);
       throw new Error(`Geodata file ${filePath} not found`);
     }
-    await queryRunner.manager.clear(entity);
 
     const input = createReadStream(filePath);
-    let buffer: DeepPartial<T>[] = [];
-    const lineReader = readLine.createInterface({ input: input });
+    let bufferGeodata: QueryDeepPartialEntity<GeodataPlacesEntity>[] = [];
+    const lineReader = readLine.createInterface({ input });
 
     for await (const line of lineReader) {
       const lineSplit = line.split('\t');
-      buffer.push(lineToEntityMapper(lineSplit));
-      if (buffer.length > 1000) {
-        await queryRunner.manager.save(buffer);
-        buffer = [];
+      const geoData = lineToEntityMapper(lineSplit);
+      bufferGeodata.push(geoData);
+      if (bufferGeodata.length > 1000) {
+        await queryRunner.manager.upsert(GeodataPlacesEntity, bufferGeodata, ['id']);
+        bufferGeodata = [];
       }
     }
-    await queryRunner.manager.save(buffer);
+    await queryRunner.manager.upsert(GeodataPlacesEntity, bufferGeodata, ['id']);
   }
 
-  private async loadCities500(queryRunner: QueryRunner) {
-    await this.loadGeodataToTableFromFile<GeodataPlacesEntity>(
+  private async loadCities500(
+    queryRunner: QueryRunner,
+    admin1Map: Map<string, string>,
+    admin2Map: Map<string, string>,
+  ) {
+    await this.loadGeodataToTableFromFile(
       queryRunner,
       (lineSplit: string[]) =>
         this.geodataPlacesRepository.create({
           id: Number.parseInt(lineSplit[0]),
           name: lineSplit[1],
+          alternateNames: lineSplit[3],
           latitude: Number.parseFloat(lineSplit[4]),
           longitude: Number.parseFloat(lineSplit[5]),
           countryCode: lineSplit[8],
           admin1Code: lineSplit[10],
           admin2Code: lineSplit[11],
           modificationDate: lineSplit[18],
+          admin1Name: admin1Map.get(`${lineSplit[8]}.${lineSplit[10]}`),
+          admin2Name: admin2Map.get(`${lineSplit[8]}.${lineSplit[10]}.${lineSplit[11]}`),
         }),
-      geodataCitites500Path,
-      GeodataPlacesEntity,
+      geodataCities500Path,
     );
   }
 
-  private async loadAdmin1(queryRunner: QueryRunner) {
-    await this.loadGeodataToTableFromFile<GeodataAdmin1Entity>(
-      queryRunner,
-      (lineSplit: string[]) =>
-        this.geodataAdmin1Repository.create({
-          key: lineSplit[0],
-          name: lineSplit[1],
-        }),
-      geodataAdmin1Path,
-      GeodataAdmin1Entity,
-    );
-  }
+  private async loadAdmin(filePath: string) {
+    if (!existsSync(filePath)) {
+      this.logger.error(`Geodata file ${filePath} not found`);
+      throw new Error(`Geodata file ${filePath} not found`);
+    }
 
-  private async loadAdmin2(queryRunner: QueryRunner) {
-    await this.loadGeodataToTableFromFile<GeodataAdmin2Entity>(
-      queryRunner,
-      (lineSplit: string[]) =>
-        this.geodataAdmin2Repository.create({
-          key: lineSplit[0],
-          name: lineSplit[1],
-        }),
-      geodataAdmin2Path,
-      GeodataAdmin2Entity,
-    );
+    const input = createReadStream(filePath);
+    const lineReader = readLine.createInterface({ input: input });
+
+    const adminMap = new Map<string, string>();
+    for await (const line of lineReader) {
+      const lineSplit = line.split('\t');
+      adminMap.set(lineSplit[0], lineSplit[1]);
+    }
+
+    return adminMap;
   }
 
   async teardown() {
@@ -167,8 +156,6 @@ export class MetadataRepository implements IMetadataRepository {
 
     const response = await this.geodataPlacesRepository
       .createQueryBuilder('geoplaces')
-      .leftJoinAndSelect('geoplaces.admin1', 'admin1')
-      .leftJoinAndSelect('geoplaces.admin2', 'admin2')
       .where('earth_box(ll_to_earth(:latitude, :longitude), 25000) @> "earthCoord"', point)
       .orderBy('earth_distance(ll_to_earth(:latitude, :longitude), "earthCoord")')
       .limit(1)
@@ -183,9 +170,9 @@ export class MetadataRepository implements IMetadataRepository {
 
     this.logger.verbose(`Raw: ${JSON.stringify(response, null, 2)}`);
 
-    const { countryCode, name: city, admin1, admin2 } = response;
+    const { countryCode, name: city, admin1Name, admin2Name } = response;
     const country = getName(countryCode, 'en') ?? null;
-    const stateParts = [admin2?.name, admin1?.name].filter((name) => !!name);
+    const stateParts = [admin2Name, admin1Name].filter((name) => !!name);
     const state = stateParts.length > 0 ? stateParts.join(', ') : null;
 
     return { country, state, city };
diff --git a/server/src/infra/repositories/search.repository.ts b/server/src/infra/repositories/search.repository.ts
index a30c96b10..089640128 100644
--- a/server/src/infra/repositories/search.repository.ts
+++ b/server/src/infra/repositories/search.repository.ts
@@ -12,7 +12,13 @@ import {
   SmartSearchOptions,
 } from '@app/domain';
 import { getCLIPModelInfo } from '@app/domain/smart-info/smart-info.constant';
-import { AssetEntity, AssetFaceEntity, SmartInfoEntity, SmartSearchEntity } from '@app/infra/entities';
+import {
+  AssetEntity,
+  AssetFaceEntity,
+  GeodataPlacesEntity,
+  SmartInfoEntity,
+  SmartSearchEntity,
+} from '@app/infra/entities';
 import { ImmichLogger } from '@app/infra/logger';
 import { Injectable } from '@nestjs/common';
 import { InjectRepository } from '@nestjs/typeorm';
@@ -31,6 +37,7 @@ export class SearchRepository implements ISearchRepository {
     @InjectRepository(AssetEntity) private assetRepository: Repository<AssetEntity>,
     @InjectRepository(AssetFaceEntity) private assetFaceRepository: Repository<AssetFaceEntity>,
     @InjectRepository(SmartSearchEntity) private smartSearchRepository: Repository<SmartSearchEntity>,
+    @InjectRepository(GeodataPlacesEntity) private readonly geodataPlacesRepository: Repository<GeodataPlacesEntity>,
   ) {
     this.faceColumns = this.assetFaceRepository.manager.connection
       .getMetadata(AssetFaceEntity)
@@ -172,6 +179,27 @@ export class SearchRepository implements ISearchRepository {
     }));
   }
 
+  @GenerateSql({ params: [DummyValue.STRING] })
+  async searchPlaces(placeName: string): Promise<GeodataPlacesEntity[]> {
+    return await this.geodataPlacesRepository
+      .createQueryBuilder('geoplaces')
+      .where(`f_unaccent(name) %>> f_unaccent(:placeName)`)
+      .orWhere(`f_unaccent("admin2Name") %>> f_unaccent(:placeName)`)
+      .orWhere(`f_unaccent("admin1Name") %>> f_unaccent(:placeName)`)
+      .orWhere(`f_unaccent("alternateNames") %>> f_unaccent(:placeName)`)
+      .orderBy(
+        `
+        COALESCE(f_unaccent(name) <->>> f_unaccent(:placeName), 0) +
+        COALESCE(f_unaccent("admin2Name") <->>> f_unaccent(:placeName), 0) +
+        COALESCE(f_unaccent("admin1Name") <->>> f_unaccent(:placeName), 0) +
+        COALESCE(f_unaccent("alternateNames") <->>> f_unaccent(:placeName), 0)
+        `,
+      )
+      .setParameters({ placeName })
+      .limit(20)
+      .getMany();
+  }
+
   async upsert(smartInfo: Partial<SmartInfoEntity>, embedding?: Embedding): Promise<void> {
     await this.repository.upsert(smartInfo, { conflictPaths: ['assetId'] });
     if (!smartInfo.assetId || !embedding) {
diff --git a/server/src/infra/sql/search.repository.sql b/server/src/infra/sql/search.repository.sql
index a21697c26..c45d90a7a 100644
--- a/server/src/infra/sql/search.repository.sql
+++ b/server/src/infra/sql/search.repository.sql
@@ -238,3 +238,37 @@ FROM
 WHERE
   res.distance <= $3
 COMMIT
+
+-- SearchRepository.searchPlaces
+SELECT
+  "geoplaces"."id" AS "geoplaces_id",
+  "geoplaces"."name" AS "geoplaces_name",
+  "geoplaces"."longitude" AS "geoplaces_longitude",
+  "geoplaces"."latitude" AS "geoplaces_latitude",
+  "geoplaces"."countryCode" AS "geoplaces_countryCode",
+  "geoplaces"."admin1Code" AS "geoplaces_admin1Code",
+  "geoplaces"."admin2Code" AS "geoplaces_admin2Code",
+  "geoplaces"."admin1Name" AS "geoplaces_admin1Name",
+  "geoplaces"."admin2Name" AS "geoplaces_admin2Name",
+  "geoplaces"."alternateNames" AS "geoplaces_alternateNames",
+  "geoplaces"."modificationDate" AS "geoplaces_modificationDate"
+FROM
+  "geodata_places" "geoplaces"
+WHERE
+  f_unaccent (name) %>> f_unaccent ($1)
+  OR f_unaccent ("admin2Name") %>> f_unaccent ($1)
+  OR f_unaccent ("admin1Name") %>> f_unaccent ($1)
+  OR f_unaccent ("alternateNames") %>> f_unaccent ($1)
+ORDER BY
+  COALESCE(f_unaccent (name) <->>> f_unaccent ($1), 0) + COALESCE(
+    f_unaccent ("admin2Name") <->>> f_unaccent ($1),
+    0
+  ) + COALESCE(
+    f_unaccent ("admin1Name") <->>> f_unaccent ($1),
+    0
+  ) + COALESCE(
+    f_unaccent ("alternateNames") <->>> f_unaccent ($1),
+    0
+  ) ASC
+LIMIT
+  20
diff --git a/server/test/repositories/search.repository.mock.ts b/server/test/repositories/search.repository.mock.ts
index e0bdab269..06a2cb76d 100644
--- a/server/test/repositories/search.repository.mock.ts
+++ b/server/test/repositories/search.repository.mock.ts
@@ -7,5 +7,6 @@ export const newSearchRepositoryMock = (): jest.Mocked<ISearchRepository> => {
     searchSmart: jest.fn(),
     searchFaces: jest.fn(),
     upsert: jest.fn(),
+    searchPlaces: jest.fn(),
   };
 };
diff --git a/web/src/lib/components/elements/search-bar.svelte b/web/src/lib/components/elements/search-bar.svelte
index 9c6eded22..898601d0a 100644
--- a/web/src/lib/components/elements/search-bar.svelte
+++ b/web/src/lib/components/elements/search-bar.svelte
@@ -6,6 +6,7 @@
   import LoadingSpinner from '../shared-components/loading-spinner.svelte';
 
   export let name: string;
+  export let roundedBottom = true;
   export let isSearching: boolean;
   export let placeholder: string;
 
@@ -17,7 +18,11 @@
   };
 </script>
 
-<div class="flex items-center text-sm rounded-lg bg-gray-100 p-2 dark:bg-gray-700 gap-2 place-items-center h-full">
+<div
+  class="flex items-center text-sm {roundedBottom
+    ? 'rounded-lg'
+    : 'rounded-t-lg'} bg-gray-100 p-2 dark:bg-gray-700 gap-2 place-items-center h-full"
+>
   <button on:click={() => dispatch('search', { force: true })}>
     <div class="w-fit">
       <Icon path={mdiMagnify} size="24" />
diff --git a/web/src/lib/components/shared-components/change-location.svelte b/web/src/lib/components/shared-components/change-location.svelte
index 2e95c94f9..5adb1ecda 100644
--- a/web/src/lib/components/shared-components/change-location.svelte
+++ b/web/src/lib/components/shared-components/change-location.svelte
@@ -1,10 +1,15 @@
 <script lang="ts">
-  import type { AssetResponseDto } from '@immich/sdk';
   import { createEventDispatcher } from 'svelte';
   import ConfirmDialogue from './confirm-dialogue.svelte';
+  import { maximumLengthSearchPeople, timeBeforeShowLoadingSpinner } from '$lib/constants';
+  import { handleError } from '$lib/utils/handle-error';
+
+  import { clickOutside } from '$lib/utils/click-outside';
   import LoadingSpinner from './loading-spinner.svelte';
   import { delay } from '$lib/utils/asset-utils';
   import { timeToLoadTheMap } from '$lib/constants';
+  import { searchPlaces, type AssetResponseDto, type PlacesResponseDto } from '@immich/sdk';
+  import SearchBar from '../elements/search-bar.svelte';
 
   export const title = 'Change Location';
   export let asset: AssetResponseDto | undefined = undefined;
@@ -14,6 +19,16 @@
     lat: number;
   }
 
+  let places: PlacesResponseDto[] = [];
+  let suggestedPlaces: PlacesResponseDto[] = [];
+  let searchWord: string;
+  let isSearching = false;
+  let showSpinner = false;
+  let focusedElements: (HTMLButtonElement | null)[] = Array.from({ length: maximumLengthSearchPeople }, () => null);
+  let indexFocus: number | null = null;
+  let hideSuggestion = false;
+  let addClipMapMarker: (long: number, lat: number) => void;
+
   const dispatch = createEventDispatcher<{
     cancel: void;
     confirm: Point;
@@ -23,6 +38,16 @@
   $: lng = asset?.exifInfo?.longitude || 0;
   $: zoom = lat && lng ? 15 : 1;
 
+  $: {
+    if (places) {
+      suggestedPlaces = places.slice(0, 5);
+      indexFocus = null;
+    }
+    if (searchWord === '') {
+      suggestedPlaces = [];
+    }
+  }
+
   let point: Point | null = null;
 
   const handleCancel = () => dispatch('cancel');
@@ -38,8 +63,82 @@
       dispatch('cancel');
     }
   };
+
+  const getLocation = (name: string, admin1Name?: string, admin2Name?: string): string => {
+    return `${name}${admin1Name ? ', ' + admin1Name : ''}${admin2Name ? ', ' + admin2Name : ''}`;
+  };
+
+  const handleSearchPlaces = async () => {
+    if (searchWord === '' || isSearching) {
+      return;
+    }
+
+    // TODO: refactor setTimeout/clearTimeout logic - there are no less than 12 places that duplicate this code
+    isSearching = true;
+    const timeout = setTimeout(() => (showSpinner = true), timeBeforeShowLoadingSpinner);
+    try {
+      places = await searchPlaces({ name: searchWord });
+    } catch (error) {
+      places = [];
+      handleError(error, "Can't search places");
+    } finally {
+      clearTimeout(timeout);
+      isSearching = false;
+      showSpinner = false;
+    }
+  };
+
+  const handleUseSuggested = (latitude: number, longitude: number) => {
+    hideSuggestion = true;
+    point = { lng: longitude, lat: latitude };
+    addClipMapMarker(longitude, latitude);
+  };
+
+  const handleKeyboardPress = (event: KeyboardEvent) => {
+    if (suggestedPlaces.length === 0) {
+      return;
+    }
+
+    event.stopPropagation();
+    switch (event.key) {
+      case 'ArrowDown': {
+        event.preventDefault();
+        if (indexFocus === null) {
+          indexFocus = 0;
+        } else if (indexFocus === suggestedPlaces.length - 1) {
+          indexFocus = 0;
+        } else {
+          indexFocus++;
+        }
+        focusedElements[indexFocus]?.focus();
+        return;
+      }
+      case 'ArrowUp': {
+        if (indexFocus === null) {
+          indexFocus = 0;
+          return;
+        }
+        if (indexFocus === 0) {
+          indexFocus = suggestedPlaces.length - 1;
+        } else {
+          indexFocus--;
+        }
+        focusedElements[indexFocus]?.focus();
+
+        return;
+      }
+      case 'Enter': {
+        if (indexFocus !== null) {
+          hideSuggestion = true;
+          handleUseSuggested(suggestedPlaces[indexFocus].latitude, suggestedPlaces[indexFocus].longitude);
+        }
+      }
+    }
+  };
 </script>
 
+<svelte:document on:keydown={handleKeyboardPress} />
+
 <ConfirmDialogue
   confirmColor="primary"
   cancelColor="secondary"
@@ -49,6 +148,38 @@
   on:cancel={handleCancel}
 >
   <div slot="prompt" class="flex flex-col w-full h-full gap-2">
+    <div class="relative w-64 sm:w-96" use:clickOutside on:outclick={() => (hideSuggestion = true)}>
+      <button class="w-full" on:click={() => (hideSuggestion = false)}>
+        <SearchBar
+          placeholder="Search places"
+          bind:name={searchWord}
+          isSearching={showSpinner}
+          on:reset={() => {
+            suggestedPlaces = [];
+          }}
+          on:search={handleSearchPlaces}
+          roundedBottom={suggestedPlaces.length === 0 || hideSuggestion}
+        />
+      </button>
+      <div class="absolute z-[99] w-full" id="suggestion">
+        {#if !hideSuggestion}
+          {#each suggestedPlaces as place, index}
+            <button
+              bind:this={focusedElements[index]}
+              class=" flex w-full border-t border-gray-400 dark:border-immich-dark-gray h-14 place-items-center bg-gray-200 p-2 dark:bg-gray-700 hover:bg-gray-300 hover:dark:bg-[#232932] focus:bg-gray-300 focus:dark:bg-[#232932] {index ===
+              suggestedPlaces.length - 1
+                ? 'rounded-b-lg border-b'
+                : ''}"
+              on:click={() => handleUseSuggested(place.latitude, place.longitude)}
+            >
+              <p class="ml-4 text-sm text-gray-700 dark:text-gray-100 truncate">
+                {getLocation(place.name, place.admin1name, place.admin2name)}
+              </p>
+            </button>
+          {/each}
+        {/if}
+      </div>
+    </div>
     <label for="datetime">Pick a location</label>
     <div class="h-[500px] min-h-[300px] w-full">
       {#await import('../shared-components/map/map.svelte')}
@@ -63,6 +194,7 @@
           this={component.default}
           mapMarkers={lat && lng && asset ? [{ id: asset.id, lat, lon: lng }] : []}
           {zoom}
+          bind:addClipMapMarker
           center={lat && lng ? { lat, lng } : undefined}
           simplified={true}
           clickable={true}
diff --git a/web/src/lib/components/shared-components/map/map.svelte b/web/src/lib/components/shared-components/map/map.svelte
index 1752a753a..682042604 100644
--- a/web/src/lib/components/shared-components/map/map.svelte
+++ b/web/src/lib/components/shared-components/map/map.svelte
@@ -32,6 +32,17 @@
   export let simplified = false;
   export let clickable = false;
   export let useLocationPin = false;
+  export function addClipMapMarker(lng: number, lat: number) {
+    if (map) {
+      if (marker) {
+        marker.remove();
+      }
+
+      center = { lng, lat };
+      marker = new maplibregl.Marker().setLngLat([lng, lat]).addTo(map);
+      map.setZoom(15);
+    }
+  }
 
   let map: maplibregl.Map;
   let marker: maplibregl.Marker | null = null;

From 878932f87e65b764303ddf4594934b7c40ac88f8 Mon Sep 17 00:00:00 2001
From: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>
Date: Sat, 24 Feb 2024 04:32:56 +0100
Subject: [PATCH 11/28] feat(web): improve search filter design (#7367)

* feat(web): improve search filter design

* restore position of people toggle button

* consistent colors for media type inputs
---
 .../search-bar/search-filter-box.svelte       | 448 +++++++++---------
 1 file changed, 220 insertions(+), 228 deletions(-)

diff --git a/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte b/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte
index 00ceb6a87..a19cf72a4 100644
--- a/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte
+++ b/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte
@@ -319,263 +319,255 @@
 <div
   bind:clientWidth={filterBoxWidth}
   transition:fly={{ y: 25, duration: 250 }}
-  class="absolute w-full rounded-b-3xl border border-gray-200 bg-white shadow-2xl transition-all dark:border-gray-800 dark:bg-immich-dark-gray dark:text-gray-300 px-6 pt-6 overflow-y-auto max-h-[90vh] immich-scrollbar"
+  class="absolute w-full rounded-b-3xl border border-t-0 border-gray-200 bg-white shadow-2xl dark:border-gray-800 dark:bg-immich-dark-gray dark:text-gray-300"
 >
-  <p class="text-xs py-2">FILTERS</p>
-  <hr class="border-slate-300 dark:border-slate-700 py-2" />
-
   <form
-    id="search-filter-form relative"
+    id="search-filter-form"
     autocomplete="off"
-    class="hover:cursor-auto"
     on:submit|preventDefault={search}
     on:reset|preventDefault={resetForm}
   >
-    <!-- PEOPLE -->
-    <div id="people-selection" class="my-4">
-      <div class="flex justify-between place-items-center gap-6">
-        <div class="flex-1">
-          <p class="immich-form-label">PEOPLE</p>
-        </div>
-      </div>
-
+    <div class="px-4 sm:px-6 py-4 space-y-10 max-h-[calc(100dvh-12rem)] overflow-y-auto immich-scrollbar">
+      <!-- PEOPLE -->
       {#if suggestions.people.length > 0}
-        <div class="flex gap-1 mt-4 flex-wrap max-h-[300px] overflow-y-auto immich-scrollbar transition-all">
-          {#each peopleList as person (person.id)}
-            <button
-              type="button"
-              class="w-20 text-center rounded-3xl border-2 border-transparent hover:bg-immich-gray dark:hover:bg-immich-dark-primary/20 p-2 transition-all {filter.people.some(
-                (p) => p.id === person.id,
-              )
-                ? 'dark:border-slate-500 border-slate-300 bg-slate-200 dark:bg-slate-800 dark:text-white'
-                : ''}"
-              on:click={() => handlePeopleSelection(person.id)}
-            >
-              <ImageThumbnail
-                circle
-                shadow
-                url={getPeopleThumbnailUrl(person.id)}
-                altText={person.name}
-                widthStyle="100%"
-              />
-              <p class="mt-2 line-clamp-2 text-sm font-medium dark:text-white">{person.name}</p>
-            </button>
-          {/each}
-        </div>
+        <div id="people-selection" class="-mb-4">
+          <div class="flex items-center gap-6">
+            <p class="immich-form-label">PEOPLE</p>
+          </div>
 
-        <div class="flex justify-center mt-2">
-          <Button
-            shadow={false}
-            color="text-primary"
-            type="button"
-            class="flex gap-2 place-items-center place-content-center"
-            on:click={() => (showAllPeople = !showAllPeople)}
-          >
-            {#if showAllPeople}
-              <span><Icon path={mdiClose} /></span>
-              Collapse
-            {:else}
-              <span><Icon path={mdiArrowRight} /></span>
-              See all people
-            {/if}
-          </Button>
+          <div class="flex -mx-1 max-h-64 gap-1 mt-2 flex-wrap overflow-y-auto immich-scrollbar">
+            {#each peopleList as person (person.id)}
+              <button
+                type="button"
+                class="w-20 text-center rounded-3xl border-2 border-transparent hover:bg-immich-gray dark:hover:bg-immich-dark-primary/20 p-2 transition-all {filter.people.some(
+                  (p) => p.id === person.id,
+                )
+                  ? 'dark:border-slate-500 border-slate-400 bg-slate-200 dark:bg-slate-800 dark:text-white'
+                  : ''}"
+                on:click={() => handlePeopleSelection(person.id)}
+              >
+                <ImageThumbnail
+                  circle
+                  shadow
+                  url={getPeopleThumbnailUrl(person.id)}
+                  altText={person.name}
+                  widthStyle="100%"
+                />
+                <p class="mt-2 line-clamp-2 text-sm font-medium dark:text-white">{person.name}</p>
+              </button>
+            {/each}
+          </div>
+
+          {#if showAllPeople || suggestions.people.length > peopleList.length}
+            <div class="flex justify-center mt-2">
+              <Button
+                shadow={false}
+                color="text-primary"
+                class="flex gap-2 place-items-center"
+                on:click={() => (showAllPeople = !showAllPeople)}
+              >
+                {#if showAllPeople}
+                  <span><Icon path={mdiClose} /></span>
+                  Collapse
+                {:else}
+                  <span><Icon path={mdiArrowRight} /></span>
+                  See all people
+                {/if}
+              </Button>
+            </div>
+          {/if}
         </div>
       {/if}
-    </div>
 
-    <hr class="border-slate-300 dark:border-slate-700" />
-    <!-- CONTEXT -->
-    <div class="my-4">
-      <label class="immich-form-label" for="context">CONTEXT</label>
-      <input
-        class="immich-form-input hover:cursor-text w-full mt-3"
-        type="text"
-        id="context"
-        name="context"
-        placeholder="Sunrise on the beach"
-        bind:value={filter.context}
-      />
-    </div>
-
-    <hr class="border-slate-300 dark:border-slate-700" />
-    <!-- LOCATION -->
-    <div id="location-selection" class="my-4">
-      <p class="immich-form-label">PLACE</p>
-
-      <div class="flex justify-between gap-5 mt-3">
-        <div class="w-full">
-          <label class="text-sm text-black dark:text-white" for="search-place-country">Country</label>
-          <Combobox
-            id="search-place-country"
-            options={suggestions.country}
-            bind:selectedOption={filter.location.country}
-            placeholder="Search country..."
-            on:click={() => updateSuggestion(SearchSuggestionType.Country, {})}
+      <!-- CONTEXT -->
+      <div>
+        <label class="immich-form-label" for="context">
+          <span>CONTEXT</span>
+          <input
+            class="immich-form-input hover:cursor-text w-full mt-1"
+            type="text"
+            id="context"
+            name="context"
+            placeholder="Sunrise on the beach"
+            bind:value={filter.context}
           />
-        </div>
-
-        <div class="w-full">
-          <label class="text-sm text-black dark:text-white" for="search-place-state">State</label>
-          <Combobox
-            id="search-place-state"
-            options={suggestions.state}
-            bind:selectedOption={filter.location.state}
-            placeholder="Search state..."
-            on:click={() => updateSuggestion(SearchSuggestionType.State, { country: filter.location.country?.value })}
-          />
-        </div>
-
-        <div class="w-full">
-          <label class="text-sm text-black dark:text-white" for="search-place-city">City</label>
-          <Combobox
-            id="search-place-city"
-            options={suggestions.city}
-            bind:selectedOption={filter.location.city}
-            placeholder="Search city..."
-            on:click={() =>
-              updateSuggestion(SearchSuggestionType.City, {
-                country: filter.location.country?.value,
-                state: filter.location.state?.value,
-              })}
-          />
-        </div>
-      </div>
-    </div>
-
-    <hr class="border-slate-300 dark:border-slate-700" />
-    <!-- CAMERA MODEL -->
-    <div id="camera-selection" class="my-4">
-      <p class="immich-form-label">CAMERA</p>
-
-      <div class="flex justify-between gap-5 mt-3">
-        <div class="w-full">
-          <label class="text-sm text-black dark:text-white" for="search-camera-make">Make</label>
-          <Combobox
-            id="search-camera-make"
-            options={suggestions.make}
-            bind:selectedOption={filter.camera.make}
-            placeholder="Search camera make..."
-            on:click={() =>
-              updateSuggestion(SearchSuggestionType.CameraMake, { cameraModel: filter.camera.model?.value })}
-          />
-        </div>
-
-        <div class="w-full">
-          <label class="text-sm text-black dark:text-white" for="search-camera-model">Model</label>
-          <Combobox
-            id="search-camera-model"
-            options={suggestions.model}
-            bind:selectedOption={filter.camera.model}
-            placeholder="Search camera model..."
-            on:click={() =>
-              updateSuggestion(SearchSuggestionType.CameraModel, { cameraMake: filter.camera.make?.value })}
-          />
-        </div>
-      </div>
-    </div>
-
-    <hr class="border-slate-300 dark:border-slate-700" />
-
-    <!-- DATE RANGE -->
-    <div id="date-range-selection" class="my-4 flex justify-between gap-5">
-      <div class="mb-3 flex-1 mt">
-        <label class="immich-form-label" for="start-date">START DATE</label>
-        <input
-          class="immich-form-input w-full mt-3 hover:cursor-pointer"
-          type="date"
-          id="start-date"
-          name="start-date"
-          bind:value={filter.date.takenAfter}
-        />
+        </label>
       </div>
 
-      <div class="mb-3 flex-1">
-        <label class="immich-form-label" for="end-date">END DATE</label>
-        <input
-          class="immich-form-input w-full mt-3 hover:cursor-pointer"
-          type="date"
-          id="end-date"
-          name="end-date"
-          placeholder=""
-          bind:value={filter.date.takenBefore}
-        />
-      </div>
-    </div>
+      <!-- LOCATION -->
+      <div id="location-selection">
+        <p class="immich-form-label">PLACE</p>
 
-    <hr class="border-slate-300 dark:border-slate-700" />
-    <div class="py-3 grid grid-cols-[repeat(auto-fill,minmax(21rem,1fr))] gap-x-16 gap-y-8">
-      <!-- MEDIA TYPE -->
-      <div id="media-type-selection">
-        <p class="immich-form-label">MEDIA TYPE</p>
+        <div class="grid grid-cols-[repeat(auto-fit,minmax(10rem,1fr))] gap-5 mt-1">
+          <div class="w-full">
+            <label class="text-sm text-black dark:text-white" for="search-place-country">Country</label>
+            <Combobox
+              id="search-place-country"
+              options={suggestions.country}
+              bind:selectedOption={filter.location.country}
+              placeholder="Search country..."
+              on:click={() => updateSuggestion(SearchSuggestionType.Country, {})}
+            />
+          </div>
 
-        <div class="flex gap-5 mt-3">
-          <label
-            for="type-all"
-            class="text-base flex place-items-center gap-1 hover:cursor-pointer text-black dark:text-white"
-          >
-            <input
-              bind:group={filter.mediaType}
-              value={MediaType.All}
-              type="radio"
-              name="radio-type"
-              id="type-all"
-            />All</label
-          >
+          <div class="w-full">
+            <label class="text-sm text-black dark:text-white" for="search-place-state">State</label>
+            <Combobox
+              id="search-place-state"
+              options={suggestions.state}
+              bind:selectedOption={filter.location.state}
+              placeholder="Search state..."
+              on:click={() => updateSuggestion(SearchSuggestionType.State, { country: filter.location.country?.value })}
+            />
+          </div>
 
-          <label
-            for="type-image"
-            class="text-base flex place-items-center gap-1 hover:cursor-pointer text-black dark:text-white"
-          >
-            <input
-              bind:group={filter.mediaType}
-              value={MediaType.Image}
-              type="radio"
-              name="media-type"
-              id="type-image"
-            />Image</label
-          >
-
-          <label
-            for="type-video"
-            class="text-base flex place-items-center gap-1 hover:cursor-pointer text-black dark:text-white"
-          >
-            <input
-              bind:group={filter.mediaType}
-              value={MediaType.Video}
-              type="radio"
-              name="radio-type"
-              id="type-video"
-            />Video</label
-          >
+          <div class="w-full">
+            <label class="text-sm text-black dark:text-white" for="search-place-city">City</label>
+            <Combobox
+              id="search-place-city"
+              options={suggestions.city}
+              bind:selectedOption={filter.location.city}
+              placeholder="Search city..."
+              on:click={() =>
+                updateSuggestion(SearchSuggestionType.City, {
+                  country: filter.location.country?.value,
+                  state: filter.location.state?.value,
+                })}
+            />
+          </div>
         </div>
       </div>
 
-      <!-- DISPLAY OPTIONS -->
-      <div id="display-options-selection">
-        <p class="immich-form-label">DISPLAY OPTIONS</p>
+      <!-- CAMERA MODEL -->
+      <div id="camera-selection">
+        <p class="immich-form-label">CAMERA</p>
 
-        <div class="flex gap-5 mt-3">
-          <label class="flex items-center mb-2">
-            <input type="checkbox" class="form-checkbox h-5 w-5 color" bind:checked={filter.isNotInAlbum} />
-            <span class="ml-2 text-sm text-black dark:text-white pt-1">Not in any album</span>
-          </label>
+        <div class="grid grid-cols-[repeat(auto-fit,minmax(10rem,1fr))] gap-5 mt-1">
+          <div class="w-full">
+            <label class="text-sm text-black dark:text-white" for="search-camera-make">Make</label>
+            <Combobox
+              id="search-camera-make"
+              options={suggestions.make}
+              bind:selectedOption={filter.camera.make}
+              placeholder="Search camera make..."
+              on:click={() =>
+                updateSuggestion(SearchSuggestionType.CameraMake, { cameraModel: filter.camera.model?.value })}
+            />
+          </div>
 
-          <label class="flex items-center mb-2">
-            <input type="checkbox" class="form-checkbox h-5 w-5 color" bind:checked={filter.isArchive} />
-            <span class="ml-2 text-sm text-black dark:text-white pt-1">Archive</span>
-          </label>
+          <div class="w-full">
+            <label class="text-sm text-black dark:text-white" for="search-camera-model">Model</label>
+            <Combobox
+              id="search-camera-model"
+              options={suggestions.model}
+              bind:selectedOption={filter.camera.model}
+              placeholder="Search camera model..."
+              on:click={() =>
+                updateSuggestion(SearchSuggestionType.CameraModel, { cameraMake: filter.camera.make?.value })}
+            />
+          </div>
+        </div>
+      </div>
 
-          <label class="flex items-center mb-2">
-            <input type="checkbox" class="form-checkbox h-5 w-5 color" bind:checked={filter.isFavorite} />
-            <span class="ml-2 text-sm text-black dark:text-white pt-1">Favorite</span>
-          </label>
+      <!-- DATE RANGE -->
+      <div id="date-range-selection" class="grid grid-cols-[repeat(auto-fit,minmax(10rem,1fr))] gap-5">
+        <label class="immich-form-label" for="start-date">
+          <span>START DATE</span>
+          <input
+            class="immich-form-input w-full mt-1 hover:cursor-pointer"
+            type="date"
+            id="start-date"
+            name="start-date"
+            max={filter.date.takenBefore}
+            bind:value={filter.date.takenAfter}
+          />
+        </label>
+
+        <label class="immich-form-label" for="end-date">
+          <span>END DATE</span>
+          <input
+            class="immich-form-input w-full mt-1 hover:cursor-pointer"
+            type="date"
+            id="end-date"
+            name="end-date"
+            placeholder=""
+            min={filter.date.takenAfter}
+            bind:value={filter.date.takenBefore}
+          />
+        </label>
+      </div>
+
+      <div class="grid md:grid-cols-2 gap-x-5 gap-y-8">
+        <!-- MEDIA TYPE -->
+        <div id="media-type-selection">
+          <p class="immich-form-label">MEDIA TYPE</p>
+
+          <div class="flex gap-5 mt-1 text-base">
+            <label for="type-all" class="flex items-center gap-1">
+              <input
+                bind:group={filter.mediaType}
+                value={MediaType.All}
+                type="radio"
+                name="radio-type"
+                id="type-all"
+                class="size-4"
+              />
+              <span class="pt-0.5">All</span>
+            </label>
+
+            <label for="type-image" class="flex items-center gap-1">
+              <input
+                bind:group={filter.mediaType}
+                value={MediaType.Image}
+                type="radio"
+                name="media-type"
+                id="type-image"
+                class="size-4"
+              />
+              <span class="pt-0.5">Image</span>
+            </label>
+
+            <label for="type-video" class="flex items-center gap-1">
+              <input
+                bind:group={filter.mediaType}
+                value={MediaType.Video}
+                type="radio"
+                name="radio-type"
+                id="type-video"
+                class="size-4"
+              />
+              <span class="pt-0.5">Video</span>
+            </label>
+          </div>
+        </div>
+
+        <!-- DISPLAY OPTIONS -->
+        <div id="display-options-selection" class="text-sm">
+          <p class="immich-form-label">DISPLAY OPTIONS</p>
+
+          <div class="flex flex-wrap gap-x-5 gap-y-2 mt-1">
+            <label class="flex items-center gap-2">
+              <input type="checkbox" class="size-5 flex-shrink-0" bind:checked={filter.isNotInAlbum} />
+              <span class="pt-1">Not in any album</span>
+            </label>
+
+            <label class="flex items-center gap-2">
+              <input type="checkbox" class="size-5 flex-shrink-0" bind:checked={filter.isArchive} />
+              <span class="pt-1">Archive</span>
+            </label>
+
+            <label class="flex items-center gap-2">
+              <input type="checkbox" class="size-5 flex-shrink-0" bind:checked={filter.isFavorite} />
+              <span class="pt-1">Favorite</span>
+            </label>
+          </div>
         </div>
       </div>
     </div>
 
     <div
       id="button-row"
-      class="flex justify-end gap-4 py-4 sticky bottom-0 dark:border-gray-800 dark:bg-immich-dark-gray"
+      class="flex justify-end gap-4 border-t dark:border-gray-800 dark:bg-immich-dark-gray px-4 sm:py-6 py-4 mt-2 rounded-b-3xl"
     >
       <Button type="reset" color="gray">CLEAR ALL</Button>
       <Button type="submit">SEARCH</Button>

From bc3979029de78edcf3be2c41e558003544e470b0 Mon Sep 17 00:00:00 2001
From: Robert Vollmer <dev@robv.de>
Date: Sat, 24 Feb 2024 04:38:57 +0100
Subject: [PATCH 12/28] refactor(mobile): move error details to separate DB
 column (#6898)

* Add "details" column to LoggerMessage

* Include error details in log details page

* Move error details out of log message

* Add error message to mixin

* Create extension for HTTP Response logging

* Fix analyze errors

* format

* fix analyze errors, format again
---
 .../lib/extensions/asyncvalue_extensions.dart |   2 +-
 .../lib/extensions/response_extensions.dart   |   5 +
 mobile/lib/main.dart                          |   7 +-
 mobile/lib/mixins/error_logger.mixin.dart     |   6 +-
 .../activities/services/activity.service.dart |  38 +--
 .../services/image_viewer.service.dart        |  10 +-
 .../asset_viewer/ui/description_input.dart    |   2 +-
 .../backup/providers/backup.provider.dart     |   2 +-
 .../providers/authentication.provider.dart    |   6 +-
 .../modules/login/services/oauth.service.dart |   2 +-
 .../map/providers/map_state.provider.dart     |   8 +-
 .../lib/modules/map/services/map.service.dart |   1 +
 mobile/lib/modules/map/utils/map_utils.dart   |   6 +-
 .../modules/map/widgets/map_asset_grid.dart   |   2 +-
 .../memories/services/memory.service.dart     |   2 +-
 .../partner/services/partner.service.dart     |   8 +-
 .../services/shared_link.service.dart         |   8 +-
 .../providers/trashed_asset.provider.dart     |   8 +-
 .../modules/trash/services/trash.service.dart |   6 +-
 .../shared/models/logger_message.model.dart   |   2 +
 .../shared/models/logger_message.model.g.dart | 220 +++++++++++++++++-
 mobile/lib/shared/services/asset.service.dart |   4 +-
 .../services/immich_logger.service.dart       |   3 +-
 mobile/lib/shared/services/share.service.dart |   6 +-
 mobile/lib/shared/services/sync.service.dart  |  22 +-
 mobile/lib/shared/services/user.service.dart  |   4 +-
 .../lib/shared/views/app_log_detail_page.dart |  84 +------
 mobile/lib/shared/views/splash_screen.dart    |   6 +-
 28 files changed, 319 insertions(+), 161 deletions(-)
 create mode 100644 mobile/lib/extensions/response_extensions.dart

diff --git a/mobile/lib/extensions/asyncvalue_extensions.dart b/mobile/lib/extensions/asyncvalue_extensions.dart
index c616835a8..af02ff13c 100644
--- a/mobile/lib/extensions/asyncvalue_extensions.dart
+++ b/mobile/lib/extensions/asyncvalue_extensions.dart
@@ -30,7 +30,7 @@ extension LogOnError<T> on AsyncValue<T> {
     }
 
     if (hasError && !hasValue) {
-      _asyncErrorLogger.severe("$error", error, stackTrace);
+      _asyncErrorLogger.severe('Could not load value', error, stackTrace);
       return onError?.call(error, stackTrace) ??
           ScaffoldErrorBody(errorMsg: error?.toString());
     }
diff --git a/mobile/lib/extensions/response_extensions.dart b/mobile/lib/extensions/response_extensions.dart
new file mode 100644
index 000000000..7fec41d07
--- /dev/null
+++ b/mobile/lib/extensions/response_extensions.dart
@@ -0,0 +1,5 @@
+import 'package:http/http.dart';
+
+extension LoggerExtension on Response {
+  String toLoggerString() => "Status: $statusCode $reasonPhrase\n\n$body";
+}
diff --git a/mobile/lib/main.dart b/mobile/lib/main.dart
index 293867fb3..f20cf7ecc 100644
--- a/mobile/lib/main.dart
+++ b/mobile/lib/main.dart
@@ -73,15 +73,14 @@ Future<void> initApp() async {
   FlutterError.onError = (details) {
     FlutterError.presentError(details);
     log.severe(
-      'FlutterError - Catch all error: ${details.toString()} - ${details.exception} - ${details.library} - ${details.context} - ${details.stack}',
-      details,
+      'FlutterError - Catch all',
+      "${details.toString()}\nException: ${details.exception}\nLibrary: ${details.library}\nContext: ${details.context}",
       details.stack,
     );
   };
 
   PlatformDispatcher.instance.onError = (error, stack) {
-    log.severe('PlatformDispatcher - Catch all error: $error', error, stack);
-    debugPrint("PlatformDispatcher - Catch all error: $error $stack");
+    log.severe('PlatformDispatcher - Catch all', error, stack);
     return true;
   };
 
diff --git a/mobile/lib/mixins/error_logger.mixin.dart b/mobile/lib/mixins/error_logger.mixin.dart
index 38837a716..9b2bc6f98 100644
--- a/mobile/lib/mixins/error_logger.mixin.dart
+++ b/mobile/lib/mixins/error_logger.mixin.dart
@@ -10,13 +10,14 @@ mixin ErrorLoggerMixin {
   /// Else, logs the error to the overrided logger and returns an AsyncError<>
   AsyncFuture<T> guardError<T>(
     Future<T> Function() fn, {
+    required String errorMessage,
     Level logLevel = Level.SEVERE,
   }) async {
     try {
       final result = await fn();
       return AsyncData(result);
     } catch (error, stackTrace) {
-      logger.log(logLevel, "$error", error, stackTrace);
+      logger.log(logLevel, errorMessage, error, stackTrace);
       return AsyncError(error, stackTrace);
     }
   }
@@ -26,12 +27,13 @@ mixin ErrorLoggerMixin {
   Future<T> logError<T>(
     Future<T> Function() fn, {
     required T defaultValue,
+    required String errorMessage,
     Level logLevel = Level.SEVERE,
   }) async {
     try {
       return await fn();
     } catch (error, stackTrace) {
-      logger.log(logLevel, "$error", error, stackTrace);
+      logger.log(logLevel, errorMessage, error, stackTrace);
     }
     return defaultValue;
   }
diff --git a/mobile/lib/modules/activities/services/activity.service.dart b/mobile/lib/modules/activities/services/activity.service.dart
index db35c17ae..cde98f73a 100644
--- a/mobile/lib/modules/activities/services/activity.service.dart
+++ b/mobile/lib/modules/activities/services/activity.service.dart
@@ -24,6 +24,7 @@ class ActivityService with ErrorLoggerMixin {
         return list != null ? list.map(Activity.fromDto).toList() : [];
       },
       defaultValue: [],
+      errorMessage: "Failed to get all activities for album $albumId",
     );
   }
 
@@ -35,6 +36,7 @@ class ActivityService with ErrorLoggerMixin {
         return dto?.comments ?? 0;
       },
       defaultValue: 0,
+      errorMessage: "Failed to statistics for album $albumId",
     );
   }
 
@@ -45,6 +47,7 @@ class ActivityService with ErrorLoggerMixin {
         return true;
       },
       defaultValue: false,
+      errorMessage: "Failed to delete activity",
     );
   }
 
@@ -54,21 +57,24 @@ class ActivityService with ErrorLoggerMixin {
     String? assetId,
     String? comment,
   }) async {
-    return guardError(() async {
-      final dto = await _apiService.activityApi.createActivity(
-        ActivityCreateDto(
-          albumId: albumId,
-          type: type == ActivityType.comment
-              ? ReactionType.comment
-              : ReactionType.like,
-          assetId: assetId,
-          comment: comment,
-        ),
-      );
-      if (dto != null) {
-        return Activity.fromDto(dto);
-      }
-      throw NoResponseDtoError();
-    });
+    return guardError(
+      () async {
+        final dto = await _apiService.activityApi.createActivity(
+          ActivityCreateDto(
+            albumId: albumId,
+            type: type == ActivityType.comment
+                ? ReactionType.comment
+                : ReactionType.like,
+            assetId: assetId,
+            comment: comment,
+          ),
+        );
+        if (dto != null) {
+          return Activity.fromDto(dto);
+        }
+        throw NoResponseDtoError();
+      },
+      errorMessage: "Failed to create $type for album $albumId",
+    );
   }
 }
diff --git a/mobile/lib/modules/asset_viewer/services/image_viewer.service.dart b/mobile/lib/modules/asset_viewer/services/image_viewer.service.dart
index db527c6e2..54682fdee 100644
--- a/mobile/lib/modules/asset_viewer/services/image_viewer.service.dart
+++ b/mobile/lib/modules/asset_viewer/services/image_viewer.service.dart
@@ -1,6 +1,7 @@
 import 'dart:io';
 
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/extensions/response_extensions.dart';
 import 'package:immich_mobile/shared/models/asset.dart';
 import 'package:immich_mobile/shared/providers/api.provider.dart';
 import 'package:immich_mobile/shared/services/api.service.dart';
@@ -39,7 +40,8 @@ class ImageViewerService {
           final failedResponse =
               imageResponse.statusCode != 200 ? imageResponse : motionReponse;
           _log.severe(
-            "Motion asset download failed with status - ${failedResponse.statusCode} and response - ${failedResponse.body}",
+            "Motion asset download failed",
+            failedResponse.toLoggerString(),
           );
           return false;
         }
@@ -75,9 +77,7 @@ class ImageViewerService {
             .downloadFileWithHttpInfo(asset.remoteId!);
 
         if (res.statusCode != 200) {
-          _log.severe(
-            "Asset download failed with status - ${res.statusCode} and response - ${res.body}",
-          );
+          _log.severe("Asset download failed", res.toLoggerString());
           return false;
         }
 
@@ -98,7 +98,7 @@ class ImageViewerService {
         return entity != null;
       }
     } catch (error, stack) {
-      _log.severe("Error saving file ${error.toString()}", error, stack);
+      _log.severe("Error saving downloaded asset", error, stack);
       return false;
     } finally {
       // Clear temp files
diff --git a/mobile/lib/modules/asset_viewer/ui/description_input.dart b/mobile/lib/modules/asset_viewer/ui/description_input.dart
index c5972a822..c5bae07cd 100644
--- a/mobile/lib/modules/asset_viewer/ui/description_input.dart
+++ b/mobile/lib/modules/asset_viewer/ui/description_input.dart
@@ -48,7 +48,7 @@ class DescriptionInput extends HookConsumerWidget {
         );
       } catch (error, stack) {
         hasError.value = true;
-        _log.severe("Error updating description $error", error, stack);
+        _log.severe("Error updating description", error, stack);
         ImmichToast.show(
           context: context,
           msg: "description_input_submit_error".tr(),
diff --git a/mobile/lib/modules/backup/providers/backup.provider.dart b/mobile/lib/modules/backup/providers/backup.provider.dart
index a175a17de..68c6bf9e6 100644
--- a/mobile/lib/modules/backup/providers/backup.provider.dart
+++ b/mobile/lib/modules/backup/providers/backup.provider.dart
@@ -245,7 +245,7 @@ class BackupNotifier extends StateNotifier<BackUpState> {
         } catch (e, stack) {
           log.severe(
             "Failed to get thumbnail for album ${album.name}",
-            e.toString(),
+            e,
             stack,
           );
         }
diff --git a/mobile/lib/modules/login/providers/authentication.provider.dart b/mobile/lib/modules/login/providers/authentication.provider.dart
index 23dcd5053..e01002433 100644
--- a/mobile/lib/modules/login/providers/authentication.provider.dart
+++ b/mobile/lib/modules/login/providers/authentication.provider.dart
@@ -108,7 +108,7 @@ class AuthenticationNotifier extends StateNotifier<AuthenticationState> {
           .then((_) => log.info("Logout was successful for $userEmail"))
           .onError(
             (error, stackTrace) =>
-                log.severe("Error logging out $userEmail", error, stackTrace),
+                log.severe("Logout failed for $userEmail", error, stackTrace),
           );
 
       await Future.wait([
@@ -129,8 +129,8 @@ class AuthenticationNotifier extends StateNotifier<AuthenticationState> {
         shouldChangePassword: false,
         isAuthenticated: false,
       );
-    } catch (e) {
-      log.severe("Error logging out $e");
+    } catch (e, stack) {
+      log.severe('Logout failed', e, stack);
     }
   }
 
diff --git a/mobile/lib/modules/login/services/oauth.service.dart b/mobile/lib/modules/login/services/oauth.service.dart
index 8f34c968e..952c6fa8d 100644
--- a/mobile/lib/modules/login/services/oauth.service.dart
+++ b/mobile/lib/modules/login/services/oauth.service.dart
@@ -36,7 +36,7 @@ class OAuthService {
         ),
       );
     } catch (e, stack) {
-      log.severe("Error performing oAuthLogin: ${e.toString()}", e, stack);
+      log.severe("OAuth login failed", e, stack);
       return null;
     }
   }
diff --git a/mobile/lib/modules/map/providers/map_state.provider.dart b/mobile/lib/modules/map/providers/map_state.provider.dart
index de6265c23..f1d1a4dde 100644
--- a/mobile/lib/modules/map/providers/map_state.provider.dart
+++ b/mobile/lib/modules/map/providers/map_state.provider.dart
@@ -1,6 +1,7 @@
 import 'dart:io';
 
 import 'package:flutter/material.dart';
+import 'package:immich_mobile/extensions/response_extensions.dart';
 import 'package:immich_mobile/modules/map/models/map_state.model.dart';
 import 'package:immich_mobile/modules/settings/providers/app_settings.provider.dart';
 import 'package:immich_mobile/modules/settings/services/app_settings.service.dart';
@@ -51,7 +52,8 @@ class MapStateNotifier extends _$MapStateNotifier {
         lightStyleFetched: AsyncError(lightResponse.body, StackTrace.current),
       );
       _log.severe(
-        "Cannot fetch map light style with status - ${lightResponse.statusCode} and response - ${lightResponse.body}",
+        "Cannot fetch map light style",
+        lightResponse.toLoggerString(),
       );
       return;
     }
@@ -77,9 +79,7 @@ class MapStateNotifier extends _$MapStateNotifier {
       state = state.copyWith(
         darkStyleFetched: AsyncError(darkResponse.body, StackTrace.current),
       );
-      _log.severe(
-        "Cannot fetch map dark style with status - ${darkResponse.statusCode} and response - ${darkResponse.body}",
-      );
+      _log.severe("Cannot fetch map dark style", darkResponse.toLoggerString());
       return;
     }
 
diff --git a/mobile/lib/modules/map/services/map.service.dart b/mobile/lib/modules/map/services/map.service.dart
index b3a904cbf..0a5036056 100644
--- a/mobile/lib/modules/map/services/map.service.dart
+++ b/mobile/lib/modules/map/services/map.service.dart
@@ -28,6 +28,7 @@ class MapSerivce with ErrorLoggerMixin {
         return markers?.map(MapMarker.fromDto) ?? [];
       },
       defaultValue: [],
+      errorMessage: "Failed to get map markers",
     );
   }
 }
diff --git a/mobile/lib/modules/map/utils/map_utils.dart b/mobile/lib/modules/map/utils/map_utils.dart
index 46af81ce1..f6e8349f5 100644
--- a/mobile/lib/modules/map/utils/map_utils.dart
+++ b/mobile/lib/modules/map/utils/map_utils.dart
@@ -105,10 +105,8 @@ class MapUtils {
         timeLimit: const Duration(seconds: 5),
       );
       return (currentUserLocation, null);
-    } catch (error) {
-      _log.severe(
-        "Cannot get user's current location due to ${error.toString()}",
-      );
+    } catch (error, stack) {
+      _log.severe("Cannot get user's current location", error, stack);
       return (null, LocationPermission.unableToDetermine);
     }
   }
diff --git a/mobile/lib/modules/map/widgets/map_asset_grid.dart b/mobile/lib/modules/map/widgets/map_asset_grid.dart
index d1f187e25..ad90d36ed 100644
--- a/mobile/lib/modules/map/widgets/map_asset_grid.dart
+++ b/mobile/lib/modules/map/widgets/map_asset_grid.dart
@@ -147,7 +147,7 @@ class MapAssetGrid extends HookConsumerWidget {
                         },
                         error: (error, stackTrace) {
                           log.warning(
-                            "Cannot get assets in the current map bounds $error",
+                            "Cannot get assets in the current map bounds",
                             error,
                             stackTrace,
                           );
diff --git a/mobile/lib/modules/memories/services/memory.service.dart b/mobile/lib/modules/memories/services/memory.service.dart
index 8d2cd226a..8ee203e6c 100644
--- a/mobile/lib/modules/memories/services/memory.service.dart
+++ b/mobile/lib/modules/memories/services/memory.service.dart
@@ -47,7 +47,7 @@ class MemoryService {
 
       return memories.isNotEmpty ? memories : null;
     } catch (error, stack) {
-      log.severe("Cannot get memories ${error.toString()}", error, stack);
+      log.severe("Cannot get memories", error, stack);
       return null;
     }
   }
diff --git a/mobile/lib/modules/partner/services/partner.service.dart b/mobile/lib/modules/partner/services/partner.service.dart
index 32e500353..d1e40076c 100644
--- a/mobile/lib/modules/partner/services/partner.service.dart
+++ b/mobile/lib/modules/partner/services/partner.service.dart
@@ -40,7 +40,7 @@ class PartnerService {
         return userDtos.map((u) => User.fromPartnerDto(u)).toList();
       }
     } catch (e) {
-      _log.warning("failed to get partners for direction $direction:\n$e");
+      _log.warning("Failed to get partners for direction $direction", e);
     }
     return null;
   }
@@ -51,7 +51,7 @@ class PartnerService {
       partner.isPartnerSharedBy = false;
       await _db.writeTxn(() => _db.users.put(partner));
     } catch (e) {
-      _log.warning("failed to remove partner ${partner.id}:\n$e");
+      _log.warning("Failed to remove partner ${partner.id}", e);
       return false;
     }
     return true;
@@ -66,7 +66,7 @@ class PartnerService {
         return true;
       }
     } catch (e) {
-      _log.warning("failed to add partner ${partner.id}:\n$e");
+      _log.warning("Failed to add partner ${partner.id}", e);
     }
     return false;
   }
@@ -81,7 +81,7 @@ class PartnerService {
         return true;
       }
     } catch (e) {
-      _log.warning("failed to update partner ${partner.id}:\n$e");
+      _log.warning("Failed to update partner ${partner.id}", e);
     }
     return false;
   }
diff --git a/mobile/lib/modules/shared_link/services/shared_link.service.dart b/mobile/lib/modules/shared_link/services/shared_link.service.dart
index 3ea1d411b..62f431580 100644
--- a/mobile/lib/modules/shared_link/services/shared_link.service.dart
+++ b/mobile/lib/modules/shared_link/services/shared_link.service.dart
@@ -22,7 +22,7 @@ class SharedLinkService {
           ? AsyncData(list.map(SharedLink.fromDto).toList())
           : const AsyncData([]);
     } catch (e, stack) {
-      _log.severe("failed to fetch shared links - $e");
+      _log.severe("Failed to fetch shared links", e, stack);
       return AsyncError(e, stack);
     }
   }
@@ -31,7 +31,7 @@ class SharedLinkService {
     try {
       return await _apiService.sharedLinkApi.removeSharedLink(id);
     } catch (e) {
-      _log.severe("failed to delete shared link id - $id with error - $e");
+      _log.severe("Failed to delete shared link id - $id", e);
     }
   }
 
@@ -81,7 +81,7 @@ class SharedLinkService {
         }
       }
     } catch (e) {
-      _log.severe("failed to create shared link with error - $e");
+      _log.severe("Failed to create shared link", e);
     }
     return null;
   }
@@ -113,7 +113,7 @@ class SharedLinkService {
         return SharedLink.fromDto(responseDto);
       }
     } catch (e) {
-      _log.severe("failed to update shared link id - $id with error - $e");
+      _log.severe("Failed to update shared link id - $id", e);
     }
     return null;
   }
diff --git a/mobile/lib/modules/trash/providers/trashed_asset.provider.dart b/mobile/lib/modules/trash/providers/trashed_asset.provider.dart
index 177e7d2d4..165d1c0f7 100644
--- a/mobile/lib/modules/trash/providers/trashed_asset.provider.dart
+++ b/mobile/lib/modules/trash/providers/trashed_asset.provider.dart
@@ -44,7 +44,7 @@ class TrashNotifier extends StateNotifier<bool> {
           .read(syncServiceProvider)
           .handleRemoteAssetRemoval(idsToRemove.cast<String>().toList());
     } catch (error, stack) {
-      _log.severe("Cannot empty trash ${error.toString()}", error, stack);
+      _log.severe("Cannot empty trash", error, stack);
     }
   }
 
@@ -70,7 +70,7 @@ class TrashNotifier extends StateNotifier<bool> {
 
       return isRemoved;
     } catch (error, stack) {
-      _log.severe("Cannot empty trash ${error.toString()}", error, stack);
+      _log.severe("Cannot remove assets", error, stack);
     }
     return false;
   }
@@ -93,7 +93,7 @@ class TrashNotifier extends StateNotifier<bool> {
         return true;
       }
     } catch (error, stack) {
-      _log.severe("Cannot restore trash ${error.toString()}", error, stack);
+      _log.severe("Cannot restore assets", error, stack);
     }
     return false;
   }
@@ -123,7 +123,7 @@ class TrashNotifier extends StateNotifier<bool> {
         await _db.assets.putAll(updatedAssets);
       });
     } catch (error, stack) {
-      _log.severe("Cannot restore trash ${error.toString()}", error, stack);
+      _log.severe("Cannot restore trash", error, stack);
     }
   }
 }
diff --git a/mobile/lib/modules/trash/services/trash.service.dart b/mobile/lib/modules/trash/services/trash.service.dart
index 9a9ff5d0b..96b07ca20 100644
--- a/mobile/lib/modules/trash/services/trash.service.dart
+++ b/mobile/lib/modules/trash/services/trash.service.dart
@@ -25,7 +25,7 @@ class TrashService {
       await _apiService.trashApi.restoreAssets(BulkIdsDto(ids: remoteIds));
       return true;
     } catch (error, stack) {
-      _log.severe("Cannot restore assets ${error.toString()}", error, stack);
+      _log.severe("Cannot restore assets", error, stack);
       return false;
     }
   }
@@ -34,7 +34,7 @@ class TrashService {
     try {
       await _apiService.trashApi.emptyTrash();
     } catch (error, stack) {
-      _log.severe("Cannot empty trash ${error.toString()}", error, stack);
+      _log.severe("Cannot empty trash", error, stack);
     }
   }
 
@@ -42,7 +42,7 @@ class TrashService {
     try {
       await _apiService.trashApi.restoreTrash();
     } catch (error, stack) {
-      _log.severe("Cannot restore trash ${error.toString()}", error, stack);
+      _log.severe("Cannot restore trash", error, stack);
     }
   }
 }
diff --git a/mobile/lib/shared/models/logger_message.model.dart b/mobile/lib/shared/models/logger_message.model.dart
index cb1d45a58..f657257ea 100644
--- a/mobile/lib/shared/models/logger_message.model.dart
+++ b/mobile/lib/shared/models/logger_message.model.dart
@@ -9,6 +9,7 @@ part 'logger_message.model.g.dart';
 class LoggerMessage {
   Id id = Isar.autoIncrement;
   String message;
+  String? details;
   @Enumerated(EnumType.ordinal)
   LogLevel level = LogLevel.INFO;
   DateTime createdAt;
@@ -17,6 +18,7 @@ class LoggerMessage {
 
   LoggerMessage({
     required this.message,
+    required this.details,
     required this.level,
     required this.createdAt,
     required this.context1,
diff --git a/mobile/lib/shared/models/logger_message.model.g.dart b/mobile/lib/shared/models/logger_message.model.g.dart
index a6b960eec..76c823704 100644
--- a/mobile/lib/shared/models/logger_message.model.g.dart
+++ b/mobile/lib/shared/models/logger_message.model.g.dart
@@ -32,14 +32,19 @@ const LoggerMessageSchema = CollectionSchema(
       name: r'createdAt',
       type: IsarType.dateTime,
     ),
-    r'level': PropertySchema(
+    r'details': PropertySchema(
       id: 3,
+      name: r'details',
+      type: IsarType.string,
+    ),
+    r'level': PropertySchema(
+      id: 4,
       name: r'level',
       type: IsarType.byte,
       enumMap: _LoggerMessagelevelEnumValueMap,
     ),
     r'message': PropertySchema(
-      id: 4,
+      id: 5,
       name: r'message',
       type: IsarType.string,
     )
@@ -76,6 +81,12 @@ int _loggerMessageEstimateSize(
       bytesCount += 3 + value.length * 3;
     }
   }
+  {
+    final value = object.details;
+    if (value != null) {
+      bytesCount += 3 + value.length * 3;
+    }
+  }
   bytesCount += 3 + object.message.length * 3;
   return bytesCount;
 }
@@ -89,8 +100,9 @@ void _loggerMessageSerialize(
   writer.writeString(offsets[0], object.context1);
   writer.writeString(offsets[1], object.context2);
   writer.writeDateTime(offsets[2], object.createdAt);
-  writer.writeByte(offsets[3], object.level.index);
-  writer.writeString(offsets[4], object.message);
+  writer.writeString(offsets[3], object.details);
+  writer.writeByte(offsets[4], object.level.index);
+  writer.writeString(offsets[5], object.message);
 }
 
 LoggerMessage _loggerMessageDeserialize(
@@ -103,9 +115,10 @@ LoggerMessage _loggerMessageDeserialize(
     context1: reader.readStringOrNull(offsets[0]),
     context2: reader.readStringOrNull(offsets[1]),
     createdAt: reader.readDateTime(offsets[2]),
-    level: _LoggerMessagelevelValueEnumMap[reader.readByteOrNull(offsets[3])] ??
+    details: reader.readStringOrNull(offsets[3]),
+    level: _LoggerMessagelevelValueEnumMap[reader.readByteOrNull(offsets[4])] ??
         LogLevel.ALL,
-    message: reader.readString(offsets[4]),
+    message: reader.readString(offsets[5]),
   );
   object.id = id;
   return object;
@@ -125,9 +138,11 @@ P _loggerMessageDeserializeProp<P>(
     case 2:
       return (reader.readDateTime(offset)) as P;
     case 3:
+      return (reader.readStringOrNull(offset)) as P;
+    case 4:
       return (_LoggerMessagelevelValueEnumMap[reader.readByteOrNull(offset)] ??
           LogLevel.ALL) as P;
-    case 4:
+    case 5:
       return (reader.readString(offset)) as P;
     default:
       throw IsarError('Unknown property with id $propertyId');
@@ -619,6 +634,160 @@ extension LoggerMessageQueryFilter
     });
   }
 
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsIsNull() {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(const FilterCondition.isNull(
+        property: r'details',
+      ));
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsIsNotNull() {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(const FilterCondition.isNotNull(
+        property: r'details',
+      ));
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsEqualTo(
+    String? value, {
+    bool caseSensitive = true,
+  }) {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(FilterCondition.equalTo(
+        property: r'details',
+        value: value,
+        caseSensitive: caseSensitive,
+      ));
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsGreaterThan(
+    String? value, {
+    bool include = false,
+    bool caseSensitive = true,
+  }) {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(FilterCondition.greaterThan(
+        include: include,
+        property: r'details',
+        value: value,
+        caseSensitive: caseSensitive,
+      ));
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsLessThan(
+    String? value, {
+    bool include = false,
+    bool caseSensitive = true,
+  }) {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(FilterCondition.lessThan(
+        include: include,
+        property: r'details',
+        value: value,
+        caseSensitive: caseSensitive,
+      ));
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsBetween(
+    String? lower,
+    String? upper, {
+    bool includeLower = true,
+    bool includeUpper = true,
+    bool caseSensitive = true,
+  }) {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(FilterCondition.between(
+        property: r'details',
+        lower: lower,
+        includeLower: includeLower,
+        upper: upper,
+        includeUpper: includeUpper,
+        caseSensitive: caseSensitive,
+      ));
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsStartsWith(
+    String value, {
+    bool caseSensitive = true,
+  }) {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(FilterCondition.startsWith(
+        property: r'details',
+        value: value,
+        caseSensitive: caseSensitive,
+      ));
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsEndsWith(
+    String value, {
+    bool caseSensitive = true,
+  }) {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(FilterCondition.endsWith(
+        property: r'details',
+        value: value,
+        caseSensitive: caseSensitive,
+      ));
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsContains(String value, {bool caseSensitive = true}) {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(FilterCondition.contains(
+        property: r'details',
+        value: value,
+        caseSensitive: caseSensitive,
+      ));
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsMatches(String pattern, {bool caseSensitive = true}) {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(FilterCondition.matches(
+        property: r'details',
+        wildcard: pattern,
+        caseSensitive: caseSensitive,
+      ));
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsIsEmpty() {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(FilterCondition.equalTo(
+        property: r'details',
+        value: '',
+      ));
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition>
+      detailsIsNotEmpty() {
+    return QueryBuilder.apply(this, (query) {
+      return query.addFilterCondition(FilterCondition.greaterThan(
+        property: r'details',
+        value: '',
+      ));
+    });
+  }
+
   QueryBuilder<LoggerMessage, LoggerMessage, QAfterFilterCondition> idEqualTo(
       Id value) {
     return QueryBuilder.apply(this, (query) {
@@ -913,6 +1082,18 @@ extension LoggerMessageQuerySortBy
     });
   }
 
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterSortBy> sortByDetails() {
+    return QueryBuilder.apply(this, (query) {
+      return query.addSortBy(r'details', Sort.asc);
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterSortBy> sortByDetailsDesc() {
+    return QueryBuilder.apply(this, (query) {
+      return query.addSortBy(r'details', Sort.desc);
+    });
+  }
+
   QueryBuilder<LoggerMessage, LoggerMessage, QAfterSortBy> sortByLevel() {
     return QueryBuilder.apply(this, (query) {
       return query.addSortBy(r'level', Sort.asc);
@@ -979,6 +1160,18 @@ extension LoggerMessageQuerySortThenBy
     });
   }
 
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterSortBy> thenByDetails() {
+    return QueryBuilder.apply(this, (query) {
+      return query.addSortBy(r'details', Sort.asc);
+    });
+  }
+
+  QueryBuilder<LoggerMessage, LoggerMessage, QAfterSortBy> thenByDetailsDesc() {
+    return QueryBuilder.apply(this, (query) {
+      return query.addSortBy(r'details', Sort.desc);
+    });
+  }
+
   QueryBuilder<LoggerMessage, LoggerMessage, QAfterSortBy> thenById() {
     return QueryBuilder.apply(this, (query) {
       return query.addSortBy(r'id', Sort.asc);
@@ -1038,6 +1231,13 @@ extension LoggerMessageQueryWhereDistinct
     });
   }
 
+  QueryBuilder<LoggerMessage, LoggerMessage, QDistinct> distinctByDetails(
+      {bool caseSensitive = true}) {
+    return QueryBuilder.apply(this, (query) {
+      return query.addDistinctBy(r'details', caseSensitive: caseSensitive);
+    });
+  }
+
   QueryBuilder<LoggerMessage, LoggerMessage, QDistinct> distinctByLevel() {
     return QueryBuilder.apply(this, (query) {
       return query.addDistinctBy(r'level');
@@ -1078,6 +1278,12 @@ extension LoggerMessageQueryProperty
     });
   }
 
+  QueryBuilder<LoggerMessage, String?, QQueryOperations> detailsProperty() {
+    return QueryBuilder.apply(this, (query) {
+      return query.addPropertyName(r'details');
+    });
+  }
+
   QueryBuilder<LoggerMessage, LogLevel, QQueryOperations> levelProperty() {
     return QueryBuilder.apply(this, (query) {
       return query.addPropertyName(r'level');
diff --git a/mobile/lib/shared/services/asset.service.dart b/mobile/lib/shared/services/asset.service.dart
index 64a0f28ab..3086ab924 100644
--- a/mobile/lib/shared/services/asset.service.dart
+++ b/mobile/lib/shared/services/asset.service.dart
@@ -90,7 +90,7 @@ class AssetService {
       return allAssets;
     } catch (error, stack) {
       log.severe(
-        'Error while getting remote assets: ${error.toString()}',
+        'Error while getting remote assets',
         error,
         stack,
       );
@@ -117,7 +117,7 @@ class AssetService {
       );
       return true;
     } catch (error, stack) {
-      log.severe("Error deleteAssets  ${error.toString()}", error, stack);
+      log.severe("Error while deleting assets", error, stack);
     }
     return false;
   }
diff --git a/mobile/lib/shared/services/immich_logger.service.dart b/mobile/lib/shared/services/immich_logger.service.dart
index b66177e57..967ab2d5f 100644
--- a/mobile/lib/shared/services/immich_logger.service.dart
+++ b/mobile/lib/shared/services/immich_logger.service.dart
@@ -12,7 +12,7 @@ import 'package:share_plus/share_plus.dart';
 /// [ImmichLogger] is a custom logger that is built on top of the [logging] package.
 /// The logs are written to the database and onto console, using `debugPrint` method.
 ///
-/// The logs are deleted when exceeding the `maxLogEntries` (default 200) property
+/// The logs are deleted when exceeding the `maxLogEntries` (default 500) property
 /// in the class.
 ///
 /// Logs can be shared by calling the `shareLogs` method, which will open a share dialog
@@ -58,6 +58,7 @@ class ImmichLogger {
     debugPrint('[${record.level.name}] [${record.time}] ${record.message}');
     final lm = LoggerMessage(
       message: record.message,
+      details: record.error?.toString(),
       level: record.level.toLogLevel(),
       createdAt: record.time,
       context1: record.loggerName,
diff --git a/mobile/lib/shared/services/share.service.dart b/mobile/lib/shared/services/share.service.dart
index d7daa51b8..be7c0c168 100644
--- a/mobile/lib/shared/services/share.service.dart
+++ b/mobile/lib/shared/services/share.service.dart
@@ -2,6 +2,7 @@ import 'dart:io';
 
 import 'package:flutter/material.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/extensions/response_extensions.dart';
 import 'package:immich_mobile/shared/models/asset.dart';
 import 'package:immich_mobile/shared/providers/api.provider.dart';
 import 'package:logging/logging.dart';
@@ -41,7 +42,8 @@ class ShareService {
 
           if (res.statusCode != 200) {
             _log.severe(
-              "Asset download failed with status - ${res.statusCode} and response - ${res.body}",
+              "Asset download for ${asset.fileName} failed",
+              res.toLoggerString(),
             );
             continue;
           }
@@ -68,7 +70,7 @@ class ShareService {
       );
       return true;
     } catch (error) {
-      _log.severe("Share failed with error $error");
+      _log.severe("Share failed", error);
     }
     return false;
   }
diff --git a/mobile/lib/shared/services/sync.service.dart b/mobile/lib/shared/services/sync.service.dart
index d039b3409..a441091d3 100644
--- a/mobile/lib/shared/services/sync.service.dart
+++ b/mobile/lib/shared/services/sync.service.dart
@@ -140,7 +140,7 @@ class SyncService {
     try {
       await _db.writeTxn(() => a.put(_db));
     } on IsarError catch (e) {
-      _log.severe("Failed to put new asset into db: $e");
+      _log.severe("Failed to put new asset into db", e);
       return false;
     }
     return true;
@@ -173,7 +173,7 @@ class SyncService {
       }
       return false;
     } on IsarError catch (e) {
-      _log.severe("Failed to sync remote assets to db: $e");
+      _log.severe("Failed to sync remote assets to db", e);
     }
     return null;
   }
@@ -232,7 +232,7 @@ class SyncService {
       await _db.writeTxn(() => _db.assets.deleteAll(idsToDelete));
       await upsertAssetsWithExif(toAdd + toUpdate);
     } on IsarError catch (e) {
-      _log.severe("Failed to sync remote assets to db: $e");
+      _log.severe("Failed to sync remote assets to db", e);
     }
     await _updateUserAssetsETag(user, now);
     return true;
@@ -364,7 +364,7 @@ class SyncService {
       });
       _log.info("Synced changes of remote album ${album.name} to DB");
     } on IsarError catch (e) {
-      _log.severe("Failed to sync remote album to database $e");
+      _log.severe("Failed to sync remote album to database", e);
     }
 
     if (album.shared || dto.shared) {
@@ -441,7 +441,7 @@ class SyncService {
       assert(ok);
       _log.info("Removed local album $album from DB");
     } catch (e) {
-      _log.severe("Failed to remove local album $album from DB");
+      _log.severe("Failed to remove local album $album from DB", e);
     }
   }
 
@@ -577,7 +577,7 @@ class SyncService {
       });
       _log.info("Synced changes of local album ${ape.name} to DB");
     } on IsarError catch (e) {
-      _log.severe("Failed to update synced album ${ape.name} in DB: $e");
+      _log.severe("Failed to update synced album ${ape.name} in DB", e);
     }
 
     return true;
@@ -623,7 +623,7 @@ class SyncService {
       });
       _log.info("Fast synced local album ${ape.name} to DB");
     } on IsarError catch (e) {
-      _log.severe("Failed to fast sync local album ${ape.name} to DB: $e");
+      _log.severe("Failed to fast sync local album ${ape.name} to DB", e);
       return false;
     }
 
@@ -656,7 +656,7 @@ class SyncService {
       await _db.writeTxn(() => _db.albums.store(a));
       _log.info("Added a new local album to DB: ${ape.name}");
     } on IsarError catch (e) {
-      _log.severe("Failed to add new local album ${ape.name} to DB: $e");
+      _log.severe("Failed to add new local album ${ape.name} to DB", e);
     }
   }
 
@@ -706,9 +706,7 @@ class SyncService {
       });
       _log.info("Upserted ${assets.length} assets into the DB");
     } on IsarError catch (e) {
-      _log.severe(
-        "Failed to upsert ${assets.length} assets into the DB: ${e.toString()}",
-      );
+      _log.severe("Failed to upsert ${assets.length} assets into the DB", e);
       // give details on the errors
       assets.sort(Asset.compareByOwnerChecksum);
       final inDb = await _db.assets.getAllByOwnerIdChecksum(
@@ -776,7 +774,7 @@ class SyncService {
       });
       return true;
     } catch (e) {
-      _log.severe("Failed to remove all local albums and assets: $e");
+      _log.severe("Failed to remove all local albums and assets", e);
       return false;
     }
   }
diff --git a/mobile/lib/shared/services/user.service.dart b/mobile/lib/shared/services/user.service.dart
index 4d398c3a8..ae65ed31d 100644
--- a/mobile/lib/shared/services/user.service.dart
+++ b/mobile/lib/shared/services/user.service.dart
@@ -42,7 +42,7 @@ class UserService {
       final dto = await _apiService.userApi.getAllUsers(isAll);
       return dto?.map(User.fromUserDto).toList();
     } catch (e) {
-      _log.warning("Failed get all users:\n$e");
+      _log.warning("Failed get all users", e);
       return null;
     }
   }
@@ -65,7 +65,7 @@ class UserService {
         ),
       );
     } catch (e) {
-      _log.warning("Failed to upload profile image:\n$e");
+      _log.warning("Failed to upload profile image", e);
       return null;
     }
   }
diff --git a/mobile/lib/shared/views/app_log_detail_page.dart b/mobile/lib/shared/views/app_log_detail_page.dart
index 126f46c8f..6b99d7f0a 100644
--- a/mobile/lib/shared/views/app_log_detail_page.dart
+++ b/mobile/lib/shared/views/app_log_detail_page.dart
@@ -15,7 +15,7 @@ class AppLogDetailPage extends HookConsumerWidget {
   Widget build(BuildContext context, WidgetRef ref) {
     var isDarkTheme = context.isDarkTheme;
 
-    buildStackMessage(String stackTrace) {
+    buildTextWithCopyButton(String header, String text) {
       return Padding(
         padding: const EdgeInsets.all(8.0),
         child: Column(
@@ -28,7 +28,7 @@ class AppLogDetailPage extends HookConsumerWidget {
                 Padding(
                   padding: const EdgeInsets.only(bottom: 8.0),
                   child: Text(
-                    "STACK TRACES",
+                    header,
                     style: TextStyle(
                       fontSize: 12.0,
                       color: context.primaryColor,
@@ -38,8 +38,7 @@ class AppLogDetailPage extends HookConsumerWidget {
                 ),
                 IconButton(
                   onPressed: () {
-                    Clipboard.setData(ClipboardData(text: stackTrace))
-                        .then((_) {
+                    Clipboard.setData(ClipboardData(text: text)).then((_) {
                       ScaffoldMessenger.of(context).showSnackBar(
                         SnackBar(
                           content: Text(
@@ -68,73 +67,7 @@ class AppLogDetailPage extends HookConsumerWidget {
               child: Padding(
                 padding: const EdgeInsets.all(8.0),
                 child: SelectableText(
-                  stackTrace,
-                  style: const TextStyle(
-                    fontSize: 12.0,
-                    fontWeight: FontWeight.bold,
-                    fontFamily: "Inconsolata",
-                  ),
-                ),
-              ),
-            ),
-          ],
-        ),
-      );
-    }
-
-    buildLogMessage(String message) {
-      return Padding(
-        padding: const EdgeInsets.all(8.0),
-        child: Column(
-          crossAxisAlignment: CrossAxisAlignment.start,
-          children: [
-            Row(
-              mainAxisAlignment: MainAxisAlignment.spaceBetween,
-              crossAxisAlignment: CrossAxisAlignment.center,
-              children: [
-                Padding(
-                  padding: const EdgeInsets.only(bottom: 8.0),
-                  child: Text(
-                    "MESSAGE",
-                    style: TextStyle(
-                      fontSize: 12.0,
-                      color: context.primaryColor,
-                      fontWeight: FontWeight.bold,
-                    ),
-                  ),
-                ),
-                IconButton(
-                  onPressed: () {
-                    Clipboard.setData(ClipboardData(text: message)).then((_) {
-                      ScaffoldMessenger.of(context).showSnackBar(
-                        SnackBar(
-                          content: Text(
-                            "Copied to clipboard",
-                            style: context.textTheme.bodyLarge?.copyWith(
-                              color: context.primaryColor,
-                            ),
-                          ),
-                        ),
-                      );
-                    });
-                  },
-                  icon: Icon(
-                    Icons.copy,
-                    size: 16.0,
-                    color: context.primaryColor,
-                  ),
-                ),
-              ],
-            ),
-            Container(
-              decoration: BoxDecoration(
-                color: isDarkTheme ? Colors.grey[900] : Colors.grey[200],
-                borderRadius: BorderRadius.circular(15.0),
-              ),
-              child: Padding(
-                padding: const EdgeInsets.all(8.0),
-                child: SelectableText(
-                  message,
+                  text,
                   style: const TextStyle(
                     fontSize: 12.0,
                     fontWeight: FontWeight.bold,
@@ -194,11 +127,16 @@ class AppLogDetailPage extends HookConsumerWidget {
       body: SafeArea(
         child: ListView(
           children: [
-            buildLogMessage(logMessage.message),
+            buildTextWithCopyButton("MESSAGE", logMessage.message),
+            if (logMessage.details != null)
+              buildTextWithCopyButton("DETAILS", logMessage.details.toString()),
             if (logMessage.context1 != null)
               buildLogContext1(logMessage.context1.toString()),
             if (logMessage.context2 != null)
-              buildStackMessage(logMessage.context2.toString()),
+              buildTextWithCopyButton(
+                "STACK TRACE",
+                logMessage.context2.toString(),
+              ),
           ],
         ),
       ),
diff --git a/mobile/lib/shared/views/splash_screen.dart b/mobile/lib/shared/views/splash_screen.dart
index 8dddb60aa..3c0d65bde 100644
--- a/mobile/lib/shared/views/splash_screen.dart
+++ b/mobile/lib/shared/views/splash_screen.dart
@@ -35,10 +35,10 @@ class SplashScreenPage extends HookConsumerWidget {
             deviceIsOffline = true;
             log.fine("Device seems to be offline upon launch");
           } else {
-            log.severe(e);
+            log.severe("Failed to resolve endpoint", e);
           }
         } catch (e) {
-          log.severe(e);
+          log.severe("Failed to resolve endpoint", e);
         }
 
         try {
@@ -53,7 +53,7 @@ class SplashScreenPage extends HookConsumerWidget {
           ref.read(authenticationProvider.notifier).logout();
 
           log.severe(
-            'Cannot set success login info: $error',
+            'Cannot set success login info',
             error,
             stackTrace,
           );

From 57758293e5b0dfde6f3e8d673f2be2b7e3278c34 Mon Sep 17 00:00:00 2001
From: Robert Vollmer <dev@robv.de>
Date: Sat, 24 Feb 2024 04:40:09 +0100
Subject: [PATCH 13/28] fix(mobile): remove log message counter (#6865)

* fix(mobile): remove log message counter

Previously, the items in the log page were numbered starting with `#0`
and increasing from top to bottom. Being new to the app, this confused
me because I would have expected that newer messages have a higher
number than older messages.

Removing the counter completely because it doesn't add any value -
log messages are identified by their timestamp, text and other details.

* Switch timestamp and context in log overview
---
 mobile/lib/shared/views/app_log_page.dart | 32 +++++++----------------
 1 file changed, 9 insertions(+), 23 deletions(-)

diff --git a/mobile/lib/shared/views/app_log_page.dart b/mobile/lib/shared/views/app_log_page.dart
index a0c4553f9..993b25c7c 100644
--- a/mobile/lib/shared/views/app_log_page.dart
+++ b/mobile/lib/shared/views/app_log_page.dart
@@ -69,9 +69,9 @@ class AppLogPage extends HookConsumerWidget {
 
     return Scaffold(
       appBar: AppBar(
-        title: Text(
-          "Logs - ${logMessages.value.length}",
-          style: const TextStyle(
+        title: const Text(
+          "Logs",
+          style: TextStyle(
             fontWeight: FontWeight.bold,
             fontSize: 16.0,
           ),
@@ -135,29 +135,15 @@ class AppLogPage extends HookConsumerWidget {
             dense: true,
             tileColor: getTileColor(logMessage.level),
             minLeadingWidth: 10,
-            title: Text.rich(
-              TextSpan(
-                children: [
-                  TextSpan(
-                    text: "#$index ",
-                    style: TextStyle(
-                      color: isDarkTheme ? Colors.white70 : Colors.grey[600],
-                      fontSize: 14.0,
-                      fontWeight: FontWeight.bold,
-                    ),
-                  ),
-                  TextSpan(
-                    text: truncateLogMessage(logMessage.message, 4),
-                    style: const TextStyle(
-                      fontSize: 14.0,
-                    ),
-                  ),
-                ],
+            title: Text(
+              truncateLogMessage(logMessage.message, 4),
+              style: const TextStyle(
+                fontSize: 14.0,
+                fontFamily: "Inconsolata",
               ),
-              style: const TextStyle(fontSize: 14.0, fontFamily: "Inconsolata"),
             ),
             subtitle: Text(
-              "[${logMessage.context1}] Logged on ${DateFormat("HH:mm:ss.SSS").format(logMessage.createdAt)}",
+              "at ${DateFormat("HH:mm:ss.SSS").format(logMessage.createdAt)} in ${logMessage.context1}",
               style: TextStyle(
                 fontSize: 12.0,
                 color: Colors.grey[600],

From 6ec4c5874b52494425fc63ce36597c8bc91388f1 Mon Sep 17 00:00:00 2001
From: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>
Date: Sat, 24 Feb 2024 21:23:30 +0100
Subject: [PATCH 14/28] fix(web): timezone handling in search filter (#7384)

---
 .../assets/thumbnail/thumbnail.svelte         |  2 +-
 .../search-bar/search-filter-box.svelte       | 28 ++++++++-----------
 ...e-to-seconds.spec.ts => date-time.spec.ts} |  2 +-
 .../{time-to-seconds.ts => date-time.ts}      |  6 +++-
 web/src/routes/(user)/search/+page.svelte     | 18 +++++++-----
 5 files changed, 29 insertions(+), 27 deletions(-)
 rename web/src/lib/utils/{time-to-seconds.spec.ts => date-time.spec.ts} (92%)
 rename web/src/lib/utils/{time-to-seconds.ts => date-time.ts} (68%)

diff --git a/web/src/lib/components/assets/thumbnail/thumbnail.svelte b/web/src/lib/components/assets/thumbnail/thumbnail.svelte
index ec511d419..8ee042a1a 100644
--- a/web/src/lib/components/assets/thumbnail/thumbnail.svelte
+++ b/web/src/lib/components/assets/thumbnail/thumbnail.svelte
@@ -3,7 +3,7 @@
   import Icon from '$lib/components/elements/icon.svelte';
   import { ProjectionType } from '$lib/constants';
   import { getAssetFileUrl, getAssetThumbnailUrl, isSharedLink } from '$lib/utils';
-  import { timeToSeconds } from '$lib/utils/time-to-seconds';
+  import { timeToSeconds } from '$lib/utils/date-time';
   import { AssetTypeEnum, ThumbnailFormat, type AssetResponseDto } from '@immich/sdk';
   import {
     mdiArchiveArrowDownOutline,
diff --git a/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte b/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte
index a19cf72a4..1be3c9560 100644
--- a/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte
+++ b/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte
@@ -16,7 +16,7 @@
   import { createEventDispatcher, onMount } from 'svelte';
   import { fly } from 'svelte/transition';
   import Combobox, { type ComboBoxOption } from '../combobox.svelte';
-  import { DateTime } from 'luxon';
+  import { parseUtcDate } from '$lib/utils/date-time';
 
   enum MediaType {
     All = 'all',
@@ -231,6 +231,9 @@
     };
   };
 
+  const parseOptionalDate = (dateString?: string) => (dateString ? parseUtcDate(dateString) : undefined);
+  const toStartOfDayDate = (dateString: string) => parseUtcDate(dateString)?.startOf('day').toISODate() || undefined;
+
   const search = async () => {
     let type: AssetTypeEnum | undefined = undefined;
 
@@ -246,16 +249,11 @@
       city: filter.location.city?.value,
       make: filter.camera.make?.value,
       model: filter.camera.model?.value,
-      takenAfter: filter.date.takenAfter
-        ? DateTime.fromFormat(filter.date.takenAfter, 'yyyy-MM-dd').toUTC().startOf('day').toString()
-        : undefined,
-      takenBefore: filter.date.takenBefore
-        ? DateTime.fromFormat(filter.date.takenBefore, 'yyyy-MM-dd').toUTC().endOf('day').toString()
-        : undefined,
-      /* eslint-disable unicorn/prefer-logical-operator-over-ternary */
-      isArchived: filter.isArchive ? filter.isArchive : undefined,
-      isFavorite: filter.isFavorite ? filter.isFavorite : undefined,
-      isNotInAlbum: filter.isNotInAlbum ? filter.isNotInAlbum : undefined,
+      takenAfter: parseOptionalDate(filter.date.takenAfter)?.startOf('day').toISO() || undefined,
+      takenBefore: parseOptionalDate(filter.date.takenBefore)?.endOf('day').toISO() || undefined,
+      isArchived: filter.isArchive || undefined,
+      isFavorite: filter.isFavorite || undefined,
+      isNotInAlbum: filter.isNotInAlbum || undefined,
       personIds: filter.people && filter.people.length > 0 ? filter.people.map((p) => p.id) : undefined,
       type,
     };
@@ -295,12 +293,8 @@
           model: searchQuery.model ? { label: searchQuery.model, value: searchQuery.model } : undefined,
         },
         date: {
-          takenAfter: searchQuery.takenAfter
-            ? DateTime.fromISO(searchQuery.takenAfter).toUTC().toFormat('yyyy-MM-dd')
-            : undefined,
-          takenBefore: searchQuery.takenBefore
-            ? DateTime.fromISO(searchQuery.takenBefore).toUTC().toFormat('yyyy-MM-dd')
-            : undefined,
+          takenAfter: searchQuery.takenAfter ? toStartOfDayDate(searchQuery.takenAfter) : undefined,
+          takenBefore: searchQuery.takenBefore ? toStartOfDayDate(searchQuery.takenBefore) : undefined,
         },
         isArchive: searchQuery.isArchived,
         isFavorite: searchQuery.isFavorite,
diff --git a/web/src/lib/utils/time-to-seconds.spec.ts b/web/src/lib/utils/date-time.spec.ts
similarity index 92%
rename from web/src/lib/utils/time-to-seconds.spec.ts
rename to web/src/lib/utils/date-time.spec.ts
index 3e6cb0839..cbb08418c 100644
--- a/web/src/lib/utils/time-to-seconds.spec.ts
+++ b/web/src/lib/utils/date-time.spec.ts
@@ -1,4 +1,4 @@
-import { timeToSeconds } from './time-to-seconds';
+import { timeToSeconds } from './date-time';
 
 describe('converting time to seconds', () => {
   it('parses hh:mm:ss correctly', () => {
diff --git a/web/src/lib/utils/time-to-seconds.ts b/web/src/lib/utils/date-time.ts
similarity index 68%
rename from web/src/lib/utils/time-to-seconds.ts
rename to web/src/lib/utils/date-time.ts
index 026615ea0..f1eeee02b 100644
--- a/web/src/lib/utils/time-to-seconds.ts
+++ b/web/src/lib/utils/date-time.ts
@@ -1,4 +1,4 @@
-import { Duration } from 'luxon';
+import { DateTime, Duration } from 'luxon';
 
 /**
  * Convert time like `01:02:03.456` to seconds.
@@ -11,3 +11,7 @@ export function timeToSeconds(time: string) {
 
   return Duration.fromObject({ hours, minutes, seconds }).as('seconds');
 }
+
+export function parseUtcDate(date: string) {
+  return DateTime.fromISO(date, { zone: 'UTC' }).toUTC();
+}
diff --git a/web/src/routes/(user)/search/+page.svelte b/web/src/routes/(user)/search/+page.svelte
index fd84071d3..3d52ee04f 100644
--- a/web/src/routes/(user)/search/+page.svelte
+++ b/web/src/routes/(user)/search/+page.svelte
@@ -35,6 +35,7 @@
   import type { Viewport } from '$lib/stores/assets.store';
   import { locale } from '$lib/stores/preferences.store';
   import LoadingSpinner from '$lib/components/shared-components/loading-spinner.svelte';
+  import { parseUtcDate } from '$lib/utils/date-time';
 
   const MAX_ASSET_COUNT = 5000;
   let { isViewing: showAssetViewer } = assetViewingStore;
@@ -143,13 +144,16 @@
     isLoading = false;
   };
 
-  function getHumanReadableDate(date: string) {
-    const d = new Date(date);
-    return d.toLocaleDateString($locale, {
-      year: 'numeric',
-      month: 'long',
-      day: 'numeric',
-    });
+  function getHumanReadableDate(dateString: string) {
+    const date = parseUtcDate(dateString).startOf('day');
+    return date.toLocaleString(
+      {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+      },
+      { locale: $locale },
+    );
   }
 
   function getHumanReadableSearchKey(key: keyof SearchTerms): string {

From 9d3ed719e0eec592a0b19dd016bbbf558d25db8a Mon Sep 17 00:00:00 2001
From: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>
Date: Sat, 24 Feb 2024 21:24:24 +0100
Subject: [PATCH 15/28] fix(web): prevent scroll reset on search page (#7385)

---
 web/src/routes/(user)/search/+page.svelte | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/web/src/routes/(user)/search/+page.svelte b/web/src/routes/(user)/search/+page.svelte
index 3d52ee04f..bda74db78 100644
--- a/web/src/routes/(user)/search/+page.svelte
+++ b/web/src/routes/(user)/search/+page.svelte
@@ -290,11 +290,7 @@
       </section>
     {/if}
     <section id="search-content" class="relative bg-immich-bg dark:bg-immich-dark-bg">
-      {#if isLoading}
-        <div class="flex justify-center py-16 items-center">
-          <LoadingSpinner size="48" />
-        </div>
-      {:else if searchResultAssets.length > 0}
+      {#if searchResultAssets.length > 0}
         <GalleryViewer
           assets={searchResultAssets}
           bind:selectedAssets
@@ -302,7 +298,7 @@
           showArchiveIcon={true}
           {viewport}
         />
-      {:else}
+      {:else if !isLoading}
         <div class="flex min-h-[calc(66vh_-_11rem)] w-full place-content-center items-center dark:text-white">
           <div class="flex flex-col content-center items-center text-center">
             <Icon path={mdiImageOffOutline} size="3.5em" />
@@ -311,6 +307,12 @@
           </div>
         </div>
       {/if}
+
+      {#if isLoading}
+        <div class="flex justify-center py-16 items-center">
+          <LoadingSpinner size="48" />
+        </div>
+      {/if}
     </section>
   </section>
 </section>

From 038e69fd0273335c7fe6f08290d1c20a97ed5e84 Mon Sep 17 00:00:00 2001
From: Jan108 <jan.braker@t-online.de>
Date: Sat, 24 Feb 2024 21:28:56 +0100
Subject: [PATCH 16/28] feat(web): Added password field visibility toggle
 (#7368)

* Added password field visibility toggle

* improvements to password input field

* fix e2e and change tabindex

* add missing name=password

* remove unnecessary type prop

---------

Co-authored-by: Jan108 <dasJan108@gmail.com>
Co-authored-by: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>
---
 .../forms/admin-registration-form.svelte      | 25 ++--------
 .../forms/change-password-form.svelte         | 21 ++------
 .../components/forms/create-user-form.svelte  | 16 ++----
 .../lib/components/forms/login-form.svelte    | 11 +---
 .../shared-components/password-field.svelte   | 50 +++++++++++++++++++
 .../settings/setting-input-field.svelte       | 49 ++++++++++++------
 .../change-password-settings.svelte           |  3 ++
 7 files changed, 101 insertions(+), 74 deletions(-)
 create mode 100644 web/src/lib/components/shared-components/password-field.svelte

diff --git a/web/src/lib/components/forms/admin-registration-form.svelte b/web/src/lib/components/forms/admin-registration-form.svelte
index 144e1711d..0781ef226 100644
--- a/web/src/lib/components/forms/admin-registration-form.svelte
+++ b/web/src/lib/components/forms/admin-registration-form.svelte
@@ -4,14 +4,15 @@
   import { signUpAdmin } from '@immich/sdk';
   import { handleError } from '../../utils/handle-error';
   import Button from '../elements/buttons/button.svelte';
+  import PasswordField from '../shared-components/password-field.svelte';
 
   let errorMessage: string;
   let password = '';
-  let confirmPassowrd = '';
+  let confirmPassword = '';
   let canRegister = false;
 
   $: {
-    if (password !== confirmPassowrd && confirmPassowrd.length > 0) {
+    if (password !== confirmPassword && confirmPassword.length > 0) {
       errorMessage = 'Password does not match';
       canRegister = false;
     } else {
@@ -56,28 +57,12 @@
 
   <div class="flex flex-col gap-2">
     <label class="immich-form-label" for="password">Admin Password</label>
-    <input
-      class="immich-form-input"
-      id="password"
-      name="password"
-      type="password"
-      autocomplete="new-password"
-      required
-      bind:value={password}
-    />
+    <PasswordField id="password" name="password" bind:password autocomplete="new-password" />
   </div>
 
   <div class="flex flex-col gap-2">
     <label class="immich-form-label" for="confirmPassword">Confirm Admin Password</label>
-    <input
-      class="immich-form-input"
-      id="confirmPassword"
-      name="password"
-      type="password"
-      autocomplete="new-password"
-      required
-      bind:value={confirmPassowrd}
-    />
+    <PasswordField id="confirmPassword" bind:password={confirmPassword} autocomplete="new-password" />
   </div>
 
   <div class="flex flex-col gap-2">
diff --git a/web/src/lib/components/forms/change-password-form.svelte b/web/src/lib/components/forms/change-password-form.svelte
index c33a93e5d..8e0d4d6f8 100644
--- a/web/src/lib/components/forms/change-password-form.svelte
+++ b/web/src/lib/components/forms/change-password-form.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
   import { createEventDispatcher } from 'svelte';
   import Button from '../elements/buttons/button.svelte';
+  import PasswordField from '../shared-components/password-field.svelte';
   import { updateUser, type UserResponseDto } from '@immich/sdk';
 
   export let user: UserResponseDto;
@@ -46,28 +47,12 @@
 <form on:submit|preventDefault={changePassword} method="post" class="mt-5 flex flex-col gap-5">
   <div class="flex flex-col gap-2">
     <label class="immich-form-label" for="password">New Password</label>
-    <input
-      class="immich-form-input"
-      id="password"
-      name="password"
-      type="password"
-      autocomplete="new-password"
-      required
-      bind:value={password}
-    />
+    <PasswordField id="password" bind:password autocomplete="new-password" />
   </div>
 
   <div class="flex flex-col gap-2">
     <label class="immich-form-label" for="confirmPassword">Confirm Password</label>
-    <input
-      class="immich-form-input"
-      id="confirmPassword"
-      name="password"
-      type="password"
-      autocomplete="current-password"
-      required
-      bind:value={passwordConfirm}
-    />
+    <PasswordField id="confirmPassword" bind:password={passwordConfirm} autocomplete="new-password" />
   </div>
 
   {#if errorMessage}
diff --git a/web/src/lib/components/forms/create-user-form.svelte b/web/src/lib/components/forms/create-user-form.svelte
index 689ec6995..c83b5f672 100644
--- a/web/src/lib/components/forms/create-user-form.svelte
+++ b/web/src/lib/components/forms/create-user-form.svelte
@@ -6,12 +6,13 @@
   import { createEventDispatcher } from 'svelte';
   import Button from '../elements/buttons/button.svelte';
   import ImmichLogo from '../shared-components/immich-logo.svelte';
+  import PasswordField from '../shared-components/password-field.svelte';
 
   let error: string;
   let success: string;
 
   let password = '';
-  let confirmPassowrd = '';
+  let confirmPassword = '';
 
   let canCreateUser = false;
   let quotaSize: number | undefined;
@@ -20,7 +21,7 @@
   $: quotaSizeWarning = quotaSize && convertToBytes(Number(quotaSize), 'GiB') > $serverInfo.diskSizeRaw;
 
   $: {
-    if (password !== confirmPassowrd && confirmPassowrd.length > 0) {
+    if (password !== confirmPassword && confirmPassword.length > 0) {
       error = 'Password does not match';
       canCreateUser = false;
     } else {
@@ -91,19 +92,12 @@
 
     <div class="m-4 flex flex-col gap-2">
       <label class="immich-form-label" for="password">Password</label>
-      <input class="immich-form-input" id="password" name="password" type="password" required bind:value={password} />
+      <PasswordField id="password" name="password" bind:password autocomplete="new-password" />
     </div>
 
     <div class="m-4 flex flex-col gap-2">
       <label class="immich-form-label" for="confirmPassword">Confirm Password</label>
-      <input
-        class="immich-form-input"
-        id="confirmPassword"
-        name="password"
-        type="password"
-        required
-        bind:value={confirmPassowrd}
-      />
+      <PasswordField id="confirmPassword" bind:password={confirmPassword} autocomplete="new-password" />
     </div>
 
     <div class="m-4 flex flex-col gap-2">
diff --git a/web/src/lib/components/forms/login-form.svelte b/web/src/lib/components/forms/login-form.svelte
index 387c76be3..9ea654a80 100644
--- a/web/src/lib/components/forms/login-form.svelte
+++ b/web/src/lib/components/forms/login-form.svelte
@@ -9,6 +9,7 @@
   import { onMount } from 'svelte';
   import { fade } from 'svelte/transition';
   import Button from '../elements/buttons/button.svelte';
+  import PasswordField from '../shared-components/password-field.svelte';
 
   export let onSuccess: () => unknown | Promise<unknown>;
   export let onFirstLogin: () => unknown | Promise<unknown>;
@@ -112,15 +113,7 @@
 
     <div class="flex flex-col gap-2">
       <label class="immich-form-label" for="password">Password</label>
-      <input
-        class="immich-form-input"
-        id="password"
-        name="password"
-        type="password"
-        autocomplete="current-password"
-        bind:value={password}
-        required
-      />
+      <PasswordField id="password" bind:password autocomplete="current-password" />
     </div>
 
     <div class="my-5 flex w-full">
diff --git a/web/src/lib/components/shared-components/password-field.svelte b/web/src/lib/components/shared-components/password-field.svelte
new file mode 100644
index 000000000..b03d765fc
--- /dev/null
+++ b/web/src/lib/components/shared-components/password-field.svelte
@@ -0,0 +1,50 @@
+<script lang="ts">
+  import { mdiEyeOffOutline, mdiEyeOutline } from '@mdi/js';
+  import type { HTMLInputAttributes } from 'svelte/elements';
+  import Icon from '../elements/icon.svelte';
+
+  interface $$Props extends HTMLInputAttributes {
+    password: string;
+    autocomplete: string;
+    required?: boolean;
+    onInput?: (value: string) => void;
+  }
+
+  export let password: $$Props['password'];
+  export let required = true;
+  export let onInput: $$Props['onInput'] = undefined;
+
+  let showPassword = false;
+</script>
+
+<div class="relative w-full">
+  <input
+    {...$$restProps}
+    class="immich-form-input w-full !pr-12"
+    type={showPassword ? 'text' : 'password'}
+    {required}
+    value={password}
+    on:input={(e) => {
+      password = e.currentTarget.value;
+      onInput?.(password);
+    }}
+  />
+
+  {#if password.length > 0}
+    <button
+      type="button"
+      tabindex="-1"
+      class="absolute inset-y-0 end-0 px-4 text-gray-700 dark:text-gray-200"
+      on:click={() => (showPassword = !showPassword)}
+      title={showPassword ? 'Hide password' : 'Show password'}
+    >
+      <Icon path={showPassword ? mdiEyeOffOutline : mdiEyeOutline} size="1.25em" />
+    </button>
+  {/if}
+</div>
+
+<style>
+  input::-ms-reveal {
+    display: none;
+  }
+</style>
diff --git a/web/src/lib/components/shared-components/settings/setting-input-field.svelte b/web/src/lib/components/shared-components/settings/setting-input-field.svelte
index 83cd0e71e..8e966c8f5 100644
--- a/web/src/lib/components/shared-components/settings/setting-input-field.svelte
+++ b/web/src/lib/components/shared-components/settings/setting-input-field.svelte
@@ -10,6 +10,7 @@
 <script lang="ts">
   import { quintOut } from 'svelte/easing';
   import { fly } from 'svelte/transition';
+  import PasswordField from '../password-field.svelte';
 
   export let inputType: SettingInputFieldType;
   export let value: string | number;
@@ -22,6 +23,7 @@
   export let required = false;
   export let disabled = false;
   export let isEdited = false;
+  export let passwordAutocomplete: string = 'current-password';
 
   const handleInput = (e: Event) => {
     value = (e.target as HTMLInputElement).value;
@@ -64,20 +66,35 @@
     <slot name="desc" />
   {/if}
 
-  <input
-    class="immich-form-input w-full pb-2"
-    aria-describedby={desc ? `${label}-desc` : undefined}
-    aria-labelledby="{label}-label"
-    id={label}
-    name={label}
-    type={inputType}
-    min={min.toString()}
-    max={max.toString()}
-    {step}
-    {required}
-    {value}
-    on:input={handleInput}
-    {disabled}
-    {title}
-  />
+  {#if inputType !== SettingInputFieldType.PASSWORD}
+    <input
+      class="immich-form-input w-full pb-2"
+      aria-describedby={desc ? `${label}-desc` : undefined}
+      aria-labelledby="{label}-label"
+      id={label}
+      name={label}
+      type={inputType}
+      min={min.toString()}
+      max={max.toString()}
+      {step}
+      {required}
+      {value}
+      on:input={handleInput}
+      {disabled}
+      {title}
+    />
+  {:else}
+    <PasswordField
+      aria-describedby={desc ? `${label}-desc` : undefined}
+      aria-labelledby="{label}-label"
+      id={label}
+      name={label}
+      autocomplete={passwordAutocomplete}
+      {required}
+      password={value.toString()}
+      onInput={(passwordValue) => (value = passwordValue)}
+      {disabled}
+      {title}
+    />
+  {/if}
 </div>
diff --git a/web/src/lib/components/user-settings-page/change-password-settings.svelte b/web/src/lib/components/user-settings-page/change-password-settings.svelte
index 9745b15fa..89a8103f5 100644
--- a/web/src/lib/components/user-settings-page/change-password-settings.svelte
+++ b/web/src/lib/components/user-settings-page/change-password-settings.svelte
@@ -47,6 +47,7 @@
           label="PASSWORD"
           bind:value={password}
           required={true}
+          passwordAutocomplete="current-password"
         />
 
         <SettingInputField
@@ -54,6 +55,7 @@
           label="NEW PASSWORD"
           bind:value={newPassword}
           required={true}
+          passwordAutocomplete="new-password"
         />
 
         <SettingInputField
@@ -61,6 +63,7 @@
           label="CONFIRM PASSWORD"
           bind:value={confirmPassword}
           required={true}
+          passwordAutocomplete="new-password"
         />
 
         <div class="flex justify-end">

From 912d723281ebe01c28726c57467f18c273def441 Mon Sep 17 00:00:00 2001
From: Daniel Mendizabal <daniel@darhon.com>
Date: Sun, 25 Feb 2024 07:31:01 +1100
Subject: [PATCH 17/28] Update reverse-proxy.md - Apache (#7386)

Update reverse-proxy.md

Update to the Apache implementation
---
 docs/docs/administration/reverse-proxy.md | 23 +++++++----------------
 1 file changed, 7 insertions(+), 16 deletions(-)

diff --git a/docs/docs/administration/reverse-proxy.md b/docs/docs/administration/reverse-proxy.md
index 66f4d7b9f..24919347f 100644
--- a/docs/docs/administration/reverse-proxy.md
+++ b/docs/docs/administration/reverse-proxy.md
@@ -44,22 +44,13 @@ Below is an example config for Apache2 site configuration.
 
 ```
 <VirtualHost *:80>
-    ServerName <snip>
+   ServerName <snip>
+   ProxyRequests Off
+   ProxyPass / http://127.0.0.1:2283/ timeout=600 upgrade=websocket
+   ProxyPassReverse / http://127.0.0.1:2283/
+   ProxyPreserveHost On
 
-    ProxyRequests off
-    ProxyVia on
-
-    RewriteEngine On
-    RewriteCond %{REQUEST_URI}  ^/api/socket.io            [NC]
-    RewriteCond %{QUERY_STRING} transport=websocket    [NC]
-    RewriteRule /(.*)           ws://localhost:2283/$1 [P,L]
-
-    ProxyPass        /api/socket.io ws://localhost:2283/api/socket.io
-    ProxyPassReverse /api/socket.io ws://localhost:2283/api/socket.io
-
-    <Location />
-        ProxyPass http://localhost:2283/
-        ProxyPassReverse http://localhost:2283/
-    </Location>
 </VirtualHost>
 ```
+
+**timeout:** is measured in seconds, and it is particularly useful when long operations are triggered (i.e. Repair), so the server doesn't return an error.

From 2a75f884d9ab63f355bd60c44a76a6e8a2c05c43 Mon Sep 17 00:00:00 2001
From: Sourav Agrawal <35604369+agrawalsourav98@users.noreply.github.com>
Date: Sun, 25 Feb 2024 04:52:27 +0530
Subject: [PATCH 18/28] Fix Smart Search when using OpenVINO (#7389)

* Fix external_path loading in OpenVINO EP

* Fix ruff lint

* Wrap block in try finally

* remove static input shape code

* add unit test

* remove unused imports

* remove repeat line

* linting

* formatting

---------

Co-authored-by: mertalev <101130780+mertalev@users.noreply.github.com>
---
 machine-learning/ann/__init__.py         |  1 -
 machine-learning/ann/ann.py              |  3 +-
 machine-learning/app/models/base.py      | 66 +++++-------------------
 machine-learning/app/models/constants.py |  3 --
 machine-learning/app/test_main.py        | 26 +++++++++-
 machine-learning/pyproject.toml          |  6 +--
 6 files changed, 41 insertions(+), 64 deletions(-)

diff --git a/machine-learning/ann/__init__.py b/machine-learning/ann/__init__.py
index 0793d1011..e69de29bb 100644
--- a/machine-learning/ann/__init__.py
+++ b/machine-learning/ann/__init__.py
@@ -1 +0,0 @@
-from .ann import Ann, is_available
diff --git a/machine-learning/ann/ann.py b/machine-learning/ann/ann.py
index 94f665bfc..148d5ba10 100644
--- a/machine-learning/ann/ann.py
+++ b/machine-learning/ann/ann.py
@@ -32,8 +32,7 @@ T = TypeVar("T", covariant=True)
 
 
 class Newable(Protocol[T]):
-    def new(self) -> None:
-        ...
+    def new(self) -> None: ...
 
 
 class _Singleton(type, Newable[T]):
diff --git a/machine-learning/app/models/base.py b/machine-learning/app/models/base.py
index 6097c7c98..6909a935c 100644
--- a/machine-learning/app/models/base.py
+++ b/machine-learning/app/models/base.py
@@ -1,18 +1,16 @@
 from __future__ import annotations
 
+import os
 from abc import ABC, abstractmethod
 from pathlib import Path
 from shutil import rmtree
 from typing import Any
 
-import onnx
 import onnxruntime as ort
 from huggingface_hub import snapshot_download
-from onnx.shape_inference import infer_shapes
-from onnx.tools.update_model_dims import update_inputs_outputs_dims
 
 import ann.ann
-from app.models.constants import STATIC_INPUT_PROVIDERS, SUPPORTED_PROVIDERS
+from app.models.constants import SUPPORTED_PROVIDERS
 
 from ..config import get_cache_dir, get_hf_model_name, log, settings
 from ..schemas import ModelRuntime, ModelType
@@ -113,63 +111,25 @@ class InferenceModel(ABC):
             )
             model_path = onnx_path
 
-        if any(provider in STATIC_INPUT_PROVIDERS for provider in self.providers):
-            static_path = model_path.parent / "static_1" / "model.onnx"
-            static_path.parent.mkdir(parents=True, exist_ok=True)
-            if not static_path.is_file():
-                self._convert_to_static(model_path, static_path)
-            model_path = static_path
-
         match model_path.suffix:
             case ".armnn":
                 session = AnnSession(model_path)
             case ".onnx":
-                session = ort.InferenceSession(
-                    model_path.as_posix(),
-                    sess_options=self.sess_options,
-                    providers=self.providers,
-                    provider_options=self.provider_options,
-                )
+                cwd = os.getcwd()
+                try:
+                    os.chdir(model_path.parent)
+                    session = ort.InferenceSession(
+                        model_path.as_posix(),
+                        sess_options=self.sess_options,
+                        providers=self.providers,
+                        provider_options=self.provider_options,
+                    )
+                finally:
+                    os.chdir(cwd)
             case _:
                 raise ValueError(f"Unsupported model file type: {model_path.suffix}")
         return session
 
-    def _convert_to_static(self, source_path: Path, target_path: Path) -> None:
-        inferred = infer_shapes(onnx.load(source_path))
-        inputs = self._get_static_dims(inferred.graph.input)
-        outputs = self._get_static_dims(inferred.graph.output)
-
-        # check_model gets called in update_inputs_outputs_dims and doesn't work for large models
-        check_model = onnx.checker.check_model
-        try:
-
-            def check_model_stub(*args: Any, **kwargs: Any) -> None:
-                pass
-
-            onnx.checker.check_model = check_model_stub
-            updated_model = update_inputs_outputs_dims(inferred, inputs, outputs)
-        finally:
-            onnx.checker.check_model = check_model
-
-        onnx.save(
-            updated_model,
-            target_path,
-            save_as_external_data=True,
-            all_tensors_to_one_file=False,
-            size_threshold=1048576,
-        )
-
-    def _get_static_dims(self, graph_io: Any, dim_size: int = 1) -> dict[str, list[int]]:
-        return {
-            field.name: [
-                d.dim_value if d.HasField("dim_value") else dim_size
-                for shape in field.type.ListFields()
-                if (dim := shape[1].shape.dim)
-                for d in dim
-            ]
-            for field in graph_io
-        }
-
     @property
     def model_type(self) -> ModelType:
         return self._model_type
diff --git a/machine-learning/app/models/constants.py b/machine-learning/app/models/constants.py
index 18965d2b1..b112e9279 100644
--- a/machine-learning/app/models/constants.py
+++ b/machine-learning/app/models/constants.py
@@ -54,9 +54,6 @@ _INSIGHTFACE_MODELS = {
 SUPPORTED_PROVIDERS = ["CUDAExecutionProvider", "OpenVINOExecutionProvider", "CPUExecutionProvider"]
 
 
-STATIC_INPUT_PROVIDERS = ["OpenVINOExecutionProvider"]
-
-
 def is_openclip(model_name: str) -> bool:
     return clean_name(model_name) in _OPENCLIP_MODELS
 
diff --git a/machine-learning/app/test_main.py b/machine-learning/app/test_main.py
index cf941c1bb..e25099e67 100644
--- a/machine-learning/app/test_main.py
+++ b/machine-learning/app/test_main.py
@@ -1,4 +1,5 @@
 import json
+import os
 from io import BytesIO
 from pathlib import Path
 from random import randint
@@ -237,12 +238,12 @@ class TestBase:
         mock_model_path.is_file.return_value = True
         mock_model_path.suffix = ".armnn"
         mock_model_path.with_suffix.return_value = mock_model_path
-        mock_session = mocker.patch("app.models.base.AnnSession")
+        mock_ann = mocker.patch("app.models.base.AnnSession")
 
         encoder = OpenCLIPEncoder("ViT-B-32__openai")
         encoder._make_session(mock_model_path)
 
-        mock_session.assert_called_once()
+        mock_ann.assert_called_once()
 
     def test_make_session_return_ort_if_available_and_ann_is_not(self, mocker: MockerFixture) -> None:
         mock_armnn_path = mocker.Mock()
@@ -256,6 +257,7 @@ class TestBase:
 
         mock_ann = mocker.patch("app.models.base.AnnSession")
         mock_ort = mocker.patch("app.models.base.ort.InferenceSession")
+        mocker.patch("app.models.base.os.chdir")
 
         encoder = OpenCLIPEncoder("ViT-B-32__openai")
         encoder._make_session(mock_armnn_path)
@@ -278,6 +280,26 @@ class TestBase:
         mock_ann.assert_not_called()
         mock_ort.assert_not_called()
 
+    def test_make_session_changes_cwd(self, mocker: MockerFixture) -> None:
+        mock_model_path = mocker.Mock()
+        mock_model_path.is_file.return_value = True
+        mock_model_path.suffix = ".onnx"
+        mock_model_path.parent = "model_parent"
+        mock_model_path.with_suffix.return_value = mock_model_path
+        mock_ort = mocker.patch("app.models.base.ort.InferenceSession")
+        mock_chdir = mocker.patch("app.models.base.os.chdir")
+
+        encoder = OpenCLIPEncoder("ViT-B-32__openai")
+        encoder._make_session(mock_model_path)
+
+        mock_chdir.assert_has_calls(
+            [
+                mock.call(mock_model_path.parent),
+                mock.call(os.getcwd()),
+            ]
+        )
+        mock_ort.assert_called_once()
+
     def test_download(self, mocker: MockerFixture) -> None:
         mock_snapshot_download = mocker.patch("app.models.base.snapshot_download")
 
diff --git a/machine-learning/pyproject.toml b/machine-learning/pyproject.toml
index 750ca65f2..fec5c7213 100644
--- a/machine-learning/pyproject.toml
+++ b/machine-learning/pyproject.toml
@@ -82,10 +82,10 @@ warn_untyped_fields = true
 [tool.ruff]
 line-length = 120
 target-version = "py311"
-select = ["E", "F", "I"]
 
-[tool.ruff.per-file-ignores]
-"test_main.py" = ["F403"]
+[tool.ruff.lint]
+select = ["E", "F", "I"]
+per-file-ignores = { "test_main.py" = ["F403"] }
 
 [tool.black]
 line-length = 120

From 943105ea207bcf96eac377c2407b90ab56c27c75 Mon Sep 17 00:00:00 2001
From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com>
Date: Sun, 25 Feb 2024 09:07:13 -0800
Subject: [PATCH 19/28] chore(deps): update vitest monorepo to v1.3.1 (#7407)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
---
 e2e/package-lock.json | 78 +++++++++++++++++++++----------------------
 1 file changed, 39 insertions(+), 39 deletions(-)

diff --git a/e2e/package-lock.json b/e2e/package-lock.json
index 9fe651a52..44155ac83 100644
--- a/e2e/package-lock.json
+++ b/e2e/package-lock.json
@@ -904,9 +904,9 @@
       }
     },
     "node_modules/@vitest/coverage-v8": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/@vitest/coverage-v8/-/coverage-v8-1.3.0.tgz",
-      "integrity": "sha512-e5Y5uK5NNoQMQaNitGQQjo9FoA5ZNcu7Bn6pH+dxUf48u6po1cX38kFBYUHZ9GNVkF4JLbncE0WeWwTw+nLrxg==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@vitest/coverage-v8/-/coverage-v8-1.3.1.tgz",
+      "integrity": "sha512-UuBnkSJUNE9rdHjDCPyJ4fYuMkoMtnghes1XohYa4At0MS3OQSAo97FrbwSLRshYsXThMZy1+ybD/byK5llyIg==",
       "dev": true,
       "dependencies": {
         "@ampproject/remapping": "^2.2.1",
@@ -927,17 +927,17 @@
         "url": "https://opencollective.com/vitest"
       },
       "peerDependencies": {
-        "vitest": "1.3.0"
+        "vitest": "1.3.1"
       }
     },
     "node_modules/@vitest/expect": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-1.3.0.tgz",
-      "integrity": "sha512-7bWt0vBTZj08B+Ikv70AnLRicohYwFgzNjFqo9SxxqHHxSlUJGSXmCRORhOnRMisiUryKMdvsi1n27Bc6jL9DQ==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-1.3.1.tgz",
+      "integrity": "sha512-xofQFwIzfdmLLlHa6ag0dPV8YsnKOCP1KdAeVVh34vSjN2dcUiXYCD9htu/9eM7t8Xln4v03U9HLxLpPlsXdZw==",
       "dev": true,
       "dependencies": {
-        "@vitest/spy": "1.3.0",
-        "@vitest/utils": "1.3.0",
+        "@vitest/spy": "1.3.1",
+        "@vitest/utils": "1.3.1",
         "chai": "^4.3.10"
       },
       "funding": {
@@ -945,12 +945,12 @@
       }
     },
     "node_modules/@vitest/runner": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/@vitest/runner/-/runner-1.3.0.tgz",
-      "integrity": "sha512-1Jb15Vo/Oy7mwZ5bXi7zbgszsdIBNjc4IqP8Jpr/8RdBC4nF1CTzIAn2dxYvpF1nGSseeL39lfLQ2uvs5u1Y9A==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@vitest/runner/-/runner-1.3.1.tgz",
+      "integrity": "sha512-5FzF9c3jG/z5bgCnjr8j9LNq/9OxV2uEBAITOXfoe3rdZJTdO7jzThth7FXv/6b+kdY65tpRQB7WaKhNZwX+Kg==",
       "dev": true,
       "dependencies": {
-        "@vitest/utils": "1.3.0",
+        "@vitest/utils": "1.3.1",
         "p-limit": "^5.0.0",
         "pathe": "^1.1.1"
       },
@@ -959,9 +959,9 @@
       }
     },
     "node_modules/@vitest/snapshot": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/@vitest/snapshot/-/snapshot-1.3.0.tgz",
-      "integrity": "sha512-swmktcviVVPYx9U4SEQXLV6AEY51Y6bZ14jA2yo6TgMxQ3h+ZYiO0YhAHGJNp0ohCFbPAis1R9kK0cvN6lDPQA==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@vitest/snapshot/-/snapshot-1.3.1.tgz",
+      "integrity": "sha512-EF++BZbt6RZmOlE3SuTPu/NfwBF6q4ABS37HHXzs2LUVPBLx2QoY/K0fKpRChSo8eLiuxcbCVfqKgx/dplCDuQ==",
       "dev": true,
       "dependencies": {
         "magic-string": "^0.30.5",
@@ -973,9 +973,9 @@
       }
     },
     "node_modules/@vitest/spy": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-1.3.0.tgz",
-      "integrity": "sha512-AkCU0ThZunMvblDpPKgjIi025UxR8V7MZ/g/EwmAGpjIujLVV2X6rGYGmxE2D4FJbAy0/ijdROHMWa2M/6JVMw==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-1.3.1.tgz",
+      "integrity": "sha512-xAcW+S099ylC9VLU7eZfdT9myV67Nor9w9zhf0mGCYJSO+zM2839tOeROTdikOi/8Qeusffvxb/MyBSOja1Uig==",
       "dev": true,
       "dependencies": {
         "tinyspy": "^2.2.0"
@@ -985,9 +985,9 @@
       }
     },
     "node_modules/@vitest/utils": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-1.3.0.tgz",
-      "integrity": "sha512-/LibEY/fkaXQufi4GDlQZhikQsPO2entBKtfuyIpr1jV4DpaeasqkeHjhdOhU24vSHshcSuEyVlWdzvv2XmYCw==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-1.3.1.tgz",
+      "integrity": "sha512-d3Waie/299qqRyHTm2DjADeTaNdNSVsnwHPWrs20JMpjh6eiVq7ggggweO8rc4arhf6rRkWuHKwvxGvejUXZZQ==",
       "dev": true,
       "dependencies": {
         "diff-sequences": "^29.6.3",
@@ -2551,9 +2551,9 @@
       }
     },
     "node_modules/vite": {
-      "version": "5.1.3",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-5.1.3.tgz",
-      "integrity": "sha512-UfmUD36DKkqhi/F75RrxvPpry+9+tTkrXfMNZD+SboZqBCMsxKtO52XeGzzuh7ioz+Eo/SYDBbdb0Z7vgcDJew==",
+      "version": "5.1.4",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-5.1.4.tgz",
+      "integrity": "sha512-n+MPqzq+d9nMVTKyewqw6kSt+R3CkvF9QAKY8obiQn8g1fwTscKxyfaYnC632HtBXAQGc1Yjomphwn1dtwGAHg==",
       "dev": true,
       "dependencies": {
         "esbuild": "^0.19.3",
@@ -2606,9 +2606,9 @@
       }
     },
     "node_modules/vite-node": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/vite-node/-/vite-node-1.3.0.tgz",
-      "integrity": "sha512-D/oiDVBw75XMnjAXne/4feCkCEwcbr2SU1bjAhCcfI5Bq3VoOHji8/wCPAfUkDIeohJ5nSZ39fNxM3dNZ6OBOA==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/vite-node/-/vite-node-1.3.1.tgz",
+      "integrity": "sha512-azbRrqRxlWTJEVbzInZCTchx0X69M/XPTCz4H+TLvlTcR/xH/3hkRqhOakT41fMJCMzXTu4UvegkZiEoJAWvng==",
       "dev": true,
       "dependencies": {
         "cac": "^6.7.14",
@@ -2642,16 +2642,16 @@
       }
     },
     "node_modules/vitest": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/vitest/-/vitest-1.3.0.tgz",
-      "integrity": "sha512-V9qb276J1jjSx9xb75T2VoYXdO1UKi+qfflY7V7w93jzX7oA/+RtYE6TcifxksxsZvygSSMwu2Uw6di7yqDMwg==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/vitest/-/vitest-1.3.1.tgz",
+      "integrity": "sha512-/1QJqXs8YbCrfv/GPQ05wAZf2eakUPLPa18vkJAKE7RXOKfVHqMZZ1WlTjiwl6Gcn65M5vpNUB6EFLnEdRdEXQ==",
       "dev": true,
       "dependencies": {
-        "@vitest/expect": "1.3.0",
-        "@vitest/runner": "1.3.0",
-        "@vitest/snapshot": "1.3.0",
-        "@vitest/spy": "1.3.0",
-        "@vitest/utils": "1.3.0",
+        "@vitest/expect": "1.3.1",
+        "@vitest/runner": "1.3.1",
+        "@vitest/snapshot": "1.3.1",
+        "@vitest/spy": "1.3.1",
+        "@vitest/utils": "1.3.1",
         "acorn-walk": "^8.3.2",
         "chai": "^4.3.10",
         "debug": "^4.3.4",
@@ -2665,7 +2665,7 @@
         "tinybench": "^2.5.1",
         "tinypool": "^0.8.2",
         "vite": "^5.0.0",
-        "vite-node": "1.3.0",
+        "vite-node": "1.3.1",
         "why-is-node-running": "^2.2.2"
       },
       "bin": {
@@ -2680,8 +2680,8 @@
       "peerDependencies": {
         "@edge-runtime/vm": "*",
         "@types/node": "^18.0.0 || >=20.0.0",
-        "@vitest/browser": "1.3.0",
-        "@vitest/ui": "1.3.0",
+        "@vitest/browser": "1.3.1",
+        "@vitest/ui": "1.3.1",
         "happy-dom": "*",
         "jsdom": "*"
       },

From 45ecb629a1a644dfb6d3b3322cbb3d3cfdfc5a4d Mon Sep 17 00:00:00 2001
From: Mert <101130780+mertalev@users.noreply.github.com>
Date: Sun, 25 Feb 2024 13:18:09 -0500
Subject: [PATCH 20/28] fix(server): storage template migration not working
 (#7414)

add `withExif`
---
 server/src/domain/storage-template/storage-template.service.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/server/src/domain/storage-template/storage-template.service.ts b/server/src/domain/storage-template/storage-template.service.ts
index d69698254..857d1df32 100644
--- a/server/src/domain/storage-template/storage-template.service.ts
+++ b/server/src/domain/storage-template/storage-template.service.ts
@@ -117,7 +117,7 @@ export class StorageTemplateService {
       return true;
     }
     const assetPagination = usePagination(JOBS_ASSET_PAGINATION_SIZE, (pagination) =>
-      this.assetRepository.getAll(pagination),
+      this.assetRepository.getAll(pagination, { withExif: true }),
     );
     const users = await this.userRepository.getList();
 

From 3e8af16270e0e2270c0b466a7d317f2f77c0a295 Mon Sep 17 00:00:00 2001
From: Daniel Dietzler <36593685+danieldietzler@users.noreply.github.com>
Date: Mon, 26 Feb 2024 22:45:08 +0100
Subject: [PATCH 21/28] refactor(web): search box (#7397)

* refactor search suggestion handling

* chore: open api

* revert server changes

* chore: open api

* update location filters

* location filter cleanup

* refactor people filter

* refactor camera filter

* refactor display filter

* cleanup

---------

Co-authored-by: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>
---
 server/src/domain/search/search.service.ts    |  36 +-
 .../shared-components/combobox.svelte         |   4 +
 .../search-bar/search-camera-section.svelte   |  63 ++
 .../search-bar/search-date-section.svelte     |  37 ++
 .../search-bar/search-display-section.svelte  |  32 +
 .../search-bar/search-filter-box.svelte       | 549 +++---------------
 .../search-bar/search-location-section.svelte |  96 +++
 .../search-bar/search-media-section.svelte    |  47 ++
 .../search-bar/search-people-section.svelte   |  95 +++
 9 files changed, 468 insertions(+), 491 deletions(-)
 create mode 100644 web/src/lib/components/shared-components/search-bar/search-camera-section.svelte
 create mode 100644 web/src/lib/components/shared-components/search-bar/search-date-section.svelte
 create mode 100644 web/src/lib/components/shared-components/search-bar/search-display-section.svelte
 create mode 100644 web/src/lib/components/shared-components/search-bar/search-location-section.svelte
 create mode 100644 web/src/lib/components/shared-components/search-bar/search-media-section.svelte
 create mode 100644 web/src/lib/components/shared-components/search-bar/search-people-section.svelte

diff --git a/server/src/domain/search/search.service.ts b/server/src/domain/search/search.service.ts
index 95ad848e2..5b5639998 100644
--- a/server/src/domain/search/search.service.ts
+++ b/server/src/domain/search/search.service.ts
@@ -195,26 +195,22 @@ export class SearchService {
   }
 
   async getSearchSuggestions(auth: AuthDto, dto: SearchSuggestionRequestDto): Promise<string[]> {
-    if (dto.type === SearchSuggestionType.COUNTRY) {
-      return this.metadataRepository.getCountries(auth.user.id);
+    switch (dto.type) {
+      case SearchSuggestionType.COUNTRY: {
+        return this.metadataRepository.getCountries(auth.user.id);
+      }
+      case SearchSuggestionType.STATE: {
+        return this.metadataRepository.getStates(auth.user.id, dto.country);
+      }
+      case SearchSuggestionType.CITY: {
+        return this.metadataRepository.getCities(auth.user.id, dto.country, dto.state);
+      }
+      case SearchSuggestionType.CAMERA_MAKE: {
+        return this.metadataRepository.getCameraMakes(auth.user.id, dto.model);
+      }
+      case SearchSuggestionType.CAMERA_MODEL: {
+        return this.metadataRepository.getCameraModels(auth.user.id, dto.make);
+      }
     }
-
-    if (dto.type === SearchSuggestionType.STATE) {
-      return this.metadataRepository.getStates(auth.user.id, dto.country);
-    }
-
-    if (dto.type === SearchSuggestionType.CITY) {
-      return this.metadataRepository.getCities(auth.user.id, dto.country, dto.state);
-    }
-
-    if (dto.type === SearchSuggestionType.CAMERA_MAKE) {
-      return this.metadataRepository.getCameraMakes(auth.user.id, dto.model);
-    }
-
-    if (dto.type === SearchSuggestionType.CAMERA_MODEL) {
-      return this.metadataRepository.getCameraModels(auth.user.id, dto.make);
-    }
-
-    return [];
   }
 }
diff --git a/web/src/lib/components/shared-components/combobox.svelte b/web/src/lib/components/shared-components/combobox.svelte
index 7c1e1f68d..80ea3b796 100644
--- a/web/src/lib/components/shared-components/combobox.svelte
+++ b/web/src/lib/components/shared-components/combobox.svelte
@@ -3,6 +3,10 @@
     label: string;
     value: string;
   };
+
+  export function toComboBoxOptions(items: string[]) {
+    return items.map<ComboBoxOption>((item) => ({ label: item, value: item }));
+  }
 </script>
 
 <script lang="ts">
diff --git a/web/src/lib/components/shared-components/search-bar/search-camera-section.svelte b/web/src/lib/components/shared-components/search-bar/search-camera-section.svelte
new file mode 100644
index 000000000..adc824aec
--- /dev/null
+++ b/web/src/lib/components/shared-components/search-bar/search-camera-section.svelte
@@ -0,0 +1,63 @@
+<script lang="ts" context="module">
+  export interface SearchCameraFilter {
+    make?: string;
+    model?: string;
+  }
+</script>
+
+<script lang="ts">
+  import { SearchSuggestionType, getSearchSuggestions } from '@immich/sdk';
+  import Combobox, { toComboBoxOptions } from '../combobox.svelte';
+
+  export let filters: SearchCameraFilter;
+
+  let makes: string[] = [];
+  let models: string[] = [];
+
+  $: makeFilter = filters.make;
+  $: modelFilter = filters.model;
+  $: updateMakes(modelFilter);
+  $: updateModels(makeFilter);
+
+  async function updateMakes(model?: string) {
+    makes = await getSearchSuggestions({
+      $type: SearchSuggestionType.CameraMake,
+      model,
+    });
+  }
+
+  async function updateModels(make?: string) {
+    models = await getSearchSuggestions({
+      $type: SearchSuggestionType.CameraModel,
+      make,
+    });
+  }
+</script>
+
+<div id="camera-selection">
+  <p class="immich-form-label">CAMERA</p>
+
+  <div class="grid grid-cols-[repeat(auto-fit,minmax(10rem,1fr))] gap-5 mt-1">
+    <div class="w-full">
+      <label class="text-sm text-black dark:text-white" for="search-camera-make">Make</label>
+      <Combobox
+        id="search-camera-make"
+        options={toComboBoxOptions(makes)}
+        selectedOption={makeFilter ? { label: makeFilter, value: makeFilter } : undefined}
+        on:select={({ detail }) => (filters.make = detail?.value)}
+        placeholder="Search camera make..."
+      />
+    </div>
+
+    <div class="w-full">
+      <label class="text-sm text-black dark:text-white" for="search-camera-model">Model</label>
+      <Combobox
+        id="search-camera-model"
+        options={toComboBoxOptions(models)}
+        selectedOption={modelFilter ? { label: modelFilter, value: modelFilter } : undefined}
+        on:select={({ detail }) => (filters.model = detail?.value)}
+        placeholder="Search camera model..."
+      />
+    </div>
+  </div>
+</div>
diff --git a/web/src/lib/components/shared-components/search-bar/search-date-section.svelte b/web/src/lib/components/shared-components/search-bar/search-date-section.svelte
new file mode 100644
index 000000000..02fa90330
--- /dev/null
+++ b/web/src/lib/components/shared-components/search-bar/search-date-section.svelte
@@ -0,0 +1,37 @@
+<script lang="ts" context="module">
+  export interface SearchDateFilter {
+    takenBefore?: string;
+    takenAfter?: string;
+  }
+</script>
+
+<script lang="ts">
+  export let filters: SearchDateFilter;
+</script>
+
+<div id="date-range-selection" class="grid grid-cols-[repeat(auto-fit,minmax(10rem,1fr))] gap-5">
+  <label class="immich-form-label" for="start-date">
+    <span>START DATE</span>
+    <input
+      class="immich-form-input w-full mt-1 hover:cursor-pointer"
+      type="date"
+      id="start-date"
+      name="start-date"
+      max={filters.takenBefore}
+      bind:value={filters.takenAfter}
+    />
+  </label>
+
+  <label class="immich-form-label" for="end-date">
+    <span>END DATE</span>
+    <input
+      class="immich-form-input w-full mt-1 hover:cursor-pointer"
+      type="date"
+      id="end-date"
+      name="end-date"
+      placeholder=""
+      min={filters.takenAfter}
+      bind:value={filters.takenBefore}
+    />
+  </label>
+</div>
diff --git a/web/src/lib/components/shared-components/search-bar/search-display-section.svelte b/web/src/lib/components/shared-components/search-bar/search-display-section.svelte
new file mode 100644
index 000000000..49a2dd56d
--- /dev/null
+++ b/web/src/lib/components/shared-components/search-bar/search-display-section.svelte
@@ -0,0 +1,32 @@
+<script lang="ts" context="module">
+  export interface SearchDisplayFilters {
+    isNotInAlbum?: boolean;
+    isArchive?: boolean;
+    isFavorite?: boolean;
+  }
+</script>
+
+<script lang="ts">
+  export let filters: SearchDisplayFilters;
+</script>
+
+<div id="display-options-selection" class="text-sm">
+  <p class="immich-form-label">DISPLAY OPTIONS</p>
+
+  <div class="flex flex-wrap gap-x-5 gap-y-2 mt-1">
+    <label class="flex items-center gap-2">
+      <input type="checkbox" class="size-5 flex-shrink-0" bind:checked={filters.isNotInAlbum} />
+      <span class="pt-1">Not in any album</span>
+    </label>
+
+    <label class="flex items-center gap-2">
+      <input type="checkbox" class="size-5 flex-shrink-0" bind:checked={filters.isArchive} />
+      <span class="pt-1">Archive</span>
+    </label>
+
+    <label class="flex items-center gap-2">
+      <input type="checkbox" class="size-5 flex-shrink-0" bind:checked={filters.isFavorite} />
+      <span class="pt-1">Favorite</span>
+    </label>
+  </div>
+</div>
diff --git a/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte b/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte
index 1be3c9560..eb7cc0d87 100644
--- a/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte
+++ b/web/src/lib/components/shared-components/search-bar/search-filter-box.svelte
@@ -1,242 +1,97 @@
-<script lang="ts">
-  import ImageThumbnail from '$lib/components/assets/thumbnail/image-thumbnail.svelte';
-  import Button from '$lib/components/elements/buttons/button.svelte';
-  import Icon from '$lib/components/elements/icon.svelte';
-  import { getPeopleThumbnailUrl } from '$lib/utils';
-  import { handleError } from '$lib/utils/handle-error';
-  import {
-    AssetTypeEnum,
-    SearchSuggestionType,
-    type PersonResponseDto,
-    type SmartSearchDto,
-    type MetadataSearchDto,
-  } from '@immich/sdk';
-  import { getAllPeople, getSearchSuggestions } from '@immich/sdk';
-  import { mdiArrowRight, mdiClose } from '@mdi/js';
-  import { createEventDispatcher, onMount } from 'svelte';
-  import { fly } from 'svelte/transition';
-  import Combobox, { type ComboBoxOption } from '../combobox.svelte';
-  import { parseUtcDate } from '$lib/utils/date-time';
+<script lang="ts" context="module">
+  import type { SearchLocationFilter } from './search-location-section.svelte';
+  import type { SearchDisplayFilters } from './search-display-section.svelte';
+  import type { SearchDateFilter } from './search-date-section.svelte';
 
-  enum MediaType {
+  export enum MediaType {
     All = 'all',
     Image = 'image',
     Video = 'video',
   }
 
-  type SearchSuggestion = {
-    people: PersonResponseDto[];
-    country: ComboBoxOption[];
-    state: ComboBoxOption[];
-    city: ComboBoxOption[];
-    make: ComboBoxOption[];
-    model: ComboBoxOption[];
-  };
-
-  type SearchParams = {
-    state?: string;
-    country?: string;
-    city?: string;
-    cameraMake?: string;
-    cameraModel?: string;
-  };
-
-  type SearchFilter = {
+  export type SearchFilter = {
     context?: string;
-    people: (PersonResponseDto | Pick<PersonResponseDto, 'id'>)[];
-
-    location: {
-      country?: ComboBoxOption;
-      state?: ComboBoxOption;
-      city?: ComboBoxOption;
-    };
-
-    camera: {
-      make?: ComboBoxOption;
-      model?: ComboBoxOption;
-    };
-
-    date: {
-      takenAfter?: string;
-      takenBefore?: string;
-    };
-
-    isArchive?: boolean;
-    isFavorite?: boolean;
-    isNotInAlbum?: boolean;
-
+    personIds: Set<string>;
+    location: SearchLocationFilter;
+    camera: SearchCameraFilter;
+    date: SearchDateFilter;
+    display: SearchDisplayFilters;
     mediaType: MediaType;
   };
+</script>
+
+<script lang="ts">
+  import Button from '$lib/components/elements/buttons/button.svelte';
+  import { handleError } from '$lib/utils/handle-error';
+  import { AssetTypeEnum, type SmartSearchDto, type MetadataSearchDto } from '@immich/sdk';
+  import { createEventDispatcher } from 'svelte';
+  import { fly } from 'svelte/transition';
+  import SearchPeopleSection from './search-people-section.svelte';
+  import SearchLocationSection from './search-location-section.svelte';
+  import SearchCameraSection, { type SearchCameraFilter } from './search-camera-section.svelte';
+  import SearchDateSection from './search-date-section.svelte';
+  import SearchMediaSection from './search-media-section.svelte';
+  import { parseUtcDate } from '$lib/utils/date-time';
+  import SearchDisplaySection from './search-display-section.svelte';
 
   export let searchQuery: MetadataSearchDto | SmartSearchDto;
 
-  let suggestions: SearchSuggestion = {
-    people: [],
-    country: [],
-    state: [],
-    city: [],
-    make: [],
-    model: [],
-  };
+  const parseOptionalDate = (dateString?: string) => (dateString ? parseUtcDate(dateString) : undefined);
+  const toStartOfDayDate = (dateString: string) => parseUtcDate(dateString)?.startOf('day').toISODate() || undefined;
+  const dispatch = createEventDispatcher<{ search: SmartSearchDto | MetadataSearchDto }>();
 
   let filter: SearchFilter = {
-    context: undefined,
-    people: [],
+    context: 'query' in searchQuery ? searchQuery.query : '',
+    personIds: new Set('personIds' in searchQuery ? searchQuery.personIds : []),
     location: {
-      country: undefined,
-      state: undefined,
-      city: undefined,
+      country: searchQuery.country,
+      state: searchQuery.state,
+      city: searchQuery.city,
     },
     camera: {
-      make: undefined,
-      model: undefined,
+      make: searchQuery.make,
+      model: searchQuery.model,
     },
     date: {
-      takenAfter: undefined,
-      takenBefore: undefined,
+      takenAfter: searchQuery.takenAfter ? toStartOfDayDate(searchQuery.takenAfter) : undefined,
+      takenBefore: searchQuery.takenBefore ? toStartOfDayDate(searchQuery.takenBefore) : undefined,
     },
-    isArchive: undefined,
-    isFavorite: undefined,
-    isNotInAlbum: undefined,
-    mediaType: MediaType.All,
+    display: {
+      isArchive: searchQuery.isArchived,
+      isFavorite: searchQuery.isFavorite,
+      isNotInAlbum: 'isNotInAlbum' in searchQuery ? searchQuery.isNotInAlbum : undefined,
+    },
+    mediaType:
+      searchQuery.type === AssetTypeEnum.Image
+        ? MediaType.Image
+        : searchQuery.type === AssetTypeEnum.Video
+          ? MediaType.Video
+          : MediaType.All,
   };
 
-  const dispatch = createEventDispatcher<{ search: SmartSearchDto | MetadataSearchDto }>();
-  let showAllPeople = false;
-
   let filterBoxWidth = 0;
-  $: numberOfPeople = (filterBoxWidth - 80) / 85;
-  $: peopleList = showAllPeople ? suggestions.people : suggestions.people.slice(0, numberOfPeople);
-
-  onMount(() => {
-    getPeople();
-    populateExistingFilters();
-  });
-
-  function orderBySelectedPeopleFirst<T extends Pick<PersonResponseDto, 'id'>>(people: T[]) {
-    return people.sort((a, _) => {
-      if (filter.people.some((p) => p.id === a.id)) {
-        return -1;
-      }
-      return 1;
-    });
-  }
-
-  const getPeople = async () => {
-    try {
-      const { people } = await getAllPeople({ withHidden: false });
-      suggestions.people = orderBySelectedPeopleFirst(people);
-    } catch (error) {
-      handleError(error, 'Failed to get people');
-    }
-  };
-
-  const handlePeopleSelection = (id: string) => {
-    if (filter.people.some((p) => p.id === id)) {
-      filter.people = filter.people.filter((p) => p.id !== id);
-      return;
-    }
-
-    const person = suggestions.people.find((p) => p.id === id);
-    if (person) {
-      filter.people = [...filter.people, person];
-    }
-  };
-
-  const updateSuggestion = async (type: SearchSuggestionType, params: SearchParams) => {
-    if (
-      type === SearchSuggestionType.City ||
-      type === SearchSuggestionType.State ||
-      type === SearchSuggestionType.Country
-    ) {
-      suggestions = { ...suggestions, city: [], state: [], country: [] };
-    }
-
-    if (type === SearchSuggestionType.CameraMake || type === SearchSuggestionType.CameraModel) {
-      suggestions = { ...suggestions, make: [], model: [] };
-    }
-
-    try {
-      const data = await getSearchSuggestions({
-        $type: type,
-        country: params.country,
-        state: params.state,
-        make: params.cameraMake,
-        model: params.cameraModel,
-      });
-
-      switch (type) {
-        case SearchSuggestionType.Country: {
-          for (const country of data) {
-            suggestions.country = [...suggestions.country, { label: country, value: country }];
-          }
-          break;
-        }
-
-        case SearchSuggestionType.State: {
-          for (const state of data) {
-            suggestions.state = [...suggestions.state, { label: state, value: state }];
-          }
-
-          break;
-        }
-
-        case SearchSuggestionType.City: {
-          for (const city of data) {
-            suggestions.city = [...suggestions.city, { label: city, value: city }];
-          }
-          break;
-        }
-
-        case SearchSuggestionType.CameraMake: {
-          for (const make of data) {
-            suggestions.make = [...suggestions.make, { label: make, value: make }];
-          }
-          break;
-        }
-
-        case SearchSuggestionType.CameraModel: {
-          for (const model of data) {
-            suggestions.model = [...suggestions.model, { label: model, value: model }];
-          }
-          break;
-        }
-      }
-    } catch (error) {
-      handleError(error, 'Failed to get search suggestions');
-    }
-  };
 
   const resetForm = () => {
     filter = {
-      context: undefined,
-      people: [],
-      location: {
-        country: undefined,
-        state: undefined,
-        city: undefined,
-      },
-      camera: {
-        make: undefined,
-        model: undefined,
-      },
-      date: {
-        takenAfter: undefined,
-        takenBefore: undefined,
-      },
-      isArchive: undefined,
-      isFavorite: undefined,
-      isNotInAlbum: undefined,
+      personIds: new Set(),
+      location: {},
+      camera: {},
+      date: {},
+      display: {},
       mediaType: MediaType.All,
     };
   };
 
-  const parseOptionalDate = (dateString?: string) => (dateString ? parseUtcDate(dateString) : undefined);
-  const toStartOfDayDate = (dateString: string) => parseUtcDate(dateString)?.startOf('day').toISODate() || undefined;
-
   const search = async () => {
-    let type: AssetTypeEnum | undefined = undefined;
+    if (filter.context && filter.personIds.size > 0) {
+      handleError(
+        new Error('Context search does not support people filter'),
+        'Context search does not support people filter',
+      );
+      return;
+    }
 
+    let type: AssetTypeEnum | undefined = undefined;
     if (filter.mediaType === MediaType.Image) {
       type = AssetTypeEnum.Image;
     } else if (filter.mediaType === MediaType.Video) {
@@ -244,70 +99,23 @@
     }
 
     let payload: SmartSearchDto | MetadataSearchDto = {
-      country: filter.location.country?.value,
-      state: filter.location.state?.value,
-      city: filter.location.city?.value,
-      make: filter.camera.make?.value,
-      model: filter.camera.model?.value,
+      query: filter.context || undefined,
+      country: filter.location.country,
+      state: filter.location.state,
+      city: filter.location.city,
+      make: filter.camera.make,
+      model: filter.camera.model,
       takenAfter: parseOptionalDate(filter.date.takenAfter)?.startOf('day').toISO() || undefined,
       takenBefore: parseOptionalDate(filter.date.takenBefore)?.endOf('day').toISO() || undefined,
-      isArchived: filter.isArchive || undefined,
-      isFavorite: filter.isFavorite || undefined,
-      isNotInAlbum: filter.isNotInAlbum || undefined,
-      personIds: filter.people && filter.people.length > 0 ? filter.people.map((p) => p.id) : undefined,
+      isArchived: filter.display.isArchive || undefined,
+      isFavorite: filter.display.isFavorite || undefined,
+      isNotInAlbum: filter.display.isNotInAlbum || undefined,
+      personIds: filter.personIds.size > 0 ? [...filter.personIds] : undefined,
       type,
     };
 
-    if (filter.context) {
-      if (payload.personIds && payload.personIds.length > 0) {
-        handleError(
-          new Error('Context search does not support people filter'),
-          'Context search does not support people filter',
-        );
-        return;
-      }
-
-      payload = {
-        ...payload,
-        query: filter.context,
-      };
-    }
-
     dispatch('search', payload);
   };
-
-  function populateExistingFilters() {
-    if (searchQuery) {
-      const personIds = 'personIds' in searchQuery && searchQuery.personIds ? searchQuery.personIds : [];
-
-      filter = {
-        context: 'query' in searchQuery ? searchQuery.query : '',
-        people: orderBySelectedPeopleFirst(personIds.map((id) => ({ id }))),
-        location: {
-          country: searchQuery.country ? { label: searchQuery.country, value: searchQuery.country } : undefined,
-          state: searchQuery.state ? { label: searchQuery.state, value: searchQuery.state } : undefined,
-          city: searchQuery.city ? { label: searchQuery.city, value: searchQuery.city } : undefined,
-        },
-        camera: {
-          make: searchQuery.make ? { label: searchQuery.make, value: searchQuery.make } : undefined,
-          model: searchQuery.model ? { label: searchQuery.model, value: searchQuery.model } : undefined,
-        },
-        date: {
-          takenAfter: searchQuery.takenAfter ? toStartOfDayDate(searchQuery.takenAfter) : undefined,
-          takenBefore: searchQuery.takenBefore ? toStartOfDayDate(searchQuery.takenBefore) : undefined,
-        },
-        isArchive: searchQuery.isArchived,
-        isFavorite: searchQuery.isFavorite,
-        isNotInAlbum: 'isNotInAlbum' in searchQuery ? searchQuery.isNotInAlbum : undefined,
-        mediaType:
-          searchQuery.type === AssetTypeEnum.Image
-            ? MediaType.Image
-            : searchQuery.type === AssetTypeEnum.Video
-              ? MediaType.Video
-              : MediaType.All,
-      };
-    }
-  }
 </script>
 
 <div
@@ -323,55 +131,7 @@
   >
     <div class="px-4 sm:px-6 py-4 space-y-10 max-h-[calc(100dvh-12rem)] overflow-y-auto immich-scrollbar">
       <!-- PEOPLE -->
-      {#if suggestions.people.length > 0}
-        <div id="people-selection" class="-mb-4">
-          <div class="flex items-center gap-6">
-            <p class="immich-form-label">PEOPLE</p>
-          </div>
-
-          <div class="flex -mx-1 max-h-64 gap-1 mt-2 flex-wrap overflow-y-auto immich-scrollbar">
-            {#each peopleList as person (person.id)}
-              <button
-                type="button"
-                class="w-20 text-center rounded-3xl border-2 border-transparent hover:bg-immich-gray dark:hover:bg-immich-dark-primary/20 p-2 transition-all {filter.people.some(
-                  (p) => p.id === person.id,
-                )
-                  ? 'dark:border-slate-500 border-slate-400 bg-slate-200 dark:bg-slate-800 dark:text-white'
-                  : ''}"
-                on:click={() => handlePeopleSelection(person.id)}
-              >
-                <ImageThumbnail
-                  circle
-                  shadow
-                  url={getPeopleThumbnailUrl(person.id)}
-                  altText={person.name}
-                  widthStyle="100%"
-                />
-                <p class="mt-2 line-clamp-2 text-sm font-medium dark:text-white">{person.name}</p>
-              </button>
-            {/each}
-          </div>
-
-          {#if showAllPeople || suggestions.people.length > peopleList.length}
-            <div class="flex justify-center mt-2">
-              <Button
-                shadow={false}
-                color="text-primary"
-                class="flex gap-2 place-items-center"
-                on:click={() => (showAllPeople = !showAllPeople)}
-              >
-                {#if showAllPeople}
-                  <span><Icon path={mdiClose} /></span>
-                  Collapse
-                {:else}
-                  <span><Icon path={mdiArrowRight} /></span>
-                  See all people
-                {/if}
-              </Button>
-            </div>
-          {/if}
-        </div>
-      {/if}
+      <SearchPeopleSection width={filterBoxWidth} bind:selectedPeople={filter.personIds} />
 
       <!-- CONTEXT -->
       <div>
@@ -389,173 +149,20 @@
       </div>
 
       <!-- LOCATION -->
-      <div id="location-selection">
-        <p class="immich-form-label">PLACE</p>
-
-        <div class="grid grid-cols-[repeat(auto-fit,minmax(10rem,1fr))] gap-5 mt-1">
-          <div class="w-full">
-            <label class="text-sm text-black dark:text-white" for="search-place-country">Country</label>
-            <Combobox
-              id="search-place-country"
-              options={suggestions.country}
-              bind:selectedOption={filter.location.country}
-              placeholder="Search country..."
-              on:click={() => updateSuggestion(SearchSuggestionType.Country, {})}
-            />
-          </div>
-
-          <div class="w-full">
-            <label class="text-sm text-black dark:text-white" for="search-place-state">State</label>
-            <Combobox
-              id="search-place-state"
-              options={suggestions.state}
-              bind:selectedOption={filter.location.state}
-              placeholder="Search state..."
-              on:click={() => updateSuggestion(SearchSuggestionType.State, { country: filter.location.country?.value })}
-            />
-          </div>
-
-          <div class="w-full">
-            <label class="text-sm text-black dark:text-white" for="search-place-city">City</label>
-            <Combobox
-              id="search-place-city"
-              options={suggestions.city}
-              bind:selectedOption={filter.location.city}
-              placeholder="Search city..."
-              on:click={() =>
-                updateSuggestion(SearchSuggestionType.City, {
-                  country: filter.location.country?.value,
-                  state: filter.location.state?.value,
-                })}
-            />
-          </div>
-        </div>
-      </div>
+      <SearchLocationSection bind:filters={filter.location} />
 
       <!-- CAMERA MODEL -->
-      <div id="camera-selection">
-        <p class="immich-form-label">CAMERA</p>
-
-        <div class="grid grid-cols-[repeat(auto-fit,minmax(10rem,1fr))] gap-5 mt-1">
-          <div class="w-full">
-            <label class="text-sm text-black dark:text-white" for="search-camera-make">Make</label>
-            <Combobox
-              id="search-camera-make"
-              options={suggestions.make}
-              bind:selectedOption={filter.camera.make}
-              placeholder="Search camera make..."
-              on:click={() =>
-                updateSuggestion(SearchSuggestionType.CameraMake, { cameraModel: filter.camera.model?.value })}
-            />
-          </div>
-
-          <div class="w-full">
-            <label class="text-sm text-black dark:text-white" for="search-camera-model">Model</label>
-            <Combobox
-              id="search-camera-model"
-              options={suggestions.model}
-              bind:selectedOption={filter.camera.model}
-              placeholder="Search camera model..."
-              on:click={() =>
-                updateSuggestion(SearchSuggestionType.CameraModel, { cameraMake: filter.camera.make?.value })}
-            />
-          </div>
-        </div>
-      </div>
+      <SearchCameraSection bind:filters={filter.camera} />
 
       <!-- DATE RANGE -->
-      <div id="date-range-selection" class="grid grid-cols-[repeat(auto-fit,minmax(10rem,1fr))] gap-5">
-        <label class="immich-form-label" for="start-date">
-          <span>START DATE</span>
-          <input
-            class="immich-form-input w-full mt-1 hover:cursor-pointer"
-            type="date"
-            id="start-date"
-            name="start-date"
-            max={filter.date.takenBefore}
-            bind:value={filter.date.takenAfter}
-          />
-        </label>
-
-        <label class="immich-form-label" for="end-date">
-          <span>END DATE</span>
-          <input
-            class="immich-form-input w-full mt-1 hover:cursor-pointer"
-            type="date"
-            id="end-date"
-            name="end-date"
-            placeholder=""
-            min={filter.date.takenAfter}
-            bind:value={filter.date.takenBefore}
-          />
-        </label>
-      </div>
+      <SearchDateSection bind:filters={filter.date} />
 
       <div class="grid md:grid-cols-2 gap-x-5 gap-y-8">
         <!-- MEDIA TYPE -->
-        <div id="media-type-selection">
-          <p class="immich-form-label">MEDIA TYPE</p>
-
-          <div class="flex gap-5 mt-1 text-base">
-            <label for="type-all" class="flex items-center gap-1">
-              <input
-                bind:group={filter.mediaType}
-                value={MediaType.All}
-                type="radio"
-                name="radio-type"
-                id="type-all"
-                class="size-4"
-              />
-              <span class="pt-0.5">All</span>
-            </label>
-
-            <label for="type-image" class="flex items-center gap-1">
-              <input
-                bind:group={filter.mediaType}
-                value={MediaType.Image}
-                type="radio"
-                name="media-type"
-                id="type-image"
-                class="size-4"
-              />
-              <span class="pt-0.5">Image</span>
-            </label>
-
-            <label for="type-video" class="flex items-center gap-1">
-              <input
-                bind:group={filter.mediaType}
-                value={MediaType.Video}
-                type="radio"
-                name="radio-type"
-                id="type-video"
-                class="size-4"
-              />
-              <span class="pt-0.5">Video</span>
-            </label>
-          </div>
-        </div>
+        <SearchMediaSection bind:filteredMedia={filter.mediaType} />
 
         <!-- DISPLAY OPTIONS -->
-        <div id="display-options-selection" class="text-sm">
-          <p class="immich-form-label">DISPLAY OPTIONS</p>
-
-          <div class="flex flex-wrap gap-x-5 gap-y-2 mt-1">
-            <label class="flex items-center gap-2">
-              <input type="checkbox" class="size-5 flex-shrink-0" bind:checked={filter.isNotInAlbum} />
-              <span class="pt-1">Not in any album</span>
-            </label>
-
-            <label class="flex items-center gap-2">
-              <input type="checkbox" class="size-5 flex-shrink-0" bind:checked={filter.isArchive} />
-              <span class="pt-1">Archive</span>
-            </label>
-
-            <label class="flex items-center gap-2">
-              <input type="checkbox" class="size-5 flex-shrink-0" bind:checked={filter.isFavorite} />
-              <span class="pt-1">Favorite</span>
-            </label>
-          </div>
-        </div>
+        <SearchDisplaySection bind:filters={filter.display} />
       </div>
     </div>
 
diff --git a/web/src/lib/components/shared-components/search-bar/search-location-section.svelte b/web/src/lib/components/shared-components/search-bar/search-location-section.svelte
new file mode 100644
index 000000000..2a713e9a0
--- /dev/null
+++ b/web/src/lib/components/shared-components/search-bar/search-location-section.svelte
@@ -0,0 +1,96 @@
+<script lang="ts" context="module">
+  export interface SearchLocationFilter {
+    country?: string;
+    state?: string;
+    city?: string;
+  }
+</script>
+
+<script lang="ts">
+  import { getSearchSuggestions, SearchSuggestionType } from '@immich/sdk';
+  import Combobox, { toComboBoxOptions } from '../combobox.svelte';
+
+  export let filters: SearchLocationFilter;
+
+  let countries: string[] = [];
+  let states: string[] = [];
+  let cities: string[] = [];
+
+  $: countryFilter = filters.country;
+  $: stateFilter = filters.state;
+  $: updateCountries();
+  $: updateStates(countryFilter);
+  $: updateCities(countryFilter, stateFilter);
+
+  async function updateCountries() {
+    countries = await getSearchSuggestions({
+      $type: SearchSuggestionType.Country,
+    });
+
+    if (filters.country && !countries.includes(filters.country)) {
+      filters.country = undefined;
+    }
+  }
+
+  async function updateStates(country?: string) {
+    states = await getSearchSuggestions({
+      $type: SearchSuggestionType.State,
+      country,
+    });
+
+    if (filters.state && !states.includes(filters.state)) {
+      filters.state = undefined;
+    }
+  }
+
+  async function updateCities(country?: string, state?: string) {
+    cities = await getSearchSuggestions({
+      $type: SearchSuggestionType.City,
+      country,
+      state,
+    });
+
+    if (filters.city && !cities.includes(filters.city)) {
+      filters.city = undefined;
+    }
+  }
+</script>
+
+<div id="location-selection">
+  <p class="immich-form-label">PLACE</p>
+
+  <div class="grid grid-cols-[repeat(auto-fit,minmax(10rem,1fr))] gap-5 mt-1">
+    <div class="w-full">
+      <label class="text-sm text-black dark:text-white" for="search-place-country">Country</label>
+      <Combobox
+        id="search-place-country"
+        options={toComboBoxOptions(countries)}
+        selectedOption={filters.country ? { label: filters.country, value: filters.country } : undefined}
+        on:select={({ detail }) => (filters.country = detail?.value)}
+        placeholder="Search country..."
+      />
+    </div>
+
+    <div class="w-full">
+      <label class="text-sm text-black dark:text-white" for="search-place-state">State</label>
+      <Combobox
+        id="search-place-state"
+        options={toComboBoxOptions(states)}
+        selectedOption={filters.state ? { label: filters.state, value: filters.state } : undefined}
+        on:select={({ detail }) => (filters.state = detail?.value)}
+        placeholder="Search state..."
+      />
+    </div>
+
+    <div class="w-full">
+      <label class="text-sm text-black dark:text-white" for="search-place-city">City</label>
+      <Combobox
+        id="search-place-city"
+        options={toComboBoxOptions(cities)}
+        selectedOption={filters.city ? { label: filters.city, value: filters.city } : undefined}
+        on:select={({ detail }) => (filters.city = detail?.value)}
+        placeholder="Search city..."
+      />
+    </div>
+  </div>
+</div>
diff --git a/web/src/lib/components/shared-components/search-bar/search-media-section.svelte b/web/src/lib/components/shared-components/search-bar/search-media-section.svelte
new file mode 100644
index 000000000..a050d6adc
--- /dev/null
+++ b/web/src/lib/components/shared-components/search-bar/search-media-section.svelte
@@ -0,0 +1,47 @@
+<script lang="ts">
+  import { MediaType } from './search-filter-box.svelte';
+
+  export let filteredMedia: MediaType;
+</script>
+
+<div id="media-type-selection">
+  <p class="immich-form-label">MEDIA TYPE</p>
+
+  <div class="flex gap-5 mt-1 text-base">
+    <label for="type-all" class="flex items-center gap-1">
+      <input
+        bind:group={filteredMedia}
+        value={MediaType.All}
+        type="radio"
+        name="radio-type"
+        id="type-all"
+        class="size-4"
+      />
+      <span class="pt-0.5">All</span>
+    </label>
+
+    <label for="type-image" class="flex items-center gap-1">
+      <input
+        bind:group={filteredMedia}
+        value={MediaType.Image}
+        type="radio"
+        name="media-type"
+        id="type-image"
+        class="size-4"
+      />
+      <span class="pt-0.5">Image</span>
+    </label>
+
+    <label for="type-video" class="flex items-center gap-1">
+      <input
+        bind:group={filteredMedia}
+        value={MediaType.Video}
+        type="radio"
+        name="radio-type"
+        id="type-video"
+        class="size-4"
+      />
+      <span class="pt-0.5">Video</span>
+    </label>
+  </div>
+</div>
diff --git a/web/src/lib/components/shared-components/search-bar/search-people-section.svelte b/web/src/lib/components/shared-components/search-bar/search-people-section.svelte
new file mode 100644
index 000000000..6db71e2ae
--- /dev/null
+++ b/web/src/lib/components/shared-components/search-bar/search-people-section.svelte
@@ -0,0 +1,95 @@
+<script lang="ts">
+  import ImageThumbnail from '$lib/components/assets/thumbnail/image-thumbnail.svelte';
+  import Button from '$lib/components/elements/buttons/button.svelte';
+  import Icon from '$lib/components/elements/icon.svelte';
+  import { getPeopleThumbnailUrl } from '$lib/utils';
+  import { getAllPeople, type PersonResponseDto } from '@immich/sdk';
+  import { mdiClose, mdiArrowRight } from '@mdi/js';
+  import { handleError } from '$lib/utils/handle-error';
+
+  export let width: number;
+  export let selectedPeople: Set<string>;
+
+  let peoplePromise = getPeople();
+  let showAllPeople = false;
+  $: numberOfPeople = (width - 80) / 85;
+
+  function orderBySelectedPeopleFirst(people: PersonResponseDto[]) {
+    return [
+      ...people.filter((p) => selectedPeople.has(p.id)), //
+      ...people.filter((p) => !selectedPeople.has(p.id)),
+    ];
+  }
+
+  async function getPeople() {
+    try {
+      const res = await getAllPeople({ withHidden: false });
+      return orderBySelectedPeopleFirst(res.people);
+    } catch (error) {
+      handleError(error, 'Failed to get people');
+    }
+  }
+
+  function togglePersonSelection(id: string) {
+    if (selectedPeople.has(id)) {
+      selectedPeople.delete(id);
+    } else {
+      selectedPeople.add(id);
+    }
+    selectedPeople = selectedPeople;
+  }
+</script>
+
+{#await peoplePromise then people}
+  {#if people && people.length > 0}
+    {@const peopleList = showAllPeople ? people : people.slice(0, numberOfPeople)}
+
+    <div id="people-selection" class="-mb-4">
+      <div class="flex items-center gap-6">
+        <p class="immich-form-label">PEOPLE</p>
+      </div>
+
+      <div class="flex -mx-1 max-h-64 gap-1 mt-2 flex-wrap overflow-y-auto immich-scrollbar">
+        {#each peopleList as person (person.id)}
+          <button
+            type="button"
+            class="w-20 text-center rounded-3xl border-2 border-transparent hover:bg-immich-gray dark:hover:bg-immich-dark-primary/20 p-2 transition-all {selectedPeople.has(
+              person.id,
+            )
+              ? 'dark:border-slate-500 border-slate-400 bg-slate-200 dark:bg-slate-800 dark:text-white'
+              : ''}"
+            on:click={() => togglePersonSelection(person.id)}
+          >
+            <ImageThumbnail
+              circle
+              shadow
+              url={getPeopleThumbnailUrl(person.id)}
+              altText={person.name}
+              widthStyle="100%"
+            />
+            <p class="mt-2 line-clamp-2 text-sm font-medium dark:text-white">{person.name}</p>
+          </button>
+        {/each}
+      </div>
+
+      {#if showAllPeople || people.length > peopleList.length}
+        <div class="flex justify-center mt-2">
+          <Button
+            shadow={false}
+            color="text-primary"
+            class="flex gap-2 place-items-center"
+            on:click={() => (showAllPeople = !showAllPeople)}
+          >
+            {#if showAllPeople}
+              <span><Icon path={mdiClose} /></span>
+              Collapse
+            {:else}
+              <span><Icon path={mdiArrowRight} /></span>
+              See all people
+            {/if}
+          </Button>
+        </div>
+      {/if}
+    </div>
+  {/if}
+{/await}

From 8a05ff51e953d5b1a2b06580a08bf8a075fae357 Mon Sep 17 00:00:00 2001
From: martin <74269598+martabal@users.noreply.github.com>
Date: Mon, 26 Feb 2024 22:58:52 +0100
Subject: [PATCH 22/28] fix(web): count hidden people (#7417)

fix: count hidden people
---
 .../lib/components/faces-page/merge-suggestion-modal.svelte   | 2 +-
 web/src/routes/(user)/people/+page.svelte                     | 4 +++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/web/src/lib/components/faces-page/merge-suggestion-modal.svelte b/web/src/lib/components/faces-page/merge-suggestion-modal.svelte
index 892ec6908..f2ff4c581 100644
--- a/web/src/lib/components/faces-page/merge-suggestion-modal.svelte
+++ b/web/src/lib/components/faces-page/merge-suggestion-modal.svelte
@@ -100,7 +100,7 @@
               <div class="flex flex-wrap justify-center md:grid md:grid-cols-{potentialMergePeople.length}">
                 {#each potentialMergePeople as person (person.id)}
                   <div class="h-24 w-24 md:h-28 md:w-28">
-                    <button class="p-2" on:click={() => changePersonToMerge(person)}>
+                    <button class="p-2 w-full" on:click={() => changePersonToMerge(person)}>
                       <ImageThumbnail
                         border={true}
                         circle
diff --git a/web/src/routes/(user)/people/+page.svelte b/web/src/routes/(user)/people/+page.svelte
index 100c3e625..1372d254b 100644
--- a/web/src/routes/(user)/people/+page.svelte
+++ b/web/src/routes/(user)/people/+page.svelte
@@ -212,7 +212,9 @@
 
       people = people.filter((person: PersonResponseDto) => person.id !== personToMerge.id);
       people = people.map((person: PersonResponseDto) => (person.id === personToBeMergedIn.id ? mergedPerson : person));
-      countHiddenPeople--;
+      if (personToMerge.isHidden) {
+        countHiddenPeople--;
+      }
       countTotalPeople--;
       notificationController.show({
         message: 'Merge people successfully',

From c8bdeb8fec3fd0dd1fff841ee5c6499898a6dfe3 Mon Sep 17 00:00:00 2001
From: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>
Date: Tue, 27 Feb 2024 03:48:47 +0100
Subject: [PATCH 23/28] fix(web): fetch error reporting (#7391)

---
 open-api/typescript-sdk/fetch-errors.ts | 15 ++++++++++++
 open-api/typescript-sdk/fetch.ts        |  1 +
 web/src/hooks.client.ts                 | 32 ++++++++-----------------
 web/src/lib/utils/handle-error.ts       | 27 +++++++++++++--------
 4 files changed, 43 insertions(+), 32 deletions(-)
 create mode 100644 open-api/typescript-sdk/fetch-errors.ts

diff --git a/open-api/typescript-sdk/fetch-errors.ts b/open-api/typescript-sdk/fetch-errors.ts
new file mode 100644
index 000000000..f21f0ed1c
--- /dev/null
+++ b/open-api/typescript-sdk/fetch-errors.ts
@@ -0,0 +1,15 @@
+import { HttpError } from '@oazapfts/runtime';
+
+export interface ApiExceptionResponse {
+  message: string;
+  error?: string;
+  statusCode: number;
+}
+
+export interface ApiHttpError extends HttpError {
+  data: ApiExceptionResponse;
+}
+
+export function isHttpError(error: unknown): error is ApiHttpError {
+  return error instanceof HttpError;
+}
diff --git a/open-api/typescript-sdk/fetch.ts b/open-api/typescript-sdk/fetch.ts
index 5441cd826..5759e66ad 100644
--- a/open-api/typescript-sdk/fetch.ts
+++ b/open-api/typescript-sdk/fetch.ts
@@ -1 +1,2 @@
 export * from './fetch-client';
+export * from './fetch-errors';
diff --git a/web/src/hooks.client.ts b/web/src/hooks.client.ts
index 1e29371fa..802e9a712 100644
--- a/web/src/hooks.client.ts
+++ b/web/src/hooks.client.ts
@@ -1,34 +1,22 @@
+import { isHttpError } from '@immich/sdk';
 import type { HandleClientError } from '@sveltejs/kit';
-import type { AxiosError, AxiosResponse } from 'axios';
 
 const LOG_PREFIX = '[hooks.client.ts]';
 const DEFAULT_MESSAGE = 'Hmm, not sure about that. Check the logs or open a ticket?';
 
 const parseError = (error: unknown) => {
-  const httpError = error as AxiosError;
-  const request = httpError?.request as Request & { path: string };
-  const response = httpError?.response as AxiosResponse<{
-    message: string;
-    statusCode: number;
-    error: string;
-  }>;
+  const httpError = isHttpError(error) ? error : undefined;
+  const statusCode = httpError?.status || httpError?.data?.statusCode || 500;
+  const message = httpError?.data?.message || (httpError?.data && String(httpError.data)) || httpError?.message;
 
-  let code = response?.data?.statusCode || response?.status || httpError.code || '500';
-  if (response) {
-    code += ` - ${response.data?.error || response.statusText}`;
-  }
-
-  if (request && response) {
-    console.log({
-      status: response.status,
-      url: `${request.method} ${request.path}`,
-      response: response.data || 'No data',
-    });
-  }
+  console.log({
+    status: statusCode,
+    response: httpError?.data || 'No data',
+  });
 
   return {
-    message: response?.data?.message || httpError?.message || DEFAULT_MESSAGE,
-    code,
+    message: message || DEFAULT_MESSAGE,
+    code: statusCode,
     stack: httpError?.stack,
   };
 };
diff --git a/web/src/lib/utils/handle-error.ts b/web/src/lib/utils/handle-error.ts
index 3337dbb47..23727e411 100644
--- a/web/src/lib/utils/handle-error.ts
+++ b/web/src/lib/utils/handle-error.ts
@@ -1,18 +1,25 @@
-import type { HttpError } from '@sveltejs/kit';
+import { isHttpError } from '@immich/sdk';
+import { isAxiosError } from 'axios';
 import { notificationController, NotificationType } from '../components/shared-components/notification/notification';
 
 export async function getServerErrorMessage(error: unknown) {
-  let data = (error as HttpError)?.body;
-  if (data instanceof Blob) {
-    const response = await data.text();
-    try {
-      data = JSON.parse(response);
-    } catch {
-      data = { message: response };
-    }
+  if (isHttpError(error)) {
+    return error.data?.message || error.data;
   }
 
-  return data?.message || null;
+  if (isAxiosError(error)) {
+    let data = error.response?.data;
+    if (data instanceof Blob) {
+      const response = await data.text();
+      try {
+        data = JSON.parse(response);
+      } catch {
+        data = { message: response };
+      }
+    }
+
+    return data?.message;
+  }
 }
 
 export async function handleError(error: unknown, message: string) {

From 99a002b947d31b38154f5185c89842066cd2ad68 Mon Sep 17 00:00:00 2001
From: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>
Date: Tue, 27 Feb 2024 04:07:23 +0100
Subject: [PATCH 24/28] fix(web): alignment of people in search box (#7430)

* refactor search suggestion handling

* chore: open api

* revert server changes

* chore: open api

* update location filters

* location filter cleanup

* refactor people filter

* refactor camera filter

* refactor display filter

* cleanup

* fix(web): alignment of people in search box

* fix bad merge

---------

Co-authored-by: Daniel Dietzler <mail@ddietzler.dev>
Co-authored-by: Alex Tran <alex.tran1502@gmail.com>
---
 .../shared-components/search-bar/search-people-section.svelte   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/src/lib/components/shared-components/search-bar/search-people-section.svelte b/web/src/lib/components/shared-components/search-bar/search-people-section.svelte
index 6db71e2ae..4b87ab12d 100644
--- a/web/src/lib/components/shared-components/search-bar/search-people-section.svelte
+++ b/web/src/lib/components/shared-components/search-bar/search-people-section.svelte
@@ -53,7 +53,7 @@
         {#each peopleList as person (person.id)}
           <button
             type="button"
-            class="w-20 text-center rounded-3xl border-2 border-transparent hover:bg-immich-gray dark:hover:bg-immich-dark-primary/20 p-2 transition-all {selectedPeople.has(
+            class="flex flex-col items-center w-20 rounded-3xl border-2 border-transparent hover:bg-immich-gray dark:hover:bg-immich-dark-primary/20 p-2 transition-all {selectedPeople.has(
               person.id,
             )
               ? 'dark:border-slate-500 border-slate-400 bg-slate-200 dark:bg-slate-800 dark:text-white'

From 4272b496ff48f30d20d163725082d77622579dd6 Mon Sep 17 00:00:00 2001
From: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>
Date: Tue, 27 Feb 2024 04:07:49 +0100
Subject: [PATCH 25/28] fix(web): prevent resetting date input when entering 0
 (#7415)

* fix(web): prevent resetting date input when entering 0

* resolve conflict

---------

Co-authored-by: Alex Tran <alex.tran1502@gmail.com>
---
 .../lib/components/elements/date-input.svelte | 24 +++++++++++++++++++
 .../faces-page/set-birth-date-modal.svelte    |  3 ++-
 .../map-page/map-settings-modal.svelte        |  5 ++--
 .../shared-components/change-date.svelte      |  3 ++-
 .../search-bar/search-date-section.svelte     |  6 +++--
 5 files changed, 35 insertions(+), 6 deletions(-)
 create mode 100644 web/src/lib/components/elements/date-input.svelte

diff --git a/web/src/lib/components/elements/date-input.svelte b/web/src/lib/components/elements/date-input.svelte
new file mode 100644
index 000000000..e4ec4bcab
--- /dev/null
+++ b/web/src/lib/components/elements/date-input.svelte
@@ -0,0 +1,24 @@
+<script lang="ts">
+  import type { HTMLInputAttributes } from 'svelte/elements';
+
+  interface $$Props extends HTMLInputAttributes {
+    type: 'date' | 'datetime-local';
+  }
+
+  export let value: $$Props['value'] = undefined;
+  $: updatedValue = value;
+</script>
+
+<input
+  {...$$restProps}
+  {value}
+  on:input={(e) => {
+    updatedValue = e.currentTarget.value;
+
+    // Only update when value is not empty to prevent resetting the input
+    if (updatedValue !== '') {
+      value = updatedValue;
+    }
+  }}
+  on:blur={() => (value = updatedValue)}
+/>
diff --git a/web/src/lib/components/faces-page/set-birth-date-modal.svelte b/web/src/lib/components/faces-page/set-birth-date-modal.svelte
index 415f5c0f7..717b88d03 100644
--- a/web/src/lib/components/faces-page/set-birth-date-modal.svelte
+++ b/web/src/lib/components/faces-page/set-birth-date-modal.svelte
@@ -4,6 +4,7 @@
   import FullScreenModal from '../shared-components/full-screen-modal.svelte';
   import { mdiCake } from '@mdi/js';
   import Icon from '$lib/components/elements/icon.svelte';
+  import DateInput from '../elements/date-input.svelte';
 
   export let birthDate: string;
 
@@ -37,7 +38,7 @@
 
     <form on:submit|preventDefault={() => handleSubmit()} autocomplete="off">
       <div class="m-4 flex flex-col gap-2">
-        <input
+        <DateInput
           class="immich-form-input"
           id="birthDate"
           name="birthDate"
diff --git a/web/src/lib/components/map-page/map-settings-modal.svelte b/web/src/lib/components/map-page/map-settings-modal.svelte
index 17fd558ab..49d841116 100644
--- a/web/src/lib/components/map-page/map-settings-modal.svelte
+++ b/web/src/lib/components/map-page/map-settings-modal.svelte
@@ -8,6 +8,7 @@
   import LinkButton from '../elements/buttons/link-button.svelte';
   import SettingSelect from '$lib/components/shared-components/settings/setting-select.svelte';
   import SettingSwitch from '$lib/components/shared-components/settings/setting-switch.svelte';
+  import DateInput from '../elements/date-input.svelte';
 
   export let settings: MapSettings;
   let customDateRange = !!settings.dateAfter || !!settings.dateBefore;
@@ -38,7 +39,7 @@
         <div in:fly={{ y: 10, duration: 200 }} class="flex flex-col gap-4">
           <div class="flex items-center justify-between gap-8">
             <label class="immich-form-label shrink-0 text-sm" for="date-after">Date after</label>
-            <input
+            <DateInput
               class="immich-form-input w-40"
               type="date"
               id="date-after"
@@ -48,7 +49,7 @@
           </div>
           <div class="flex items-center justify-between gap-8">
             <label class="immich-form-label shrink-0 text-sm" for="date-before">Date before</label>
-            <input class="immich-form-input w-40" type="date" id="date-before" bind:value={settings.dateBefore} />
+            <DateInput class="immich-form-input w-40" type="date" id="date-before" bind:value={settings.dateBefore} />
           </div>
           <div class="flex justify-center text-xs">
             <LinkButton
diff --git a/web/src/lib/components/shared-components/change-date.svelte b/web/src/lib/components/shared-components/change-date.svelte
index 3972c0c66..f4c45c1e0 100644
--- a/web/src/lib/components/shared-components/change-date.svelte
+++ b/web/src/lib/components/shared-components/change-date.svelte
@@ -3,6 +3,7 @@
   import { DateTime } from 'luxon';
   import ConfirmDialogue from './confirm-dialogue.svelte';
   import Combobox from './combobox.svelte';
+  import DateInput from '../elements/date-input.svelte';
 
   export let initialDate: DateTime = DateTime.now();
 
@@ -74,7 +75,7 @@
       <div class="mt-2" />
       <div class="flex flex-col">
         <label for="datetime">Date and Time</label>
-        <input
+        <DateInput
           class="immich-form-input text-sm my-4 w-full"
           id="datetime"
           type="datetime-local"
diff --git a/web/src/lib/components/shared-components/search-bar/search-date-section.svelte b/web/src/lib/components/shared-components/search-bar/search-date-section.svelte
index 02fa90330..f08436bd0 100644
--- a/web/src/lib/components/shared-components/search-bar/search-date-section.svelte
+++ b/web/src/lib/components/shared-components/search-bar/search-date-section.svelte
@@ -6,13 +6,15 @@
 </script>
 
 <script lang="ts">
+  import DateInput from '$lib/components/elements/date-input.svelte';
+
   export let filters: SearchDateFilter;
 </script>
 
 <div id="date-range-selection" class="grid grid-cols-[repeat(auto-fit,minmax(10rem,1fr))] gap-5">
   <label class="immich-form-label" for="start-date">
     <span>START DATE</span>
-    <input
+    <DateInput
       class="immich-form-input w-full mt-1 hover:cursor-pointer"
       type="date"
       id="start-date"
@@ -24,7 +26,7 @@
 
   <label class="immich-form-label" for="end-date">
     <span>END DATE</span>
-    <input
+    <DateInput
       class="immich-form-input w-full mt-1 hover:cursor-pointer"
       type="date"
       id="end-date"

From d799bf791066d0cc48dc93404760258fc1c16860 Mon Sep 17 00:00:00 2001
From: martyfuhry <martyfuhry@gmail.com>
Date: Mon, 26 Feb 2024 22:25:39 -0500
Subject: [PATCH 26/28] fix(mobile): Stop sending app to login page for
 unrelated auth errors (#7383)

Now we only validate access token when we have one in the store and only send you to the login page when the response from the server is a 401

linter

Co-authored-by: Alex Tran <alex.tran1502@gmail.com>
---
 mobile/lib/routing/auth_guard.dart | 31 ++++++++++++++++--------------
 1 file changed, 17 insertions(+), 14 deletions(-)

diff --git a/mobile/lib/routing/auth_guard.dart b/mobile/lib/routing/auth_guard.dart
index 6aee9271f..fe212c4ca 100644
--- a/mobile/lib/routing/auth_guard.dart
+++ b/mobile/lib/routing/auth_guard.dart
@@ -1,8 +1,8 @@
 import 'dart:io';
 
 import 'package:auto_route/auto_route.dart';
-import 'package:flutter/foundation.dart';
 import 'package:immich_mobile/routing/router.dart';
+import 'package:immich_mobile/shared/models/store.dart';
 import 'package:immich_mobile/shared/services/api.service.dart';
 import 'package:logging/logging.dart';
 import 'package:openapi/api.dart';
@@ -16,28 +16,31 @@ class AuthGuard extends AutoRouteGuard {
     resolver.next(true);
 
     try {
-      var res = await _apiService.authenticationApi.validateAccessToken();
+      // Look in the store for an access token
+      Store.get(StoreKey.accessToken);
+
+      // Validate the access token with the server
+      final res = await _apiService.authenticationApi.validateAccessToken();
       if (res == null || res.authStatus != true) {
         // If the access token is invalid, take user back to login
-        _log.fine("User token is invalid. Redirecting to login");
+        _log.fine('User token is invalid. Redirecting to login');
         router.replaceAll([const LoginRoute()]);
       }
+    } on StoreKeyNotFoundException catch (_) {
+      // If there is no access token, take us to the login page
+      _log.warning('No access token in the store.');
+      router.replaceAll([const LoginRoute()]);
+      return;
     } on ApiException catch (e) {
-      if (e.code == HttpStatus.badRequest &&
-          e.innerException is SocketException) {
-        // offline?
-        _log.fine(
-          "Unable to validate user token. User may be offline and offline browsing is allowed.",
-        );
-      } else {
-        debugPrint("Error [onNavigation] ${e.toString()}");
+      // On an unauthorized request, take us to the login page
+      if (e.code == HttpStatus.unauthorized) {
+        _log.warning("Unauthorized access token.");
         router.replaceAll([const LoginRoute()]);
         return;
       }
     } catch (e) {
-      debugPrint("Error [onNavigation] ${e.toString()}");
-      router.replaceAll([const LoginRoute()]);
-      return;
+      // Otherwise, this is not fatal, but we still log the warning
+      _log.warning('Error validating access token from server: $e');
     }
   }
 }

From 7e18e69c1cd6ef9381b76191c41dbaf3c26900af Mon Sep 17 00:00:00 2001
From: Mert <101130780+mertalev@users.noreply.github.com>
Date: Tue, 27 Feb 2024 00:45:14 -0500
Subject: [PATCH 27/28] fix(ml): only use openvino if a gpu is available
 (#7450)

use `device_type`
---
 machine-learning/app/models/base.py | 18 +++++++++---------
 machine-learning/app/test_main.py   | 26 +++++++++++++++-----------
 2 files changed, 24 insertions(+), 20 deletions(-)

diff --git a/machine-learning/app/models/base.py b/machine-learning/app/models/base.py
index 6909a935c..ad48624b4 100644
--- a/machine-learning/app/models/base.py
+++ b/machine-learning/app/models/base.py
@@ -165,6 +165,14 @@ class InferenceModel(ABC):
     def providers_default(self) -> list[str]:
         available_providers = set(ort.get_available_providers())
         log.debug(f"Available ORT providers: {available_providers}")
+        if (openvino := "OpenVINOExecutionProvider") in available_providers:
+            device_ids: list[str] = ort.capi._pybind_state.get_available_openvino_device_ids()
+            log.debug(f"Available OpenVINO devices: {device_ids}")
+
+            gpu_devices = [device_id for device_id in device_ids if device_id.startswith("GPU")]
+            if not gpu_devices:
+                log.warning("No GPU device found in OpenVINO. Falling back to CPU.")
+                available_providers.remove(openvino)
         return [provider for provider in SUPPORTED_PROVIDERS if provider in available_providers]
 
     @property
@@ -184,15 +192,7 @@ class InferenceModel(ABC):
                 case "CPUExecutionProvider" | "CUDAExecutionProvider":
                     option = {"arena_extend_strategy": "kSameAsRequested"}
                 case "OpenVINOExecutionProvider":
-                    try:
-                        device_ids: list[str] = ort.capi._pybind_state.get_available_openvino_device_ids()
-                        log.debug(f"Available OpenVINO devices: {device_ids}")
-                        gpu_devices = [device_id for device_id in device_ids if device_id.startswith("GPU")]
-                        option = {"device_id": gpu_devices[0]} if gpu_devices else {}
-                    except AttributeError as e:
-                        log.warning("Failed to get OpenVINO device IDs. Using default options.")
-                        log.error(e)
-                        option = {}
+                    option = {"device_type": "GPU_FP32"}
                 case _:
                     option = {}
             options.append(option)
diff --git a/machine-learning/app/test_main.py b/machine-learning/app/test_main.py
index e25099e67..0f802997f 100644
--- a/machine-learning/app/test_main.py
+++ b/machine-learning/app/test_main.py
@@ -45,11 +45,23 @@ class TestBase:
         assert encoder.providers == self.CUDA_EP
 
     @pytest.mark.providers(OV_EP)
-    def test_sets_openvino_provider_if_available(self, providers: list[str]) -> None:
+    def test_sets_openvino_provider_if_available(self, providers: list[str], mocker: MockerFixture) -> None:
+        mocked = mocker.patch("app.models.base.ort.capi._pybind_state")
+        mocked.get_available_openvino_device_ids.return_value = ["GPU.0", "CPU"]
+
         encoder = OpenCLIPEncoder("ViT-B-32__openai")
 
         assert encoder.providers == self.OV_EP
 
+    @pytest.mark.providers(OV_EP)
+    def test_avoids_openvino_if_gpu_not_available(self, providers: list[str], mocker: MockerFixture) -> None:
+        mocked = mocker.patch("app.models.base.ort.capi._pybind_state")
+        mocked.get_available_openvino_device_ids.return_value = ["CPU"]
+
+        encoder = OpenCLIPEncoder("ViT-B-32__openai")
+
+        assert encoder.providers == self.CPU_EP
+
     @pytest.mark.providers(CUDA_EP_OUT_OF_ORDER)
     def test_sets_providers_in_correct_order(self, providers: list[str]) -> None:
         encoder = OpenCLIPEncoder("ViT-B-32__openai")
@@ -68,22 +80,14 @@ class TestBase:
 
         assert encoder.providers == providers
 
-    def test_sets_default_provider_options(self) -> None:
-        encoder = OpenCLIPEncoder("ViT-B-32__openai", providers=["OpenVINOExecutionProvider", "CPUExecutionProvider"])
-
-        assert encoder.provider_options == [
-            {},
-            {"arena_extend_strategy": "kSameAsRequested"},
-        ]
-
-    def test_sets_openvino_device_id_if_possible(self, mocker: MockerFixture) -> None:
+    def test_sets_default_provider_options(self, mocker: MockerFixture) -> None:
         mocked = mocker.patch("app.models.base.ort.capi._pybind_state")
         mocked.get_available_openvino_device_ids.return_value = ["GPU.0", "CPU"]
 
         encoder = OpenCLIPEncoder("ViT-B-32__openai", providers=["OpenVINOExecutionProvider", "CPUExecutionProvider"])
 
         assert encoder.provider_options == [
-            {"device_id": "GPU.0"},
+            {"device_type": "GPU_FP32"},
             {"arena_extend_strategy": "kSameAsRequested"},
         ]
 

From 8965c25f545b123c96860812640a0a138f99e16a Mon Sep 17 00:00:00 2001
From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com>
Date: Tue, 27 Feb 2024 00:53:37 -0500
Subject: [PATCH 28/28] chore(deps): update machine-learning (#7451)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
---
 machine-learning/export/Dockerfile |  2 +-
 machine-learning/poetry.lock       | 48 +++++++++++++++---------------
 2 files changed, 25 insertions(+), 25 deletions(-)

diff --git a/machine-learning/export/Dockerfile b/machine-learning/export/Dockerfile
index 40402886f..c22668380 100644
--- a/machine-learning/export/Dockerfile
+++ b/machine-learning/export/Dockerfile
@@ -1,4 +1,4 @@
-FROM mambaorg/micromamba:bookworm-slim@sha256:926cac38640709f90f3fef2a3f730733b5c350be612f0d14706be8833b79ad8c as builder
+FROM mambaorg/micromamba:bookworm-slim@sha256:6038b89363c9181215f3d9e8ce2720c880e224537f4028a854482e43a9b4998a as builder
 
 ENV NODE_ENV=production \
   TRANSFORMERS_CACHE=/cache \
diff --git a/machine-learning/poetry.lock b/machine-learning/poetry.lock
index c8ae6c741..782269c8c 100644
--- a/machine-learning/poetry.lock
+++ b/machine-learning/poetry.lock
@@ -1250,13 +1250,13 @@ test = ["Cython (>=0.29.24,<0.30.0)"]
 
 [[package]]
 name = "httpx"
-version = "0.26.0"
+version = "0.27.0"
 description = "The next generation HTTP client."
 optional = false
 python-versions = ">=3.8"
 files = [
-    {file = "httpx-0.26.0-py3-none-any.whl", hash = "sha256:8915f5a3627c4d47b73e8202457cb28f1266982d1159bd5779d86a80c0eab1cd"},
-    {file = "httpx-0.26.0.tar.gz", hash = "sha256:451b55c30d5185ea6b23c2c793abf9bb237d2a7dfb901ced6ff69ad37ec1dfaf"},
+    {file = "httpx-0.27.0-py3-none-any.whl", hash = "sha256:71d5465162c13681bff01ad59b2cc68dd838ea1f10e51574bac27103f00c91a5"},
+    {file = "httpx-0.27.0.tar.gz", hash = "sha256:a0cb88a46f32dc874e04ee956e4c2764aba2aa228f650b06788ba6bda2962ab5"},
 ]
 
 [package.dependencies]
@@ -2465,13 +2465,13 @@ files = [
 
 [[package]]
 name = "pytest"
-version = "8.0.0"
+version = "8.0.2"
 description = "pytest: simple powerful testing with Python"
 optional = false
 python-versions = ">=3.8"
 files = [
-    {file = "pytest-8.0.0-py3-none-any.whl", hash = "sha256:50fb9cbe836c3f20f0dfa99c565201fb75dc54c8d76373cd1bde06b06657bdb6"},
-    {file = "pytest-8.0.0.tar.gz", hash = "sha256:249b1b0864530ba251b7438274c4d251c58d868edaaec8762893ad4a0d71c36c"},
+    {file = "pytest-8.0.2-py3-none-any.whl", hash = "sha256:edfaaef32ce5172d5466b5127b42e0d6d35ebbe4453f0e3505d96afd93f6b096"},
+    {file = "pytest-8.0.2.tar.gz", hash = "sha256:d4051d623a2e0b7e51960ba963193b09ce6daeb9759a451844a21e4ddedfc1bd"},
 ]
 
 [package.dependencies]
@@ -2836,28 +2836,28 @@ files = [
 
 [[package]]
 name = "ruff"
-version = "0.2.1"
+version = "0.2.2"
 description = "An extremely fast Python linter and code formatter, written in Rust."
 optional = false
 python-versions = ">=3.7"
 files = [
-    {file = "ruff-0.2.1-py3-none-macosx_10_12_x86_64.macosx_11_0_arm64.macosx_10_12_universal2.whl", hash = "sha256:dd81b911d28925e7e8b323e8d06951554655021df8dd4ac3045d7212ac4ba080"},
-    {file = "ruff-0.2.1-py3-none-macosx_10_12_x86_64.whl", hash = "sha256:dc586724a95b7d980aa17f671e173df00f0a2eef23f8babbeee663229a938fec"},
-    {file = "ruff-0.2.1-py3-none-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:c92db7101ef5bfc18e96777ed7bc7c822d545fa5977e90a585accac43d22f18a"},
-    {file = "ruff-0.2.1-py3-none-manylinux_2_17_armv7l.manylinux2014_armv7l.whl", hash = "sha256:13471684694d41ae0f1e8e3a7497e14cd57ccb7dd72ae08d56a159d6c9c3e30e"},
-    {file = "ruff-0.2.1-py3-none-manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:a11567e20ea39d1f51aebd778685582d4c56ccb082c1161ffc10f79bebe6df35"},
-    {file = "ruff-0.2.1-py3-none-manylinux_2_17_ppc64.manylinux2014_ppc64.whl", hash = "sha256:00a818e2db63659570403e44383ab03c529c2b9678ba4ba6c105af7854008105"},
-    {file = "ruff-0.2.1-py3-none-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:be60592f9d218b52f03384d1325efa9d3b41e4c4d55ea022cd548547cc42cd2b"},
-    {file = "ruff-0.2.1-py3-none-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:fbd2288890b88e8aab4499e55148805b58ec711053588cc2f0196a44f6e3d855"},
-    {file = "ruff-0.2.1-py3-none-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:f3ef052283da7dec1987bba8d8733051c2325654641dfe5877a4022108098683"},
-    {file = "ruff-0.2.1-py3-none-musllinux_1_2_aarch64.whl", hash = "sha256:7022d66366d6fded4ba3889f73cd791c2d5621b2ccf34befc752cb0df70f5fad"},
-    {file = "ruff-0.2.1-py3-none-musllinux_1_2_armv7l.whl", hash = "sha256:0a725823cb2a3f08ee743a534cb6935727d9e47409e4ad72c10a3faf042ad5ba"},
-    {file = "ruff-0.2.1-py3-none-musllinux_1_2_i686.whl", hash = "sha256:0034d5b6323e6e8fe91b2a1e55b02d92d0b582d2953a2b37a67a2d7dedbb7acc"},
-    {file = "ruff-0.2.1-py3-none-musllinux_1_2_x86_64.whl", hash = "sha256:e5cb5526d69bb9143c2e4d2a115d08ffca3d8e0fddc84925a7b54931c96f5c02"},
-    {file = "ruff-0.2.1-py3-none-win32.whl", hash = "sha256:6b95ac9ce49b4fb390634d46d6ece32ace3acdd52814671ccaf20b7f60adb232"},
-    {file = "ruff-0.2.1-py3-none-win_amd64.whl", hash = "sha256:e3affdcbc2afb6f5bd0eb3130139ceedc5e3f28d206fe49f63073cb9e65988e0"},
-    {file = "ruff-0.2.1-py3-none-win_arm64.whl", hash = "sha256:efababa8e12330aa94a53e90a81eb6e2d55f348bc2e71adbf17d9cad23c03ee6"},
-    {file = "ruff-0.2.1.tar.gz", hash = "sha256:3b42b5d8677cd0c72b99fcaf068ffc62abb5a19e71b4a3b9cfa50658a0af02f1"},
+    {file = "ruff-0.2.2-py3-none-macosx_10_12_x86_64.macosx_11_0_arm64.macosx_10_12_universal2.whl", hash = "sha256:0a9efb032855ffb3c21f6405751d5e147b0c6b631e3ca3f6b20f917572b97eb6"},
+    {file = "ruff-0.2.2-py3-none-macosx_10_12_x86_64.whl", hash = "sha256:d450b7fbff85913f866a5384d8912710936e2b96da74541c82c1b458472ddb39"},
+    {file = "ruff-0.2.2-py3-none-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:ecd46e3106850a5c26aee114e562c329f9a1fbe9e4821b008c4404f64ff9ce73"},
+    {file = "ruff-0.2.2-py3-none-manylinux_2_17_armv7l.manylinux2014_armv7l.whl", hash = "sha256:5e22676a5b875bd72acd3d11d5fa9075d3a5f53b877fe7b4793e4673499318ba"},
+    {file = "ruff-0.2.2-py3-none-manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:1695700d1e25a99d28f7a1636d85bafcc5030bba9d0578c0781ba1790dbcf51c"},
+    {file = "ruff-0.2.2-py3-none-manylinux_2_17_ppc64.manylinux2014_ppc64.whl", hash = "sha256:b0c232af3d0bd8f521806223723456ffebf8e323bd1e4e82b0befb20ba18388e"},
+    {file = "ruff-0.2.2-py3-none-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:f63d96494eeec2fc70d909393bcd76c69f35334cdbd9e20d089fb3f0640216ca"},
+    {file = "ruff-0.2.2-py3-none-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:6a61ea0ff048e06de273b2e45bd72629f470f5da8f71daf09fe481278b175001"},
+    {file = "ruff-0.2.2-py3-none-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:5e1439c8f407e4f356470e54cdecdca1bd5439a0673792dbe34a2b0a551a2fe3"},
+    {file = "ruff-0.2.2-py3-none-musllinux_1_2_aarch64.whl", hash = "sha256:940de32dc8853eba0f67f7198b3e79bc6ba95c2edbfdfac2144c8235114d6726"},
+    {file = "ruff-0.2.2-py3-none-musllinux_1_2_armv7l.whl", hash = "sha256:0c126da55c38dd917621552ab430213bdb3273bb10ddb67bc4b761989210eb6e"},
+    {file = "ruff-0.2.2-py3-none-musllinux_1_2_i686.whl", hash = "sha256:3b65494f7e4bed2e74110dac1f0d17dc8e1f42faaa784e7c58a98e335ec83d7e"},
+    {file = "ruff-0.2.2-py3-none-musllinux_1_2_x86_64.whl", hash = "sha256:1ec49be4fe6ddac0503833f3ed8930528e26d1e60ad35c2446da372d16651ce9"},
+    {file = "ruff-0.2.2-py3-none-win32.whl", hash = "sha256:d920499b576f6c68295bc04e7b17b6544d9d05f196bb3aac4358792ef6f34325"},
+    {file = "ruff-0.2.2-py3-none-win_amd64.whl", hash = "sha256:cc9a91ae137d687f43a44c900e5d95e9617cb37d4c989e462980ba27039d239d"},
+    {file = "ruff-0.2.2-py3-none-win_arm64.whl", hash = "sha256:c9d15fc41e6054bfc7200478720570078f0b41c9ae4f010bcc16bd6f4d1aacdd"},
+    {file = "ruff-0.2.2.tar.gz", hash = "sha256:e62ed7f36b3068a30ba39193a14274cd706bc486fad521276458022f7bccb31d"},
 ]
 
 [[package]]