Show map inside bottom sheet on clicking 'add location data'

lib/ui/viewer/file/file_details_widget.dart

@@ -1,6 +1,7 @@
 import "package:exif/exif.dart";
 import "package:flutter/material.dart";
 import "package:logging/logging.dart";
+import "package:modal_bottom_sheet/modal_bottom_sheet.dart";
 import "package:photos/core/configuration.dart";
 import "package:photos/generated/l10n.dart";
 import 'package:photos/models/file/file.dart';
@@ -8,6 +9,7 @@ import 'package:photos/models/file/file_type.dart';
 import "package:photos/models/metadata/file_magic.dart";
 import "package:photos/services/file_magic_service.dart";
 import "package:photos/services/update_service.dart";
+import "package:photos/theme/colors.dart";
 import 'package:photos/theme/ente_theme.dart';
 import 'package:photos/ui/components/buttons/icon_button_widget.dart';
 import "package:photos/ui/components/divider_widget.dart";
@@ -22,6 +24,7 @@ import 'package:photos/ui/viewer/file_details/exif_item_widgets.dart';
 import "package:photos/ui/viewer/file_details/file_properties_item_widget.dart";
 import "package:photos/ui/viewer/file_details/location_tags_widget.dart";
 import "package:photos/ui/viewer/file_details/objects_item_widget.dart";
+import 'package:photos/ui/viewer/location/add_location_data_widget.dart';
 import "package:photos/utils/exif_util.dart";
 
 class FileDetailsWidget extends StatefulWidget {
@@ -87,6 +90,7 @@ class _FileDetailsWidgetState extends State<FileDetailsWidget> {
     getExif(widget.file).then((exif) {
       _exifNotifier.value = exif;
     });
+
     super.initState();
   }
 
@@ -172,7 +176,22 @@ class _FileDetailsWidgetState extends State<FileDetailsWidget> {
                         ],
                       ),
                       hasChipButtons: false,
-                      onTap: () {},
+                      onTap: () {
+                        showBarModalBottomSheet(
+                          shape: const RoundedRectangleBorder(
+                            borderRadius: BorderRadius.vertical(
+                              top: Radius.circular(5),
+                            ),
+                          ),
+                          backgroundColor:
+                              getEnteColorScheme(context).backgroundElevated,
+                          barrierColor: backdropFaintDark,
+                          context: context,
+                          builder: (context) {
+                            return const AddLocationDataWidget();
+                          },
+                        );
+                      },
                     ),
                     const FileDetailsDivider(),
                   ],

lib/ui/viewer/location/add_location_data_widget.dart

@@ -0,0 +1,78 @@
+import "package:flutter/material.dart";
+import "package:flutter_map/flutter_map.dart";
+import "package:photos/ui/map/map_button.dart";
+import "package:photos/ui/map/tile/layers.dart";
+
+class AddLocationDataWidget extends StatefulWidget {
+  const AddLocationDataWidget({super.key});
+
+  @override
+  State<AddLocationDataWidget> createState() => _AddLocationDataWidgetState();
+}
+
+class _AddLocationDataWidgetState extends State<AddLocationDataWidget> {
+  final MapController _mapController = MapController();
+
+  @override
+  void initState() {
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    super.dispose();
+    _mapController.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Stack(
+      children: [
+        FlutterMap(
+          mapController: _mapController,
+          options: MapOptions(
+            zoom: 3,
+            maxZoom: 18.0,
+            minZoom: 2.8,
+            onTap: (tapPosition, latlng) {
+              print(latlng);
+            },
+          ),
+          children: const [
+            OSMFranceTileLayer(),
+          ],
+        ),
+        Positioned(
+          // bottom: widget.bottomSheetDraggableAreaHeight + 10,
+          bottom: 30,
+
+          right: 10,
+          child: Column(
+            children: [
+              MapButton(
+                icon: Icons.add,
+                onPressed: () {
+                  _mapController.move(
+                    _mapController.center,
+                    _mapController.zoom + 1,
+                  );
+                },
+                heroTag: 'zoom-in',
+              ),
+              MapButton(
+                icon: Icons.remove,
+                onPressed: () {
+                  _mapController.move(
+                    _mapController.center,
+                    _mapController.zoom - 1,
+                  );
+                },
+                heroTag: 'zoom-out',
+              ),
+            ],
+          ),
+        ),
+      ],
+    );
+  }
+}