fix none handling

* feat(web): search type selection dropdown

* chore: implement suggestions

* lint

---------

Co-authored-by: Alex <alex.tran1502@gmail.com>

.github/package.json

@@ -4,6 +4,6 @@
     "format:fix": "prettier --write ."
   },
   "devDependencies": {
-    "prettier": "^3.5.3"
+    "prettier": "^3.7.4"
   }
 }

cli/package.json

@@ -31,7 +31,7 @@
     "eslint-plugin-unicorn": "^62.0.0",
     "globals": "^16.0.0",
     "mock-fs": "^5.2.0",
-    "prettier": "^3.2.5",
+    "prettier": "^3.7.4",
     "prettier-plugin-organize-imports": "^4.0.0",
     "typescript": "^5.3.3",
     "typescript-eslint": "^8.28.0",

docs/package.json

@@ -38,7 +38,7 @@
     "@docusaurus/module-type-aliases": "~3.9.0",
     "@docusaurus/tsconfig": "^3.7.0",
     "@docusaurus/types": "^3.7.0",
-    "prettier": "^3.2.4",
+    "prettier": "^3.7.4",
     "typescript": "^5.1.6"
   },
   "browserslist": {

e2e/package.json

@@ -43,7 +43,7 @@
     "oidc-provider": "^9.0.0",
     "pg": "^8.11.3",
     "pngjs": "^7.0.0",
-    "prettier": "^3.2.5",
+    "prettier": "^3.7.4",
     "prettier-plugin-organize-imports": "^4.0.0",
     "sharp": "^0.34.5",
     "socket.io-client": "^4.7.4",

i18n/en.json

@@ -78,7 +78,6 @@
     "exclusion_pattern_description": "Exclusion patterns lets you ignore files and folders when scanning your library. This is useful if you have folders that contain files you don't want to import, such as RAW files.",
     "export_config_as_json_description": "Download the current system config as a JSON file",
     "external_libraries_page_description": "Admin external library page",
-    "external_library_management": "External Library Management",
     "face_detection": "Face detection",
     "face_detection_description": "Detect the faces in assets using machine learning. For videos, only the thumbnail is considered. \"Refresh\" (re-)processes all assets. \"Reset\" additionally clears all current face data. \"Missing\" queues assets that haven't been processed yet. Detected faces will be queued for Facial Recognition after Face Detection is complete, grouping them into existing or new people.",
     "facial_recognition_job_description": "Group detected faces into people. This step runs after Face Detection is complete. \"Reset\" (re-)clusters all faces. \"Missing\" queues faces that don't have a person assigned.",

pnpm-lock.yaml

@@ -20,8 +20,8 @@ importers:
   .github:
     devDependencies:
       prettier:
-        specifier: ^3.5.3
-        version: 3.7.1
+        specifier: ^3.7.4
+        version: 3.7.4
 
   cli:
     dependencies:
@@ -85,7 +85,7 @@ importers:
         version: 10.1.8(eslint@9.39.1(jiti@2.6.1))
       eslint-plugin-prettier:
         specifier: ^5.1.3
-        version: 5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@10.1.8(eslint@9.39.1(jiti@2.6.1)))(eslint@9.39.1(jiti@2.6.1))(prettier@3.7.1)
+        version: 5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@10.1.8(eslint@9.39.1(jiti@2.6.1)))(eslint@9.39.1(jiti@2.6.1))(prettier@3.7.4)
       eslint-plugin-unicorn:
         specifier: ^62.0.0
         version: 62.0.0(eslint@9.39.1(jiti@2.6.1))
@@ -96,11 +96,11 @@ importers:
         specifier: ^5.2.0
         version: 5.5.0
       prettier:
-        specifier: ^3.2.5
-        version: 3.7.1
+        specifier: ^3.7.4
+        version: 3.7.4
       prettier-plugin-organize-imports:
         specifier: ^4.0.0
-        version: 4.3.0(prettier@3.7.1)(typescript@5.9.3)
+        version: 4.3.0(prettier@3.7.4)(typescript@5.9.3)
       typescript:
         specifier: ^5.3.3
         version: 5.9.3
@@ -184,8 +184,8 @@ importers:
         specifier: ^3.7.0
         version: 3.9.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       prettier:
-        specifier: ^3.2.4
-        version: 3.7.1
+        specifier: ^3.7.4
+        version: 3.7.4
       typescript:
         specifier: ^5.1.6
         version: 5.9.3
@@ -239,7 +239,7 @@ importers:
         version: 10.1.8(eslint@9.39.1(jiti@2.6.1))
       eslint-plugin-prettier:
         specifier: ^5.1.3
-        version: 5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@10.1.8(eslint@9.39.1(jiti@2.6.1)))(eslint@9.39.1(jiti@2.6.1))(prettier@3.7.1)
+        version: 5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@10.1.8(eslint@9.39.1(jiti@2.6.1)))(eslint@9.39.1(jiti@2.6.1))(prettier@3.7.4)
       eslint-plugin-unicorn:
         specifier: ^62.0.0
         version: 62.0.0(eslint@9.39.1(jiti@2.6.1))
@@ -265,11 +265,11 @@ importers:
         specifier: ^7.0.0
         version: 7.0.0
       prettier:
-        specifier: ^3.2.5
-        version: 3.7.1
+        specifier: ^3.7.4
+        version: 3.7.4
       prettier-plugin-organize-imports:
         specifier: ^4.0.0
-        version: 4.3.0(prettier@3.7.1)(typescript@5.9.3)
+        version: 4.3.0(prettier@3.7.4)(typescript@5.9.3)
       sharp:
         specifier: ^0.34.5
         version: 0.34.5
@@ -655,7 +655,7 @@ importers:
         version: 10.1.8(eslint@9.39.1(jiti@2.6.1))
       eslint-plugin-prettier:
         specifier: ^5.1.3
-        version: 5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@10.1.8(eslint@9.39.1(jiti@2.6.1)))(eslint@9.39.1(jiti@2.6.1))(prettier@3.7.1)
+        version: 5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@10.1.8(eslint@9.39.1(jiti@2.6.1)))(eslint@9.39.1(jiti@2.6.1))(prettier@3.7.4)
       eslint-plugin-unicorn:
         specifier: ^62.0.0
         version: 62.0.0(eslint@9.39.1(jiti@2.6.1))
@@ -672,11 +672,11 @@ importers:
         specifier: ^7.0.0
         version: 7.0.0
       prettier:
-        specifier: ^3.0.2
-        version: 3.7.1
+        specifier: ^3.7.4
+        version: 3.7.4
       prettier-plugin-organize-imports:
         specifier: ^4.0.0
-        version: 4.3.0(prettier@3.7.1)(typescript@5.9.3)
+        version: 4.3.0(prettier@3.7.4)(typescript@5.9.3)
       sql-formatter:
         specifier: ^15.0.0
         version: 15.6.10
@@ -717,8 +717,8 @@ importers:
         specifier: file:../open-api/typescript-sdk
         version: link:../open-api/typescript-sdk
       '@immich/ui':
-        specifier: ^0.49.2
-        version: 0.49.3(@sveltejs/kit@2.49.0(@opentelemetry/api@1.9.0)(@sveltejs/vite-plugin-svelte@6.2.1(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)
+        specifier: ^0.50.0
+        version: 0.50.0(@sveltejs/kit@2.49.0(@opentelemetry/api@1.9.0)(@sveltejs/vite-plugin-svelte@6.2.1(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)
       '@mapbox/mapbox-gl-rtl-text':
         specifier: 0.2.3
         version: 0.2.3(mapbox-gl@1.13.3)
@@ -904,17 +904,17 @@ importers:
         specifier: ^16.0.0
         version: 16.5.0
       prettier:
-        specifier: ^3.4.2
-        version: 3.7.1
+        specifier: ^3.7.4
+        version: 3.7.4
       prettier-plugin-organize-imports:
         specifier: ^4.0.0
-        version: 4.3.0(prettier@3.7.1)(typescript@5.9.3)
+        version: 4.3.0(prettier@3.7.4)(typescript@5.9.3)
       prettier-plugin-sort-json:
         specifier: ^4.1.1
-        version: 4.1.1(prettier@3.7.1)
+        version: 4.1.1(prettier@3.7.4)
       prettier-plugin-svelte:
         specifier: ^3.3.3
-        version: 3.4.0(prettier@3.7.1)(svelte@5.45.2)
+        version: 3.4.0(prettier@3.7.4)(svelte@5.45.2)
       rollup-plugin-visualizer:
         specifier: ^6.0.0
         version: 6.0.5(rollup@4.53.3)
@@ -2989,8 +2989,8 @@ packages:
     peerDependencies:
       svelte: ^5.0.0
 
-  '@immich/ui@0.49.3':
-    resolution: {integrity: sha512-joqT72Y6gmGK6z25Suzr2VhYANrLo43g20T4UHmbQenz/z/Ax6sl1Ao9SjIOwEkKMm9N3Txoh7WOOzmHVl04OA==}
+  '@immich/ui@0.50.0':
+    resolution: {integrity: sha512-7AW9SRZTAgal8xlkUAxm7o4+pSG7HcKb+Bh9JpWLaDRRdGyPCZMmsNa9CjZglOQ7wkAD07tQ9u4+zezBLe0dlQ==}
     peerDependencies:
       svelte: ^5.0.0
 
@@ -9765,8 +9765,8 @@ packages:
       prettier: ^3.0.0
       svelte: ^3.2.0 || ^4.0.0-next.0 || ^5.0.0-next.0
 
-  prettier@3.7.1:
-    resolution: {integrity: sha512-RWKXE4qB3u5Z6yz7omJkjWwmTfLdcbv44jUVHC5NpfXwFGzvpQM798FGv/6WNK879tc+Cn0AAyherCl1KjbyZQ==}
+  prettier@3.7.4:
+    resolution: {integrity: sha512-v6UNi1+3hSlVvv8fSaoUbggEM5VErKmmpGA7Pl3HF8V6uKY7rvClBOJlH6yNwQtfTueNkGVpOv/mtWL9L4bgRA==}
     engines: {node: '>=14'}
     hasBin: true
 
@@ -14517,7 +14517,7 @@ snapshots:
   '@fig/complete-commander@3.2.0(commander@11.1.0)':
     dependencies:
       commander: 11.1.0
-      prettier: 3.7.1
+      prettier: 3.7.4
 
   '@floating-ui/core@1.7.3':
     dependencies:
@@ -14700,7 +14700,7 @@ snapshots:
     dependencies:
       svelte: 5.45.2
 
-  '@immich/ui@0.49.3(@sveltejs/kit@2.49.0(@opentelemetry/api@1.9.0)(@sveltejs/vite-plugin-svelte@6.2.1(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)':
+  '@immich/ui@0.50.0(@sveltejs/kit@2.49.0(@opentelemetry/api@1.9.0)(@sveltejs/vite-plugin-svelte@6.2.1(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)(vite@7.2.4(@types/node@24.10.1)(jiti@2.6.1)(lightningcss@1.30.2)(terser@5.44.0)(yaml@2.8.2)))(svelte@5.45.2)':
     dependencies:
       '@immich/svelte-markdown-preprocess': 0.1.0(svelte@5.45.2)
       '@internationalized/date': 3.10.0
@@ -15788,7 +15788,7 @@ snapshots:
   '@react-email/render@1.4.0(react-dom@19.2.0(react@19.2.0))(react@19.2.0)':
     dependencies:
       html-to-text: 9.0.5
-      prettier: 3.7.1
+      prettier: 3.7.4
       react: 19.2.0
       react-dom: 19.2.0(react@19.2.0)
       react-promise-suspense: 0.3.4
@@ -18907,10 +18907,10 @@ snapshots:
       lodash.memoize: 4.1.2
       semver: 7.7.3
 
-  eslint-plugin-prettier@5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@10.1.8(eslint@9.39.1(jiti@2.6.1)))(eslint@9.39.1(jiti@2.6.1))(prettier@3.7.1):
+  eslint-plugin-prettier@5.5.4(@types/eslint@9.6.1)(eslint-config-prettier@10.1.8(eslint@9.39.1(jiti@2.6.1)))(eslint@9.39.1(jiti@2.6.1))(prettier@3.7.4):
     dependencies:
       eslint: 9.39.1(jiti@2.6.1)
-      prettier: 3.7.1
+      prettier: 3.7.4
       prettier-linter-helpers: 1.0.0
       synckit: 0.11.11
     optionalDependencies:
@@ -22636,21 +22636,21 @@ snapshots:
     dependencies:
       fast-diff: 1.3.0
 
-  prettier-plugin-organize-imports@4.3.0(prettier@3.7.1)(typescript@5.9.3):
+  prettier-plugin-organize-imports@4.3.0(prettier@3.7.4)(typescript@5.9.3):
     dependencies:
-      prettier: 3.7.1
+      prettier: 3.7.4
       typescript: 5.9.3
 
-  prettier-plugin-sort-json@4.1.1(prettier@3.7.1):
+  prettier-plugin-sort-json@4.1.1(prettier@3.7.4):
     dependencies:
-      prettier: 3.7.1
+      prettier: 3.7.4
 
-  prettier-plugin-svelte@3.4.0(prettier@3.7.1)(svelte@5.45.2):
+  prettier-plugin-svelte@3.4.0(prettier@3.7.4)(svelte@5.45.2):
     dependencies:
-      prettier: 3.7.1
+      prettier: 3.7.4
       svelte: 5.45.2
 
-  prettier@3.7.1: {}
+  prettier@3.7.4: {}
 
   pretty-error@4.0.0:
     dependencies:

server/package.json

@@ -153,7 +153,7 @@
     "mock-fs": "^5.2.0",
     "node-gyp": "^12.0.0",
     "pngjs": "^7.0.0",
-    "prettier": "^3.0.2",
+    "prettier": "^3.7.4",
     "prettier-plugin-organize-imports": "^4.0.0",
     "sql-formatter": "^15.0.0",
     "supertest": "^7.1.0",

server/src/database.ts

@@ -240,7 +240,7 @@ export type Session = {
   isPendingSyncReset: boolean;
 };
 
-export type Exif = Omit<Selectable<AssetExifTable>, 'updatedAt' | 'updateId'>;
+export type Exif = Omit<Selectable<AssetExifTable>, 'updatedAt' | 'updateId' | 'lockedProperties'>;
 
 export type Person = {
   createdAt: Date;

server/src/queries/asset.job.repository.sql

@@ -50,9 +50,11 @@ select
         where
           "asset"."id" = "tag_asset"."assetId"
       ) as agg
-  ) as "tags"
+  ) as "tags",
+  to_json("asset_exif") as "exifInfo"
 from
   "asset"
+  inner join "asset_exif" on "asset"."id" = "asset_exif"."assetId"
 where
   "asset"."id" = $2::uuid
 limit
@@ -224,6 +226,14 @@ from
 where
   "asset"."id" = $2
 
+-- AssetJobRepository.getLockedPropertiesForMetadataExtraction
+select
+  "asset_exif"."lockedProperties"
+from
+  "asset_exif"
+where
+  "asset_exif"."assetId" = $1
+
 -- AssetJobRepository.getAlbumThumbnailFiles
 select
   "asset_file"."id",

server/src/queries/asset.repository.sql

@@ -3,17 +3,31 @@
 -- AssetRepository.updateAllExif
 update "asset_exif"
 set
-  "model" = $1
+  "model" = $1,
+  "lockedProperties" = nullif(
+    array(
+      select distinct
+        unnest("asset_exif"."lockedProperties" || $2)
+    ),
+    '{}'
+  )
 where
-  "assetId" in ($2)
+  "assetId" in ($3)
 
 -- AssetRepository.updateDateTimeOriginal
 update "asset_exif"
 set
   "dateTimeOriginal" = "dateTimeOriginal" + $1::interval,
-  "timeZone" = $2
+  "timeZone" = $2,
+  "lockedProperties" = nullif(
+    array(
+      select distinct
+        unnest("asset_exif"."lockedProperties" || $3)
+    ),
+    '{}'
+  )
 where
-  "assetId" in ($3)
+  "assetId" in ($4)
 returning
   "assetId",
   "dateTimeOriginal",

server/src/repositories/asset-job.repository.ts

@@ -50,6 +50,7 @@ export class AssetJobRepository {
             .whereRef('asset.id', '=', 'tag_asset.assetId'),
         ).as('tags'),
       )
+      .$call(withExifInner)
       .limit(1)
       .executeTakeFirst();
   }
@@ -128,6 +129,16 @@ export class AssetJobRepository {
       .executeTakeFirst();
   }
 
+  @GenerateSql({ params: [DummyValue.UUID] })
+  async getLockedPropertiesForMetadataExtraction(assetId: string) {
+    return this.db
+      .selectFrom('asset_exif')
+      .select('asset_exif.lockedProperties')
+      .where('asset_exif.assetId', '=', assetId)
+      .executeTakeFirst()
+      .then((row) => row?.lockedProperties ?? []);
+  }
+
   @GenerateSql({ params: [DummyValue.UUID, AssetFileType.Thumbnail] })
   getAlbumThumbnailFiles(id: string, fileType?: AssetFileType) {
     return this.db

server/src/repositories/asset.repository.ts

@@ -1,5 +1,5 @@
 import { Injectable } from '@nestjs/common';
-import { Insertable, Kysely, NotNull, Selectable, sql, Updateable, UpdateResult } from 'kysely';
+import { ExpressionBuilder, Insertable, Kysely, NotNull, Selectable, sql, Updateable, UpdateResult } from 'kysely';
 import { isEmpty, isUndefined, omitBy } from 'lodash';
 import { InjectKysely } from 'nestjs-kysely';
 import { Stack } from 'src/database';
@@ -7,7 +7,7 @@ import { Chunked, ChunkedArray, DummyValue, GenerateSql } from 'src/decorators';
 import { AuthDto } from 'src/dtos/auth.dto';
 import { AssetFileType, AssetMetadataKey, AssetOrder, AssetStatus, AssetType, AssetVisibility } from 'src/enum';
 import { DB } from 'src/schema';
-import { AssetExifTable } from 'src/schema/tables/asset-exif.table';
+import { AssetExifTable, LockableProperty } from 'src/schema/tables/asset-exif.table';
 import { AssetFileTable } from 'src/schema/tables/asset-file.table';
 import { AssetJobStatusTable } from 'src/schema/tables/asset-job-status.table';
 import { AssetTable } from 'src/schema/tables/asset.table';
@@ -113,51 +113,69 @@ interface GetByIdsRelations {
   tags?: boolean;
 }
 
+const distinctLocked = <T extends LockableProperty[] | null>(eb: ExpressionBuilder<DB, 'asset_exif'>, columns: T) =>
+  sql<T>`nullif(array(select distinct unnest(${eb.ref('asset_exif.lockedProperties')} || ${columns})), '{}')`;
+
 @Injectable()
 export class AssetRepository {
   constructor(@InjectKysely() private db: Kysely<DB>) {}
 
-  async upsertExif(exif: Insertable<AssetExifTable>): Promise<void> {
-    const value = { ...exif, assetId: asUuid(exif.assetId) };
+  async upsertExif(
+    exif: Insertable<AssetExifTable>,
+    { lockedPropertiesBehavior }: { lockedPropertiesBehavior: 'none' | 'update' | 'skip' },
+  ): Promise<void> {
     await this.db
       .insertInto('asset_exif')
-      .values(value)
+      .values(exif)
       .onConflict((oc) =>
-        oc.column('assetId').doUpdateSet((eb) =>
-          removeUndefinedKeys(
+        oc.column('assetId').doUpdateSet((eb) => {
+          const updateLocked = <T extends keyof AssetExifTable>(col: T) => eb.ref(`excluded.${col}`);
+          const skipLocked = <T extends keyof AssetExifTable>(col: T) =>
+            eb
+              .case()
+              .when(sql`${col}`, '=', eb.fn.any('asset_exif.lockedProperties'))
+              .then(eb.ref(`asset_exif.${col}`))
+              .else(eb.ref(`excluded.${col}`))
+              .end();
+          const ref = lockedPropertiesBehavior === 'update' ? updateLocked : skipLocked;
+          return removeUndefinedKeys(
             {
-              description: eb.ref('excluded.description'),
-              exifImageWidth: eb.ref('excluded.exifImageWidth'),
-              exifImageHeight: eb.ref('excluded.exifImageHeight'),
-              fileSizeInByte: eb.ref('excluded.fileSizeInByte'),
-              orientation: eb.ref('excluded.orientation'),
-              dateTimeOriginal: eb.ref('excluded.dateTimeOriginal'),
-              modifyDate: eb.ref('excluded.modifyDate'),
-              timeZone: eb.ref('excluded.timeZone'),
-              latitude: eb.ref('excluded.latitude'),
-              longitude: eb.ref('excluded.longitude'),
-              projectionType: eb.ref('excluded.projectionType'),
-              city: eb.ref('excluded.city'),
-              livePhotoCID: eb.ref('excluded.livePhotoCID'),
-              autoStackId: eb.ref('excluded.autoStackId'),
-              state: eb.ref('excluded.state'),
-              country: eb.ref('excluded.country'),
-              make: eb.ref('excluded.make'),
-              model: eb.ref('excluded.model'),
-              lensModel: eb.ref('excluded.lensModel'),
-              fNumber: eb.ref('excluded.fNumber'),
-              focalLength: eb.ref('excluded.focalLength'),
-              iso: eb.ref('excluded.iso'),
-              exposureTime: eb.ref('excluded.exposureTime'),
-              profileDescription: eb.ref('excluded.profileDescription'),
-              colorspace: eb.ref('excluded.colorspace'),
-              bitsPerSample: eb.ref('excluded.bitsPerSample'),
-              rating: eb.ref('excluded.rating'),
-              fps: eb.ref('excluded.fps'),
+              description: ref('description'),
+              exifImageWidth: ref('exifImageWidth'),
+              exifImageHeight: ref('exifImageHeight'),
+              fileSizeInByte: ref('fileSizeInByte'),
+              orientation: ref('orientation'),
+              dateTimeOriginal: ref('dateTimeOriginal'),
+              modifyDate: ref('modifyDate'),
+              timeZone: ref('timeZone'),
+              latitude: ref('latitude'),
+              longitude: ref('longitude'),
+              projectionType: ref('projectionType'),
+              city: ref('city'),
+              livePhotoCID: ref('livePhotoCID'),
+              autoStackId: ref('autoStackId'),
+              state: ref('state'),
+              country: ref('country'),
+              make: ref('make'),
+              model: ref('model'),
+              lensModel: ref('lensModel'),
+              fNumber: ref('fNumber'),
+              focalLength: ref('focalLength'),
+              iso: ref('iso'),
+              exposureTime: ref('exposureTime'),
+              profileDescription: ref('profileDescription'),
+              colorspace: ref('colorspace'),
+              bitsPerSample: ref('bitsPerSample'),
+              rating: ref('rating'),
+              fps: ref('fps'),
+              lockedProperties:
+                exif.lockedProperties !== undefined && lockedPropertiesBehavior !== 'none'
+                  ? distinctLocked(eb, exif.lockedProperties)
+                  : exif.lockedProperties,
             },
-            value,
-          ),
-        ),
+            exif,
+          );
+        }),
       )
       .execute();
   }
@@ -169,19 +187,30 @@ export class AssetRepository {
       return;
     }
 
-    await this.db.updateTable('asset_exif').set(options).where('assetId', 'in', ids).execute();
+    await this.db
+      .updateTable('asset_exif')
+      .set((eb) => ({
+        ...options,
+        lockedProperties: distinctLocked(eb, Object.keys(options) as LockableProperty[]),
+      }))
+      .where('assetId', 'in', ids)
+      .execute();
   }
 
   @GenerateSql({ params: [[DummyValue.UUID], DummyValue.NUMBER, DummyValue.STRING] })
   @Chunked()
-  async updateDateTimeOriginal(
-    ids: string[],
-    delta?: number,
-    timeZone?: string,
-  ): Promise<{ assetId: string; dateTimeOriginal: Date | null; timeZone: string | null }[]> {
-    return await this.db
+  updateDateTimeOriginal(ids: string[], delta?: number, timeZone?: string) {
+    if (ids.length === 0) {
+      return;
+    }
+
+    return this.db
       .updateTable('asset_exif')
-      .set({ dateTimeOriginal: sql`"dateTimeOriginal" + ${(delta ?? 0) + ' minute'}::interval`, timeZone })
+      .set((eb) => ({
+        dateTimeOriginal: sql`"dateTimeOriginal" + ${(delta ?? 0) + ' minute'}::interval`,
+        timeZone,
+        lockedProperties: distinctLocked(eb, ['dateTimeOriginal', 'timeZone']),
+      }))
       .where('assetId', 'in', ids)
       .returning(['assetId', 'dateTimeOriginal', 'timeZone'])
       .execute();

server/src/schema/migrations/1764957138636-AddLockedPropertiesToAssetExif.ts

@@ -0,0 +1,9 @@
+import { Kysely, sql } from 'kysely';
+
+export async function up(db: Kysely<any>): Promise<void> {
+  await sql`ALTER TABLE "asset_exif" ADD "lockedProperties" character varying[];`.execute(db);
+}
+
+export async function down(db: Kysely<any>): Promise<void> {
+  await sql`ALTER TABLE "asset_exif" DROP COLUMN "lockedProperties";`.execute(db);
+}

server/src/schema/tables/asset-exif.table.ts

@@ -2,6 +2,16 @@ import { UpdatedAtTrigger, UpdateIdColumn } from 'src/decorators';
 import { AssetTable } from 'src/schema/tables/asset.table';
 import { Column, ForeignKeyColumn, Generated, Int8, Table, Timestamp, UpdateDateColumn } from 'src/sql-tools';
 
+export type LockableProperty = (typeof lockableProperties)[number];
+export const lockableProperties = [
+  'description',
+  'dateTimeOriginal',
+  'latitude',
+  'longitude',
+  'rating',
+  'timeZone',
+] as const;
+
 @Table('asset_exif')
 @UpdatedAtTrigger('asset_exif_updatedAt')
 export class AssetExifTable {
@@ -97,4 +107,7 @@ export class AssetExifTable {
 
   @UpdateIdColumn({ index: true })
   updateId!: Generated<string>;
+
+  @Column({ type: 'character varying', array: true, nullable: true })
+  lockedProperties!: Array<LockableProperty> | null;
 }

server/src/services/asset-media.service.ts

@@ -370,7 +370,7 @@ export class AssetMediaService extends BaseService {
       : this.assetRepository.deleteFile({ assetId, type: AssetFileType.Sidecar }));
 
     await this.storageRepository.utimes(file.originalPath, new Date(), new Date(dto.fileModifiedAt));
-    await this.assetRepository.upsertExif({ assetId, fileSizeInByte: file.size });
+    await this.assetRepository.upsertExif({ assetId, fileSizeInByte: file.size }, { lockedPropertiesBehavior: 'none' });
     await this.jobRepository.queue({
       name: JobName.AssetExtractMetadata,
       data: { id: assetId, source: 'upload' },
@@ -399,7 +399,10 @@ export class AssetMediaService extends BaseService {
     });
 
     const { size } = await this.storageRepository.stat(created.originalPath);
-    await this.assetRepository.upsertExif({ assetId: created.id, fileSizeInByte: size });
+    await this.assetRepository.upsertExif(
+      { assetId: created.id, fileSizeInByte: size },
+      { lockedPropertiesBehavior: 'none' },
+    );
     await this.jobRepository.queue({ name: JobName.AssetExtractMetadata, data: { id: created.id, source: 'copy' } });
     return created;
   }
@@ -440,7 +443,10 @@ export class AssetMediaService extends BaseService {
       await this.storageRepository.utimes(sidecarFile.originalPath, new Date(), new Date(dto.fileModifiedAt));
     }
     await this.storageRepository.utimes(file.originalPath, new Date(), new Date(dto.fileModifiedAt));
-    await this.assetRepository.upsertExif({ assetId: asset.id, fileSizeInByte: file.size });
+    await this.assetRepository.upsertExif(
+      { assetId: asset.id, fileSizeInByte: file.size },
+      { lockedPropertiesBehavior: 'none' },
+    );
 
     await this.eventRepository.emit('AssetCreate', { asset });
 

server/src/services/asset.service.spec.ts

@@ -225,7 +225,10 @@ describe(AssetService.name, () => {
 
       await sut.update(authStub.admin, 'asset-1', { description: 'Test description' });
 
-      expect(mocks.asset.upsertExif).toHaveBeenCalledWith({ assetId: 'asset-1', description: 'Test description' });
+      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(
+        { assetId: 'asset-1', description: 'Test description', lockedProperties: ['description'] },
+        { lockedPropertiesBehavior: 'update' },
+      );
     });
 
     it('should update the exif rating', async () => {
@@ -235,7 +238,14 @@ describe(AssetService.name, () => {
 
       await sut.update(authStub.admin, 'asset-1', { rating: 3 });
 
-      expect(mocks.asset.upsertExif).toHaveBeenCalledWith({ assetId: 'asset-1', rating: 3 });
+      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(
+        {
+          assetId: 'asset-1',
+          rating: 3,
+          lockedProperties: ['rating'],
+        },
+        { lockedPropertiesBehavior: 'update' },
+      );
     });
 
     it('should fail linking a live video if the motion part could not be found', async () => {

server/src/services/asset.service.ts

@@ -30,7 +30,7 @@ import {
   QueueName,
 } from 'src/enum';
 import { BaseService } from 'src/services/base.service';
-import { ISidecarWriteJob, JobItem, JobOf } from 'src/types';
+import { JobItem, JobOf } from 'src/types';
 import { requireElevatedPermission } from 'src/utils/access';
 import { getAssetFiles, getMyPartnerIds, onAfterUnlink, onBeforeLink, onBeforeUnlink } from 'src/utils/asset.util';
 
@@ -143,9 +143,9 @@ export class AssetService extends BaseService {
     await this.requireAccess({ auth, permission: Permission.AssetUpdate, ids });
 
     const assetDto = { isFavorite, visibility, duplicateId };
-    const exifDto = { latitude, longitude, rating, description, dateTimeOriginal };
+    const exifDto = _.omitBy({ latitude, longitude, rating, description, dateTimeOriginal }, _.isUndefined);
 
-    const isExifChanged = Object.values(exifDto).some((v) => v !== undefined);
+    const isExifChanged = Object.keys(exifDto).length > 0;
     if (isExifChanged) {
       await this.assetRepository.updateAllExif(ids, exifDto);
     }
@@ -456,12 +456,25 @@ export class AssetService extends BaseService {
     return asset;
   }
 
-  private async updateExif(dto: ISidecarWriteJob) {
+  private async updateExif(dto: {
+    id: string;
+    description?: string;
+    dateTimeOriginal?: string;
+    latitude?: number;
+    longitude?: number;
+    rating?: number;
+  }) {
     const { id, description, dateTimeOriginal, latitude, longitude, rating } = dto;
     const writes = _.omitBy({ description, dateTimeOriginal, latitude, longitude, rating }, _.isUndefined);
     if (Object.keys(writes).length > 0) {
-      await this.assetRepository.upsertExif({ assetId: id, ...writes });
-      await this.jobRepository.queue({ name: JobName.SidecarWrite, data: { id, ...writes } });
+      await this.assetRepository.upsertExif(
+        {
+          assetId: id,
+          ...writes,
+        },
+        { lockedPropertiesBehavior: 'update' },
+      );
+      await this.jobRepository.queue({ name: JobName.SidecarWrite, data: { id } });
     }
   }
 }

server/src/services/metadata.service.spec.ts

@@ -187,7 +187,9 @@ describe(MetadataService.name, () => {
 
       await sut.handleMetadataExtraction({ id: assetStub.image.id });
       expect(mocks.assetJob.getForMetadataExtraction).toHaveBeenCalledWith(assetStub.sidecar.id);
-      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(expect.objectContaining({ dateTimeOriginal: sidecarDate }));
+      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(expect.objectContaining({ dateTimeOriginal: sidecarDate }), {
+        lockedPropertiesBehavior: 'skip',
+      });
       expect(mocks.asset.update).toHaveBeenCalledWith(
         expect.objectContaining({
           id: assetStub.image.id,
@@ -214,6 +216,7 @@ describe(MetadataService.name, () => {
       expect(mocks.assetJob.getForMetadataExtraction).toHaveBeenCalledWith(assetStub.image.id);
       expect(mocks.asset.upsertExif).toHaveBeenCalledWith(
         expect.objectContaining({ dateTimeOriginal: fileModifiedAt }),
+        { lockedPropertiesBehavior: 'skip' },
       );
       expect(mocks.asset.update).toHaveBeenCalledWith({
         id: assetStub.image.id,
@@ -238,7 +241,10 @@ describe(MetadataService.name, () => {
 
       await sut.handleMetadataExtraction({ id: assetStub.image.id });
       expect(mocks.assetJob.getForMetadataExtraction).toHaveBeenCalledWith(assetStub.image.id);
-      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(expect.objectContaining({ dateTimeOriginal: fileCreatedAt }));
+      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(
+        expect.objectContaining({ dateTimeOriginal: fileCreatedAt }),
+        { lockedPropertiesBehavior: 'skip' },
+      );
       expect(mocks.asset.update).toHaveBeenCalledWith({
         id: assetStub.image.id,
         duration: null,
@@ -258,6 +264,7 @@ describe(MetadataService.name, () => {
         expect.objectContaining({
           dateTimeOriginal: new Date('2022-01-01T00:00:00.000Z'),
         }),
+        { lockedPropertiesBehavior: 'skip' },
       );
 
       expect(mocks.asset.update).toHaveBeenCalledWith(
@@ -281,7 +288,9 @@ describe(MetadataService.name, () => {
 
       await sut.handleMetadataExtraction({ id: assetStub.image.id });
       expect(mocks.assetJob.getForMetadataExtraction).toHaveBeenCalledWith(assetStub.image.id);
-      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(expect.objectContaining({ iso: 160 }));
+      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(expect.objectContaining({ iso: 160 }), {
+        lockedPropertiesBehavior: 'skip',
+      });
       expect(mocks.asset.update).toHaveBeenCalledWith({
         id: assetStub.image.id,
         duration: null,
@@ -310,6 +319,7 @@ describe(MetadataService.name, () => {
       expect(mocks.assetJob.getForMetadataExtraction).toHaveBeenCalledWith(assetStub.image.id);
       expect(mocks.asset.upsertExif).toHaveBeenCalledWith(
         expect.objectContaining({ city: null, state: null, country: null }),
+        { lockedPropertiesBehavior: 'skip' },
       );
       expect(mocks.asset.update).toHaveBeenCalledWith({
         id: assetStub.withLocation.id,
@@ -339,6 +349,7 @@ describe(MetadataService.name, () => {
       expect(mocks.assetJob.getForMetadataExtraction).toHaveBeenCalledWith(assetStub.image.id);
       expect(mocks.asset.upsertExif).toHaveBeenCalledWith(
         expect.objectContaining({ city: 'City', state: 'State', country: 'Country' }),
+        { lockedPropertiesBehavior: 'skip' },
       );
       expect(mocks.asset.update).toHaveBeenCalledWith({
         id: assetStub.withLocation.id,
@@ -358,7 +369,10 @@ describe(MetadataService.name, () => {
 
       await sut.handleMetadataExtraction({ id: assetStub.image.id });
       expect(mocks.assetJob.getForMetadataExtraction).toHaveBeenCalledWith(assetStub.image.id);
-      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(expect.objectContaining({ latitude: null, longitude: null }));
+      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(
+        expect.objectContaining({ latitude: null, longitude: null }),
+        { lockedPropertiesBehavior: 'skip' },
+      );
     });
 
     it('should extract tags from TagsList', async () => {
@@ -571,6 +585,7 @@ describe(MetadataService.name, () => {
       expect(mocks.assetJob.getForMetadataExtraction).toHaveBeenCalledWith(assetStub.video.id);
       expect(mocks.asset.upsertExif).toHaveBeenCalledWith(
         expect.objectContaining({ orientation: ExifOrientation.Rotate270CW.toString() }),
+        { lockedPropertiesBehavior: 'skip' },
       );
     });
 
@@ -879,37 +894,40 @@ describe(MetadataService.name, () => {
 
       await sut.handleMetadataExtraction({ id: assetStub.image.id });
       expect(mocks.assetJob.getForMetadataExtraction).toHaveBeenCalledWith(assetStub.image.id);
-      expect(mocks.asset.upsertExif).toHaveBeenCalledWith({
-        assetId: assetStub.image.id,
-        bitsPerSample: expect.any(Number),
-        autoStackId: null,
-        colorspace: tags.ColorSpace,
-        dateTimeOriginal: dateForTest,
-        description: tags.ImageDescription,
-        exifImageHeight: null,
-        exifImageWidth: null,
-        exposureTime: tags.ExposureTime,
-        fNumber: null,
-        fileSizeInByte: 123_456,
-        focalLength: tags.FocalLength,
-        fps: null,
-        iso: tags.ISO,
-        latitude: null,
-        lensModel: tags.LensModel,
-        livePhotoCID: tags.MediaGroupUUID,
-        longitude: null,
-        make: tags.Make,
-        model: tags.Model,
-        modifyDate: expect.any(Date),
-        orientation: tags.Orientation?.toString(),
-        profileDescription: tags.ProfileDescription,
-        projectionType: 'EQUIRECTANGULAR',
-        timeZone: tags.tz,
-        rating: tags.Rating,
-        country: null,
-        state: null,
-        city: null,
-      });
+      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(
+        {
+          assetId: assetStub.image.id,
+          bitsPerSample: expect.any(Number),
+          autoStackId: null,
+          colorspace: tags.ColorSpace,
+          dateTimeOriginal: dateForTest,
+          description: tags.ImageDescription,
+          exifImageHeight: null,
+          exifImageWidth: null,
+          exposureTime: tags.ExposureTime,
+          fNumber: null,
+          fileSizeInByte: 123_456,
+          focalLength: tags.FocalLength,
+          fps: null,
+          iso: tags.ISO,
+          latitude: null,
+          lensModel: tags.LensModel,
+          livePhotoCID: tags.MediaGroupUUID,
+          longitude: null,
+          make: tags.Make,
+          model: tags.Model,
+          modifyDate: expect.any(Date),
+          orientation: tags.Orientation?.toString(),
+          profileDescription: tags.ProfileDescription,
+          projectionType: 'EQUIRECTANGULAR',
+          timeZone: tags.tz,
+          rating: tags.Rating,
+          country: null,
+          state: null,
+          city: null,
+        },
+        { lockedPropertiesBehavior: 'skip' },
+      );
       expect(mocks.asset.update).toHaveBeenCalledWith(
         expect.objectContaining({
           id: assetStub.image.id,
@@ -943,6 +961,7 @@ describe(MetadataService.name, () => {
         expect.objectContaining({
           timeZone: 'UTC+0',
         }),
+        { lockedPropertiesBehavior: 'skip' },
       );
     });
 
@@ -1089,6 +1108,7 @@ describe(MetadataService.name, () => {
         expect.objectContaining({
           description: '',
         }),
+        { lockedPropertiesBehavior: 'skip' },
       );
 
       mockReadTags({ ImageDescription: ' my\n description' });
@@ -1097,6 +1117,7 @@ describe(MetadataService.name, () => {
         expect.objectContaining({
           description: 'my\n description',
         }),
+        { lockedPropertiesBehavior: 'skip' },
       );
     });
 
@@ -1109,6 +1130,7 @@ describe(MetadataService.name, () => {
         expect.objectContaining({
           description: '1000',
         }),
+        { lockedPropertiesBehavior: 'skip' },
       );
     });
 
@@ -1332,6 +1354,7 @@ describe(MetadataService.name, () => {
         expect.objectContaining({
           modifyDate: expect.any(Date),
         }),
+        { lockedPropertiesBehavior: 'skip' },
       );
     });
 
@@ -1344,6 +1367,7 @@ describe(MetadataService.name, () => {
         expect.objectContaining({
           rating: null,
         }),
+        { lockedPropertiesBehavior: 'skip' },
       );
     });
 
@@ -1356,6 +1380,7 @@ describe(MetadataService.name, () => {
         expect.objectContaining({
           rating: 5,
         }),
+        { lockedPropertiesBehavior: 'skip' },
       );
     });
 
@@ -1368,6 +1393,7 @@ describe(MetadataService.name, () => {
         expect.objectContaining({
           rating: -1,
         }),
+        { lockedPropertiesBehavior: 'skip' },
       );
     });
 
@@ -1489,7 +1515,9 @@ describe(MetadataService.name, () => {
       mockReadTags(exif);
 
       await sut.handleMetadataExtraction({ id: assetStub.image.id });
-      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(expect.objectContaining(expected));
+      expect(mocks.asset.upsertExif).toHaveBeenCalledWith(expect.objectContaining(expected), {
+        lockedPropertiesBehavior: 'skip',
+      });
     });
 
     it.each([
@@ -1515,6 +1543,7 @@ describe(MetadataService.name, () => {
         expect.objectContaining({
           lensModel: expected,
         }),
+        { lockedPropertiesBehavior: 'skip' },
       );
     });
   });
@@ -1623,12 +1652,14 @@ describe(MetadataService.name, () => {
 
   describe('handleSidecarWrite', () => {
     it('should skip assets that no longer exist', async () => {
+      mocks.assetJob.getLockedPropertiesForMetadataExtraction.mockResolvedValue([]);
       mocks.assetJob.getForSidecarWriteJob.mockResolvedValue(void 0);
       await expect(sut.handleSidecarWrite({ id: 'asset-123' })).resolves.toBe(JobStatus.Failed);
       expect(mocks.metadata.writeTags).not.toHaveBeenCalled();
     });
 
     it('should skip jobs with no metadata', async () => {
+      mocks.assetJob.getLockedPropertiesForMetadataExtraction.mockResolvedValue([]);
       const asset = factory.jobAssets.sidecarWrite();
       mocks.assetJob.getForSidecarWriteJob.mockResolvedValue(asset);
       await expect(sut.handleSidecarWrite({ id: asset.id })).resolves.toBe(JobStatus.Skipped);
@@ -1641,20 +1672,22 @@ describe(MetadataService.name, () => {
       const gps = 12;
       const date = '2023-11-22T04:56:12.196Z';
 
+      mocks.assetJob.getLockedPropertiesForMetadataExtraction.mockResolvedValue([
+        'description',
+        'latitude',
+        'longitude',
+        'dateTimeOriginal',
+      ]);
       mocks.assetJob.getForSidecarWriteJob.mockResolvedValue(asset);
       await expect(
         sut.handleSidecarWrite({
           id: asset.id,
-          description,
-          latitude: gps,
-          longitude: gps,
-          dateTimeOriginal: date,
         }),
       ).resolves.toBe(JobStatus.Success);
       expect(mocks.metadata.writeTags).toHaveBeenCalledWith(asset.files[0].path, {
+        DateTimeOriginal: date,
         Description: description,
         ImageDescription: description,
-        DateTimeOriginal: date,
         GPSLatitude: gps,
         GPSLongitude: gps,
       });

server/src/services/metadata.service.ts

@@ -289,7 +289,7 @@ export class MetadataService extends BaseService {
     };
 
     const promises: Promise<unknown>[] = [
-      this.assetRepository.upsertExif(exifData),
+      this.assetRepository.upsertExif(exifData, { lockedPropertiesBehavior: 'skip' }),
       this.assetRepository.update({
         id: asset.id,
         duration: this.getDuration(exifTags),
@@ -392,22 +392,34 @@ export class MetadataService extends BaseService {
 
   @OnJob({ name: JobName.SidecarWrite, queue: QueueName.Sidecar })
   async handleSidecarWrite(job: JobOf<JobName.SidecarWrite>): Promise<JobStatus> {
-    const { id, description, dateTimeOriginal, latitude, longitude, rating, tags } = job;
+    const { id, tags } = job;
     const asset = await this.assetJobRepository.getForSidecarWriteJob(id);
     if (!asset) {
       return JobStatus.Failed;
     }
 
+    const lockedProperties = await this.assetJobRepository.getLockedPropertiesForMetadataExtraction(id);
     const tagsList = (asset.tags || []).map((tag) => tag.value);
 
     const { sidecarFile } = getAssetFiles(asset.files);
     const sidecarPath = sidecarFile?.path || `${asset.originalPath}.xmp`;
 
+    const { description, dateTimeOriginal, latitude, longitude, rating } = _.pick(
+      {
+        description: asset.exifInfo.description,
+        dateTimeOriginal: asset.exifInfo.dateTimeOriginal,
+        latitude: asset.exifInfo.latitude,
+        longitude: asset.exifInfo.longitude,
+        rating: asset.exifInfo.rating,
+      },
+      lockedProperties,
+    );
+
     const exif = _.omitBy(
       <Tags>{
         Description: description,
         ImageDescription: description,
-        DateTimeOriginal: dateTimeOriginal,
+        DateTimeOriginal: dateTimeOriginal?.toISOString(),
         GPSLatitude: latitude,
         GPSLongitude: longitude,
         Rating: rating,

server/src/sql-tools/decorators/column.decorator.ts

@@ -2,7 +2,7 @@ import { asOptions } from 'src/sql-tools/helpers';
 import { register } from 'src/sql-tools/register';
 import { ColumnStorage, ColumnType, DatabaseEnum } from 'src/sql-tools/types';
 
-export type ColumnValue = null | boolean | string | number | object | Date | (() => string);
+export type ColumnValue = null | boolean | string | number | Array<unknown> | object | Date | (() => string);
 
 export type ColumnBaseOptions = {
   name?: string;

server/src/sql-tools/helpers.ts

@@ -39,6 +39,10 @@ export const fromColumnValue = (columnValue?: ColumnValue) => {
     return `'${value.toISOString()}'`;
   }
 
+  if (Array.isArray(value)) {
+    return "'{}'";
+  }
+
   return `'${String(value)}'`;
 };
 

server/src/sql-tools/schema-diff.spec.ts

@@ -394,6 +394,20 @@ describe(schemaDiff.name, () => {
 
         expect(diff.items).toEqual([]);
       });
+
+      it('should support arrays, ignoring types', () => {
+        const diff = schemaDiff(
+          fromColumn({ name: 'column1', type: 'character varying', isArray: true, default: "'{}'" }),
+          fromColumn({
+            name: 'column1',
+            type: 'character varying',
+            isArray: true,
+            default: "'{}'::character varying[]",
+          }),
+        );
+
+        expect(diff.items).toEqual([]);
+      });
     });
   });
 

server/src/types.ts

@@ -222,11 +222,6 @@ export interface IDeleteFilesJob extends IBaseJob {
 }
 
 export interface ISidecarWriteJob extends IEntityJob {
-  description?: string;
-  dateTimeOriginal?: string;
-  latitude?: number;
-  longitude?: number;
-  rating?: number;
   tags?: true;
 }
 

server/test/medium.factory.ts

@@ -202,7 +202,7 @@ export class MediumTestContext<S extends BaseService = BaseService> {
   }
 
   async newExif(dto: Insertable<AssetExifTable>) {
-    const result = await this.get(AssetRepository).upsertExif(dto);
+    const result = await this.get(AssetRepository).upsertExif(dto, { lockedPropertiesBehavior: 'none' });
     return { result };
   }
 

server/test/medium/specs/services/metadata.service.spec.ts

@@ -95,6 +95,7 @@ describe(MetadataService.name, () => {
           dateTimeOriginal: new Date(expected.dateTimeOriginal),
           timeZone: expected.timeZone,
         }),
+        { lockedPropertiesBehavior: 'skip' },
       );
 
       expect(mocks.asset.update).toHaveBeenCalledWith(

server/test/medium/specs/sync/sync-album-asset-exif.spec.ts

@@ -288,10 +288,13 @@ describe(SyncRequestType.AlbumAssetExifsV1, () => {
 
     // update the asset
     const assetRepository = ctx.get(AssetRepository);
-    await assetRepository.upsertExif({
-      assetId: asset.id,
-      city: 'New City',
-    });
+    await assetRepository.upsertExif(
+      {
+        assetId: asset.id,
+        city: 'New City',
+      },
+      { lockedPropertiesBehavior: 'update' },
+    );
 
     await expect(ctx.syncStream(auth, [SyncRequestType.AlbumAssetExifsV1])).resolves.toEqual([
       {
@@ -346,10 +349,13 @@ describe(SyncRequestType.AlbumAssetExifsV1, () => {
 
     // update the asset
     const assetRepository = ctx.get(AssetRepository);
-    await assetRepository.upsertExif({
-      assetId: assetDelayedExif.id,
-      city: 'Delayed Exif',
-    });
+    await assetRepository.upsertExif(
+      {
+        assetId: assetDelayedExif.id,
+        city: 'Delayed Exif',
+      },
+      { lockedPropertiesBehavior: 'update' },
+    );
 
     await expect(ctx.syncStream(auth, [SyncRequestType.AlbumAssetExifsV1])).resolves.toEqual([
       {

server/test/small.factory.ts

@@ -4,6 +4,7 @@ import {
   AuthApiKey,
   AuthSharedLink,
   AuthUser,
+  Exif,
   Library,
   Memory,
   Partner,
@@ -319,18 +320,28 @@ const versionHistoryFactory = () => ({
   version: '1.123.45',
 });
 
-const assetSidecarWriteFactory = () => ({
-  id: newUuid(),
-  originalPath: '/path/to/original-path.jpg.xmp',
-  tags: [],
-  files: [
-    {
-      id: newUuid(),
-      path: '/path/to/original-path.jpg.xmp',
-      type: AssetFileType.Sidecar,
-    },
-  ],
-});
+const assetSidecarWriteFactory = () => {
+  const id = newUuid();
+  return {
+    id,
+    originalPath: '/path/to/original-path.jpg.xmp',
+    tags: [],
+    files: [
+      {
+        id: newUuid(),
+        path: '/path/to/original-path.jpg.xmp',
+        type: AssetFileType.Sidecar,
+      },
+    ],
+    exifInfo: {
+      assetId: id,
+      description: 'this is a description',
+      latitude: 12,
+      longitude: 12,
+      dateTimeOriginal: '2023-11-22T04:56:12.196Z',
+    } as unknown as Exif,
+  };
+};
 
 const assetOcrFactory = (
   ocr: {

server/test/sql-tools/column-default-array.stub.ts

@@ -0,0 +1,40 @@
+import { Column, DatabaseSchema, Table } from 'src/sql-tools';
+
+@Table()
+export class Table1 {
+  @Column({ type: 'character varying', array: true, default: [] })
+  column1!: string[];
+}
+
+export const description = 'should register a table with a column with a default value (array)';
+export const schema: DatabaseSchema = {
+  databaseName: 'postgres',
+  schemaName: 'public',
+  functions: [],
+  enums: [],
+  extensions: [],
+  parameters: [],
+  overrides: [],
+  tables: [
+    {
+      name: 'table1',
+      columns: [
+        {
+          name: 'column1',
+          tableName: 'table1',
+          type: 'character varying',
+          nullable: false,
+          isArray: true,
+          primary: false,
+          synchronize: true,
+          default: "'{}'",
+        },
+      ],
+      indexes: [],
+      triggers: [],
+      constraints: [],
+      synchronize: true,
+    },
+  ],
+  warnings: [],
+};

web/package.json

@@ -28,7 +28,7 @@
     "@formatjs/icu-messageformat-parser": "^2.9.8",
     "@immich/justified-layout-wasm": "^0.4.3",
     "@immich/sdk": "file:../open-api/typescript-sdk",
-    "@immich/ui": "^0.49.2",
+    "@immich/ui": "^0.50.0",
     "@mapbox/mapbox-gl-rtl-text": "0.2.3",
     "@mdi/js": "^7.4.47",
     "@photo-sphere-viewer/core": "^5.14.0",
@@ -93,7 +93,7 @@
     "factory.ts": "^1.4.1",
     "globals": "^16.0.0",
     "happy-dom": "^20.0.0",
-    "prettier": "^3.4.2",
+    "prettier": "^3.7.4",
     "prettier-plugin-organize-imports": "^4.0.0",
     "prettier-plugin-sort-json": "^4.1.1",
     "prettier-plugin-svelte": "^3.3.3",

web/src/lib/components/HeaderActionButton.svelte

@@ -0,0 +1,24 @@
+<script lang="ts">
+  import type { HeaderButtonActionItem } from '$lib/types';
+  import { Button } from '@immich/ui';
+
+  type Props = {
+    action: HeaderButtonActionItem;
+  };
+
+  const { action }: Props = $props();
+  const { title, icon, color = 'secondary', onAction } = $derived(action);
+</script>
+
+{#if action.$if?.() ?? true}
+  <Button
+    variant="ghost"
+    size="small"
+    {color}
+    leadingIcon={icon}
+    onclick={() => onAction(action)}
+    title={action.data?.title}
+  >
+    {title}
+  </Button>
+{/if}

web/src/lib/components/HeaderButton.svelte

@@ -1,17 +0,0 @@
-<script lang="ts">
-  import { type ActionItem, Button, Text } from '@immich/ui';
-
-  type Props = {
-    action: ActionItem;
-    title?: string;
-  };
-
-  const { action, title: titleAttr }: Props = $props();
-  const { title, icon, color = 'secondary', onAction } = $derived(action);
-</script>
-
-{#if action.$if?.() ?? true}
-  <Button variant="ghost" size="small" {color} leadingIcon={icon} onclick={() => onAction(action)} title={titleAttr}>
-    <Text class="hidden md:block">{title}</Text>
-  </Button>
-{/if}

web/src/lib/components/layouts/AdminPageLayout.svelte

@@ -1,19 +1,33 @@
 <script lang="ts">
   import PageContent from '$lib/components/layouts/PageContent.svelte';
-  import TitleLayout from '$lib/components/layouts/TitleLayout.svelte';
   import NavigationBar from '$lib/components/shared-components/navigation-bar/navigation-bar.svelte';
   import AdminSidebar from '$lib/sidebars/AdminSidebar.svelte';
   import { sidebarStore } from '$lib/stores/sidebar.svelte';
-  import { AppShell, AppShellHeader, AppShellSidebar, Scrollable, type BreadcrumbItem } from '@immich/ui';
+  import type { HeaderButtonActionItem } from '$lib/types';
+  import {
+    AppShell,
+    AppShellHeader,
+    AppShellSidebar,
+    Breadcrumbs,
+    Button,
+    ContextMenuButton,
+    HStack,
+    MenuItemType,
+    Scrollable,
+    isMenuItemType,
+    type BreadcrumbItem,
+  } from '@immich/ui';
+  import { mdiSlashForward } from '@mdi/js';
   import type { Snippet } from 'svelte';
+  import { t } from 'svelte-i18n';
 
   type Props = {
     breadcrumbs: BreadcrumbItem[];
-    buttons?: Snippet;
+    actions?: Array<HeaderButtonActionItem | MenuItemType>;
     children?: Snippet;
   };
 
-  let { breadcrumbs, buttons, children }: Props = $props();
+  let { breadcrumbs, actions = [], children }: Props = $props();
 </script>
 
 <AppShell>
@@ -24,11 +38,37 @@
     <AdminSidebar />
   </AppShellSidebar>
 
-  <TitleLayout {breadcrumbs} {buttons}>
+  <div class="h-full flex flex-col">
+    <div class="flex h-16 w-full justify-between items-center border-b py-2 px-4 md:px-2">
+      <Breadcrumbs items={breadcrumbs} separator={mdiSlashForward} />
+
+      {#if actions.length > 0}
+        <div class="hidden md:block">
+          <HStack gap={0}>
+            {#each actions as action, i (i)}
+              {#if !isMenuItemType(action) && (action.$if?.() ?? true)}
+                <Button
+                  variant="ghost"
+                  size="small"
+                  color={action.color ?? 'secondary'}
+                  leadingIcon={action.icon}
+                  onclick={() => action.onAction(action)}
+                  title={action.data?.title}
+                >
+                  {action.title}
+                </Button>
+              {/if}
+            {/each}
+          </HStack>
+        </div>
+
+        <ContextMenuButton aria-label={$t('open')} items={actions} class="md:hidden" />
+      {/if}
+    </div>
     <Scrollable class="grow">
       <PageContent>
         {@render children?.()}
       </PageContent>
     </Scrollable>
-  </TitleLayout>
+  </div>
 </AppShell>

web/src/lib/components/layouts/TitleLayout.svelte

@@ -1,21 +0,0 @@
-<script lang="ts">
-  import { Breadcrumbs, type BreadcrumbItem } from '@immich/ui';
-  import { mdiSlashForward } from '@mdi/js';
-  import type { Snippet } from 'svelte';
-
-  type Props = {
-    breadcrumbs: BreadcrumbItem[];
-    buttons?: Snippet;
-    children?: Snippet;
-  };
-
-  let { breadcrumbs, buttons, children }: Props = $props();
-</script>
-
-<div class="h-full flex flex-col">
-  <div class="flex h-16 w-full place-items-center justify-between border-b p-2">
-    <Breadcrumbs items={breadcrumbs} separator={mdiSlashForward} />
-    {@render buttons?.()}
-  </div>
-  {@render children?.()}
-</div>

web/src/lib/components/shared-components/search-bar/search-bar.svelte

@@ -9,9 +9,9 @@
   import { generateId } from '$lib/utils/generate-id';
   import { getMetadataSearchQuery } from '$lib/utils/metadata-search';
   import type { MetadataSearchDto, SmartSearchDto } from '@immich/sdk';
-  import { IconButton, modalManager } from '@immich/ui';
+  import { Button, IconButton, modalManager } from '@immich/ui';
   import { mdiClose, mdiMagnify, mdiTune } from '@mdi/js';
-  import { onDestroy, tick } from 'svelte';
+  import { onDestroy, onMount, tick } from 'svelte';
   import { t } from 'svelte-i18n';
   import SearchHistoryBox from './search-history-box.svelte';
 
@@ -31,6 +31,8 @@
   let isSearchSuggestions = $state(false);
   let selectedId: string | undefined = $state();
   let close: (() => Promise<void>) | undefined;
+  let showSearchTypeDropdown = $state(false);
+  let currentSearchType = $state('smart');
 
   const listboxId = generateId();
   const searchTypeId = generateId();
@@ -70,6 +72,7 @@
 
   const onFocusIn = () => {
     searchStore.isSearchEnabled = true;
+    getSearchType();
   };
 
   const onFocusOut = () => {
@@ -98,6 +101,9 @@
     const searchResult = await result.onClose;
     close = undefined;
 
+    // Refresh search type after modal closes
+    getSearchType();
+
     if (!searchResult) {
       return;
     }
@@ -139,6 +145,7 @@
 
   const onEscape = () => {
     closeDropdown();
+    closeSearchTypeDropdown();
   };
 
   const onArrow = async (direction: 1 | -1) => {
@@ -168,6 +175,20 @@
     searchHistoryBox?.clearSelection();
   };
 
+  const toggleSearchTypeDropdown = () => {
+    showSearchTypeDropdown = !showSearchTypeDropdown;
+  };
+
+  const closeSearchTypeDropdown = () => {
+    showSearchTypeDropdown = false;
+  };
+
+  const selectSearchType = (type: string) => {
+    localStorage.setItem('searchQueryType', type);
+    currentSearchType = type;
+    showSearchTypeDropdown = false;
+  };
+
   const onsubmit = (event: Event) => {
     event.preventDefault();
     onSubmit();
@@ -180,17 +201,18 @@
       case 'metadata':
       case 'description':
       case 'ocr': {
+        currentSearchType = searchType;
         return searchType;
       }
       default: {
+        currentSearchType = 'smart';
         return 'smart';
       }
     }
   }
 
   function getSearchTypeText(): string {
-    const searchType = getSearchType();
-    switch (searchType) {
+    switch (currentSearchType) {
       case 'smart': {
         return $t('context');
       }
@@ -203,8 +225,22 @@
       case 'ocr': {
         return $t('ocr');
       }
+      default: {
+        return $t('context');
+      }
     }
   }
+
+  onMount(() => {
+    getSearchType();
+  });
+
+  const searchTypes = [
+    { value: 'smart', label: () => $t('context') },
+    { value: 'metadata', label: () => $t('filename') },
+    { value: 'description', label: () => $t('description') },
+    { value: 'ocr', label: () => $t('ocr') },
+  ] as const;
 </script>
 
 <svelte:document
@@ -293,11 +329,34 @@
         class:max-md:hidden={value}
         class:end-28={value.length > 0}
       >
-        <p
-          class="bg-immich-primary text-white dark:bg-immich-dark-primary/90 dark:text-black/75 rounded-full px-3 py-1 text-xs"
-        >
-          {getSearchTypeText()}
-        </p>
+        <div class="relative">
+          <Button
+            class="bg-immich-primary text-white dark:bg-immich-dark-primary/90 dark:text-black/75 rounded-full px-3 py-1 text-xs hover:opacity-80 transition-opacity cursor-pointer"
+            onclick={toggleSearchTypeDropdown}
+            aria-expanded={showSearchTypeDropdown}
+            aria-haspopup="listbox"
+          >
+            {getSearchTypeText()}
+          </Button>
+
+          {#if showSearchTypeDropdown}
+            <div
+              class="absolute top-full right-0 mt-1 bg-white dark:bg-immich-dark-gray border border-gray-200 dark:border-gray-600 rounded-lg shadow-lg py-1 min-w-32 z-9999"
+              use:focusOutside={{ onFocusOut: closeSearchTypeDropdown }}
+            >
+              {#each searchTypes as searchType (searchType.value)}
+                <button
+                  type="button"
+                  class="w-full text-left px-3 py-2 text-xs hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors
+                         {currentSearchType === searchType.value ? 'bg-gray-100 dark:bg-gray-700' : ''}"
+                  onclick={() => selectSearchType(searchType.value)}
+                >
+                  {searchType.label()}
+                </button>
+              {/each}
+            </div>
+          {/if}
+        </div>
       </div>
     {/if}
 

web/src/lib/services/library.service.ts

@@ -28,7 +28,7 @@ export const getLibrariesActions = ($t: MessageFormatter, libraries: LibraryResp
     title: $t('scan_all_libraries'),
     type: $t('command'),
     icon: mdiSync,
-    onAction: () => void handleScanAllLibraries(),
+    onAction: () => handleScanAllLibraries(),
     shortcuts: { shift: true, key: 'r' },
     $if: () => libraries.length > 0,
   };
@@ -37,7 +37,7 @@ export const getLibrariesActions = ($t: MessageFormatter, libraries: LibraryResp
     title: $t('create_library'),
     type: $t('command'),
     icon: mdiPlusBoxOutline,
-    onAction: () => void handleCreateLibrary(),
+    onAction: () => handleCreateLibrary(),
     shortcuts: { shift: true, key: 'n' },
   };
 
@@ -49,7 +49,7 @@ export const getLibraryActions = ($t: MessageFormatter, library: LibraryResponse
     icon: mdiPencilOutline,
     type: $t('command'),
     title: $t('rename'),
-    onAction: () => void modalManager.show(LibraryRenameModal, { library }),
+    onAction: () => modalManager.show(LibraryRenameModal, { library }),
     shortcuts: { key: 'r' },
   };
 
@@ -58,7 +58,7 @@ export const getLibraryActions = ($t: MessageFormatter, library: LibraryResponse
     type: $t('command'),
     title: $t('delete'),
     color: 'danger',
-    onAction: () => void handleDeleteLibrary(library),
+    onAction: () => handleDeleteLibrary(library),
     shortcuts: { key: 'Backspace' },
   };
 
@@ -66,21 +66,21 @@ export const getLibraryActions = ($t: MessageFormatter, library: LibraryResponse
     icon: mdiPlusBoxOutline,
     type: $t('command'),
     title: $t('add'),
-    onAction: () => void modalManager.show(LibraryFolderAddModal, { library }),
+    onAction: () => modalManager.show(LibraryFolderAddModal, { library }),
   };
 
   const AddExclusionPattern: ActionItem = {
     icon: mdiPlusBoxOutline,
     type: $t('command'),
     title: $t('add'),
-    onAction: () => void modalManager.show(LibraryExclusionPatternAddModal, { library }),
+    onAction: () => modalManager.show(LibraryExclusionPatternAddModal, { library }),
   };
 
   const Scan: ActionItem = {
     icon: mdiSync,
     type: $t('command'),
     title: $t('scan_library'),
-    onAction: () => void handleScanLibrary(library),
+    onAction: () => handleScanLibrary(library),
     shortcuts: { shift: true, key: 'r' },
   };
 
@@ -92,14 +92,14 @@ export const getLibraryFolderActions = ($t: MessageFormatter, library: LibraryRe
     icon: mdiPencilOutline,
     type: $t('command'),
     title: $t('edit'),
-    onAction: () => void modalManager.show(LibraryFolderEditModal, { folder, library }),
+    onAction: () => modalManager.show(LibraryFolderEditModal, { folder, library }),
   };
 
   const Delete: ActionItem = {
     icon: mdiTrashCanOutline,
     type: $t('command'),
     title: $t('delete'),
-    onAction: () => void handleDeleteLibraryFolder(library, folder),
+    onAction: () => handleDeleteLibraryFolder(library, folder),
   };
 
   return { Edit, Delete };
@@ -114,14 +114,14 @@ export const getLibraryExclusionPatternActions = (
     icon: mdiPencilOutline,
     type: $t('command'),
     title: $t('edit'),
-    onAction: () => void modalManager.show(LibraryExclusionPatternEditModal, { exclusionPattern, library }),
+    onAction: () => modalManager.show(LibraryExclusionPatternEditModal, { exclusionPattern, library }),
   };
 
   const Delete: ActionItem = {
     icon: mdiTrashCanOutline,
     type: $t('command'),
     title: $t('delete'),
-    onAction: () => void handleDeleteExclusionPattern(library, exclusionPattern),
+    onAction: () => handleDeleteExclusionPattern(library, exclusionPattern),
   };
 
   return { Edit, Delete };
@@ -273,7 +273,7 @@ const handleDeleteLibraryFolder = async (library: LibraryResponseDto, folder: st
   });
 
   if (!confirmed) {
-    return false;
+    return;
   }
 
   try {
@@ -285,10 +285,7 @@ const handleDeleteLibraryFolder = async (library: LibraryResponseDto, folder: st
     toastManager.success($t('admin.library_updated'));
   } catch (error) {
     handleError(error, $t('errors.unable_to_update_library'));
-    return false;
   }
-
-  return true;
 };
 
 export const handleAddLibraryExclusionPattern = async (library: LibraryResponseDto, exclusionPattern: string) => {
@@ -345,9 +342,8 @@ const handleDeleteExclusionPattern = async (library: LibraryResponseDto, exclusi
   const $t = await getFormatter();
 
   const confirmed = await modalManager.showDialog({ prompt: $t('admin.library_remove_exclusion_pattern_prompt') });
-
   if (!confirmed) {
-    return false;
+    return;
   }
 
   try {
@@ -361,8 +357,5 @@ const handleDeleteExclusionPattern = async (library: LibraryResponseDto, exclusi
     toastManager.success($t('admin.library_updated'));
   } catch (error) {
     handleError(error, $t('errors.unable_to_update_library'));
-    return false;
   }
-
-  return true;
 };

web/src/lib/services/queue.service.ts

@@ -1,11 +1,20 @@
 import { goto } from '$app/navigation';
 import { AppRoute } from '$lib/constants';
 import { eventManager } from '$lib/managers/event-manager.svelte';
+import { queueManager } from '$lib/managers/queue-manager.svelte';
 import JobCreateModal from '$lib/modals/JobCreateModal.svelte';
-import { user } from '$lib/stores/user.store';
+import type { HeaderButtonActionItem } from '$lib/types';
 import { handleError } from '$lib/utils/handle-error';
 import { getFormatter } from '$lib/utils/i18n';
-import { emptyQueue, getQueue, QueueName, updateQueue, type QueueResponseDto } from '@immich/sdk';
+import {
+  emptyQueue,
+  getQueue,
+  QueueCommand,
+  QueueName,
+  runQueueCommandLegacy,
+  updateQueue,
+  type QueueResponseDto,
+} from '@immich/sdk';
 import { modalManager, toastManager, type ActionItem, type IconLike } from '@immich/ui';
 import {
   mdiClose,
@@ -23,7 +32,6 @@ import {
   mdiPlay,
   mdiPlus,
   mdiStateMachine,
-  mdiSync,
   mdiTable,
   mdiTagFaces,
   mdiTrashCanOutline,
@@ -31,7 +39,6 @@ import {
   mdiVideo,
 } from '@mdi/js';
 import type { MessageFormatter } from 'svelte-i18n';
-import { get } from 'svelte/store';
 
 type QueueItem = {
   icon: IconLike;
@@ -39,15 +46,17 @@ type QueueItem = {
   subtitle?: string;
 };
 
-export const getQueuesActions = ($t: MessageFormatter) => {
-  const ViewQueues: ActionItem = {
-    title: $t('admin.queues'),
-    description: $t('admin.queues_page_description'),
-    icon: mdiSync,
-    type: $t('page'),
-    isGlobal: true,
-    $if: () => get(user)?.isAdmin,
-    onAction: () => goto(AppRoute.ADMIN_QUEUES),
+export const getQueuesActions = ($t: MessageFormatter, queues: QueueResponseDto[] | undefined) => {
+  const pausedQueues = (queues ?? []).filter(({ isPaused }) => isPaused).map(({ name }) => name);
+
+  const ResumePaused: HeaderButtonActionItem = {
+    title: $t('resume_paused_jobs', { values: { count: pausedQueues.length } }),
+    $if: () => pausedQueues.length > 0,
+    icon: mdiPlay,
+    onAction: () => handleResumePausedJobs(pausedQueues),
+    data: {
+      title: pausedQueues.join(', '),
+    },
   };
 
   const CreateJob: ActionItem = {
@@ -68,7 +77,7 @@ export const getQueuesActions = ($t: MessageFormatter) => {
     onAction: () => goto(`${AppRoute.ADMIN_SETTINGS}?isOpen=job`),
   };
 
-  return { ViewQueues, ManageConcurrency, CreateJob };
+  return { ResumePaused, ManageConcurrency, CreateJob };
 };
 
 export const getQueueActions = ($t: MessageFormatter, queue: QueueResponseDto) => {
@@ -126,6 +135,19 @@ export const handleEmptyQueue = async (queue: QueueResponseDto) => {
   }
 };
 
+const handleResumePausedJobs = async (queues: QueueName[]) => {
+  const $t = await getFormatter();
+
+  try {
+    for (const name of queues) {
+      await runQueueCommandLegacy({ name, queueCommandDto: { command: QueueCommand.Resume, force: false } });
+    }
+    await queueManager.refresh();
+  } catch (error) {
+    handleError(error, $t('admin.failed_job_command', { values: { command: 'resume', job: 'paused jobs' } }));
+  }
+};
+
 const handleRemoveFailedJobs = async (queue: QueueResponseDto) => {
   const $t = await getFormatter();
 

web/src/lib/services/shared-link.service.ts

@@ -24,26 +24,26 @@ export const getSharedLinkActions = ($t: MessageFormatter, sharedLink: SharedLin
   const Edit: ActionItem = {
     title: $t('edit_link'),
     icon: mdiPencilOutline,
-    onAction: () => void goto(`${AppRoute.SHARED_LINKS}/${sharedLink.id}`),
+    onAction: () => goto(`${AppRoute.SHARED_LINKS}/${sharedLink.id}`),
   };
 
   const Delete: ActionItem = {
     title: $t('delete_link'),
     icon: mdiTrashCanOutline,
     color: 'danger',
-    onAction: () => void handleDeleteSharedLink(sharedLink),
+    onAction: () => handleDeleteSharedLink(sharedLink),
   };
 
   const Copy: ActionItem = {
     title: $t('copy_link'),
     icon: mdiContentCopy,
-    onAction: () => void copyToClipboard(asUrl(sharedLink)),
+    onAction: () => copyToClipboard(asUrl(sharedLink)),
   };
 
   const ViewQrCode: ActionItem = {
     title: $t('view_qr_code'),
     icon: mdiQrcode,
-    onAction: () => void handleShowSharedLinkQrCode(sharedLink),
+    onAction: () => handleShowSharedLinkQrCode(sharedLink),
   };
 
   return { Edit, Delete, Copy, ViewQrCode };
@@ -88,7 +88,7 @@ export const handleUpdateSharedLink = async (sharedLink: SharedLinkResponseDto,
   }
 };
 
-export const handleDeleteSharedLink = async (sharedLink: SharedLinkResponseDto): Promise<boolean> => {
+const handleDeleteSharedLink = async (sharedLink: SharedLinkResponseDto) => {
   const $t = await getFormatter();
   const success = await modalManager.showDialog({
     title: $t('delete_shared_link'),
@@ -96,17 +96,15 @@ export const handleDeleteSharedLink = async (sharedLink: SharedLinkResponseDto):
     confirmText: $t('delete'),
   });
   if (!success) {
-    return false;
+    return;
   }
 
   try {
     await removeSharedLink({ id: sharedLink.id });
     eventManager.emit('SharedLinkDelete', sharedLink);
     toastManager.success($t('deleted_shared_link'));
-    return true;
   } catch (error) {
     handleError(error, $t('errors.unable_to_delete_shared_link'));
-    return false;
   }
 };
 

web/src/lib/services/system-config.service.ts

@@ -20,7 +20,7 @@ export const getSystemConfigActions = (
     description: $t('admin.copy_config_to_clipboard_description'),
     type: $t('command'),
     icon: mdiContentCopy,
-    onAction: () => void handleCopyToClipboard(config),
+    onAction: () => handleCopyToClipboard(config),
     shortcuts: { shift: true, key: 'c' },
   };
 

web/src/lib/services/user-admin.service.ts

@@ -1,11 +1,13 @@
 import { goto } from '$app/navigation';
 import { eventManager } from '$lib/managers/event-manager.svelte';
+import { serverConfigManager } from '$lib/managers/server-config-manager.svelte';
 import PasswordResetSuccessModal from '$lib/modals/PasswordResetSuccessModal.svelte';
 import UserCreateModal from '$lib/modals/UserCreateModal.svelte';
 import UserDeleteConfirmModal from '$lib/modals/UserDeleteConfirmModal.svelte';
 import UserEditModal from '$lib/modals/UserEditModal.svelte';
 import UserRestoreConfirmModal from '$lib/modals/UserRestoreConfirmModal.svelte';
 import { user as authUser } from '$lib/stores/user.store';
+import type { HeaderButtonActionItem } from '$lib/types';
 import { handleError } from '$lib/utils/handle-error';
 import { getFormatter } from '$lib/utils/i18n';
 import {
@@ -28,6 +30,7 @@ import {
   mdiPlusBoxOutline,
   mdiTrashCanOutline,
 } from '@mdi/js';
+import { DateTime } from 'luxon';
 import type { MessageFormatter } from 'svelte-i18n';
 import { get } from 'svelte/store';
 
@@ -36,7 +39,7 @@ export const getUserAdminsActions = ($t: MessageFormatter) => {
     title: $t('create_user'),
     type: $t('command'),
     icon: mdiPlusBoxOutline,
-    onAction: () => void modalManager.show(UserCreateModal, {}),
+    onAction: () => modalManager.show(UserCreateModal, {}),
     shortcuts: { shift: true, key: 'n' },
   };
 
@@ -60,11 +63,17 @@ export const getUserAdminActions = ($t: MessageFormatter, user: UserAdminRespons
     shortcuts: { key: 'Backspace' },
   };
 
-  const Restore: ActionItem = {
+  const getDeleteDate = (deletedAt: string): Date =>
+    DateTime.fromISO(deletedAt).plus({ days: serverConfigManager.value.userDeleteDelay }).toJSDate();
+
+  const Restore: HeaderButtonActionItem = {
     icon: mdiDeleteRestore,
     title: $t('restore'),
     type: $t('command'),
     color: 'primary',
+    data: {
+      title: $t('admin.user_restore_scheduled_removal', { values: { date: getDeleteDate(user.deletedAt!) } }),
+    },
     $if: () => !!user.deletedAt && user.status === UserStatus.Deleted,
     onAction: () => modalManager.show(UserRestoreConfirmModal, { user }),
   };
@@ -74,14 +83,14 @@ export const getUserAdminActions = ($t: MessageFormatter, user: UserAdminRespons
     title: $t('reset_password'),
     type: $t('command'),
     $if: () => get(authUser).id !== user.id,
-    onAction: () => void handleResetPasswordUserAdmin(user),
+    onAction: () => handleResetPasswordUserAdmin(user),
   };
 
   const ResetPinCode: ActionItem = {
     icon: mdiLockSmart,
     type: $t('command'),
     title: $t('reset_pin_code'),
-    onAction: () => void handleResetPinCodeUserAdmin(user),
+    onAction: () => handleResetPinCodeUserAdmin(user),
   };
 
   return { Update, Delete, Restore, ResetPassword, ResetPinCode };
@@ -162,12 +171,12 @@ const generatePassword = (length: number = 16) => {
   return generatedPassword;
 };
 
-export const handleResetPasswordUserAdmin = async (user: UserAdminResponseDto) => {
+const handleResetPasswordUserAdmin = async (user: UserAdminResponseDto) => {
   const $t = await getFormatter();
   const prompt = $t('admin.confirm_user_password_reset', { values: { user: user.name } });
   const success = await modalManager.showDialog({ prompt });
   if (!success) {
-    return false;
+    return;
   }
 
   try {
@@ -176,28 +185,24 @@ export const handleResetPasswordUserAdmin = async (user: UserAdminResponseDto) =
     eventManager.emit('UserAdminUpdate', response);
     toastManager.success();
     await modalManager.show(PasswordResetSuccessModal, { newPassword: dto.password });
-    return true;
   } catch (error) {
     handleError(error, $t('errors.unable_to_reset_password'));
-    return false;
   }
 };
 
-export const handleResetPinCodeUserAdmin = async (user: UserAdminResponseDto) => {
+const handleResetPinCodeUserAdmin = async (user: UserAdminResponseDto) => {
   const $t = await getFormatter();
   const prompt = $t('admin.confirm_user_pin_code_reset', { values: { user: user.name } });
   const success = await modalManager.showDialog({ prompt });
   if (!success) {
-    return false;
+    return;
   }
 
   try {
     const response = await updateUserAdmin({ id: user.id, userAdminUpdateDto: { pinCode: null } });
     eventManager.emit('UserAdminUpdate', response);
     toastManager.success($t('pin_code_reset_successfully'));
-    return true;
   } catch (error) {
     handleError(error, $t('errors.unable_to_reset_pin_code'));
-    return false;
   }
 };

web/src/lib/types.ts

@@ -1,4 +1,5 @@
 import type { QueueResponseDto, ServerVersionResponseDto } from '@immich/sdk';
+import type { ActionItem } from '@immich/ui';
 
 export interface ReleaseEvent {
   isAvailable: boolean;
@@ -9,3 +10,5 @@ export interface ReleaseEvent {
 }
 
 export type QueueSnapshot = { timestamp: number; snapshot?: QueueResponseDto[] };
+
+export type HeaderButtonActionItem = ActionItem & { data?: { title?: string } };

web/src/routes/+layout.svelte

@@ -14,15 +14,15 @@
   import { themeManager } from '$lib/managers/theme-manager.svelte';
   import ServerRestartingModal from '$lib/modals/ServerRestartingModal.svelte';
   import VersionAnnouncementModal from '$lib/modals/VersionAnnouncementModal.svelte';
-  import { getQueuesActions } from '$lib/services/queue.service';
+  import { sidebarStore } from '$lib/stores/sidebar.svelte';
   import { user } from '$lib/stores/user.store';
   import { closeWebsocketConnection, openWebsocketConnection, websocketStore } from '$lib/stores/websocket';
   import type { ReleaseEvent } from '$lib/types';
   import { copyToClipboard, getReleaseType, semverToName } from '$lib/utils';
   import { maintenanceShouldRedirect } from '$lib/utils/maintenance';
   import { isAssetViewerRoute } from '$lib/utils/navigation';
-  import { CommandPaletteContext, modalManager, setTranslations, type ActionItem } from '@immich/ui';
-  import { mdiAccountMultipleOutline, mdiBookshelf, mdiCog, mdiServer, mdiThemeLightDark } from '@mdi/js';
+  import { CommandPaletteContext, modalManager, setTranslations, toastManager, type ActionItem } from '@immich/ui';
+  import { mdiAccountMultipleOutline, mdiBookshelf, mdiCog, mdiServer, mdiSync, mdiThemeLightDark } from '@mdi/js';
   import { onMount, type Snippet } from 'svelte';
   import { t } from 'svelte-i18n';
   import '../app.css';
@@ -53,6 +53,8 @@
     return new URL(page.url.pathname + page.url.search, 'https://my.immich.app');
   };
 
+  toastManager.setOptions({ class: 'top-16' });
+
   onMount(() => {
     const element = document.querySelector('#stencil');
     element?.remove();
@@ -62,6 +64,10 @@
   eventManager.emit('AppInit');
 
   beforeNavigate(({ from, to }) => {
+    if (sidebarStore.isOpen) {
+      sidebarStore.reset();
+    }
+
     if (isAssetViewerRoute(from) && isAssetViewerRoute(to)) {
       return;
     }
@@ -149,6 +155,13 @@
       icon: mdiCog,
       onAction: () => goto(AppRoute.ADMIN_SETTINGS),
     },
+    {
+      title: $t('admin.queues'),
+      description: $t('admin.queues_page_description'),
+      icon: mdiSync,
+      type: $t('page'),
+      onAction: () => goto(AppRoute.ADMIN_QUEUES),
+    },
     {
       title: $t('external_libraries'),
       description: $t('admin.external_libraries_page_description'),
@@ -163,7 +176,7 @@
     },
   ].map((route) => ({ ...route, type: $t('page'), isGlobal: true, $if: () => $user?.isAdmin }));
 
-  const commands = $derived([...userCommands, ...adminCommands, ...Object.values(getQueuesActions($t))]);
+  const commands = $derived([...userCommands, ...adminCommands]);
 </script>
 
 <OnEvents {onReleaseEvent} />

web/src/routes/admin/library-management/+page.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
   import { goto } from '$app/navigation';
-  import HeaderButton from '$lib/components/HeaderButton.svelte';
   import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import OnEvents from '$lib/components/OnEvents.svelte';
   import EmptyPlaceholder from '$lib/components/shared-components/empty-placeholder.svelte';
@@ -60,17 +59,11 @@
 
 <CommandPaletteContext commands={[Create, ScanAll]} />
 
-<AdminPageLayout breadcrumbs={[{ title: data.meta.title }]}>
-  {#snippet buttons()}
-    <div class="flex justify-end gap-2">
-      <HeaderButton action={ScanAll} />
-      <HeaderButton action={Create} />
-    </div>
-  {/snippet}
+<AdminPageLayout breadcrumbs={[{ title: data.meta.title }]} actions={[ScanAll, Create]}>
   <section class="my-4">
     <div class="flex flex-col items-center gap-2" in:fade={{ duration: 500 }}>
       {#if libraries.length > 0}
-        <table class="w-3/4 text-start">
+        <table class="text-start">
           <thead
             class="mb-4 flex h-12 w-full rounded-md border bg-gray-50 text-primary dark:border-immich-dark-gray dark:bg-immich-dark-gray"
           >

web/src/routes/admin/library-management/+page.ts

@@ -23,7 +23,7 @@ export const load = (async ({ url }) => {
     statistics: Object.fromEntries(statistics),
     owners: Object.fromEntries(owners),
     meta: {
-      title: $t('admin.external_library_management'),
+      title: $t('external_libraries'),
     },
   };
 }) satisfies PageLoad;

web/src/routes/admin/library-management/[id]/+page.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import { goto } from '$app/navigation';
   import emptyFoldersUrl from '$lib/assets/empty-folders.svg';
-  import HeaderButton from '$lib/components/HeaderButton.svelte';
+  import HeaderActionButton from '$lib/components/HeaderActionButton.svelte';
   import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import OnEvents from '$lib/components/OnEvents.svelte';
   import ServerStatisticsCard from '$lib/components/server-statistics/ServerStatisticsCard.svelte';
@@ -53,18 +53,9 @@
 <CommandPaletteContext commands={[Rename, Delete, AddFolder, AddExclusionPattern, Scan]} />
 
 <AdminPageLayout
-  breadcrumbs={[
-    { title: $t('admin.external_library_management'), href: AppRoute.ADMIN_LIBRARY_MANAGEMENT },
-    { title: library.name },
-  ]}
+  breadcrumbs={[{ title: $t('external_libraries'), href: AppRoute.ADMIN_LIBRARY_MANAGEMENT }, { title: library.name }]}
+  actions={[Scan, Rename, Delete]}
 >
-  {#snippet buttons()}
-    <div class="flex justify-end gap-2">
-      <HeaderButton action={Scan} />
-      <HeaderButton action={Rename} />
-      <HeaderButton action={Delete} />
-    </div>
-  {/snippet}
   <Container size="large" center>
     <div class="grid gap-4 grid-cols-1 lg:grid-cols-2 w-full">
       <Heading tag="h1" size="large" class="col-span-full my-4">{library.name}</Heading>
@@ -80,7 +71,7 @@
               <Icon icon={mdiFolderOutline} size="1.5rem" />
               <CardTitle>{$t('folders')}</CardTitle>
             </div>
-            <HeaderButton action={AddFolder} />
+            <HeaderActionButton action={AddFolder} />
           </div>
         </CardHeader>
         <CardBody>
@@ -120,7 +111,7 @@
               <Icon icon={mdiFilterMinusOutline} size="1.5rem" />
               <CardTitle>{$t('exclusion_pattern')}</CardTitle>
             </div>
-            <HeaderButton action={AddExclusionPattern} />
+            <HeaderActionButton action={AddExclusionPattern} />
           </div>
         </CardHeader>
         <CardBody>

web/src/routes/admin/queues/+page.svelte

@@ -1,14 +1,11 @@
 <script lang="ts">
-  import HeaderButton from '$lib/components/HeaderButton.svelte';
   import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import OnEvents from '$lib/components/OnEvents.svelte';
   import JobsPanel from '$lib/components/QueuePanel.svelte';
   import { queueManager } from '$lib/managers/queue-manager.svelte';
   import { getQueuesActions } from '$lib/services/queue.service';
-  import { handleError } from '$lib/utils/handle-error';
-  import { QueueCommand, runQueueCommandLegacy, type QueueResponseDto } from '@immich/sdk';
-  import { Button, CommandPaletteContext, HStack, Text, type ActionItem } from '@immich/ui';
-  import { mdiPlay } from '@mdi/js';
+  import { type QueueResponseDto } from '@immich/sdk';
+  import { CommandPaletteContext, type ActionItem } from '@immich/ui';
   import { onMount } from 'svelte';
   import { t } from 'svelte-i18n';
   import type { PageData } from './$types';
@@ -22,20 +19,8 @@
   onMount(() => queueManager.listen());
 
   let queues = $derived<QueueResponseDto[]>(queueManager.queues);
-  const pausedQueues = $derived(queues.filter(({ isPaused }) => isPaused).map(({ name }) => name));
 
-  const handleResumePausedJobs = async () => {
-    try {
-      for (const name of pausedQueues) {
-        await runQueueCommandLegacy({ name, queueCommandDto: { command: QueueCommand.Resume, force: false } });
-      }
-      await queueManager.refresh();
-    } catch (error) {
-      handleError(error, $t('admin.failed_job_command', { values: { command: 'resume', job: 'paused jobs' } }));
-    }
-  };
-
-  const { CreateJob, ManageConcurrency } = $derived(getQueuesActions($t));
+  const { ResumePaused, CreateJob, ManageConcurrency } = $derived(getQueuesActions($t, queueManager.queues));
   const commands: ActionItem[] = $derived([CreateJob, ManageConcurrency]);
 
   const onQueueUpdate = (update: QueueResponseDto) => {
@@ -52,27 +37,7 @@
 
 <OnEvents {onQueueUpdate} />
 
-<AdminPageLayout breadcrumbs={[{ title: data.meta.title }]}>
-  {#snippet buttons()}
-    <HStack gap={0}>
-      {#if pausedQueues.length > 0}
-        <Button
-          leadingIcon={mdiPlay}
-          onclick={handleResumePausedJobs}
-          size="small"
-          variant="ghost"
-          title={pausedQueues.join(', ')}
-        >
-          <Text class="hidden md:block">
-            {$t('resume_paused_jobs', { values: { count: pausedQueues.length } })}
-          </Text>
-        </Button>
-      {/if}
-      <HeaderButton action={CreateJob} />
-      <HeaderButton action={ManageConcurrency} />
-    </HStack>
-  {/snippet}
-
+<AdminPageLayout breadcrumbs={[{ title: data.meta.title }]} actions={[ResumePaused, CreateJob, ManageConcurrency]}>
   <section id="setting-content" class="flex place-content-center sm:mx-4">
     <section class="w-full pb-28 sm:w-5/6 md:w-212.5">
       {#if queues}

web/src/routes/admin/queues/[name]/+page.svelte

@@ -1,5 +1,4 @@
 <script lang="ts">
-  import HeaderButton from '$lib/components/HeaderButton.svelte';
   import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import OnEvents from '$lib/components/OnEvents.svelte';
   import QueueGraph from '$lib/components/QueueGraph.svelte';
@@ -7,7 +6,18 @@
   import { queueManager } from '$lib/managers/queue-manager.svelte';
   import { asQueueItem, getQueueActions } from '$lib/services/queue.service';
   import { type QueueResponseDto } from '@immich/sdk';
-  import { Badge, Card, CardBody, CardHeader, CardTitle, Container, Heading, HStack, Icon, Text } from '@immich/ui';
+  import {
+    Badge,
+    Card,
+    CardBody,
+    CardHeader,
+    CardTitle,
+    Container,
+    Heading,
+    Icon,
+    MenuItemType,
+    Text,
+  } from '@immich/ui';
   import { mdiClockTimeTwoOutline } from '@mdi/js';
   import { onMount } from 'svelte';
   import { t } from 'svelte-i18n';
@@ -35,15 +45,10 @@
 
 <OnEvents {onQueueUpdate} />
 
-<AdminPageLayout breadcrumbs={[{ title: $t('admin.queues'), href: AppRoute.ADMIN_QUEUES }, { title: item.title }]}>
-  {#snippet buttons()}
-    <HStack gap={0}>
-      <HeaderButton action={Pause} />
-      <HeaderButton action={Resume} />
-      <HeaderButton action={Empty} />
-      <HeaderButton action={RemoveFailedJobs} />
-    </HStack>
-  {/snippet}
+<AdminPageLayout
+  breadcrumbs={[{ title: $t('admin.queues'), href: AppRoute.ADMIN_QUEUES }, { title: item.title }]}
+  actions={[Pause, Resume, Empty, MenuItemType.Divider, RemoveFailedJobs]}
+>
   <div>
     <Container size="large" center>
       <div class="mb-1 mt-4 flex items-center gap-2">

web/src/routes/admin/system-settings/+page.svelte

@@ -18,7 +18,6 @@
   import ThemeSettings from '$lib/components/admin-settings/ThemeSettings.svelte';
   import TrashSettings from '$lib/components/admin-settings/TrashSettings.svelte';
   import UserSettings from '$lib/components/admin-settings/UserSettings.svelte';
-  import HeaderButton from '$lib/components/HeaderButton.svelte';
   import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import SettingAccordionState from '$lib/components/shared-components/settings/setting-accordion-state.svelte';
   import SettingAccordion from '$lib/components/shared-components/settings/setting-accordion.svelte';
@@ -27,7 +26,7 @@
   import { featureFlagsManager } from '$lib/managers/feature-flags-manager.svelte';
   import { systemConfigManager } from '$lib/managers/system-config-manager.svelte';
   import { getSystemConfigActions } from '$lib/services/system-config.service';
-  import { Alert, CommandPaletteContext, HStack } from '@immich/ui';
+  import { Alert, CommandPaletteContext } from '@immich/ui';
   import {
     mdiAccountOutline,
     mdiBackupRestore,
@@ -217,24 +216,13 @@
 
 <CommandPaletteContext commands={[CopyToClipboard, Upload, Download]} />
 
-<AdminPageLayout breadcrumbs={[{ title: data.meta.title }]}>
-  {#snippet buttons()}
-    <HStack gap={1}>
-      <div class="hidden lg:block">
-        <SearchBar placeholder={$t('search_settings')} bind:name={searchQuery} showLoadingSpinner={false} />
-      </div>
-      <HeaderButton action={CopyToClipboard} />
-      <HeaderButton action={Download} />
-      <HeaderButton action={Upload} />
-    </HStack>
-  {/snippet}
-
-  <section id="setting-content" class="flex place-content-center sm:mx-4">
+<AdminPageLayout breadcrumbs={[{ title: data.meta.title }]} actions={[CopyToClipboard, Download, Upload]}>
+  <section id="setting-content" class="flex place-content-center sm:mx-4 mt-4">
     <section class="w-full pb-28 sm:w-5/6 md:w-4xl">
       {#if featureFlagsManager.value.configFile}
         <Alert color="warning" class="text-dark my-4" title={$t('admin.config_set_by_file')} />
       {/if}
-      <div class="block lg:hidden">
+      <div>
         <SearchBar placeholder={$t('search_settings')} bind:name={searchQuery} showLoadingSpinner={false} />
       </div>
       <SettingAccordionState queryParam={QueryParameter.IS_OPEN}>

web/src/routes/admin/users/+page.svelte

@@ -1,12 +1,11 @@
 <script lang="ts">
-  import HeaderButton from '$lib/components/HeaderButton.svelte';
   import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import OnEvents from '$lib/components/OnEvents.svelte';
   import { getUserAdminsActions, handleNavigateUserAdmin } from '$lib/services/user-admin.service';
   import { locale } from '$lib/stores/preferences.store';
   import { getByteUnitString } from '$lib/utils/byte-units';
   import { searchUsersAdmin, type UserAdminResponseDto } from '@immich/sdk';
-  import { Button, CommandPaletteContext, HStack, Icon } from '@immich/ui';
+  import { Button, CommandPaletteContext, Icon } from '@immich/ui';
   import { mdiInfinity } from '@mdi/js';
   import { t } from 'svelte-i18n';
   import type { PageData } from './$types';
@@ -45,12 +44,7 @@
 
 <CommandPaletteContext commands={[Create]} />
 
-<AdminPageLayout breadcrumbs={[{ title: data.meta.title }]}>
-  {#snippet buttons()}
-    <HStack gap={1}>
-      <HeaderButton action={Create} />
-    </HStack>
-  {/snippet}
+<AdminPageLayout breadcrumbs={[{ title: data.meta.title }]} actions={[Create]}>
   <section id="setting-content" class="flex place-content-center sm:mx-4">
     <section class="w-full pb-28 lg:w-212.5">
       <table class="my-5 w-full text-start">

web/src/routes/admin/users/[id]/+page.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
   import { goto } from '$app/navigation';
-  import HeaderButton from '$lib/components/HeaderButton.svelte';
   import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import OnEvents from '$lib/components/OnEvents.svelte';
   import ServerStatisticsCard from '$lib/components/server-statistics/ServerStatisticsCard.svelte';
@@ -8,7 +7,6 @@
   import DeviceCard from '$lib/components/user-settings-page/device-card.svelte';
   import FeatureSetting from '$lib/components/users/FeatureSetting.svelte';
   import { AppRoute } from '$lib/constants';
-  import { serverConfigManager } from '$lib/managers/server-config-manager.svelte';
   import { getUserAdminActions } from '$lib/services/user-admin.service';
   import { locale } from '$lib/stores/preferences.store';
   import { createDateFormatter, findLocale } from '$lib/utils';
@@ -26,8 +24,8 @@
     Container,
     getByteUnitString,
     Heading,
-    HStack,
     Icon,
+    MenuItemType,
     Stack,
     Text,
   } from '@immich/ui';
@@ -42,15 +40,14 @@
     mdiPlayCircle,
     mdiTrashCanOutline,
   } from '@mdi/js';
-  import { DateTime } from 'luxon';
   import { t } from 'svelte-i18n';
   import type { PageData } from './$types';
 
-  interface Props {
+  type Props = {
     data: PageData;
-  }
+  };
 
-  let { data }: Props = $props();
+  const { data }: Props = $props();
 
   let user = $derived(data.user);
   const userPreferences = $derived(data.userPreferences);
@@ -94,9 +91,6 @@
       await goto(AppRoute.ADMIN_USERS);
     }
   };
-
-  const getDeleteDate = (deletedAt: string): Date =>
-    DateTime.fromISO(deletedAt).plus({ days: serverConfigManager.value.userDeleteDelay }).toJSDate();
 </script>
 
 <OnEvents
@@ -110,19 +104,8 @@
 
 <AdminPageLayout
   breadcrumbs={[{ title: $t('admin.user_management'), href: AppRoute.ADMIN_USERS }, { title: user.name }]}
+  actions={[ResetPassword, ResetPinCode, Update, Restore, MenuItemType.Divider, Delete]}
 >
-  {#snippet buttons()}
-    <HStack gap={0}>
-      <HeaderButton action={ResetPassword} />
-      <HeaderButton action={ResetPinCode} />
-      <HeaderButton action={Update} />
-      <HeaderButton
-        action={Restore}
-        title={$t('admin.user_restore_scheduled_removal', { values: { date: getDeleteDate(user.deletedAt!) } })}
-      />
-      <HeaderButton action={Delete} />
-    </HStack>
-  {/snippet}
   <div>
     <Container size="large" center>
       {#if user.deletedAt}