refactor: migrate viewer config to metadata table (#28396)

* refactor: app metadata

* refactor to per row store

* cleanup

* more test

* review changes

* more refactor

* refactor

* migrate primary color

* migrate dynamic theme

* migrate colorfulInterface

* cleanup providers

* migrate cleanup

* migrate mapconfig

* remove unused keys

* migrate timeline config

* migrate image config

* migrate viewer config

---------

Co-authored-by: shenlong-tanwen <139912620+shalong-tanwen@users.noreply.github.com>

mobile/lib/domain/models/config/app_config.dart

@@ -3,6 +3,7 @@ import 'package:immich_mobile/domain/models/config/image_config.dart';
 import 'package:immich_mobile/domain/models/config/map_config.dart';
 import 'package:immich_mobile/domain/models/config/theme_config.dart';
 import 'package:immich_mobile/domain/models/config/timeline_config.dart';
+import 'package:immich_mobile/domain/models/config/viewer_config.dart';
 
 class AppConfig {
   final ThemeConfig theme;
@@ -10,6 +11,7 @@ class AppConfig {
   final MapConfig map;
   final TimelineConfig timeline;
   final ImageConfig image;
+  final ViewerConfig viewer;
 
   const AppConfig({
     this.theme = const .new(),
@@ -17,6 +19,7 @@ class AppConfig {
     this.map = const .new(),
     this.timeline = const .new(),
     this.image = const .new(),
+    this.viewer = const .new(),
   });
 
   AppConfig copyWith({
@@ -25,12 +28,14 @@ class AppConfig {
     MapConfig? map,
     TimelineConfig? timeline,
     ImageConfig? image,
+    ViewerConfig? viewer,
   }) => .new(
     theme: theme ?? this.theme,
     cleanup: cleanup ?? this.cleanup,
     map: map ?? this.map,
     timeline: timeline ?? this.timeline,
     image: image ?? this.image,
+    viewer: viewer ?? this.viewer,
   );
 
   @override
@@ -41,11 +46,13 @@ class AppConfig {
           other.cleanup == cleanup &&
           other.map == map &&
           other.timeline == timeline &&
-          other.image == image);
+          other.image == image &&
+          other.viewer == viewer);
 
   @override
-  int get hashCode => Object.hash(theme, cleanup, map, timeline, image);
+  int get hashCode => Object.hash(theme, cleanup, map, timeline, image, viewer);
 
   @override
-  String toString() => 'AppConfig(theme: $theme, cleanup: $cleanup, map: $map, timeline: $timeline, image: $image)';
+  String toString() =>
+      'AppConfig(theme: $theme, cleanup: $cleanup, map: $map, timeline: $timeline, image: $image, viewer: $viewer)';
 }

mobile/lib/domain/models/config/viewer_config.dart

@@ -0,0 +1,37 @@
+class ViewerConfig {
+  final bool loopVideo;
+  final bool loadOriginalVideo;
+  final bool autoPlayVideo;
+  final bool tapToNavigate;
+
+  const ViewerConfig({
+    this.loopVideo = true,
+    this.loadOriginalVideo = false,
+    this.autoPlayVideo = true,
+    this.tapToNavigate = false,
+  });
+
+  ViewerConfig copyWith({bool? loopVideo, bool? loadOriginalVideo, bool? autoPlayVideo, bool? tapToNavigate}) =>
+      ViewerConfig(
+        loopVideo: loopVideo ?? this.loopVideo,
+        loadOriginalVideo: loadOriginalVideo ?? this.loadOriginalVideo,
+        autoPlayVideo: autoPlayVideo ?? this.autoPlayVideo,
+        tapToNavigate: tapToNavigate ?? this.tapToNavigate,
+      );
+
+  @override
+  bool operator ==(Object other) =>
+      identical(this, other) ||
+      (other is ViewerConfig &&
+          other.loopVideo == loopVideo &&
+          other.loadOriginalVideo == loadOriginalVideo &&
+          other.autoPlayVideo == autoPlayVideo &&
+          other.tapToNavigate == tapToNavigate);
+
+  @override
+  int get hashCode => Object.hash(loopVideo, loadOriginalVideo, autoPlayVideo, tapToNavigate);
+
+  @override
+  String toString() =>
+      'ViewerConfig(loopVideo: $loopVideo, loadOriginalVideo: $loadOriginalVideo, autoPlayVideo: $autoPlayVideo, tapToNavigate: $tapToNavigate)';
+}

mobile/lib/domain/models/metadata_key.dart

@@ -28,6 +28,12 @@ enum MetadataKey<T extends Object> {
   imagePreferRemote<bool>(.appConfig, 'image.preferRemote', false),
   imageLoadOriginal<bool>(.appConfig, 'image.loadOriginal', false),
 
+  // Viewer
+  viewerLoopVideo<bool>(.appConfig, 'viewer.loopVideo', true),
+  viewerLoadOriginalVideo<bool>(.appConfig, 'viewer.loadOriginalVideo', false),
+  viewerAutoPlayVideo<bool>(.appConfig, 'viewer.autoPlayVideo', true),
+  viewerTapToNavigate<bool>(.appConfig, 'viewer.tapToNavigate', false),
+
   // Timeline
   timelineTilesPerRow<int>(.appConfig, 'timeline.tilesPerRow', 4),
   timelineGroupAssetsBy<GroupAssetsBy>(

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

@@ -1,8 +1,6 @@
 import 'package:immich_mobile/domain/models/store.model.dart';
 
 enum Setting<T> {
-  loadOriginalVideo<bool>(StoreKey.loadOriginalVideo, false),
-  autoPlayVideo<bool>(StoreKey.autoPlayVideo, true),
   advancedTroubleshooting<bool>(StoreKey.advancedTroubleshooting, false),
   enableBackup<bool>(StoreKey.enableBackup, false);
 

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

@@ -40,12 +40,6 @@ enum StoreKey<T> {
   albumGridView<bool>._(140),
   loadOriginal<bool>._(101),
 
-  // Image viewer navigation settings
-  loopVideo<bool>._(117),
-  loadOriginalVideo<bool>._(136),
-  autoPlayVideo<bool>._(139),
-  tapToNavigate<bool>._(141),
-
   // Experimental stuff
   enableBackup<bool>._(1003),
   useWifiForUploadVideos<bool>._(1004),
@@ -53,6 +47,10 @@ enum StoreKey<T> {
   syncMigrationStatus<String>._(1013),
 
   // Legacy keys that have been migrated to the new metadata store
+  legacyLoopVideo<bool>._(117),
+  legacyLoadOriginalVideo<bool>._(136),
+  legacyAutoPlayVideo<bool>._(139),
+  legacyTapToNavigate<bool>._(141),
   legacyPreferRemoteImage<bool>._(116),
   legacyLoadOriginal<bool>._(101),
   legacyPrimaryColor<String>._(128),