feat: show "appears in" albums on asset viewer bottom sheet (#21925)

* feat: show "appears in" albums on asset viewer bottom sheet

fix: multiple RemoteAlbumPages in navigation stack

this also allows us to not have to set the current album before navigating to RemoteAlbumPage

chore: clarification comments

handle nested album pages

fix: hide "appears in" when an asset is not in any albums

fix: way more bottom padding

for some reason we can't query the safe area here :/

* fix: bottom sheet now is usable when navigating to another asset viewer

* fix: rebase conflict

* fix: restore ancestors album to currentRemoteAlbumProvider when popping

* fix: view flashing when dismissing a album viewer

* chore: code review changes

* fix: styling and padding

* chore: rework currentRemoteAlbumProvider to be scoped by the Remote album page

* fix: override remote album provider on required pages

* chore: convert query to all SQL calls instead of matching in Dart

* fix: album query

* fix: unawaited future

* Update deep_link.service.dart

---------

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

mobile/lib/presentation/pages/drift_activities.page.dart

@@ -3,6 +3,7 @@ import 'package:collection/collection.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_hooks/flutter_hooks.dart' hide Store;
 import 'package:hooks_riverpod/hooks_riverpod.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/extensions/asyncvalue_extensions.dart';
 import 'package:immich_mobile/extensions/build_context_extensions.dart';
@@ -18,12 +19,13 @@ import 'package:immich_mobile/widgets/activities/dismissible_activity.dart';
 
 @RoutePage()
 class DriftActivitiesPage extends HookConsumerWidget {
-  const DriftActivitiesPage({super.key});
+  final RemoteAlbum album;
+
+  const DriftActivitiesPage({super.key, required this.album});
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    final album = ref.watch(currentRemoteAlbumProvider)!;
-    final asset = ref.read(currentAssetNotifier) as RemoteAsset?;
+    final asset = ref.watch(currentAssetNotifier) as RemoteAsset?;
     final user = ref.watch(currentUserProvider);
 
     final activityNotifier = ref.read(albumActivityProvider(album.id, asset?.id).notifier);
@@ -43,62 +45,65 @@ class DriftActivitiesPage extends HookConsumerWidget {
       scrollToBottom();
     }
 
-    return Scaffold(
-      appBar: AppBar(
-        title: asset == null ? Text(album.name) : null,
-        actions: [const LikeActivityActionButton(menuItem: true)],
-        actionsPadding: const EdgeInsets.only(right: 8),
-      ),
-      body: activities.widgetWhen(
-        onData: (data) {
-          final liked = data.firstWhereOrNull(
-            (a) => a.type == ActivityType.like && a.user.id == user?.id && a.assetId == asset?.id,
-          );
+    return ProviderScope(
+      overrides: [currentRemoteAlbumScopedProvider.overrideWithValue(album)],
+      child: Scaffold(
+        appBar: AppBar(
+          title: asset == null ? Text(album.name) : null,
+          actions: [const LikeActivityActionButton(menuItem: true)],
+          actionsPadding: const EdgeInsets.only(right: 8),
+        ),
+        body: activities.widgetWhen(
+          onData: (data) {
+            final liked = data.firstWhereOrNull(
+              (a) => a.type == ActivityType.like && a.user.id == user?.id && a.assetId == asset?.id,
+            );
 
-          return SafeArea(
-            child: Stack(
-              children: [
-                ListView.builder(
-                  controller: listViewScrollController,
-                  itemCount: data.length + 1,
-                  itemBuilder: (context, index) {
-                    if (index == data.length) {
-                      return const SizedBox(height: 80);
-                    }
-                    final activity = data[index];
-                    final canDelete = activity.user.id == user?.id || album.ownerId == user?.id;
-                    return Padding(
-                      padding: const EdgeInsets.all(5),
-                      child: DismissibleActivity(
-                        activity.id,
-                        ActivityTile(activity),
-                        onDismiss: canDelete
-                            ? (activityId) async => await activityNotifier.removeActivity(activity.id)
-                            : null,
+            return SafeArea(
+              child: Stack(
+                children: [
+                  ListView.builder(
+                    controller: listViewScrollController,
+                    itemCount: data.length + 1,
+                    itemBuilder: (context, index) {
+                      if (index == data.length) {
+                        return const SizedBox(height: 80);
+                      }
+                      final activity = data[index];
+                      final canDelete = activity.user.id == user?.id || album.ownerId == user?.id;
+                      return Padding(
+                        padding: const EdgeInsets.all(5),
+                        child: DismissibleActivity(
+                          activity.id,
+                          ActivityTile(activity),
+                          onDismiss: canDelete
+                              ? (activityId) async => await activityNotifier.removeActivity(activity.id)
+                              : null,
+                        ),
+                      );
+                    },
+                  ),
+                  Align(
+                    alignment: Alignment.bottomCenter,
+                    child: Container(
+                      decoration: BoxDecoration(
+                        color: context.scaffoldBackgroundColor,
+                        border: Border(top: BorderSide(color: context.colorScheme.secondaryContainer, width: 1)),
+                      ),
+                      child: DriftActivityTextField(
+                        isEnabled: album.isActivityEnabled,
+                        likeId: liked?.id,
+                        onSubmit: onAddComment,
                       ),
-                    );
-                  },
-                ),
-                Align(
-                  alignment: Alignment.bottomCenter,
-                  child: Container(
-                    decoration: BoxDecoration(
-                      color: context.scaffoldBackgroundColor,
-                      border: Border(top: BorderSide(color: context.colorScheme.secondaryContainer, width: 1)),
-                    ),
-                    child: DriftActivityTextField(
-                      isEnabled: album.isActivityEnabled,
-                      likeId: liked?.id,
-                      onSubmit: onAddComment,
                     ),
                   ),
-                ),
-              ],
-            ),
-          );
-        },
+                ],
+              ),
+            );
+          },
+        ),
+        resizeToAvoidBottomInset: true,
       ),
-      resizeToAvoidBottomInset: true,
     );
   }
 }

mobile/lib/presentation/pages/drift_album.page.dart

@@ -5,7 +5,6 @@ import 'package:flutter/material.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/presentation/widgets/album/album_selector.widget.dart';
 import 'package:immich_mobile/providers/infrastructure/album.provider.dart';
-import 'package:immich_mobile/providers/infrastructure/current_album.provider.dart';
 import 'package:immich_mobile/routing/router.dart';
 import 'package:immich_mobile/widgets/common/immich_sliver_app_bar.dart';
 
@@ -43,7 +42,6 @@ class _DriftAlbumsPageState extends ConsumerState<DriftAlbumsPage> {
           ),
           AlbumSelector(
             onAlbumSelected: (album) {
-              ref.read(currentRemoteAlbumProvider.notifier).setAlbum(album);
               context.router.push(RemoteAlbumRoute(album: album));
             },
           ),

mobile/lib/presentation/pages/drift_album_options.page.dart

@@ -6,6 +6,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:fluttertoast/fluttertoast.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/domain/models/album/album.model.dart';
 import 'package:immich_mobile/domain/models/user.model.dart';
 import 'package:immich_mobile/extensions/build_context_extensions.dart';
 import 'package:immich_mobile/extensions/theme_extensions.dart';
@@ -22,15 +23,11 @@ import 'package:immich_mobile/widgets/common/user_circle_avatar.dart';
 
 @RoutePage()
 class DriftAlbumOptionsPage extends HookConsumerWidget {
-  const DriftAlbumOptionsPage({super.key});
+  final RemoteAlbum album;
+  const DriftAlbumOptionsPage({super.key, required this.album});
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    final album = ref.watch(currentRemoteAlbumProvider);
-    if (album == null) {
-      return const SizedBox();
-    }
-
     final sharedUsersAsync = ref.watch(remoteAlbumSharedUsersProvider(album.id));
     final userId = ref.watch(authProvider).userId;
     final activityEnabled = useState(album.isActivityEnabled);
@@ -191,48 +188,51 @@ class DriftAlbumOptionsPage extends HookConsumerWidget {
       );
     }
 
-    return Scaffold(
-      appBar: AppBar(
-        leading: IconButton(
-          icon: const Icon(Icons.arrow_back_ios_new_rounded),
-          onPressed: () => context.maybePop(null),
+    return ProviderScope(
+      overrides: [currentRemoteAlbumScopedProvider.overrideWithValue(album)],
+      child: Scaffold(
+        appBar: AppBar(
+          leading: IconButton(
+            icon: const Icon(Icons.arrow_back_ios_new_rounded),
+            onPressed: () => context.maybePop(null),
+          ),
+          centerTitle: true,
+          title: Text("options".t(context: context)),
         ),
-        centerTitle: true,
-        title: Text("options".t(context: context)),
-      ),
-      body: ListView(
-        children: [
-          const SizedBox(height: 8),
-          if (isOwner)
-            SwitchListTile.adaptive(
-              value: activityEnabled.value,
-              onChanged: (bool value) async {
-                activityEnabled.value = value;
-                await ref.read(remoteAlbumProvider.notifier).setActivityStatus(album.id, value);
-              },
-              activeThumbColor: activityEnabled.value ? context.primaryColor : context.themeData.disabledColor,
-              dense: true,
-              title: Text(
-                "comments_and_likes",
-                style: context.textTheme.titleMedium?.copyWith(fontWeight: FontWeight.w500),
-              ).t(context: context),
-              subtitle: Text(
-                "let_others_respond",
-                style: context.textTheme.labelLarge?.copyWith(color: context.colorScheme.onSurfaceSecondary),
-              ).t(context: context),
-            ),
-          buildSectionTitle("shared_album_section_people_title".t(context: context)),
-          if (isOwner) ...[
-            ListTile(
-              leading: const Icon(Icons.person_add_rounded),
-              title: Text("invite_people".t(context: context)),
-              onTap: () async => addUsers(),
-            ),
-            const Divider(indent: 16),
+        body: ListView(
+          children: [
+            const SizedBox(height: 8),
+            if (isOwner)
+              SwitchListTile.adaptive(
+                value: activityEnabled.value,
+                onChanged: (bool value) async {
+                  activityEnabled.value = value;
+                  await ref.read(remoteAlbumProvider.notifier).setActivityStatus(album.id, value);
+                },
+                activeThumbColor: activityEnabled.value ? context.primaryColor : context.themeData.disabledColor,
+                dense: true,
+                title: Text(
+                  "comments_and_likes",
+                  style: context.textTheme.titleMedium?.copyWith(fontWeight: FontWeight.w500),
+                ).t(context: context),
+                subtitle: Text(
+                  "let_others_respond",
+                  style: context.textTheme.labelLarge?.copyWith(color: context.colorScheme.onSurfaceSecondary),
+                ).t(context: context),
+              ),
+            buildSectionTitle("shared_album_section_people_title".t(context: context)),
+            if (isOwner) ...[
+              ListTile(
+                leading: const Icon(Icons.person_add_rounded),
+                title: Text("invite_people".t(context: context)),
+                onTap: () async => addUsers(),
+              ),
+              const Divider(indent: 16),
+            ],
+            buildOwnerInfo(),
+            buildSharedUsersList(),
           ],
-          buildOwnerInfo(),
-          buildSharedUsersList(),
-        ],
+        ),
       ),
     );
   }

mobile/lib/presentation/pages/drift_create_album.page.dart

@@ -8,7 +8,6 @@ import 'package:immich_mobile/extensions/build_context_extensions.dart';
 import 'package:immich_mobile/extensions/translate_extensions.dart';
 import 'package:immich_mobile/presentation/widgets/images/thumbnail.widget.dart';
 import 'package:immich_mobile/providers/infrastructure/album.provider.dart';
-import 'package:immich_mobile/providers/infrastructure/current_album.provider.dart';
 import 'package:immich_mobile/routing/router.dart';
 import 'package:immich_mobile/widgets/album/album_action_filled_button.dart';
 
@@ -180,7 +179,6 @@ class _DriftCreateAlbumPageState extends ConsumerState<DriftCreateAlbumPage> {
         );
 
     if (album != null) {
-      ref.read(currentRemoteAlbumProvider.notifier).setAlbum(album);
       unawaited(context.replaceRoute(RemoteAlbumRoute(album: album)));
     }
   }

mobile/lib/presentation/pages/drift_remote_album.page.dart

@@ -168,7 +168,7 @@ class _RemoteAlbumPageState extends ConsumerState<RemoteAlbumPage> {
   }
 
   Future<void> showActivity(BuildContext context) async {
-    unawaited(context.pushRoute(const DriftActivitiesRoute()));
+    unawaited(context.pushRoute(DriftActivitiesRoute(album: _album)));
   }
 
   Future<void> showOptionSheet(BuildContext context) async {
@@ -224,7 +224,7 @@ class _RemoteAlbumPageState extends ConsumerState<RemoteAlbumPage> {
                 : null,
             onShowOptions: () {
               context.pop();
-              context.pushRoute(const DriftAlbumOptionsRoute());
+              context.pushRoute(DriftAlbumOptionsRoute(album: _album));
             },
           );
         },
@@ -237,35 +237,24 @@ class _RemoteAlbumPageState extends ConsumerState<RemoteAlbumPage> {
     final user = ref.watch(currentUserProvider);
     final isOwner = user != null ? user.id == _album.ownerId : false;
 
-    return PopScope(
-      onPopInvokedWithResult: (didPop, _) {
-        if (didPop) {
-          Future.microtask(() {
-            if (mounted) {
-              ref.read(currentRemoteAlbumProvider.notifier).dispose();
-              ref.read(remoteAlbumProvider.notifier).refresh();
-            }
-          });
-        }
-      },
-      child: ProviderScope(
-        overrides: [
-          timelineServiceProvider.overrideWith((ref) {
-            final timelineService = ref.watch(timelineFactoryProvider).remoteAlbum(albumId: _album.id);
-            ref.onDispose(timelineService.dispose);
-            return timelineService;
-          }),
-        ],
-        child: Timeline(
-          appBar: RemoteAlbumSliverAppBar(
-            icon: Icons.photo_album_outlined,
-            onShowOptions: () => showOptionSheet(context),
-            onToggleAlbumOrder: isOwner ? () => toggleAlbumOrder() : null,
-            onEditTitle: isOwner ? () => showEditTitleAndDescription(context) : null,
-            onActivity: () => showActivity(context),
-          ),
-          bottomSheet: RemoteAlbumBottomSheet(album: _album),
+    return ProviderScope(
+      overrides: [
+        timelineServiceProvider.overrideWith((ref) {
+          final timelineService = ref.watch(timelineFactoryProvider).remoteAlbum(albumId: _album.id);
+          ref.onDispose(timelineService.dispose);
+          return timelineService;
+        }),
+        currentRemoteAlbumScopedProvider.overrideWithValue(_album),
+      ],
+      child: Timeline(
+        appBar: RemoteAlbumSliverAppBar(
+          icon: Icons.photo_album_outlined,
+          onShowOptions: () => showOptionSheet(context),
+          onToggleAlbumOrder: isOwner ? () => toggleAlbumOrder() : null,
+          onEditTitle: isOwner ? () => showEditTitleAndDescription(context) : null,
+          onActivity: () => showActivity(context),
         ),
+        bottomSheet: RemoteAlbumBottomSheet(album: _album),
       ),
     );
   }