ask for location permission

src/pages/checkout/components/AddressSummary.tsx

@@ -1,9 +1,9 @@
-import { Button, Card } from "antd";
+import { Button, Card, message } from "antd";
 import { GoogleMap } from "components/CustomBottomSheet/GoogleMap";
 import { MapBottomSheet } from "components/CustomBottomSheet/MapBottomSheet";
 import ProText from "components/ProText";
 import { selectCart, updateLocation } from "features/order/orderSlice";
-import { useCallback, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useAppDispatch, useAppSelector } from "redux/hooks";
 import styles from "../../address/address.module.css";
@@ -20,7 +20,8 @@ export const AddressSummary = () => {
   const dispatch = useAppDispatch();
   const { location } = useAppSelector(selectCart);
   const [isMapBottomSheetOpen, setIsMapBottomSheetOpen] = useState(false);
-  const { orderType } = useAppSelector(selectCart); // Default to delivery for now
+  const { orderType } = useAppSelector(selectCart);
+  const [userLocation, setUserLocation] = useState<LocationData | null>(null);
 
   const handleLocationSave = useCallback(
     (locationString: string) => {
@@ -42,9 +43,58 @@ export const AddressSummary = () => {
     setIsMapBottomSheetOpen(false);
   }, []);
 
+  // Request user location when delivery order type is selected and no location exists
+  useEffect(() => {
+    if (orderType === OrderType.Delivery && !location && !userLocation) {
+      if ("geolocation" in navigator) {
+        navigator.geolocation.getCurrentPosition(
+          (position) => {
+            const lat = position.coords.latitude;
+            const lng = position.coords.longitude;
+            
+            // Set location with coordinates first, address will be geocoded by the map
+            const locationData: LocationData = {
+              lat,
+              lng,
+              address: "", // Will be filled by GoogleMap when it geocodes
+            };
+            setUserLocation(locationData);
+            // Automatically set as default location
+            dispatch(updateLocation(locationData));
+          },
+          (error) => {
+            console.error("Error getting user location:", error);
+            message.warning(
+              t("address.locationPermissionDenied") ||
+                "Location access denied. Please select location manually.",
+            );
+          },
+          {
+            enableHighAccuracy: true,
+            timeout: 10000,
+            maximumAge: 0,
+          },
+        );
+      } else {
+        message.warning(
+          t("address.geolocationNotSupported") ||
+            "Geolocation is not supported by your browser",
+        );
+      }
+    }
+  }, [orderType, location, userLocation, dispatch, t]);
+
   const initialValue = useMemo(
-    () => (location ? JSON.stringify(location) : ""),
-    [location],
+    () => {
+      if (location) {
+        return JSON.stringify(location);
+      }
+      if (userLocation) {
+        return JSON.stringify(userLocation);
+      }
+      return "";
+    },
+    [location, userLocation],
   );
 
   const shouldRender = useMemo(
@@ -102,6 +152,7 @@ export const AddressSummary = () => {
         onClose={handleMapBottomSheetClose}
         initialValue={initialValue}
         onSave={handleLocationSave}
+        initialLocation={location || userLocation || undefined}
       />
     </>
   );