fix: timeline service uninitialised across routes (#19544)

mobile/lib/pages/common/tab_shell.page.dart

@@ -4,11 +4,11 @@ import 'package:flutter/material.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/extensions/build_context_extensions.dart';
 import 'package:immich_mobile/providers/asset_viewer/scroll_notifier.provider.dart';
-import 'package:immich_mobile/providers/multiselect.provider.dart';
-import 'package:immich_mobile/providers/search/search_input_focus.provider.dart';
-import 'package:immich_mobile/routing/router.dart';
 import 'package:immich_mobile/providers/haptic_feedback.provider.dart';
+import 'package:immich_mobile/providers/search/search_input_focus.provider.dart';
 import 'package:immich_mobile/providers/tab.provider.dart';
+import 'package:immich_mobile/providers/timeline/multiselect.provider.dart';
+import 'package:immich_mobile/routing/router.dart';
 
 @RoutePage()
 class TabShellPage extends ConsumerWidget {
@@ -138,7 +138,8 @@ class TabShellPage extends ConsumerWidget {
       );
     }
 
-    final multiselectEnabled = ref.watch(multiselectProvider);
+    final multiselectEnabled =
+        ref.watch(multiSelectProvider.select((s) => s.isEnabled));
     return AutoTabsRouter(
       routes: [
         const MainTimelineRoute(),

mobile/lib/presentation/pages/dev/local_timeline.page.dart

@@ -1,5 +1,3 @@
-import 'dart:async';
-
 import 'package:auto_route/auto_route.dart';
 import 'package:flutter/widgets.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
@@ -20,7 +18,7 @@ class LocalTimelinePage extends StatelessWidget {
           (ref) {
             final timelineService =
                 ref.watch(timelineFactoryProvider).localAlbum(albumId: albumId);
-            ref.onDispose(() => unawaited(timelineService.dispose()));
+            ref.onDispose(timelineService.dispose);
             return timelineService;
           },
         ),

mobile/lib/presentation/pages/dev/main_timeline.page.dart

@@ -1,10 +1,7 @@
-import 'dart:async';
-
 import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/presentation/widgets/timeline/timeline.widget.dart';
-import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart';
 
 @RoutePage()
 class MainTimelinePage extends ConsumerWidget {
@@ -12,23 +9,6 @@ class MainTimelinePage extends ConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    return ProviderScope(
+    return const Timeline();
-      key: ref.watch(timelineUsersProvider).value != null
-          ? ValueKey(ref.watch(timelineUsersProvider).value)
-          : const ValueKey("main-timeline"),
-      overrides: [
-        timelineServiceProvider.overrideWith(
-          (ref) {
-            final timelineUsers =
-                ref.watch(timelineUsersProvider).valueOrNull ?? [];
-            final timelineService =
-                ref.watch(timelineFactoryProvider).main(timelineUsers);
-            ref.onDispose(() => unawaited(timelineService.dispose()));
-            return timelineService;
-          },
-        ),
-      ],
-      child: const Timeline(),
-    );
   }
 }

mobile/lib/presentation/pages/dev/remote_timeline.page.dart

@@ -1,5 +1,3 @@
-import 'dart:async';
-
 import 'package:auto_route/auto_route.dart';
 import 'package:flutter/widgets.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
@@ -21,7 +19,7 @@ class RemoteTimelinePage extends StatelessWidget {
             final timelineService = ref
                 .watch(timelineFactoryProvider)
                 .remoteAlbum(albumId: albumId);
-            ref.onDispose(() => unawaited(timelineService.dispose()));
+            ref.onDispose(timelineService.dispose);
             return timelineService;
           },
         ),

mobile/lib/presentation/widgets/bottom_app_bar/home_bottom_app_bar.widget.dart

@@ -30,8 +30,7 @@ class HomeBottomAppBar extends ConsumerWidget {
 
     return BaseBottomSheet(
       initialChildSize: 0.25,
-      minChildSize: 0.22,
+      shouldCloseOnMinExtent: false,
-      expand: false,
       actions: [
         if (multiselect.isEnabled) const ShareActionButton(),
         if (multiselect.hasRemote) ...[

mobile/lib/presentation/widgets/timeline/timeline.widget.dart

@@ -43,26 +43,15 @@ class Timeline extends StatelessWidget {
   }
 }
 
-class _SliverTimeline extends ConsumerStatefulWidget {
+class _SliverTimeline extends StatefulWidget {
   const _SliverTimeline();
 
   @override
-  ConsumerState createState() => _SliverTimelineState();
+  State createState() => _SliverTimelineState();
 }
 
-class _SliverTimelineState extends ConsumerState<_SliverTimeline> {
+class _SliverTimelineState extends State<_SliverTimeline> {
   final _scrollController = ScrollController();
-  PersistentBottomSheetController? _bottomSheetController;
-  bool _isMultiSelectEnabled = false;
-
-  @override
-  void initState() {
-    super.initState();
-    ref.listenManual(
-      multiSelectProvider.select((s) => s.isEnabled),
-      _onMultiSelectChanged,
-    );
-  }
 
   @override
   void dispose() {
@@ -70,93 +59,80 @@ class _SliverTimelineState extends ConsumerState<_SliverTimeline> {
     super.dispose();
   }
 
-  void _onMultiSelectChanged(bool? previous, bool current) {
-    if (context.mounted && current != _isMultiSelectEnabled) {
-      setState(() {
-        _isMultiSelectEnabled = current;
-        if (current) {
-          _bottomSheetController = showBottomSheet(
-            context: context,
-            builder: (_) => const HomeBottomAppBar(),
-          );
-          _bottomSheetController?.closed.then((_) {
-            _bottomSheetController = null;
-            // Reset the multi-select state when the bottom sheet is closed
-            ref.read(multiSelectProvider.notifier).reset();
-          });
-        } else {
-          _bottomSheetController?.close();
-        }
-      });
-    }
-  }
-
   @override
   Widget build(BuildContext _) {
-    final asyncSegments = ref.watch(timelineSegmentProvider);
+    return Consumer(
-    final maxHeight =
+      builder: (context, ref, child) {
-        ref.watch(timelineArgsProvider.select((args) => args.maxHeight));
+        final asyncSegments = ref.watch(timelineSegmentProvider);
+        final maxHeight =
+            ref.watch(timelineArgsProvider.select((args) => args.maxHeight));
+        final isMultiSelectEnabled =
+            ref.watch(multiSelectProvider.select((s) => s.isEnabled));
+        return asyncSegments.widgetWhen(
+          onData: (segments) {
+            final childCount = (segments.lastOrNull?.lastIndex ?? -1) + 1;
+            final statusBarHeight = context.padding.top;
+            final totalAppBarHeight = statusBarHeight + kToolbarHeight;
+            const scrubberBottomPadding = 100.0;
 
-    return asyncSegments.widgetWhen(
+            return PrimaryScrollController(
-      onData: (segments) {
+              controller: _scrollController,
-        final childCount = (segments.lastOrNull?.lastIndex ?? -1) + 1;
+              child: Stack(
-        final statusBarHeight = context.padding.top;
+                children: [
-        final totalAppBarHeight = statusBarHeight + kToolbarHeight;
+                  Scrubber(
-        const scrubberBottomPadding = 100.0;
+                    layoutSegments: segments,
-
+                    timelineHeight: maxHeight,
-        return PrimaryScrollController(
+                    topPadding: totalAppBarHeight + 10,
-          controller: _scrollController,
+                    bottomPadding:
-          child: Stack(
+                        context.padding.bottom + scrubberBottomPadding,
-            children: [
+                    child: CustomScrollView(
-              Scrubber(
+                      primary: true,
-                layoutSegments: segments,
+                      cacheExtent: maxHeight * 2,
-                timelineHeight: maxHeight,
+                      slivers: [
-                topPadding: totalAppBarHeight + 10,
+                        SliverAnimatedOpacity(
-                bottomPadding: context.padding.bottom + scrubberBottomPadding,
+                          duration: Durations.medium1,
-                child: CustomScrollView(
+                          opacity: isMultiSelectEnabled ? 0 : 1,
-                  primary: true,
+                          sliver: const ImmichSliverAppBar(
-                  cacheExtent: maxHeight * 2,
+                            floating: true,
-                  slivers: [
+                            pinned: false,
-                    SliverAnimatedOpacity(
+                            snap: false,
-                      duration: Durations.medium1,
+                          ),
-                      opacity: _isMultiSelectEnabled ? 0 : 1,
+                        ),
-                      sliver: const ImmichSliverAppBar(
+                        _SliverSegmentedList(
-                        floating: true,
+                          segments: segments,
-                        pinned: false,
+                          delegate: SliverChildBuilderDelegate(
-                        snap: false,
+                            (ctx, index) {
-                      ),
+                              if (index >= childCount) return null;
+                              final segment = segments.findByIndex(index);
+                              return segment?.builder(ctx, index) ??
+                                  const SizedBox.shrink();
+                            },
+                            childCount: childCount,
+                            addAutomaticKeepAlives: false,
+                            // We add repaint boundary around tiles, so skip the auto boundaries
+                            addRepaintBoundaries: false,
+                          ),
+                        ),
+                        const SliverPadding(
+                          padding: EdgeInsets.only(
+                            bottom: scrubberBottomPadding,
+                          ),
+                        ),
+                      ],
                     ),
-                    _SliverSegmentedList(
+                  ),
-                      segments: segments,
+                  if (isMultiSelectEnabled) ...[
-                      delegate: SliverChildBuilderDelegate(
+                    const Positioned(
-                        (ctx, index) {
+                      top: 60,
-                          if (index >= childCount) return null;
+                      left: 25,
-                          final segment = segments.findByIndex(index);
+                      child: _MultiSelectStatusButton(),
-                          return segment?.builder(ctx, index) ??
-                              const SizedBox.shrink();
-                        },
-                        childCount: childCount,
-                        addAutomaticKeepAlives: false,
-                        // We add repaint boundary around tiles, so skip the auto boundaries
-                        addRepaintBoundaries: false,
-                      ),
-                    ),
-                    const SliverPadding(
-                      padding: EdgeInsets.only(
-                        bottom: scrubberBottomPadding,
-                      ),
                     ),
+                    const HomeBottomAppBar(),
                   ],
-                ),
+                ],
               ),
-              if (_isMultiSelectEnabled)
+            );
-                const Positioned(
+          },
-                  top: 60,
-                  left: 25,
-                  child: _MultiSelectStatusButton(),
-                ),
-            ],
-          ),
         );
       },
     );

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

@@ -1,20 +1,18 @@
 import 'package:flutter/material.dart';
 import 'package:immich_mobile/constants/enums.dart';
 import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
-import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart';
-import 'package:immich_mobile/providers/multiselect.provider.dart';
 import 'package:immich_mobile/providers/timeline/multiselect.provider.dart';
 import 'package:immich_mobile/providers/user.provider.dart';
 import 'package:immich_mobile/services/action.service.dart';
+import 'package:immich_mobile/services/timeline.service.dart';
 import 'package:logging/logging.dart';
 import 'package:riverpod_annotation/riverpod_annotation.dart';
 
 final actionProvider = NotifierProvider<ActionNotifier, void>(
   ActionNotifier.new,
   dependencies: [
-    actionServiceProvider,
+    multiSelectProvider,
     timelineServiceProvider,
-    multiselectProvider,
   ],
 );
 
@@ -32,7 +30,7 @@ class ActionResult {
 
 class ActionNotifier extends Notifier<void> {
   final Logger _logger = Logger('ActionNotifier');
-  late final ActionService _service;
+  late ActionService _service;
 
   ActionNotifier() : super();
 

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

@@ -15,9 +15,17 @@ final timelineArgsProvider = Provider.autoDispose<TimelineArgs>(
       throw UnimplementedError('Will be overridden through a ProviderScope.'),
 );
 
-final timelineServiceProvider = Provider.autoDispose<TimelineService>(
+final timelineServiceProvider = Provider<TimelineService>(
-  (ref) =>
+  (ref) {
-      throw UnimplementedError('Will be overridden through a ProviderScope.'),
+    final timelineUsers = ref.watch(timelineUsersProvider).valueOrNull ?? [];
+    final timelineService =
+        ref.watch(timelineFactoryProvider).main(timelineUsers);
+    ref.onDispose(timelineService.dispose);
+    return timelineService;
+  },
+  // Empty dependencies to inform the framework that this provider
+  // might be used in a ProviderScope
+  dependencies: [],
 );
 
 final timelineFactoryProvider = Provider<TimelineFactory>(

mobile/lib/providers/timeline/multiselect.provider.dart

@@ -47,12 +47,10 @@ class MultiSelectState {
 }
 
 class MultiSelectNotifier extends Notifier<MultiSelectState> {
-  late final TimelineService _timelineService;
+  TimelineService get _timelineService => ref.read(timelineServiceProvider);
 
   @override
   MultiSelectState build() {
-    _timelineService = ref.read(timelineServiceProvider);
-
     return const MultiSelectState(selectedAssets: {});
   }
 
@@ -145,5 +143,5 @@ final bucketSelectionProvider = Provider.family<bool, List<BaseAsset>>(
     // Check if all assets in the bucket are selected
     return bucketAssets.every((asset) => selectedAssets.contains(asset));
   },
-  dependencies: [multiSelectProvider],
+  dependencies: [multiSelectProvider, timelineServiceProvider],
 );