timeline go brrrrr

mobile-v2/lib/presentation/components/grid/asset_grid.widget.dart

@@ -1,7 +1,6 @@
 import 'package:collection/collection.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
-import 'package:flutter_list_view/flutter_list_view.dart';
 import 'package:immich_mobile/domain/models/render_list_element.model.dart';
 import 'package:immich_mobile/i18n/strings.g.dart';
 import 'package:immich_mobile/presentation/components/common/page_empty.widget.dart';
@@ -13,6 +12,7 @@ import 'package:immich_mobile/utils/extensions/build_context.extension.dart';
 import 'package:immich_mobile/utils/extensions/color.extension.dart';
 import 'package:intl/intl.dart';
 import 'package:material_symbols_icons/symbols.dart';
+import 'package:scrollable_positioned_list/scrollable_positioned_list.dart';
 
 part 'asset_grid_header.widget.dart';
 
@@ -20,31 +20,18 @@ class ImAssetGrid extends StatefulWidget {
   /// The padding for the grid
   final double? topPadding;
 
-  final FlutterListViewController? controller;
-
-  const ImAssetGrid({this.controller, this.topPadding, super.key});
+  const ImAssetGrid({this.topPadding, super.key});
 
   @override
   State createState() => _ImAssetGridState();
 }
 
 class _ImAssetGridState extends State<ImAssetGrid> {
-  late final FlutterListViewController _controller;
-
-  @override
-  void initState() {
-    super.initState();
-    _controller = widget.controller ?? FlutterListViewController();
-  }
-
-  @override
-  void dispose() {
-    // Dispose controller if it was created here
-    if (widget.controller == null) {
-      _controller.dispose();
-    }
-    super.dispose();
-  }
+  final ItemScrollController _itemScrollController = ItemScrollController();
+  final ScrollOffsetController _scrollOffsetController =
+      ScrollOffsetController();
+  final ItemPositionsListener _itemPositionsListener =
+      ItemPositionsListener.create();
 
   Text? _labelBuilder(List<RenderListElement> elements, int currentPosition) {
     final element = elements.elementAtOrNull(currentPosition);
@@ -86,51 +73,46 @@ class _ImAssetGridState extends State<ImAssetGrid> {
             elements.removeAt(0);
           }
 
-          final grid = FlutterListView(
-            delegate: FlutterListViewDelegate(
-              (_, sectionIndex) {
-                // ignore: avoid-unsafe-collection-methods
-                final section = elements[sectionIndex];
+          final EdgeInsets? padding = null;
 
-                return switch (section) {
-                  RenderListPaddingElement() => Padding(
-                      padding: EdgeInsets.only(top: section.topPadding),
-                    ),
-                  RenderListMonthHeaderElement() =>
-                    _MonthHeader(text: section.header),
-                  RenderListDayHeaderElement() => Text(section.header),
-                  RenderListAssetElement() => ImStaticGrid(
-                      section: section,
-                      isDragging: state.isDragScrolling,
-                    ),
-                };
-              },
-              childCount: elements.length,
-              addAutomaticKeepAlives: false,
-            ),
-            controller: _controller,
+          final grid = ScrollablePositionedList.builder(
+            itemCount: state.renderList.elements.length,
+            itemBuilder: (_, sectionIndex) {
+              // ignore: avoid-unsafe-collection-methods
+              final section = elements[sectionIndex];
+
+              return switch (section) {
+                RenderListPaddingElement() => Padding(
+                    padding: EdgeInsets.only(top: section.topPadding),
+                  ),
+                RenderListMonthHeaderElement() =>
+                  _MonthHeader(text: section.header),
+                RenderListDayHeaderElement() => Text(section.header),
+                RenderListAssetElement() => ImStaticGrid(section: section),
+              };
+            },
+            itemScrollController: _itemScrollController,
+            itemPositionsListener: _itemPositionsListener,
+            scrollOffsetController: _scrollOffsetController,
+            padding: padding,
+            addRepaintBoundaries: true,
           );
 
-          final EdgeInsetsGeometry? padding;
-          if (widget.topPadding == null) {
-            padding = null;
-          } else {
-            padding = EdgeInsets.only(top: widget.topPadding!);
-          }
-
-          return DraggableScrollbar(
-            controller: _controller,
-            maxItemCount: elements.length,
+          return DraggableScrollbar.semicircle(
+            alwaysVisibleScrollThumb: true,
+            controller: _itemScrollController,
+            itemPositionsListener: _itemPositionsListener,
             scrollStateListener:
                 context.read<AssetGridCubit>().setDragScrolling,
             backgroundColor: context.colorScheme.surfaceContainerHighest,
             foregroundColor: context.colorScheme.onSurface,
-            padding: padding,
-            scrollbarAnimationDuration: Durations.medium2,
-            scrollbarTimeToFade: Durations.extralong4,
+            padding: EdgeInsets.only(top: 120),
+            heightOffset: 100,
+            scrollbarAnimationDuration: const Duration(milliseconds: 300),
+            scrollbarTimeToFade: const Duration(milliseconds: 1000),
             labelTextBuilder: (int position) =>
                 _labelBuilder(elements, position),
-            labelConstraints: const BoxConstraints(maxHeight: 36),
+            labelConstraints: const BoxConstraints(maxHeight: 28),
             child: grid,
           );
         },