From ab67f410627fa2331dc4dcf20fb3758d9a988b98 Mon Sep 17 00:00:00 2001
From: Siddharth Tiwari <siddharthtiwarikreplind@gmail.com>
Date: Thu, 8 Feb 2024 04:23:50 +0530
Subject: [PATCH] chore: editable coordinates

---
 apps/map/components/map/suggest-form.tsx | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/apps/map/components/map/suggest-form.tsx b/apps/map/components/map/suggest-form.tsx
index 344cd9f683d..83529daf831 100644
--- a/apps/map/components/map/suggest-form.tsx
+++ b/apps/map/components/map/suggest-form.tsx
@@ -18,6 +18,11 @@ type formProps = {
 
 export function SuggestMapFormSheet({ latitude, longitude }: formProps) {
   const [isOpen, setIsOpen] = useState(false)
+  const [coordinates, setCoordinates] = useState({
+    latitude: latitude,
+    longitude: longitude,
+  })
+
   const [state, formAction] = useFormState<
     {
       error: boolean
@@ -72,19 +77,28 @@ export function SuggestMapFormSheet({ latitude, longitude }: formProps) {
                 required={true}
                 label="Latitude"
                 id="latitude"
-                value={latitude}
+                value={coordinates.latitude}
                 placeholder="Latitude"
                 name="latitude"
                 type="number"
+                onChange={(e) => {
+                  setCoordinates({ ...coordinates, latitude: parseFloat(e.target.value) })
+                }}
               />
               <InputComponent
                 required={true}
                 label="Longitude"
                 id="longitude"
-                value={longitude}
+                value={coordinates.longitude}
                 placeholder="Longitude"
                 name="longitude"
                 type="number"
+                onChange={(e) => {
+                  setCoordinates({
+                    ...coordinates,
+                    longitude: parseFloat(e.target.value),
+                  })
+                }}
               />
               {state.error && <span className="text-red-600">{state.message}</span>}
               <button