feat(web): show ocr text boxes in panoramas

cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@immich/cli",
-  "version": "2.5.2",
+  "version": "2.5.1",
   "description": "Command Line Interface (CLI) for Immich",
   "type": "module",
   "exports": "./dist/index.js",

docs/static/archived-versions.json

@@ -1,7 +1,7 @@
 [
   {
-    "label": "v2.5.2",
-    "url": "https://docs.v2.5.2.archive.immich.app"
+    "label": "v2.5.1",
+    "url": "https://docs.v2.5.1.archive.immich.app"
   },
   {
     "label": "v2.4.1",

e2e/package.json

@@ -1,6 +1,6 @@
 {
   "name": "immich-e2e",
-  "version": "2.5.2",
+  "version": "2.5.1",
   "description": "",
   "main": "index.js",
   "type": "module",

i18n/package.json

@@ -1,6 +1,6 @@
 {
   "name": "immich-i18n",
-  "version": "2.5.2",
+  "version": "2.5.1",
   "private": true,
   "scripts": {
     "format": "prettier --check .",

machine-learning/pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "immich-ml"
-version = "2.5.2"
+version = "2.5.1"
 description = ""
 authors = [{ name = "Hau Tran", email = "alex.tran1502@gmail.com" }]
 requires-python = ">=3.11,<4.0"

machine-learning/uv.lock

@@ -919,7 +919,7 @@ wheels = [
 
 [[package]]
 name = "immich-ml"
-version = "2.5.2"
+version = "2.4.1"
 source = { editable = "." }
 dependencies = [
     { name = "aiocache" },

mobile/android/fastlane/Fastfile

@@ -35,8 +35,8 @@ platform :android do
       task: 'bundle', 
       build_type: 'Release',
       properties: {
-        "android.injected.version.code" => 3033,
-        "android.injected.version.name" => "2.5.2",
+        "android.injected.version.code" => 3032,
+        "android.injected.version.name" => "2.5.1",
       }
     )
     upload_to_play_store(skip_upload_apk: true, skip_upload_images: true, skip_upload_screenshots: true, aab: '../build/app/outputs/bundle/release/app-release.aab')

mobile/ios/Runner/Images/RemoteImagesImpl.swift

@@ -79,7 +79,6 @@ class RemoteImageApiDelegate: NSObject, URLSessionDataDelegate {
     kCGImageSourceShouldCache: false,
     kCGImageSourceShouldCacheImmediately: true,
     kCGImageSourceCreateThumbnailWithTransform: true,
-    kCGImageSourceCreateThumbnailFromImageAlways: true
   ] as CFDictionary
   
   func urlSession(

mobile/ios/Runner/Info.plist

@@ -80,7 +80,7 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>2.5.2</string>
+	<string>2.5.1</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleURLTypes</key>

mobile/lib/domain/models/store.model.dart

@@ -89,9 +89,7 @@ enum StoreKey<T> {
   cleanupKeepMediaType<int>._(1009),
   cleanupKeepAlbumIds<String>._(1010),
   cleanupCutoffDaysAgo<int>._(1011),
-  cleanupDefaultsInitialized<bool>._(1012),
-
-  syncMigrationStatus<String>._(1013);
+  cleanupDefaultsInitialized<bool>._(1012);
 
   const StoreKey._(this.id);
   final int id;

mobile/lib/domain/services/sync_stream.service.dart

@@ -1,7 +1,4 @@
-// ignore_for_file: constant_identifier_names
-
 import 'dart:async';
-import 'dart:convert';
 
 import 'package:immich_mobile/domain/models/store.model.dart';
 import 'package:immich_mobile/domain/models/sync_event.model.dart';
@@ -10,21 +7,12 @@ import 'package:immich_mobile/extensions/platform_extensions.dart';
 import 'package:immich_mobile/infrastructure/repositories/local_asset.repository.dart';
 import 'package:immich_mobile/infrastructure/repositories/storage.repository.dart';
 import 'package:immich_mobile/infrastructure/repositories/sync_api.repository.dart';
-import 'package:immich_mobile/infrastructure/repositories/sync_migration.repository.dart';
 import 'package:immich_mobile/infrastructure/repositories/sync_stream.repository.dart';
 import 'package:immich_mobile/infrastructure/repositories/trashed_local_asset.repository.dart';
 import 'package:immich_mobile/repositories/local_files_manager.repository.dart';
-import 'package:immich_mobile/services/api.service.dart';
-import 'package:immich_mobile/utils/semver.dart';
 import 'package:logging/logging.dart';
 import 'package:openapi/api.dart';
 
-enum SyncMigrationTask {
-  v20260128_ResetExifV1, // EXIF table has incorrect width and height information.
-  v20260128_CopyExifWidthHeightToAsset, // Asset table has incorrect width and height for video ratio calculations.
-  v20260128_ResetAssetV1, // Asset v2.5.0 has width and height information that were edited assets.
-}
-
 class SyncStreamService {
   final Logger _logger = Logger('SyncStreamService');
 
@@ -34,8 +22,6 @@ class SyncStreamService {
   final DriftTrashedLocalAssetRepository _trashedLocalAssetRepository;
   final LocalFilesManagerRepository _localFilesManager;
   final StorageRepository _storageRepository;
-  final SyncMigrationRepository _syncMigrationRepository;
-  final ApiService _api;
   final bool Function()? _cancelChecker;
 
   SyncStreamService({
@@ -45,8 +31,6 @@ class SyncStreamService {
     required DriftTrashedLocalAssetRepository trashedLocalAssetRepository,
     required LocalFilesManagerRepository localFilesManager,
     required StorageRepository storageRepository,
-    required SyncMigrationRepository syncMigrationRepository,
-    required ApiService api,
     bool Function()? cancelChecker,
   }) : _syncApiRepository = syncApiRepository,
        _syncStreamRepository = syncStreamRepository,
@@ -54,32 +38,12 @@ class SyncStreamService {
        _trashedLocalAssetRepository = trashedLocalAssetRepository,
        _localFilesManager = localFilesManager,
        _storageRepository = storageRepository,
-       _syncMigrationRepository = syncMigrationRepository,
-       _api = api,
        _cancelChecker = cancelChecker;
 
   bool get isCancelled => _cancelChecker?.call() ?? false;
 
   Future<bool> sync() async {
     _logger.info("Remote sync request for user");
-    final serverVersion = await _api.serverInfoApi.getServerVersion();
-    if (serverVersion == null) {
-      _logger.severe("Cannot perform sync: unable to determine server version");
-      return false;
-    }
-
-    final semVer = SemVer(major: serverVersion.major, minor: serverVersion.minor, patch: serverVersion.patch_);
-
-    final value = Store.get(StoreKey.syncMigrationStatus, "[]");
-    final migrations = (jsonDecode(value) as List).cast<String>();
-    int previousLength = migrations.length;
-    await _runPreSyncTasks(migrations, semVer);
-
-    if (migrations.length != previousLength) {
-      _logger.info("Updated pre-sync migration status: $migrations");
-      await Store.put(StoreKey.syncMigrationStatus, jsonEncode(migrations));
-    }
-
     // Start the sync stream and handle events
     bool shouldReset = false;
     await _syncApiRepository.streamChanges(_handleEvents, onReset: () => shouldReset = true);
@@ -87,56 +51,9 @@ class SyncStreamService {
       _logger.info("Resetting sync state as requested by server");
       await _syncApiRepository.streamChanges(_handleEvents);
     }
-
-    previousLength = migrations.length;
-    await _runPostSyncTasks(migrations);
-
-    if (migrations.length != previousLength) {
-      _logger.info("Updated pre-sync migration status: $migrations");
-      await Store.put(StoreKey.syncMigrationStatus, jsonEncode(migrations));
-    }
-
     return true;
   }
 
-  Future<void> _runPreSyncTasks(List<String> migrations, SemVer semVer) async {
-    if (!migrations.contains(SyncMigrationTask.v20260128_ResetExifV1.name)) {
-      _logger.info("Running pre-sync task: v20260128_ResetExifV1");
-      await _syncApiRepository.deleteSyncAck([
-        SyncEntityType.assetExifV1,
-        SyncEntityType.partnerAssetExifV1,
-        SyncEntityType.albumAssetExifCreateV1,
-        SyncEntityType.albumAssetExifUpdateV1,
-      ]);
-      migrations.add(SyncMigrationTask.v20260128_ResetExifV1.name);
-    }
-
-    if (!migrations.contains(SyncMigrationTask.v20260128_ResetAssetV1.name) &&
-        semVer >= const SemVer(major: 2, minor: 5, patch: 0)) {
-      _logger.info("Running pre-sync task: v20260128_ResetAssetV1");
-      await _syncApiRepository.deleteSyncAck([
-        SyncEntityType.assetV1,
-        SyncEntityType.partnerAssetV1,
-        SyncEntityType.albumAssetCreateV1,
-        SyncEntityType.albumAssetUpdateV1,
-      ]);
-
-      migrations.add(SyncMigrationTask.v20260128_ResetAssetV1.name);
-
-      if (!migrations.contains(SyncMigrationTask.v20260128_CopyExifWidthHeightToAsset.name)) {
-        migrations.add(SyncMigrationTask.v20260128_CopyExifWidthHeightToAsset.name);
-      }
-    }
-  }
-
-  Future<void> _runPostSyncTasks(List<String> migrations) async {
-    if (!migrations.contains(SyncMigrationTask.v20260128_CopyExifWidthHeightToAsset.name)) {
-      _logger.info("Running post-sync task: v20260128_CopyExifWidthHeightToAsset");
-      await _syncMigrationRepository.v20260128CopyExifWidthHeightToAsset();
-      migrations.add(SyncMigrationTask.v20260128_CopyExifWidthHeightToAsset.name);
-    }
-  }
-
   Future<void> _handleEvents(List<SyncEvent> events, Function() abort, Function() reset) async {
     List<SyncEvent> items = [];
     for (final event in events) {

mobile/lib/infrastructure/repositories/sync_api.repository.dart

@@ -19,10 +19,6 @@ class SyncApiRepository {
     return _api.syncApi.sendSyncAck(SyncAckSetDto(acks: data));
   }
 
-  Future<void> deleteSyncAck(List<SyncEntityType> types) {
-    return _api.syncApi.deleteSyncAck(SyncAckDeleteDto(types: types));
-  }
-
   Future<void> streamChanges(
     Future<void> Function(List<SyncEvent>, Function() abort, Function() reset) onData, {
     Function()? onReset,

mobile/lib/infrastructure/repositories/sync_migration.repository.dart

@@ -1,24 +0,0 @@
-import 'package:immich_mobile/infrastructure/repositories/db.repository.dart';
-
-class SyncMigrationRepository extends DriftDatabaseRepository {
-  final Drift _db;
-
-  const SyncMigrationRepository(super.db) : _db = db;
-
-  Future<void> v20260128CopyExifWidthHeightToAsset() async {
-    await _db.customStatement('''
-      UPDATE remote_asset_entity
-      SET width = CASE
-            WHEN exif.orientation IN ('5', '6', '7', '8', '-90', '90') THEN exif.height
-            ELSE exif.width
-          END,
-          height = CASE
-            WHEN exif.orientation IN ('5', '6', '7', '8', '-90', '90') THEN exif.width
-            ELSE exif.height
-          END
-      FROM remote_exif_entity exif
-      WHERE exif.asset_id = remote_asset_entity.id
-        AND (exif.width IS NOT NULL OR exif.height IS NOT NULL);
-    ''');
-  }
-}

mobile/lib/presentation/widgets/asset_viewer/asset_viewer.page.dart

@@ -92,9 +92,7 @@ class AssetViewer extends ConsumerStatefulWidget {
     if (asset.isVideo || asset.isMotionPhoto) {
       ref.read(videoPlaybackValueProvider.notifier).reset();
       ref.read(videoPlayerControlsProvider.notifier).pause();
-    }
-    // Hide controls by default for videos
-    if (asset.isVideo) {
+      // Hide controls by default for videos and motion photos
       ref.read(assetViewerProvider.notifier).setControls(false);
     }
   }
@@ -149,11 +147,6 @@ class _AssetViewerState extends ConsumerState<AssetViewer> {
     if (asset != null) {
       _stackChildrenKeepAlive = ref.read(stackChildrenNotifier(asset).notifier).ref.keepAlive();
     }
-    if (ref.read(assetViewerProvider).showingControls) {
-      unawaited(SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge));
-    } else {
-      unawaited(SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky));
-    }
   }
 
   @override

mobile/lib/providers/infrastructure/sync.provider.dart

@@ -3,7 +3,6 @@ import 'package:immich_mobile/domain/services/hash.service.dart';
 import 'package:immich_mobile/domain/services/local_sync.service.dart';
 import 'package:immich_mobile/domain/services/sync_stream.service.dart';
 import 'package:immich_mobile/infrastructure/repositories/sync_api.repository.dart';
-import 'package:immich_mobile/infrastructure/repositories/sync_migration.repository.dart';
 import 'package:immich_mobile/infrastructure/repositories/sync_stream.repository.dart';
 import 'package:immich_mobile/providers/api.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/album.provider.dart';
@@ -14,8 +13,6 @@ import 'package:immich_mobile/providers/infrastructure/platform.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/storage.provider.dart';
 import 'package:immich_mobile/repositories/local_files_manager.repository.dart';
 
-final syncMigrationRepositoryProvider = Provider((ref) => SyncMigrationRepository(ref.watch(driftProvider)));
-
 final syncStreamServiceProvider = Provider(
   (ref) => SyncStreamService(
     syncApiRepository: ref.watch(syncApiRepositoryProvider),
@@ -24,8 +21,6 @@ final syncStreamServiceProvider = Provider(
     trashedLocalAssetRepository: ref.watch(trashedLocalAssetRepository),
     localFilesManager: ref.watch(localFilesManagerRepositoryProvider),
     storageRepository: ref.watch(storageRepositoryProvider),
-    syncMigrationRepository: ref.watch(syncMigrationRepositoryProvider),
-    api: ref.watch(apiServiceProvider),
     cancelChecker: ref.watch(cancellationProvider),
   ),
 );

mobile/lib/utils/migration.dart

@@ -28,7 +28,6 @@ import 'package:immich_mobile/utils/datetime_helpers.dart';
 import 'package:immich_mobile/utils/debug_print.dart';
 import 'package:immich_mobile/utils/diff.dart';
 import 'package:isar/isar.dart';
-
 // ignore: import_rule_photo_manager
 import 'package:photo_manager/photo_manager.dart';
 
@@ -89,6 +88,7 @@ Future<void> migrateDatabaseIfNeeded(Isar db, Drift drift) async {
 
   if (version < 20 && Store.isBetaTimelineEnabled) {
     await _syncLocalAlbumIsIosSharedAlbum(drift);
+    await _backfillAssetExifWidthHeight(drift);
   }
 
   if (targetVersion >= 12) {
@@ -282,6 +282,22 @@ Future<void> _syncLocalAlbumIsIosSharedAlbum(Drift db) async {
   }
 }
 
+Future<void> _backfillAssetExifWidthHeight(Drift db) async {
+  try {
+    await db.customStatement('''
+      UPDATE remote_exif_entity AS remote_exif
+      SET width = asset.width,
+          height = asset.height
+      FROM remote_asset_entity AS asset
+      WHERE remote_exif.asset_id = asset.id;
+    ''');
+
+    dPrint(() => "[MIGRATION] Successfully backfilled asset exif width and height");
+  } catch (error) {
+    dPrint(() => "[MIGRATION] Error while backfilling asset exif width and height: $error");
+  }
+}
+
 Future<void> migrateDeviceAssetToSqlite(Isar db, Drift drift) async {
   try {
     final isarDeviceAssets = await db.deviceAssetEntitys.where().findAll();

mobile/lib/widgets/photo_view/src/core/photo_view_gesture_detector.dart

@@ -203,13 +203,9 @@ class PhotoViewGestureRecognizer extends ScaleGestureRecognizer {
 
   void _decideIfWeAcceptEvent(PointerEvent event) {
     final move = _initialFocalPoint! - _currentFocalPoint!;
-
-    // Accept gesture if movement is possible in the direction the user is swiping
-    final bool isHorizontalGesture = move.dx.abs() > move.dy.abs();
-    final bool shouldMove = isHorizontalGesture
-        ? hitDetector!.shouldMove(move, Axis.horizontal)
-        : hitDetector!.shouldMove(move, Axis.vertical);
-
+    final bool shouldMove = validateAxis == Axis.vertical
+        ? hitDetector!.shouldMove(move, Axis.vertical)
+        : hitDetector!.shouldMove(move, Axis.horizontal);
     if (shouldMove || _pointerLocations.keys.length > 1) {
       final double spanDelta = (_currentSpan! - _initialSpan!).abs();
       final double focalPointDelta = (_currentFocalPoint! - _initialFocalPoint!).distance;

mobile/openapi/README.md

@@ -3,7 +3,7 @@ Immich API
 
 This Dart package is automatically generated by the [OpenAPI Generator](https://openapi-generator.tech) project:
 
-- API version: 2.5.2
+- API version: 2.5.1
 - Generator version: 7.8.0
 - Build package: org.openapitools.codegen.languages.DartClientCodegen
 

mobile/pubspec.yaml

@@ -2,7 +2,7 @@ name: immich_mobile
 description: Immich - selfhosted backup media file on mobile phone
 
 publish_to: 'none'
-version: 2.5.2+3033
+version: 2.5.1+3032
 
 environment:
   sdk: '>=3.8.0 <4.0.0'

mobile/test/api.mocks.dart

@@ -4,5 +4,3 @@ import 'package:openapi/api.dart';
 class MockAssetsApi extends Mock implements AssetsApi {}
 
 class MockSyncApi extends Mock implements SyncApi {}
-
-class MockServerApi extends Mock implements ServerApi {}

mobile/test/domain/services/sync_stream_service_test.dart

@@ -19,15 +19,12 @@ import 'package:immich_mobile/infrastructure/repositories/sync_stream.repository
 import 'package:immich_mobile/infrastructure/repositories/trashed_local_asset.repository.dart';
 import 'package:immich_mobile/repositories/local_files_manager.repository.dart';
 import 'package:mocktail/mocktail.dart';
-import 'package:openapi/api.dart';
 
-import '../../api.mocks.dart';
 import '../../fixtures/asset.stub.dart';
 import '../../fixtures/sync_stream.stub.dart';
 import '../../infrastructure/repository.mock.dart';
 import '../../mocks/asset_entity.mock.dart';
 import '../../repository.mocks.dart';
-import '../../service.mocks.dart';
 
 class _AbortCallbackWrapper {
   const _AbortCallbackWrapper();
@@ -53,9 +50,6 @@ void main() {
   late DriftTrashedLocalAssetRepository mockTrashedLocalAssetRepo;
   late LocalFilesManagerRepository mockLocalFilesManagerRepo;
   late StorageRepository mockStorageRepo;
-  late MockApiService mockApi;
-  late MockServerApi mockServerApi;
-  late MockSyncMigrationRepository mockSyncMigrationRepo;
   late Future<void> Function(List<SyncEvent>, Function(), Function()) handleEventsCallback;
   late _MockAbortCallbackWrapper mockAbortCallbackWrapper;
   late _MockAbortCallbackWrapper mockResetCallbackWrapper;
@@ -88,9 +82,6 @@ void main() {
     mockStorageRepo = MockStorageRepository();
     mockAbortCallbackWrapper = _MockAbortCallbackWrapper();
     mockResetCallbackWrapper = _MockAbortCallbackWrapper();
-    mockApi = MockApiService();
-    mockServerApi = MockServerApi();
-    mockSyncMigrationRepo = MockSyncMigrationRepository();
 
     when(() => mockAbortCallbackWrapper()).thenReturn(false);
 
@@ -103,12 +94,6 @@ void main() {
     });
 
     when(() => mockSyncApiRepo.ack(any())).thenAnswer((_) async => {});
-    when(() => mockSyncApiRepo.deleteSyncAck(any())).thenAnswer((_) async => {});
-
-    when(() => mockApi.serverInfoApi).thenReturn(mockServerApi);
-    when(() => mockServerApi.getServerVersion()).thenAnswer(
-      (_) async => ServerVersionResponseDto(major: 1, minor: 132, patch_: 0),
-    );
 
     when(() => mockSyncStreamRepo.updateUsersV1(any())).thenAnswer(successHandler);
     when(() => mockSyncStreamRepo.deleteUsersV1(any())).thenAnswer(successHandler);
@@ -142,7 +127,6 @@ void main() {
     when(() => mockSyncStreamRepo.deletePeopleV1(any())).thenAnswer(successHandler);
     when(() => mockSyncStreamRepo.updateAssetFacesV1(any())).thenAnswer(successHandler);
     when(() => mockSyncStreamRepo.deleteAssetFacesV1(any())).thenAnswer(successHandler);
-    when(() => mockSyncMigrationRepo.v20260128CopyExifWidthHeightToAsset()).thenAnswer(successHandler);
 
     sut = SyncStreamService(
       syncApiRepository: mockSyncApiRepo,
@@ -151,8 +135,6 @@ void main() {
       trashedLocalAssetRepository: mockTrashedLocalAssetRepo,
       localFilesManager: mockLocalFilesManagerRepo,
       storageRepository: mockStorageRepo,
-      api: mockApi,
-      syncMigrationRepository: mockSyncMigrationRepo,
     );
 
     when(() => mockLocalAssetRepo.getAssetsFromBackupAlbums(any())).thenAnswer((_) async => {});
@@ -234,8 +216,6 @@ void main() {
         localFilesManager: mockLocalFilesManagerRepo,
         storageRepository: mockStorageRepo,
         cancelChecker: cancellationChecker.call,
-        api: mockApi,
-        syncMigrationRepository: mockSyncMigrationRepo,
       );
       await sut.sync();
 
@@ -275,8 +255,6 @@ void main() {
         localFilesManager: mockLocalFilesManagerRepo,
         storageRepository: mockStorageRepo,
         cancelChecker: cancellationChecker.call,
-        api: mockApi,
-        syncMigrationRepository: mockSyncMigrationRepo,
       );
 
       await sut.sync();
@@ -496,7 +474,11 @@ void main() {
       });
 
       final events = [
-        SyncStreamStub.assetModified(id: 'remote-1', checksum: 'checksum-trash', ack: 'asset-remote-1-11'),
+        SyncStreamStub.assetModified(
+          id: 'remote-1',
+          checksum: 'checksum-trash',
+          ack: 'asset-remote-1-11',
+        ),
       ];
 
       await simulateEvents(events);
@@ -504,75 +486,4 @@ void main() {
       verify(() => mockTrashedLocalAssetRepo.applyRestoredAssets(restoredIds)).called(1);
     });
   });
-
-  group('SyncStreamService - Sync Migration', () {
-    test('ensure that <2.5.0 migrations run', () async {
-      await Store.put(StoreKey.syncMigrationStatus, "[]");
-      when(
-        () => mockServerApi.getServerVersion(),
-      ).thenAnswer((_) async => ServerVersionResponseDto(major: 2, minor: 4, patch_: 1));
-
-      await sut.sync();
-
-      verifyInOrder([
-        () => mockSyncApiRepo.deleteSyncAck([
-          SyncEntityType.assetExifV1,
-          SyncEntityType.partnerAssetExifV1,
-          SyncEntityType.albumAssetExifCreateV1,
-          SyncEntityType.albumAssetExifUpdateV1,
-        ]),
-        () => mockSyncMigrationRepo.v20260128CopyExifWidthHeightToAsset(),
-      ]);
-
-      // should only run on server >2.5.0
-      verifyNever(
-        () => mockSyncApiRepo.deleteSyncAck([
-          SyncEntityType.assetV1,
-          SyncEntityType.partnerAssetV1,
-          SyncEntityType.albumAssetCreateV1,
-          SyncEntityType.albumAssetUpdateV1,
-        ]),
-      );
-    });
-    test('ensure that >=2.5.0 migrations run', () async {
-      await Store.put(StoreKey.syncMigrationStatus, "[]");
-      when(
-        () => mockServerApi.getServerVersion(),
-      ).thenAnswer((_) async => ServerVersionResponseDto(major: 2, minor: 5, patch_: 0));
-      await sut.sync();
-
-      verifyInOrder([
-        () => mockSyncApiRepo.deleteSyncAck([
-          SyncEntityType.assetExifV1,
-          SyncEntityType.partnerAssetExifV1,
-          SyncEntityType.albumAssetExifCreateV1,
-          SyncEntityType.albumAssetExifUpdateV1,
-        ]),
-        () => mockSyncApiRepo.deleteSyncAck([
-          SyncEntityType.assetV1,
-          SyncEntityType.partnerAssetV1,
-          SyncEntityType.albumAssetCreateV1,
-          SyncEntityType.albumAssetUpdateV1,
-        ]),
-      ]);
-
-      // v20260128_ResetAssetV1 writes that v20260128_CopyExifWidthHeightToAsset has been completed
-      verifyNever(() => mockSyncMigrationRepo.v20260128CopyExifWidthHeightToAsset());
-    });
-
-    test('ensure that migrations do not re-run', () async {
-      await Store.put(
-        StoreKey.syncMigrationStatus,
-        '["${SyncMigrationTask.v20260128_CopyExifWidthHeightToAsset.name}"]',
-      );
-
-      when(
-        () => mockServerApi.getServerVersion(),
-      ).thenAnswer((_) async => ServerVersionResponseDto(major: 2, minor: 4, patch_: 1));
-
-      await sut.sync();
-
-      verifyNever(() => mockSyncMigrationRepo.v20260128CopyExifWidthHeightToAsset());
-    });
-  });
 }

mobile/test/infrastructure/repository.mock.dart

@@ -8,7 +8,6 @@ import 'package:immich_mobile/infrastructure/repositories/remote_asset.repositor
 import 'package:immich_mobile/infrastructure/repositories/storage.repository.dart';
 import 'package:immich_mobile/infrastructure/repositories/store.repository.dart';
 import 'package:immich_mobile/infrastructure/repositories/sync_api.repository.dart';
-import 'package:immich_mobile/infrastructure/repositories/sync_migration.repository.dart';
 import 'package:immich_mobile/infrastructure/repositories/sync_stream.repository.dart';
 import 'package:immich_mobile/infrastructure/repositories/trashed_local_asset.repository.dart';
 import 'package:immich_mobile/infrastructure/repositories/user.repository.dart';
@@ -47,8 +46,6 @@ class MockDriftBackupRepository extends Mock implements DriftBackupRepository {}
 
 class MockUploadRepository extends Mock implements UploadRepository {}
 
-class MockSyncMigrationRepository extends Mock implements SyncMigrationRepository {}
-
 // API Repos
 class MockUserApiRepository extends Mock implements UserApiRepository {}
 

open-api/immich-openapi-specs.json

@@ -14951,7 +14951,7 @@
   "info": {
     "title": "Immich",
     "description": "Immich API",
-    "version": "2.5.2",
+    "version": "2.5.1",
     "contact": {}
   },
   "tags": [

open-api/typescript-sdk/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@immich/sdk",
-  "version": "2.5.2",
+  "version": "2.5.1",
   "description": "Auto-generated TypeScript SDK for the Immich API",
   "type": "module",
   "main": "./build/index.js",

open-api/typescript-sdk/src/fetch-client.ts

@@ -1,6 +1,6 @@
 /**
  * Immich
- * 2.5.2
+ * 2.5.1
  * DO NOT MODIFY - This file has been generated using oazapfts.
  * See https://www.npmjs.com/package/oazapfts
  */

package.json

@@ -1,6 +1,6 @@
 {
   "name": "immich-monorepo",
-  "version": "2.5.2",
+  "version": "2.5.1",
   "description": "Monorepo for Immich",
   "private": true,
   "packageManager": "pnpm@10.28.0+sha512.05df71d1421f21399e053fde567cea34d446fa02c76571441bfc1c7956e98e363088982d940465fd34480d4d90a0668bc12362f8aa88000a64e83d0b0e47be48",

server/package.json

@@ -1,6 +1,6 @@
 {
   "name": "immich",
-  "version": "2.5.2",
+  "version": "2.5.1",
   "description": "",
   "author": "",
   "private": true,

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

@@ -116,22 +116,8 @@ where
   "asset"."deletedAt" is null
   and "asset"."visibility" != $1
   and (
-    not exists (
-      select
-      from
-        "asset_file"
-      where
-        "assetId" = "asset"."id"
-        and "asset_file"."type" = $2
-    )
-    or not exists (
-      select
-      from
-        "asset_file"
-      where
-        "assetId" = "asset"."id"
-        and "asset_file"."type" = $3
-    )
+    "asset_job_status"."previewAt" is null
+    or "asset_job_status"."thumbnailAt" is null
     or "asset"."thumbhash" is null
   )
 
@@ -306,14 +292,7 @@ from
 where
   "asset"."visibility" != $1
   and "asset"."deletedAt" is null
-  and exists (
-    select
-    from
-      "asset_file"
-    where
-      "assetId" = "asset"."id"
-      and "asset_file"."type" = $2
-  )
+  and "job_status"."previewAt" is not null
   and not exists (
     select
     from
@@ -644,14 +623,7 @@ from
 where
   "asset"."visibility" != $1
   and "asset"."deletedAt" is null
-  and exists (
-    select
-    from
-      "asset_file"
-    where
-      "assetId" = "asset"."id"
-      and "asset_file"."type" = $2
-  )
+  and "job_status"."previewAt" is not null
 order by
   "asset"."fileCreatedAt" desc
 

server/src/queries/asset.repository.sql

@@ -134,7 +134,8 @@ with
           "asset"
           inner join "asset_job_status" on "asset"."id" = "asset_job_status"."assetId"
         where
-          (asset."localDateTime" at time zone 'UTC')::date = today.date
+          "asset_job_status"."previewAt" is not null
+          and (asset."localDateTime" at time zone 'UTC')::date = today.date
           and "asset"."ownerId" = any ($4::uuid[])
           and "asset"."visibility" = $5
           and exists (

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

@@ -73,22 +73,8 @@ export class AssetJobRepository {
           .innerJoin('asset_job_status', 'asset_job_status.assetId', 'asset.id')
           .where((eb) =>
             eb.or([
-              eb.not((eb) =>
-                eb.exists((qb) =>
-                  qb
-                    .selectFrom('asset_file')
-                    .whereRef('assetId', '=', 'asset.id')
-                    .where('asset_file.type', '=', AssetFileType.Preview),
-                ),
-              ),
-              eb.not((eb) =>
-                eb.exists((qb) =>
-                  qb
-                    .selectFrom('asset_file')
-                    .whereRef('assetId', '=', 'asset.id')
-                    .where('asset_file.type', '=', AssetFileType.Thumbnail),
-                ),
-              ),
+              eb('asset_job_status.previewAt', 'is', null),
+              eb('asset_job_status.thumbnailAt', 'is', null),
               eb('asset.thumbhash', 'is', null),
             ]),
           ),
@@ -171,14 +157,7 @@ export class AssetJobRepository {
       .where('asset.visibility', '!=', AssetVisibility.Hidden)
       .where('asset.deletedAt', 'is', null)
       .innerJoin('asset_job_status as job_status', 'assetId', 'asset.id')
-      .where((eb) =>
-        eb.exists((qb) =>
-          qb
-            .selectFrom('asset_file')
-            .whereRef('assetId', '=', 'asset.id')
-            .where('asset_file.type', '=', AssetFileType.Preview),
-        ),
-      );
+      .where('job_status.previewAt', 'is not', null);
   }
 
   @GenerateSql({ params: [], stream: true })

server/src/repositories/asset.repository.ts

@@ -251,6 +251,8 @@ export class AssetRepository {
               duplicatesDetectedAt: eb.ref('excluded.duplicatesDetectedAt'),
               facesRecognizedAt: eb.ref('excluded.facesRecognizedAt'),
               metadataExtractedAt: eb.ref('excluded.metadataExtractedAt'),
+              previewAt: eb.ref('excluded.previewAt'),
+              thumbnailAt: eb.ref('excluded.thumbnailAt'),
               ocrAt: eb.ref('excluded.ocrAt'),
             },
             values[0],
@@ -359,6 +361,7 @@ export class AssetRepository {
                 .selectFrom('asset')
                 .selectAll('asset')
                 .innerJoin('asset_job_status', 'asset.id', 'asset_job_status.assetId')
+                .where('asset_job_status.previewAt', 'is not', null)
                 .where(sql`(asset."localDateTime" at time zone 'UTC')::date`, '=', sql`today.date`)
                 .where('asset.ownerId', '=', anyUuid(ownerIds))
                 .where('asset.visibility', '=', AssetVisibility.Timeline)

server/src/schema/migrations/1769635093204-DropThumbnailJobStatusColumns.ts

@@ -1,11 +0,0 @@
-import { Kysely, sql } from 'kysely';
-
-export async function up(db: Kysely<any>): Promise<void> {
-  await sql`ALTER TABLE "asset_job_status" DROP COLUMN "previewAt";`.execute(db);
-  await sql`ALTER TABLE "asset_job_status" DROP COLUMN "thumbnailAt";`.execute(db);
-}
-
-export async function down(db: Kysely<any>): Promise<void> {
-  await sql`ALTER TABLE "asset_job_status" ADD "previewAt" timestamp with time zone;`.execute(db);
-  await sql`ALTER TABLE "asset_job_status" ADD "thumbnailAt" timestamp with time zone;`.execute(db);
-}

server/src/schema/tables/asset-job-status.table.ts

@@ -15,6 +15,12 @@ export class AssetJobStatusTable {
   @Column({ type: 'timestamp with time zone', nullable: true })
   duplicatesDetectedAt!: Timestamp | null;
 
+  @Column({ type: 'timestamp with time zone', nullable: true })
+  previewAt!: Timestamp | null;
+
+  @Column({ type: 'timestamp with time zone', nullable: true })
+  thumbnailAt!: Timestamp | null;
+
   @Column({ type: 'timestamp with time zone', nullable: true })
   ocrAt!: Timestamp | null;
 }

server/test/medium.factory.ts

@@ -601,6 +601,8 @@ const assetJobStatusInsert = (
     duplicatesDetectedAt: date,
     facesRecognizedAt: date,
     metadataExtractedAt: date,
+    previewAt: date,
+    thumbnailAt: date,
   };
 
   return {

web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "immich-web",
-  "version": "2.5.2",
+  "version": "2.5.1",
   "license": "GNU Affero General Public License version 3",
   "type": "module",
   "scripts": {

web/src/lib/components/asset-viewer/asset-viewer.svelte

@@ -424,7 +424,6 @@
   const showOcrButton = $derived(
     $slideshowState === SlideshowState.None &&
       asset.type === AssetTypeEnum.Image &&
-      !(asset.exifInfo?.projectionType === 'EQUIRECTANGULAR') &&
       !assetViewerManager.isShowEditor &&
       ocrManager.hasOcrData,
   );

web/src/lib/components/asset-viewer/ocr-bounding-box.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import type { OcrBox } from '$lib/utils/ocr-utils';
-  import { calculateBoundingBoxDimensions } from '$lib/utils/ocr-utils';
+  import { calculateBoundingBoxMatrix } from '$lib/utils/ocr-utils';
 
   type Props = {
     ocrBox: OcrBox;
@@ -8,28 +8,19 @@
 
   let { ocrBox }: Props = $props();
 
-  const dimensions = $derived(calculateBoundingBoxDimensions(ocrBox.points));
+  const dimensions = $derived(calculateBoundingBoxMatrix(ocrBox.points));
 
-  const transform = $derived(
-    `translate(${dimensions.minX}px, ${dimensions.minY}px) rotate(${dimensions.rotation}deg) skew(${dimensions.skewX}deg, ${dimensions.skewY}deg)`,
-  );
-
-  const transformOrigin = $derived(
-    `${dimensions.centerX - dimensions.minX}px ${dimensions.centerY - dimensions.minY}px`,
+  const transform = $derived(`matrix3d(${dimensions.matrix.join(',')})`);
+  // Fits almost all strings within the box, depends on font family
+  const fontSize = $derived(
+    `max(var(--text-sm), min(var(--text-6xl), ${(1.4 * dimensions.width) / ocrBox.text.length}px))`,
   );
 </script>
 
-<div class="absolute group left-0 top-0 pointer-events-none">
-  <!-- Bounding box with CSS transforms -->
+<div class="absolute left-0 top-0">
   <div
-    class="absolute border-2 border-blue-500 bg-blue-500/10 cursor-pointer pointer-events-auto transition-all group-hover:bg-blue-500/30 group-hover:border-blue-600 group-hover:border-[3px]"
-    style="width: {dimensions.width}px; height: {dimensions.height}px; transform: {transform}; transform-origin: {transformOrigin};"
-  ></div>
-
-  <!-- Text overlay - always rendered but invisible, allows text selection and copy -->
-  <div
-    class="absolute flex items-center justify-center text-transparent text-sm px-2 py-1 pointer-events-auto cursor-text whitespace-pre-wrap wrap-break-word select-text group-hover:text-white group-hover:bg-black/75 group-hover:z-10"
-    style="width: {dimensions.width}px; height: {dimensions.height}px; transform: {transform}; transform-origin: {transformOrigin};"
+    class="absolute flex items-center justify-center text-transparent text-sm border-2 border-blue-500 bg-blue-500/10 px-2 py-1 pointer-events-auto cursor-text whitespace-pre-wrap wrap-break-word select-text transition-all hover:text-white hover:bg-black/60 hover:border-blue-600 hover:border-3"
+    style="font-size: {fontSize}; width: {dimensions.width}px; height: {dimensions.height}px; transform: {transform}; transform-origin: 0 0;"
   >
     {ocrBox.text}
   </div>

web/src/lib/components/asset-viewer/photo-sphere-viewer-adapter.svelte

@@ -2,8 +2,10 @@
   import { shortcuts } from '$lib/actions/shortcut';
   import AssetViewerEvents from '$lib/components/AssetViewerEvents.svelte';
   import { assetViewerManager } from '$lib/managers/asset-viewer-manager.svelte';
+  import { ocrManager, type OcrBoundingBox } from '$lib/stores/ocr.svelte';
   import { boundingBoxesArray, type Faces } from '$lib/stores/people.store';
   import { alwaysLoadOriginalFile } from '$lib/stores/preferences.store';
+  import { calculateBoundingBoxMatrix, getOcrBoundingBoxesAtSize, type Point } from '$lib/utils/ocr-utils';
   import {
     EquirectangularAdapter,
     Viewer,
@@ -27,6 +29,17 @@
     strokeLinejoin: 'round',
   };
 
+  // Adapted as well as possible from classlist 'border-2 border-blue-500 bg-blue-500/10 hover:border-blue-600 hover:border-3'
+  const OCR_BOX_SVG_STYLE = {
+    fill: 'var(--color-blue-500)',
+    fillOpacity: '0.1',
+    stroke: 'var(--color-blue-500)',
+    strokeWidth: '2px',
+  };
+
+  const OCR_TOOLTIP_HTML_CLASS =
+    'flex items-center justify-center text-white bg-black/50 cursor-text pointer-events-auto whitespace-pre-wrap wrap-break-word select-text';
+
   type Props = {
     panorama: string | { source: string };
     originalPanorama?: string | { source: string };
@@ -96,6 +109,59 @@
     }
   });
 
+  $effect(() => {
+    updateOcrBoxes(ocrManager.showOverlay, ocrManager.data);
+  });
+
+  /** Use updateOnly=true on zoom, pan, or resize. */
+  const updateOcrBoxes = (showOverlay: boolean, ocrData: OcrBoundingBox[], updateOnly = false) => {
+    if (!viewer || !viewer.state.textureData || !viewer.getPlugin(MarkersPlugin)) {
+      return;
+    }
+    const markersPlugin = viewer.getPlugin<MarkersPlugin>(MarkersPlugin);
+    if (!showOverlay) {
+      markersPlugin.clearMarkers();
+      return;
+    }
+    if (!updateOnly) {
+      markersPlugin.clearMarkers();
+    }
+
+    const boxes = getOcrBoundingBoxesAtSize(ocrData, {
+      width: viewer.state.textureData.panoData.croppedWidth,
+      height: viewer.state.textureData.panoData.croppedHeight,
+    });
+
+    for (const [index, box] of boxes.entries()) {
+      const points = box.points.map((p) => texturePointToViewerPoint(viewer, p));
+      const { matrix, width, height } = calculateBoundingBoxMatrix(points);
+
+      const fontSize = (1.4 * width) / box.text.length; // fits almost all strings within the box, depends on font family
+      const transform = `matrix3d(${matrix.join(',')})`;
+      const content = `<div class="${OCR_TOOLTIP_HTML_CLASS}" style="font-size: ${fontSize}px; width: ${width}px; height: ${height}px; transform: ${transform}; transform-origin: 0 0;">${box.text}</div>`;
+
+      if (updateOnly) {
+        markersPlugin.updateMarker({
+          id: `box_${index}`,
+          polygonPixels: box.points.map((b) => [b.x, b.y]),
+          tooltip: { content },
+        });
+      } else {
+        markersPlugin.addMarker({
+          id: `box_${index}`,
+          polygonPixels: box.points.map((b) => [b.x, b.y]),
+          svgStyle: OCR_BOX_SVG_STYLE,
+          tooltip: { content, trigger: 'click' },
+        });
+      }
+    }
+  };
+
+  const texturePointToViewerPoint = (viewer: Viewer, point: Point) => {
+    const spherical = viewer.dataHelper.textureCoordsToSphericalCoords({ textureX: point.x, textureY: point.y });
+    return viewer.dataHelper.sphericalCoordsToViewerCoords(spherical);
+  };
+
   const onZoom = () => {
     viewer?.animate({ zoom: assetViewerManager.zoom > 1 ? 50 : 83.3, speed: 250 });
   };
@@ -160,7 +226,20 @@
       viewer.addEventListener(events.ZoomUpdatedEvent.type, zoomHandler, { passive: true });
     }
 
-    return () => viewer.removeEventListener(events.ZoomUpdatedEvent.type, zoomHandler);
+    const onReadyHandler = () => updateOcrBoxes(ocrManager.showOverlay, ocrManager.data, false);
+    const updateHandler = () => updateOcrBoxes(ocrManager.showOverlay, ocrManager.data, true);
+    viewer.addEventListener(events.ReadyEvent.type, onReadyHandler);
+    viewer.addEventListener(events.PositionUpdatedEvent.type, updateHandler);
+    viewer.addEventListener(events.SizeUpdatedEvent.type, updateHandler);
+    viewer.addEventListener(events.ZoomUpdatedEvent.type, updateHandler, { passive: true });
+
+    return () => {
+      viewer.removeEventListener(events.ReadyEvent.type, onReadyHandler);
+      viewer.removeEventListener(events.PositionUpdatedEvent.type, updateHandler);
+      viewer.removeEventListener(events.SizeUpdatedEvent.type, updateHandler);
+      viewer.removeEventListener(events.ZoomUpdatedEvent.type, updateHandler);
+      viewer.removeEventListener(events.ZoomUpdatedEvent.type, zoomHandler);
+    };
   });
 
   onDestroy(() => {
@@ -176,3 +255,25 @@
 
 <svelte:document use:shortcuts={[{ shortcut: { key: 'z' }, onShortcut: onZoom, preventDefault: true }]} />
 <div class="h-full w-full mb-0" bind:this={container}></div>
+
+<style>
+  /* Reset the default tooltip styling */
+  :global(.psv-tooltip) {
+    top: 0 !important;
+    left: 0 !important;
+    background: none;
+    box-shadow: none;
+    width: 0;
+    height: 0;
+  }
+
+  :global(.psv-tooltip-content) {
+    font: var(--font-normal);
+    padding: 0;
+    text-shadow: none;
+  }
+
+  :global(.psv-tooltip-arrow) {
+    display: none;
+  }
+</style>

web/src/lib/components/timeline/TimelineAssetViewer.svelte

@@ -97,6 +97,7 @@
   };
 
   const handleClose = async (asset: { id: string }) => {
+    assetViewingStore.showAssetViewer(false);
     invisible = true;
     $gridScrollTarget = { at: asset.id };
     await navigate({ targetRoute: 'current', assetId: null, assetGridRouteSearchParams: $gridScrollTarget });

web/src/lib/components/timeline/actions/TimelineKeyboardActions.svelte

@@ -141,41 +141,43 @@
     }
   };
 
-  const shortcutList = $derived.by(() => {
-    if (searchStore.isSearchEnabled || $showAssetViewer) {
-      return [];
-    }
+  let shortcutList = $derived(
+    (() => {
+      if (searchStore.isSearchEnabled || $showAssetViewer) {
+        return [];
+      }
 
-    const shortcuts: ShortcutOptions[] = [
-      { shortcut: { key: '?', shift: true }, onShortcut: handleOpenShortcutModal },
-      { shortcut: { key: '/' }, onShortcut: () => goto(Route.explore()) },
-      { shortcut: { key: 'A', ctrl: true }, onShortcut: () => selectAllAssets(timelineManager, assetInteraction) },
-      { shortcut: { key: 'ArrowRight' }, onShortcut: () => setFocusTo('earlier', 'asset') },
-      { shortcut: { key: 'ArrowLeft' }, onShortcut: () => setFocusTo('later', 'asset') },
-      { shortcut: { key: 'D' }, onShortcut: () => setFocusTo('earlier', 'day') },
-      { shortcut: { key: 'D', shift: true }, onShortcut: () => setFocusTo('later', 'day') },
-      { shortcut: { key: 'M' }, onShortcut: () => setFocusTo('earlier', 'month') },
-      { shortcut: { key: 'M', shift: true }, onShortcut: () => setFocusTo('later', 'month') },
-      { shortcut: { key: 'Y' }, onShortcut: () => setFocusTo('earlier', 'year') },
-      { shortcut: { key: 'Y', shift: true }, onShortcut: () => setFocusTo('later', 'year') },
-      { shortcut: { key: 'G' }, onShortcut: handleOpenDateModal },
-    ];
-    if (onEscape) {
-      shortcuts.push({ shortcut: { key: 'Escape' }, onShortcut: onEscape });
-    }
+      const shortcuts: ShortcutOptions[] = [
+        { shortcut: { key: '?', shift: true }, onShortcut: handleOpenShortcutModal },
+        { shortcut: { key: '/' }, onShortcut: () => goto(Route.explore()) },
+        { shortcut: { key: 'A', ctrl: true }, onShortcut: () => selectAllAssets(timelineManager, assetInteraction) },
+        { shortcut: { key: 'ArrowRight' }, onShortcut: () => setFocusTo('earlier', 'asset') },
+        { shortcut: { key: 'ArrowLeft' }, onShortcut: () => setFocusTo('later', 'asset') },
+        { shortcut: { key: 'D' }, onShortcut: () => setFocusTo('earlier', 'day') },
+        { shortcut: { key: 'D', shift: true }, onShortcut: () => setFocusTo('later', 'day') },
+        { shortcut: { key: 'M' }, onShortcut: () => setFocusTo('earlier', 'month') },
+        { shortcut: { key: 'M', shift: true }, onShortcut: () => setFocusTo('later', 'month') },
+        { shortcut: { key: 'Y' }, onShortcut: () => setFocusTo('earlier', 'year') },
+        { shortcut: { key: 'Y', shift: true }, onShortcut: () => setFocusTo('later', 'year') },
+        { shortcut: { key: 'G' }, onShortcut: handleOpenDateModal },
+      ];
+      if (onEscape) {
+        shortcuts.push({ shortcut: { key: 'Escape' }, onShortcut: onEscape });
+      }
 
-    if (assetInteraction.selectionActive) {
-      shortcuts.push(
-        { shortcut: { key: 'Delete' }, onShortcut: onDelete },
-        { shortcut: { key: 'Delete', shift: true }, onShortcut: () => trashOrDelete(true) },
-        { shortcut: { key: 'D', ctrl: true }, onShortcut: () => deselectAllAssets() },
-        { shortcut: { key: 's' }, onShortcut: () => onStackAssets() },
-        { shortcut: { key: 'a', shift: true }, onShortcut: toggleArchive },
-      );
-    }
+      if (assetInteraction.selectionActive) {
+        shortcuts.push(
+          { shortcut: { key: 'Delete' }, onShortcut: onDelete },
+          { shortcut: { key: 'Delete', shift: true }, onShortcut: () => trashOrDelete(true) },
+          { shortcut: { key: 'D', ctrl: true }, onShortcut: () => deselectAllAssets() },
+          { shortcut: { key: 's' }, onShortcut: () => onStackAssets() },
+          { shortcut: { key: 'a', shift: true }, onShortcut: toggleArchive },
+        );
+      }
 
-    return shortcuts;
-  });
+      return shortcuts;
+    })(),
+  );
 </script>
 
 <svelte:document onkeydown={onKeyDown} onkeyup={onKeyUp} onselectstart={onSelectStart} use:shortcuts={shortcutList} />

web/src/lib/modals/AlbumOptionsModal.svelte

@@ -3,7 +3,6 @@
   import HeaderActionButton from '$lib/components/HeaderActionButton.svelte';
   import OnEvents from '$lib/components/OnEvents.svelte';
   import UserAvatar from '$lib/components/shared-components/user-avatar.svelte';
-  import { AlbumPageViewMode } from '$lib/constants';
   import {
     getAlbumActions,
     handleRemoveUserFromAlbum,
@@ -56,7 +55,7 @@
     sharedLinks = sharedLinks.filter(({ id }) => sharedLink.id !== id);
   };
 
-  const { AddUsers, CreateSharedLink } = $derived(getAlbumActions($t, album, AlbumPageViewMode.OPTIONS));
+  const { AddUsers, CreateSharedLink } = $derived(getAlbumActions($t, album));
 
   let sharedLinks: SharedLinkResponseDto[] = $state([]);
 

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

@@ -1,6 +1,5 @@
 import { goto } from '$app/navigation';
 import ToastAction from '$lib/components/ToastAction.svelte';
-import { AlbumPageViewMode } from '$lib/constants';
 import { eventManager } from '$lib/managers/event-manager.svelte';
 import type { TimelineAsset } from '$lib/managers/timeline-manager/types';
 import AlbumAddUsersModal from '$lib/modals/AlbumAddUsersModal.svelte';
@@ -26,7 +25,7 @@ import {
   type UserResponseDto,
 } from '@immich/sdk';
 import { modalManager, toastManager, type ActionItem } from '@immich/ui';
-import { mdiArrowLeft, mdiLink, mdiPlus, mdiPlusBoxOutline, mdiShareVariantOutline, mdiUpload } from '@mdi/js';
+import { mdiLink, mdiPlus, mdiPlusBoxOutline, mdiShareVariantOutline, mdiUpload } from '@mdi/js';
 import { type MessageFormatter } from 'svelte-i18n';
 import { get } from 'svelte/store';
 
@@ -40,7 +39,7 @@ export const getAlbumsActions = ($t: MessageFormatter) => {
   return { Create };
 };
 
-export const getAlbumActions = ($t: MessageFormatter, album: AlbumResponseDto, viewMode: AlbumPageViewMode) => {
+export const getAlbumActions = ($t: MessageFormatter, album: AlbumResponseDto) => {
   const isOwned = get(user).id === album.ownerId;
 
   const Share: ActionItem = {
@@ -67,16 +66,7 @@ export const getAlbumActions = ($t: MessageFormatter, album: AlbumResponseDto, v
     onAction: () => modalManager.show(SharedLinkCreateModal, { albumId: album.id }),
   };
 
-  const Close: ActionItem = {
-    title: $t('go_back'),
-    type: $t('command'),
-    icon: mdiArrowLeft,
-    onAction: () => goto(Route.albums()),
-    $if: () => viewMode === AlbumPageViewMode.VIEW,
-    shortcuts: { key: 'Escape' },
-  };
-
-  return { Share, AddUsers, CreateSharedLink, Close };
+  return { Share, AddUsers, CreateSharedLink };
 };
 
 export const getAlbumAssetsActions = ($t: MessageFormatter, album: AlbumResponseDto, assets: TimelineAsset[]) => {

web/src/lib/stores/memory.store.svelte.ts

@@ -1,11 +1,9 @@
 import { eventManager } from '$lib/managers/event-manager.svelte';
 import type { TimelineAsset } from '$lib/managers/timeline-manager/types';
-import { user } from '$lib/stores/user.store';
 import { asLocalTimeISO } from '$lib/utils/date-time';
 import { toTimelineAsset } from '$lib/utils/timeline-util';
 import { deleteMemory, type MemoryResponseDto, removeMemoryAssets, searchMemories, updateMemory } from '@immich/sdk';
 import { DateTime } from 'luxon';
-import { get } from 'svelte/store';
 
 type MemoryIndex = {
   memoryIndex: number;
@@ -29,11 +27,6 @@ class MemoryStoreSvelte {
       AuthLogout: () => this.clearCache(),
       AuthUserLoaded: () => this.initialize(),
     });
-
-    // loaded event might have already happened
-    if (get(user)) {
-      void this.initialize();
-    }
   }
 
   ready() {

web/src/lib/utils/date-time.spec.ts

@@ -1,5 +1,5 @@
 import { writable } from 'svelte/store';
-import { getAlbumDateRange, getShortDateRange, timeToSeconds } from './date-time';
+import { getAlbumDateRange, timeToSeconds } from './date-time';
 
 describe('converting time to seconds', () => {
   it('parses hh:mm:ss correctly', () => {
@@ -49,43 +49,6 @@ describe('converting time to seconds', () => {
   });
 });
 
-describe('getShortDateRange', () => {
-  beforeEach(() => {
-    vi.stubEnv('TZ', 'UTC');
-  });
-
-  afterAll(() => {
-    vi.unstubAllEnvs();
-  });
-
-  it('should correctly return month if start and end date are within the same month', () => {
-    expect(getShortDateRange('2022-01-01T00:00:00.000Z', '2022-01-31T00:00:00.000Z')).toEqual('Jan 2022');
-  });
-
-  it('should correctly return month range if start and end date are in separate months within the same year', () => {
-    expect(getShortDateRange('2022-01-01T00:00:00.000Z', '2022-02-01T00:00:00.000Z')).toEqual('Jan - Feb 2022');
-  });
-
-  it('should correctly return range if start and end date are in separate months and years', () => {
-    expect(getShortDateRange('2021-12-01T00:00:00.000Z', '2022-01-01T00:00:00.000Z')).toEqual('Dec 2021 - Jan 2022');
-  });
-
-  it('should correctly return month if start and end date are within the same month, ignoring local time zone', () => {
-    vi.stubEnv('TZ', 'UTC+6');
-    expect(getShortDateRange('2022-01-01T00:00:00.000Z', '2022-01-31T00:00:00.000Z')).toEqual('Jan 2022');
-  });
-
-  it('should correctly return month range if start and end date are in separate months within the same year, ignoring local time zone', () => {
-    vi.stubEnv('TZ', 'UTC+6');
-    expect(getShortDateRange('2022-01-01T00:00:00.000Z', '2022-02-01T00:00:00.000Z')).toEqual('Jan - Feb 2022');
-  });
-
-  it('should correctly return range if start and end date are in separate months and years, ignoring local time zone', () => {
-    vi.stubEnv('TZ', 'UTC+6');
-    expect(getShortDateRange('2021-12-01T00:00:00.000Z', '2022-01-01T00:00:00.000Z')).toEqual('Dec 2021 - Jan 2022');
-  });
-});
-
 describe('getAlbumDate', () => {
   beforeAll(() => {
     process.env.TZ = 'UTC';

web/src/lib/utils/date-time.ts

@@ -19,30 +19,28 @@ export function parseUtcDate(date: string) {
   return DateTime.fromISO(date, { zone: 'UTC' }).toUTC();
 }
 
-export const getShortDateRange = (startTimestamp: string, endTimestamp: string) => {
+export const getShortDateRange = (startDate: string | Date, endDate: string | Date) => {
+  startDate = startDate instanceof Date ? startDate : new Date(startDate);
+  endDate = endDate instanceof Date ? endDate : new Date(endDate);
+
   const userLocale = get(locale);
-  let startDate = DateTime.fromISO(startTimestamp).setZone('UTC');
-  let endDate = DateTime.fromISO(endTimestamp).setZone('UTC');
-
-  if (userLocale) {
-    startDate = startDate.setLocale(userLocale);
-    endDate = endDate.setLocale(userLocale);
-  }
-
-  const endDateLocalized = endDate.toLocaleString({
+  const endDateLocalized = endDate.toLocaleString(userLocale, {
     month: 'short',
     year: 'numeric',
+    // The API returns the date in UTC. If the earliest asset was taken on Jan 1st at 1am,
+    // we expect the album to start in January, even if the local timezone is UTC-5 for instance.
+    timeZone: 'UTC',
   });
 
-  if (startDate.year === endDate.year) {
-    if (startDate.month === endDate.month) {
+  if (startDate.getFullYear() === endDate.getFullYear()) {
+    if (startDate.getMonth() === endDate.getMonth()) {
       // Same year and month.
       // e.g.: aug. 2024
       return endDateLocalized;
     } else {
       // Same year but different month.
       // e.g.: jul. - sept. 2024
-      const startMonthLocalized = startDate.toLocaleString({
+      const startMonthLocalized = startDate.toLocaleString(userLocale, {
         month: 'short',
       });
       return `${startMonthLocalized} - ${endDateLocalized}`;
@@ -50,7 +48,7 @@ export const getShortDateRange = (startTimestamp: string, endTimestamp: string)
   } else {
     // Different year.
     // e.g.: feb. 2021 - sept. 2024
-    const startDateLocalized = startDate.toLocaleString({
+    const startDateLocalized = startDate.toLocaleString(userLocale, {
       month: 'short',
       year: 'numeric',
     });

web/src/lib/utils/ocr-utils.ts

@@ -12,70 +12,58 @@ const getContainedSize = (img: HTMLImageElement): { width: number; height: numbe
   return { width, height };
 };
 
+export type Point = {
+  x: number;
+  y: number;
+};
+
 export interface OcrBox {
   id: string;
-  points: { x: number; y: number }[];
+  points: Point[];
   text: string;
   confidence: number;
 }
 
-export interface BoundingBoxDimensions {
-  minX: number;
-  maxX: number;
-  minY: number;
-  maxY: number;
-  width: number;
-  height: number;
-  centerX: number;
-  centerY: number;
-  rotation: number;
-  skewX: number;
-  skewY: number;
-}
-
 /**
- * Calculate bounding box dimensions and properties from OCR points
+ * Calculate bounding box transform from OCR points. Result matrix can be used as input for css matrix3d.
  * @param points - Array of 4 corner points of the bounding box
- * @returns Dimensions, rotation, and skew values for the bounding box
+ * @returns 4x4 matrix to transform the div with text onto the polygon defined by the corner points, and size to set on the source div.
  */
-export const calculateBoundingBoxDimensions = (points: { x: number; y: number }[]): BoundingBoxDimensions => {
+export const calculateBoundingBoxMatrix = (points: Point[]): { matrix: number[]; width: number; height: number } => {
   const [topLeft, topRight, bottomRight, bottomLeft] = points;
-  const minX = Math.min(...points.map(({ x }) => x));
-  const maxX = Math.max(...points.map(({ x }) => x));
-  const minY = Math.min(...points.map(({ y }) => y));
-  const maxY = Math.max(...points.map(({ y }) => y));
-  const width = maxX - minX;
-  const height = maxY - minY;
-  const centerX = (minX + maxX) / 2;
-  const centerY = (minY + maxY) / 2;
 
-  // Calculate rotation angle from the bottom edge (bottomLeft to bottomRight)
-  const rotation = Math.atan2(bottomRight.y - bottomLeft.y, bottomRight.x - bottomLeft.x) * (180 / Math.PI);
+  // Approximate width and height to prevent text distortion as much as possible
+  const distance = (p1: Point, p2: Point) => Math.hypot(p2.x - p1.x, p2.y - p1.y);
+  const width = Math.max(distance(topLeft, topRight), distance(bottomLeft, bottomRight));
+  const height = Math.max(distance(topLeft, bottomLeft), distance(topRight, bottomRight));
 
-  // Calculate skew angles to handle perspective distortion
-  // SkewX: compare left and right edges
-  const leftEdgeAngle = Math.atan2(bottomLeft.y - topLeft.y, bottomLeft.x - topLeft.x);
-  const rightEdgeAngle = Math.atan2(bottomRight.y - topRight.y, bottomRight.x - topRight.x);
-  const skewX = (rightEdgeAngle - leftEdgeAngle) * (180 / Math.PI);
+  const dx1 = topRight.x - bottomRight.x;
+  const dx2 = bottomLeft.x - bottomRight.x;
+  const dx3 = topLeft.x - topRight.x + bottomRight.x - bottomLeft.x;
 
-  // SkewY: compare top and bottom edges
-  const topEdgeAngle = Math.atan2(topRight.y - topLeft.y, topRight.x - topLeft.x);
-  const bottomEdgeAngle = Math.atan2(bottomRight.y - bottomLeft.y, bottomRight.x - bottomLeft.x);
-  const skewY = (bottomEdgeAngle - topEdgeAngle) * (180 / Math.PI);
+  const dy1 = topRight.y - bottomRight.y;
+  const dy2 = bottomLeft.y - bottomRight.y;
+  const dy3 = topLeft.y - topRight.y + bottomRight.y - bottomLeft.y;
 
-  return {
-    minX,
-    maxX,
-    minY,
-    maxY,
-    width,
-    height,
-    centerX,
-    centerY,
-    rotation,
-    skewX,
-    skewY,
-  };
+  const det = dx1 * dy2 - dx2 * dy1;
+  const a13 = (dx3 * dy2 - dx2 * dy3) / det;
+  const a23 = (dx1 * dy3 - dx3 * dy1) / det;
+
+  const a11 = (1 + a13) * topRight.x - topLeft.x;
+  const a21 = (1 + a23) * bottomLeft.x - topLeft.x;
+
+  const a12 = (1 + a13) * topRight.y - topLeft.y;
+  const a22 = (1 + a23) * bottomLeft.y - topLeft.y;
+
+  // prettier-ignore
+  const matrix = [
+    a11 / width, a12 / width, 0, a13 / width,
+    a21 / height, a22 / height, 0, a23 / height,
+    0, 0, 1, 0,
+    topLeft.x, topLeft.y, 0, 1,
+  ];
+
+  return { matrix, width, height };
 };
 
 /**
@@ -87,18 +75,32 @@ export const getOcrBoundingBoxes = (
   zoom: ZoomImageWheelState,
   photoViewer: HTMLImageElement | null,
 ): OcrBox[] => {
-  const boxes: OcrBox[] = [];
-
   if (photoViewer === null || !photoViewer.naturalWidth || !photoViewer.naturalHeight) {
-    return boxes;
+    return [];
   }
 
   const clientHeight = photoViewer.clientHeight;
   const clientWidth = photoViewer.clientWidth;
   const { width, height } = getContainedSize(photoViewer);
 
-  const imageWidth = photoViewer.naturalWidth;
-  const imageHeight = photoViewer.naturalHeight;
+  const offset = {
+    x: ((clientWidth - width) / 2) * zoom.currentZoom + zoom.currentPositionX,
+    y: ((clientHeight - height) / 2) * zoom.currentZoom + zoom.currentPositionY,
+  };
+
+  return getOcrBoundingBoxesAtSize(
+    ocrData,
+    { width: width * zoom.currentZoom, height: height * zoom.currentZoom },
+    offset,
+  );
+};
+
+export const getOcrBoundingBoxesAtSize = (
+  ocrData: OcrBoundingBox[],
+  targetSize: { width: number; height: number },
+  offset?: Point,
+) => {
+  const boxes: OcrBox[] = [];
 
   for (const ocr of ocrData) {
     // Convert normalized coordinates (0-1) to actual pixel positions
@@ -109,14 +111,8 @@ export const getOcrBoundingBoxes = (
       { x: ocr.x3, y: ocr.y3 },
       { x: ocr.x4, y: ocr.y4 },
     ].map((point) => ({
-      x:
-        (width / imageWidth) * zoom.currentZoom * point.x * imageWidth +
-        ((clientWidth - width) / 2) * zoom.currentZoom +
-        zoom.currentPositionX,
-      y:
-        (height / imageHeight) * zoom.currentZoom * point.y * imageHeight +
-        ((clientHeight - height) / 2) * zoom.currentZoom +
-        zoom.currentPositionY,
+      x: targetSize.width * point.x + (offset?.x ?? 0),
+      y: targetSize.height * point.y + (offset?.y ?? 0),
     }));
 
     boxes.push({

web/src/routes/(user)/albums/[albumId=id]/[[photos=photos]]/[[assetId=id]]/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { goto, onNavigate } from '$app/navigation';
+  import { afterNavigate, goto, onNavigate } from '$app/navigation';
   import { scrollMemoryClearer } from '$lib/actions/scroll-memory';
   import ActionButton from '$lib/components/ActionButton.svelte';
   import AlbumDescription from '$lib/components/album-page/album-description.svelte';
@@ -52,7 +52,13 @@
   import { handlePromiseError } from '$lib/utils';
   import { cancelMultiselect } from '$lib/utils/asset-utils';
   import { handleError } from '$lib/utils/handle-error';
-  import { isAlbumsRoute, navigate, type AssetGridRouteSearchParams } from '$lib/utils/navigation';
+  import {
+    isAlbumsRoute,
+    isPeopleRoute,
+    isSearchRoute,
+    navigate,
+    type AssetGridRouteSearchParams,
+  } from '$lib/utils/navigation';
   import { AlbumUserRole, AssetVisibility, getAlbumInfo, updateAlbumInfo, type AlbumResponseDto } from '@immich/sdk';
   import { CommandPaletteDefaultProvider, Icon, IconButton, modalManager, toastManager } from '@immich/ui';
   import {
@@ -85,6 +91,7 @@
 
   let oldAt: AssetGridRouteSearchParams | null | undefined = $state();
 
+  let backUrl: string = $state(Route.albums());
   let viewMode: AlbumPageViewMode = $state(AlbumPageViewMode.VIEW);
 
   let timelineManager = $state<TimelineManager>() as TimelineManager;
@@ -93,6 +100,25 @@
   const assetInteraction = new AssetInteraction();
   const timelineInteraction = new AssetInteraction();
 
+  afterNavigate(({ from }) => {
+    let url: string | undefined = from?.url?.pathname;
+
+    const route = from?.route?.id;
+    if (isSearchRoute(route)) {
+      url = from?.url.href;
+    }
+
+    if (isAlbumsRoute(route) || isPeopleRoute(route)) {
+      url = Route.albums();
+    }
+
+    backUrl = url || Route.albums();
+
+    if (backUrl === Route.sharedLinks()) {
+      backUrl = history.state?.backUrl || Route.albums();
+    }
+  });
+
   const handleFavorite = async () => {
     try {
       await activityManager.toggleLike();
@@ -132,6 +158,7 @@
       cancelMultiselect(assetInteraction);
       return;
     }
+    await goto(backUrl);
     return;
   };
 
@@ -278,7 +305,7 @@
 
   const onAlbumDelete = async ({ id }: AlbumResponseDto) => {
     if (id === album.id) {
-      await goto(Route.albums());
+      await goto(backUrl);
       viewMode = AlbumPageViewMode.VIEW;
     }
   };
@@ -305,7 +332,7 @@
   };
 
   const { Cast } = $derived(getGlobalActions($t));
-  const { Share, Close } = $derived(getAlbumActions($t, album, viewMode));
+  const { Share } = $derived(getAlbumActions($t, album));
   const { AddAssets, Upload } = $derived(getAlbumAssetsActions($t, album, timelineInteraction.selectedAssets));
 </script>
 
@@ -319,7 +346,7 @@
   onAlbumUserDelete={refreshAlbum}
   onAlbumUpdate={(newAlbum) => (album = newAlbum)}
 />
-<CommandPaletteDefaultProvider name={$t('album')} actions={[AddAssets, Upload, Close]} />
+<CommandPaletteDefaultProvider name={$t('album')} actions={[AddAssets, Upload]} />
 
 <div class="flex overflow-hidden" use:scrollMemoryClearer={{ routeStartsWith: Route.albums() }}>
   <div class="relative w-full shrink">
@@ -485,7 +512,7 @@
       </AssetSelectControlBar>
     {:else}
       {#if viewMode === AlbumPageViewMode.VIEW}
-        <ControlAppBar showBackButton backIcon={mdiArrowLeft} onClose={() => goto(Route.albums())}>
+        <ControlAppBar showBackButton backIcon={mdiArrowLeft} onClose={() => goto(backUrl)}>
           {#snippet trailing()}
             <ActionButton action={Cast} />
 

web/src/routes/(user)/people/[personId]/[[photos=photos]]/[[assetId=id]]/+page.svelte

@@ -33,6 +33,7 @@
   import { Route } from '$lib/route';
   import { getPersonActions } from '$lib/services/person.service';
   import { AssetInteraction } from '$lib/stores/asset-interaction.svelte';
+  import { assetViewingStore } from '$lib/stores/asset-viewing.store';
   import { locale } from '$lib/stores/preferences.store';
   import { preferences } from '$lib/stores/user.store';
   import { websocketEvents } from '$lib/stores/websocket';
@@ -60,6 +61,7 @@
   let { data }: Props = $props();
 
   let numberOfAssets = $derived(data.statistics.assets);
+  let { isViewing: showAssetViewer } = assetViewingStore;
 
   let timelineManager = $state<TimelineManager>() as TimelineManager;
   const options = $derived({ visibility: AssetVisibility.Timeline, personId: data.person.id });
@@ -104,13 +106,16 @@
   });
 
   const handleEscape = async () => {
+    if ($showAssetViewer) {
+      return;
+    }
     if (assetInteraction.selectionActive) {
       assetInteraction.clearMultiselect();
       return;
+    } else {
+      await goto(previousRoute);
+      return;
     }
-
-    await goto(previousRoute);
-    return;
   };
 
   const updateAssetCount = async () => {