chore(deps): update docker.io/valkey/valkey:9 docker digest to fb8d272

* chore(mobile):  i18n: "open_asset_info" in viewer kebab menu

* feat(mobile): move some top buttons into kebabu menu

* refactor(mobile): viewer kebab menu to use context-based button generation

* feat(mobile): refactor action button and kebab menu to use ConsumerWidget for improved state management

* feat(mobile): pass original theme to ViewerKebabMenu for consistent styling

* chore: styling

---------

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

docker/docker-compose.dev.yml

@@ -127,7 +127,7 @@ services:
 
   redis:
     container_name: immich_redis
-    image: docker.io/valkey/valkey:9@sha256:4503e204c900a00ad393bec83c8c7c4c76b0529cd629e23b34b52011aefd1d27
+    image: docker.io/valkey/valkey:9@sha256:fb8d272e529ea567b9bf1302245796f21a2672b8368ca3fcb938ac334e613c8f
     healthcheck:
       test: redis-cli ping || exit 1
 

docker/docker-compose.prod.yml

@@ -56,7 +56,7 @@ services:
 
   redis:
     container_name: immich_redis
-    image: docker.io/valkey/valkey:9@sha256:4503e204c900a00ad393bec83c8c7c4c76b0529cd629e23b34b52011aefd1d27
+    image: docker.io/valkey/valkey:9@sha256:fb8d272e529ea567b9bf1302245796f21a2672b8368ca3fcb938ac334e613c8f
     healthcheck:
       test: redis-cli ping || exit 1
     restart: always

docker/docker-compose.yml

@@ -49,7 +49,7 @@ services:
 
   redis:
     container_name: immich_redis
-    image: docker.io/valkey/valkey:9@sha256:4503e204c900a00ad393bec83c8c7c4c76b0529cd629e23b34b52011aefd1d27
+    image: docker.io/valkey/valkey:9@sha256:fb8d272e529ea567b9bf1302245796f21a2672b8368ca3fcb938ac334e613c8f
     healthcheck:
       test: redis-cli ping || exit 1
     restart: always

i18n/en.json

@@ -652,6 +652,7 @@
   "backup_options_page_title": "Backup options",
   "backup_setting_subtitle": "Manage background and foreground upload settings",
   "backup_settings_subtitle": "Manage upload settings",
+  "backup_upload_details_page_more_details": "Tap for more details",
   "backward": "Backward",
   "biometric_auth_enabled": "Biometric authentication enabled",
   "biometric_locked_out": "You are locked out of biometric authentication",
@@ -718,6 +719,7 @@
   "check_corrupt_asset_backup_button": "Perform check",
   "check_corrupt_asset_backup_description": "Run this check only over Wi-Fi and once all assets have been backed-up. The procedure might take a few minutes.",
   "check_logs": "Check Logs",
+  "checksum": "Checksum",
   "choose_matching_people_to_merge": "Choose matching people to merge",
   "city": "City",
   "clear": "Clear",
@@ -1166,6 +1168,7 @@
   "header_settings_header_name_input": "Header name",
   "header_settings_header_value_input": "Header value",
   "headers_settings_tile_title": "Custom proxy headers",
+  "height": "Height",
   "hi_user": "Hi {name} ({email})",
   "hide_all_people": "Hide all people",
   "hide_gallery": "Hide gallery",
@@ -1288,6 +1291,7 @@
   "local": "Local",
   "local_asset_cast_failed": "Unable to cast an asset that is not uploaded to the server",
   "local_assets": "Local Assets",
+  "local_id": "Local ID",
   "local_media_summary": "Local Media Summary",
   "local_network": "Local network",
   "local_network_sheet_info": "The app will connect to the server through this URL when using the specified Wi-Fi network",
@@ -2218,6 +2222,7 @@
   "week": "Week",
   "welcome": "Welcome",
   "welcome_to_immich": "Welcome to Immich",
+  "width": "Width",
   "wifi_name": "Wi-Fi Name",
   "workflow": "Workflow",
   "wrong_pin_code": "Wrong PIN code",

mobile/lib/pages/backup/drift_upload_detail.page.dart

@@ -98,7 +98,7 @@ class DriftUploadDetailPage extends ConsumerWidget {
                             ),
                           ),
                         Text(
-                          'Tap for more details',
+                          "backup_upload_details_page_more_details".t(context: context),
                           style: context.textTheme.bodySmall?.copyWith(
                             color: context.colorScheme.onSurface.withValues(alpha: 0.6),
                           ),
@@ -239,14 +239,20 @@ class FileDetailDialog extends ConsumerWidget {
                   const SizedBox(height: 24),
                   if (asset != null) ...[
                     _buildInfoSection(context, [
-                      _buildInfoRow(context, "Filename", path.basename(uploadStatus.filename)),
-                      _buildInfoRow(context, "Local ID", asset.id),
-                      _buildInfoRow(context, "File Size", formatHumanReadableBytes(uploadStatus.fileSize, 2)),
-                      if (asset.width != null) _buildInfoRow(context, "Width", "${asset.width}px"),
-                      if (asset.height != null) _buildInfoRow(context, "Height", "${asset.height}px"),
-                      _buildInfoRow(context, "Created At", asset.createdAt.toString()),
-                      _buildInfoRow(context, "Updated At", asset.updatedAt.toString()),
-                      if (asset.checksum != null) _buildInfoRow(context, "Checksum", asset.checksum!),
+                      _buildInfoRow(context, "filename".t(context: context), path.basename(uploadStatus.filename)),
+                      _buildInfoRow(context, "local_id".t(context: context), asset.id),
+                      _buildInfoRow(
+                        context,
+                        "file_size".t(context: context),
+                        formatHumanReadableBytes(uploadStatus.fileSize, 2),
+                      ),
+                      if (asset.width != null) _buildInfoRow(context, "width".t(context: context), "${asset.width}px"),
+                      if (asset.height != null)
+                        _buildInfoRow(context, "height".t(context: context), "${asset.height}px"),
+                      _buildInfoRow(context, "created_at".t(context: context), asset.createdAt.toString()),
+                      _buildInfoRow(context, "updated_at".t(context: context), asset.updatedAt.toString()),
+                      if (asset.checksum != null)
+                        _buildInfoRow(context, "checksum".t(context: context), asset.checksum!),
                     ]),
                   ],
                 ],

mobile/lib/presentation/widgets/action_buttons/add_action_button.widget.dart

@@ -174,10 +174,12 @@ class _AddActionButtonState extends ConsumerState<AddActionButton> {
       consumeOutsideTap: true,
       style: MenuStyle(
         backgroundColor: WidgetStatePropertyAll(themeData.scaffoldBackgroundColor),
+        surfaceTintColor: const WidgetStatePropertyAll(Colors.grey),
         elevation: const WidgetStatePropertyAll(4),
         shape: const WidgetStatePropertyAll(
           RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(12))),
         ),
+        padding: const WidgetStatePropertyAll(EdgeInsets.symmetric(vertical: 6)),
       ),
       menuChildren: widget.originalTheme != null
           ? [

mobile/lib/presentation/widgets/action_buttons/base_action_button.widget.dart

@@ -1,7 +1,8 @@
 import 'package:flutter/material.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/extensions/build_context_extensions.dart';
 
-class BaseActionButton extends StatelessWidget {
+class BaseActionButton extends ConsumerWidget {
   const BaseActionButton({
     super.key,
     required this.label,
@@ -30,7 +31,7 @@ class BaseActionButton extends StatelessWidget {
   final void Function()? onLongPressed;
 
   @override
-  Widget build(BuildContext context) {
+  Widget build(BuildContext context, WidgetRef ref) {
     final miniWidth = minWidth ?? (context.isMobile ? context.width / 4.5 : 75.0);
     final iconTheme = IconTheme.of(context);
     final iconSize = iconTheme.size ?? 24.0;
@@ -46,14 +47,13 @@ class BaseActionButton extends StatelessWidget {
 
     if (menuItem) {
       final theme = context.themeData;
-      final effectiveStyle = theme.textTheme.labelLarge;
       final effectiveIconColor = iconColor ?? theme.iconTheme.color ?? theme.colorScheme.onSurfaceVariant;
 
       return MenuItemButton(
-        style: MenuItemButton.styleFrom(padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12)),
-        leadingIcon: Icon(iconData, color: effectiveIconColor, size: 20),
+        style: MenuItemButton.styleFrom(alignment: Alignment.centerLeft, padding: const EdgeInsets.all(16)),
+        leadingIcon: Icon(iconData, color: effectiveIconColor),
         onPressed: onPressed,
-        child: Text(label, style: effectiveStyle),
+        child: Text(label, style: theme.textTheme.labelLarge?.copyWith(fontSize: 16)),
       );
     }
 

mobile/lib/presentation/widgets/action_buttons/cast_action_button.widget.dart

@@ -7,7 +7,7 @@ import 'package:immich_mobile/providers/cast.provider.dart';
 import 'package:immich_mobile/widgets/asset_viewer/cast_dialog.dart';
 
 class CastActionButton extends ConsumerWidget {
-  const CastActionButton({super.key, this.iconOnly = true, this.menuItem = false});
+  const CastActionButton({super.key, this.iconOnly = false, this.menuItem = false});
 
   final bool iconOnly;
   final bool menuItem;

mobile/lib/presentation/widgets/action_buttons/motion_photo_action_button.widget.dart

@@ -5,7 +5,7 @@ import 'package:immich_mobile/presentation/widgets/action_buttons/base_action_bu
 import 'package:immich_mobile/providers/asset_viewer/is_motion_video_playing.provider.dart';
 
 class MotionPhotoActionButton extends ConsumerWidget {
-  const MotionPhotoActionButton({super.key, this.iconOnly = true, this.menuItem = false});
+  const MotionPhotoActionButton({super.key, this.iconOnly = false, this.menuItem = false});
 
   final bool iconOnly;
   final bool menuItem;

mobile/lib/presentation/widgets/asset_viewer/top_app_bar.widget.dart

@@ -4,26 +4,19 @@ import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/constants/enums.dart';
 import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
 import 'package:immich_mobile/domain/models/events.model.dart';
-import 'package:immich_mobile/domain/services/timeline.service.dart';
 import 'package:immich_mobile/domain/utils/event_stream.dart';
 import 'package:immich_mobile/extensions/build_context_extensions.dart';
-import 'package:immich_mobile/extensions/translate_extensions.dart';
-import 'package:immich_mobile/presentation/widgets/action_buttons/cast_action_button.widget.dart';
-import 'package:immich_mobile/presentation/widgets/action_buttons/download_action_button.widget.dart';
 import 'package:immich_mobile/presentation/widgets/action_buttons/favorite_action_button.widget.dart';
 import 'package:immich_mobile/presentation/widgets/action_buttons/motion_photo_action_button.widget.dart';
 import 'package:immich_mobile/presentation/widgets/action_buttons/unfavorite_action_button.widget.dart';
 import 'package:immich_mobile/presentation/widgets/asset_viewer/asset_viewer.state.dart';
 import 'package:immich_mobile/presentation/widgets/asset_viewer/viewer_kebab_menu.widget.dart';
 import 'package:immich_mobile/providers/activity.provider.dart';
-import 'package:immich_mobile/providers/cast.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/asset_viewer/current_asset.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/current_album.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/readonly_mode.provider.dart';
-import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart';
 import 'package:immich_mobile/providers/routes.provider.dart';
 import 'package:immich_mobile/providers/user.provider.dart';
-import 'package:immich_mobile/routing/router.dart';
 
 class ViewerTopAppBar extends ConsumerWidget implements PreferredSizeWidget {
   const ViewerTopAppBar({super.key});
@@ -42,15 +35,6 @@ class ViewerTopAppBar extends ConsumerWidget implements PreferredSizeWidget {
     final isInLockedView = ref.watch(inLockedViewProvider);
     final isReadonlyModeEnabled = ref.watch(readonlyModeProvider);
 
-    final timelineOrigin = ref.read(timelineServiceProvider).origin;
-    final showViewInTimelineButton =
-        timelineOrigin != TimelineOrigin.main &&
-        timelineOrigin != TimelineOrigin.deepLink &&
-        timelineOrigin != TimelineOrigin.trash &&
-        timelineOrigin != TimelineOrigin.archive &&
-        timelineOrigin != TimelineOrigin.localAlbum &&
-        isOwner;
-
     final isShowingSheet = ref.watch(assetViewerProvider.select((state) => state.showingBottomSheet));
     int opacity = ref.watch(assetViewerProvider.select((state) => state.backgroundOpacity));
     final showControls = ref.watch(assetViewerProvider.select((s) => s.showingControls));
@@ -63,11 +47,10 @@ class ViewerTopAppBar extends ConsumerWidget implements PreferredSizeWidget {
       opacity = 0;
     }
 
-    final isCasting = ref.watch(castProvider.select((c) => c.isCasting));
+    final originalTheme = context.themeData;
 
     final actions = <Widget>[
-      if (asset.isRemoteOnly) const DownloadActionButton(source: ActionSource.viewer, iconOnly: true),
-      if (isCasting || (asset.hasRemote)) const CastActionButton(iconOnly: true),
+      if (asset.isMotionPhoto) const MotionPhotoActionButton(iconOnly: true),
       if (album != null && album.isActivityEnabled && album.isShared)
         IconButton(
           icon: const Icon(Icons.chat_outlined),
@@ -75,28 +58,16 @@ class ViewerTopAppBar extends ConsumerWidget implements PreferredSizeWidget {
             EventStream.shared.emit(const ViewerOpenBottomSheetEvent(activitiesMode: true));
           },
         ),
-      if (showViewInTimelineButton)
-        IconButton(
-          onPressed: () async {
-            await context.maybePop();
-            await context.navigateTo(const TabShellRoute(children: [MainTimelineRoute()]));
-            EventStream.shared.emit(ScrollToDateEvent(asset.createdAt));
-          },
-          icon: const Icon(Icons.image_search),
-          tooltip: 'view_in_timeline'.t(context: context),
-        ),
+
       if (asset.hasRemote && isOwner && !asset.isFavorite)
         const FavoriteActionButton(source: ActionSource.viewer, iconOnly: true),
       if (asset.hasRemote && isOwner && asset.isFavorite)
         const UnFavoriteActionButton(source: ActionSource.viewer, iconOnly: true),
-      if (asset.isMotionPhoto) const MotionPhotoActionButton(iconOnly: true),
-      const ViewerKebabMenu(),
+
+      ViewerKebabMenu(originalTheme: originalTheme),
     ];
 
-    final lockedViewActions = <Widget>[
-      if (isCasting || (asset.hasRemote)) const CastActionButton(iconOnly: true),
-      const ViewerKebabMenu(),
-    ];
+    final lockedViewActions = <Widget>[ViewerKebabMenu(originalTheme: originalTheme)];
 
     return IgnorePointer(
       ignoring: opacity < 255,

mobile/lib/presentation/widgets/asset_viewer/viewer_kebab_menu.widget.dart

@@ -1,14 +1,17 @@
-import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
-import 'package:immich_mobile/domain/models/events.model.dart';
-import 'package:immich_mobile/domain/utils/event_stream.dart';
+import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
 import 'package:immich_mobile/extensions/build_context_extensions.dart';
-import 'package:immich_mobile/presentation/widgets/action_buttons/base_action_button.widget.dart';
+import 'package:immich_mobile/providers/cast.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/asset_viewer/current_asset.provider.dart';
+import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart';
+import 'package:immich_mobile/providers/user.provider.dart';
+import 'package:immich_mobile/utils/action_button.utils.dart';
 
 class ViewerKebabMenu extends ConsumerWidget {
-  const ViewerKebabMenu({super.key});
+  const ViewerKebabMenu({super.key, this.originalTheme});
+
+  final ThemeData? originalTheme;
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
@@ -17,25 +20,42 @@ class ViewerKebabMenu extends ConsumerWidget {
       return const SizedBox.shrink();
     }
 
-    final menuChildren = <Widget>[
-      BaseActionButton(
-        label: 'about'.tr(),
-        iconData: Icons.info_outline,
-        menuItem: true,
-        onPressed: () => EventStream.shared.emit(const ViewerOpenBottomSheetEvent()),
-      ),
-    ];
+    final user = ref.watch(currentUserProvider);
+    final isOwner = asset is RemoteAsset && asset.ownerId == user?.id;
+    final isCasting = ref.watch(castProvider.select((c) => c.isCasting));
+    final timelineOrigin = ref.read(timelineServiceProvider).origin;
+
+    final kebabContext = ViewerKebabMenuButtonContext(
+      asset: asset,
+      isOwner: isOwner,
+      isCasting: isCasting,
+      timelineOrigin: timelineOrigin,
+      originalTheme: originalTheme,
+    );
+
+    final menuChildren = ViewerKebabMenuButtonBuilder.build(kebabContext, context, ref);
 
     return MenuAnchor(
       consumeOutsideTap: true,
       style: MenuStyle(
         backgroundColor: WidgetStatePropertyAll(context.themeData.scaffoldBackgroundColor),
+        surfaceTintColor: const WidgetStatePropertyAll(Colors.grey),
         elevation: const WidgetStatePropertyAll(4),
         shape: const WidgetStatePropertyAll(
           RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(12))),
         ),
+        padding: const WidgetStatePropertyAll(EdgeInsets.symmetric(vertical: 6)),
       ),
-      menuChildren: menuChildren,
+      menuChildren: [
+        ConstrainedBox(
+          constraints: const BoxConstraints(minWidth: 150),
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            crossAxisAlignment: CrossAxisAlignment.stretch,
+            children: menuChildren,
+          ),
+        ),
+      ],
       builder: (context, controller, child) {
         return IconButton(
           icon: const Icon(Icons.more_vert_rounded),

mobile/lib/utils/action_button.utils.dart

@@ -1,9 +1,18 @@
-import 'package:flutter/widgets.dart';
+import 'package:auto_route/auto_route.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/constants/enums.dart';
 import 'package:immich_mobile/domain/models/album/album.model.dart';
 import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
+import 'package:immich_mobile/domain/models/events.model.dart';
+import 'package:immich_mobile/domain/services/timeline.service.dart';
+import 'package:immich_mobile/domain/utils/event_stream.dart';
+import 'package:immich_mobile/extensions/translate_extensions.dart';
 import 'package:immich_mobile/presentation/widgets/action_buttons/advanced_info_action_button.widget.dart';
 import 'package:immich_mobile/presentation/widgets/action_buttons/archive_action_button.widget.dart';
+import 'package:immich_mobile/presentation/widgets/action_buttons/base_action_button.widget.dart';
+import 'package:immich_mobile/presentation/widgets/action_buttons/cast_action_button.widget.dart';
 import 'package:immich_mobile/presentation/widgets/action_buttons/delete_action_button.widget.dart';
 import 'package:immich_mobile/presentation/widgets/action_buttons/delete_local_action_button.widget.dart';
 import 'package:immich_mobile/presentation/widgets/action_buttons/delete_permanent_action_button.widget.dart';
@@ -19,6 +28,7 @@ import 'package:immich_mobile/presentation/widgets/action_buttons/trash_action_b
 import 'package:immich_mobile/presentation/widgets/action_buttons/unarchive_action_button.widget.dart';
 import 'package:immich_mobile/presentation/widgets/action_buttons/unstack_action_button.widget.dart';
 import 'package:immich_mobile/presentation/widgets/action_buttons/upload_action_button.widget.dart';
+import 'package:immich_mobile/routing/router.dart';
 
 class ActionButtonContext {
   final BaseAsset asset;
@@ -164,3 +174,98 @@ class ActionButtonBuilder {
     return _actionTypes.where((type) => type.shouldShow(context)).map((type) => type.buildButton(context)).toList();
   }
 }
+
+class ViewerKebabMenuButtonContext {
+  final BaseAsset asset;
+  final bool isOwner;
+  final bool isCasting;
+  final TimelineOrigin timelineOrigin;
+  final ThemeData? originalTheme;
+
+  const ViewerKebabMenuButtonContext({
+    required this.asset,
+    required this.isOwner,
+    required this.isCasting,
+    required this.timelineOrigin,
+    this.originalTheme,
+  });
+}
+
+enum ViewerKebabMenuButtonType {
+  openInfo,
+  viewInTimeline,
+  cast,
+  download;
+
+  /// Defines which group each button belongs to.
+  /// Buttons in the same group will be displayed together,
+  /// with dividers separating different groups.
+  int get group => switch (this) {
+    ViewerKebabMenuButtonType.openInfo => 0,
+    ViewerKebabMenuButtonType.viewInTimeline => 1,
+    ViewerKebabMenuButtonType.cast => 1,
+    ViewerKebabMenuButtonType.download => 1,
+  };
+
+  bool shouldShow(ViewerKebabMenuButtonContext context) {
+    return switch (this) {
+      ViewerKebabMenuButtonType.openInfo => true,
+      ViewerKebabMenuButtonType.viewInTimeline =>
+        context.timelineOrigin != TimelineOrigin.main &&
+            context.timelineOrigin != TimelineOrigin.deepLink &&
+            context.timelineOrigin != TimelineOrigin.trash &&
+            context.timelineOrigin != TimelineOrigin.archive &&
+            context.timelineOrigin != TimelineOrigin.localAlbum &&
+            context.isOwner,
+      ViewerKebabMenuButtonType.cast => context.isCasting || context.asset.hasRemote,
+      ViewerKebabMenuButtonType.download => context.asset.isRemoteOnly,
+    };
+  }
+
+  ConsumerWidget buildButton(ViewerKebabMenuButtonContext context, BuildContext buildContext) {
+    return switch (this) {
+      ViewerKebabMenuButtonType.openInfo => BaseActionButton(
+        label: 'info'.tr(),
+        iconData: Icons.info_outline,
+        iconColor: context.originalTheme?.iconTheme.color,
+        menuItem: true,
+        onPressed: () => EventStream.shared.emit(const ViewerOpenBottomSheetEvent()),
+      ),
+
+      ViewerKebabMenuButtonType.viewInTimeline => BaseActionButton(
+        label: 'view_in_timeline'.t(context: buildContext),
+        iconData: Icons.image_search,
+        iconColor: context.originalTheme?.iconTheme.color,
+        menuItem: true,
+        onPressed: () async {
+          await buildContext.maybePop();
+          await buildContext.navigateTo(const TabShellRoute(children: [MainTimelineRoute()]));
+          EventStream.shared.emit(ScrollToDateEvent(context.asset.createdAt));
+        },
+      ),
+      ViewerKebabMenuButtonType.cast => const CastActionButton(menuItem: true),
+      ViewerKebabMenuButtonType.download => const DownloadActionButton(source: ActionSource.viewer, menuItem: true),
+    };
+  }
+}
+
+class ViewerKebabMenuButtonBuilder {
+  static List<Widget> build(ViewerKebabMenuButtonContext context, BuildContext buildContext, WidgetRef ref) {
+    final visibleButtons = ViewerKebabMenuButtonType.values.where((type) => type.shouldShow(context)).toList();
+
+    if (visibleButtons.isEmpty) return [];
+
+    final List<Widget> result = [];
+    int? lastGroup;
+
+    for (final type in visibleButtons) {
+      if (lastGroup != null && type.group != lastGroup) {
+        result.add(const Divider(height: 1));
+      }
+      result.add(type.buildButton(context, buildContext).build(buildContext, ref));
+      lastGroup = type.group;
+    }
+
+    return result;
+  }
+}

pnpm-lock.yaml

@@ -717,8 +717,8 @@ importers:
         specifier: file:../open-api/typescript-sdk
         version: link:../open-api/typescript-sdk
       '@immich/ui':
-        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)
+        specifier: ^0.50.1
+        version: 0.50.1(@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)
@@ -2989,8 +2989,8 @@ packages:
     peerDependencies:
       svelte: ^5.0.0
 
-  '@immich/ui@0.50.0':
-    resolution: {integrity: sha512-7AW9SRZTAgal8xlkUAxm7o4+pSG7HcKb+Bh9JpWLaDRRdGyPCZMmsNa9CjZglOQ7wkAD07tQ9u4+zezBLe0dlQ==}
+  '@immich/ui@0.50.1':
+    resolution: {integrity: sha512-fNlQGh75ZFa/UZAgJaYk9/ItHOXHNNzN4CunjCmE7WocVVkUZbUxopN9Ku3F5GULSqD/zJ5gNO6PQAZ1ZoSaaQ==}
     peerDependencies:
       svelte: ^5.0.0
 
@@ -14701,7 +14701,7 @@ snapshots:
     dependencies:
       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)':
+  '@immich/ui@0.50.1(@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

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.50.0",
+    "@immich/ui": "^0.50.1",
     "@mapbox/mapbox-gl-rtl-text": "0.2.3",
     "@mdi/js": "^7.4.47",
     "@photo-sphere-viewer/core": "^5.14.0",

web/src/lib/managers/AssetCacheManager.svelte.ts

@@ -1,52 +0,0 @@
-import { getAssetInfo, getAssetOcr, type AssetOcrResponseDto, type AssetResponseDto } from '@immich/sdk';
-
-class AsyncCache<V> {
-  #cache = new Map<string, V>();
-
-  async getOrFetch<K>(
-    params: K,
-    fetcher: (params: K) => Promise<V>,
-    keySerializer: (params: K) => string = (params) => JSON.stringify(params),
-  ): Promise<V> {
-    const cacheKey = keySerializer(params);
-
-    const cached = this.#cache.get(cacheKey);
-    if (cached) {
-      return cached;
-    }
-
-    const value = await fetcher(params);
-    if (value) {
-      this.#cache.set(cacheKey, value);
-    }
-
-    return value;
-  }
-
-  clear() {
-    this.#cache.clear();
-  }
-}
-
-class AssetCacheManager {
-  #assetCache = new AsyncCache<AssetResponseDto>();
-  #ocrCache = new AsyncCache<AssetOcrResponseDto[]>();
-
-  async getAsset(assetIdentifier: { key?: string; slug?: string; id: string }) {
-    return this.#assetCache.getOrFetch(assetIdentifier, getAssetInfo);
-  }
-
-  async getAssetOcr(id: string) {
-    return this.#ocrCache.getOrFetch({ id }, getAssetOcr, (params) => params.id);
-  }
-
-  clearAssetCache() {
-    this.#assetCache.clear();
-  }
-
-  clearOcrCache() {
-    this.#ocrCache.clear();
-  }
-}
-
-export const assetCacheManager = new AssetCacheManager();

web/src/lib/utils/navigation.ts

@@ -1,8 +1,8 @@
 import { goto } from '$app/navigation';
 import { page } from '$app/stores';
-import type { RouteId } from '$app/types';
 import { AppRoute } from '$lib/constants';
-import { assetCacheManager } from '$lib/managers/AssetCacheManager.svelte';
+import { getAssetInfo } from '@immich/sdk';
+import type { NavigationTarget } from '@sveltejs/kit';
 import { get } from 'svelte/store';
 
 export type AssetGridRouteSearchParams = {
@@ -20,12 +20,11 @@ export const isAlbumsRoute = (route?: string | null) => !!route?.startsWith('/(u
 export const isPeopleRoute = (route?: string | null) => !!route?.startsWith('/(user)/people/[personId]');
 export const isLockedFolderRoute = (route?: string | null) => !!route?.startsWith('/(user)/locked');
 
-export const isAssetViewerRoute = (
-  target?: { route?: { id?: RouteId | null }; params?: Record<string, string> | null } | null,
-) => !!(target?.route?.id?.endsWith('/[[assetId=id]]') && 'assetId' in (target?.params || {}));
+export const isAssetViewerRoute = (target?: NavigationTarget | null) =>
+  !!(target?.route.id?.endsWith('/[[assetId=id]]') && 'assetId' in (target?.params || {}));
 
 export function getAssetInfoFromParam({ assetId, slug, key }: { assetId?: string; key?: string; slug?: string }) {
-  return assetId ? assetCacheManager.getAsset({ id: assetId, slug, key }) : undefined;
+  return assetId ? getAssetInfo({ id: assetId, slug, key }) : undefined;
 }
 
 function currentUrlWithoutAsset() {