Add Restaurant almost done

src/components/Input/InputGoogleMaps.js

@@ -0,0 +1,47 @@
+import React, { useState } from "react";
+import { GoogleMap, LoadScript, Marker } from "@react-google-maps/api";
+
+function InputGoogleMaps(props) {
+  const containerStyle = {
+    width: "500px",
+    height: "500px",
+  };
+
+  const center = {
+    lat: props.coordinates[0],
+    lng: props.coordinates[1],
+  };
+  const [visibility, setVisibility] = useState(true);
+
+  const handleMapClick = (event) => {
+    const location = {
+      lat: event.latLng.lat(),
+      lng: event.latLng.lng(),
+    };
+    if (event.placeId) {
+      setVisibility(false);
+      props.setCoordinates([location.lat, location.lng], event.placeId);
+    } else {
+      setVisibility(true);
+      props.setCoordinates([location.lat, location.lng]);
+    }
+  };
+
+  return (
+    <LoadScript googleMapsApiKey="AIzaSyDAlZSiBanP52qpZ1kaH06XkuA2zndLUd8">
+      <GoogleMap
+        mapContainerStyle={containerStyle}
+        center={center}
+        zoom={7}
+        onClick={handleMapClick}
+      >
+        <Marker
+          position={{ lat: props.coordinates[0], lng: props.coordinates[1] }}
+          visible={visibility}
+        />
+      </GoogleMap>
+    </LoadScript>
+  );
+}
+
+export default React.memo(InputGoogleMaps);