feat(mobile): Modified draggable area of detail modal (#14953)

Modified draggable area of detail modal

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

@@ -127,18 +127,29 @@ class GalleryViewerPage extends HookConsumerWidget {
         context: context,
         useSafeArea: true,
         builder: (context) {
-          return FractionallySizedBox(
-            heightFactor: 0.75,
-            child: Padding(
-              padding: EdgeInsets.only(
-                bottom: context.viewInsets.bottom,
-              ),
-              child: ref
-                      .watch(appSettingsServiceProvider)
-                      .getSetting<bool>(AppSettingsEnum.advancedTroubleshooting)
-                  ? AdvancedBottomSheet(assetDetail: asset)
-                  : DetailPanel(asset: asset),
-            ),
+          return DraggableScrollableSheet(
+            minChildSize: 0.5,
+            maxChildSize: 1,
+            initialChildSize: 0.75,
+            expand: false,
+            builder: (context, scrollController) {
+              return Padding(
+                padding: EdgeInsets.only(
+                  bottom: context.viewInsets.bottom,
+                ),
+                child: ref.watch(appSettingsServiceProvider).getSetting<bool>(
+                          AppSettingsEnum.advancedTroubleshooting,
+                        )
+                    ? AdvancedBottomSheet(
+                        assetDetail: asset,
+                        scrollController: scrollController,
+                      )
+                    : DetailPanel(
+                        asset: asset,
+                        scrollController: scrollController,
+                      ),
+              );
+            },
           );
         },
       );

mobile/lib/widgets/asset_viewer/advanced_bottom_sheet.dart

@@ -6,12 +6,18 @@ import 'package:immich_mobile/entities/asset.entity.dart';
 
 class AdvancedBottomSheet extends HookConsumerWidget {
   final Asset assetDetail;
+  final ScrollController? scrollController;
 
-  const AdvancedBottomSheet({super.key, required this.assetDetail});
+  const AdvancedBottomSheet({
+    super.key,
+    required this.assetDetail,
+    this.scrollController,
+  });
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
     return SingleChildScrollView(
+      controller: scrollController,
       child: Container(
         margin: const EdgeInsets.symmetric(horizontal: 8.0),
         child: LayoutBuilder(

mobile/lib/widgets/asset_viewer/detail_panel/detail_panel.dart

@@ -9,12 +9,14 @@ import 'package:immich_mobile/entities/asset.entity.dart';
 
 class DetailPanel extends HookConsumerWidget {
   final Asset asset;
+  final ScrollController? scrollController;
 
-  const DetailPanel({super.key, required this.asset});
+  const DetailPanel({super.key, required this.asset, this.scrollController});
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
     return ListView(
+      controller: scrollController,
       shrinkWrap: true,
       children: [
         Padding(