From ac8b0e3cd0c1e9a8d834b1e538eeaebf2a6534ca Mon Sep 17 00:00:00 2001
From: Monique <nica14101@gmail.com>
Date: Sun, 24 Nov 2024 15:09:47 -0800
Subject: [PATCH] fixes

---
 api/maps/AddMarkers.tsx                   |  2 +-
 components/Map/index.tsx                  | 12 ++++++++++--
 components/MapViewScreen/index.tsx        |  4 ++--
 components/ProjectItem/index.tsx          |  9 +++++++--
 components/ProjectsListingModal/index.tsx |  2 +-
 5 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/api/maps/AddMarkers.tsx b/api/maps/AddMarkers.tsx
index 5f59821..5b7fa57 100644
--- a/api/maps/AddMarkers.tsx
+++ b/api/maps/AddMarkers.tsx
@@ -13,7 +13,7 @@ export default function AddMarker({
   map,
 }: {
   projects: Project[] | null;
-  setMap:  React.Dispatch<React.SetStateAction<google.maps.Map | null>>;
+  setMap: React.Dispatch<React.SetStateAction<google.maps.Map | null>>;
   map: google.maps.Map | null;
 }) {
   const [selectedProjectId, setSelectedProjectId] = useState<number | null>(
diff --git a/components/Map/index.tsx b/components/Map/index.tsx
index 2d0fa2c..d821066 100644
--- a/components/Map/index.tsx
+++ b/components/Map/index.tsx
@@ -21,7 +21,11 @@ const center = {
 
 const mapId = '54eb1c7baba5a715'; // needed for AdvancedMarker
 
-export default function Map(props: { projects: Project[] | null, setMap:  React.Dispatch<React.SetStateAction<google.maps.Map | null>>, map: google.maps.Map | null}) {
+export default function Map(props: {
+  projects: Project[] | null;
+  setMap: React.Dispatch<React.SetStateAction<google.maps.Map | null>>;
+  map: google.maps.Map | null;
+}) {
   return (
     <APIProvider apiKey={process.env.NEXT_PUBLIC_GOOGLE_MAPS_API_KEY as string}>
       <GoogleMap
@@ -34,7 +38,11 @@ export default function Map(props: { projects: Project[] | null, setMap:  React.
         mapTypeId={'roadmap'}
         clickableIcons={false}
       >
-        <AddMarkers projects={props.projects} setMap={props.setMap} map={props.map} />
+        <AddMarkers
+          projects={props.projects}
+          setMap={props.setMap}
+          map={props.map}
+        />
       </GoogleMap>
     </APIProvider>
   );
diff --git a/components/MapViewScreen/index.tsx b/components/MapViewScreen/index.tsx
index 9ae275a..20d7a25 100644
--- a/components/MapViewScreen/index.tsx
+++ b/components/MapViewScreen/index.tsx
@@ -76,8 +76,8 @@ export default function MapViewScreen({
         selectedFilters={selectedFilters}
         setSelectedFilters={setSelectedFilters}
       />
-      <Map projects={projects} setMap={setMap} map={map}/>
-      <ProjectsListingModal projects={filteredProjects} map={map}/>
+      <Map projects={projects} setMap={setMap} map={map} />
+      <ProjectsListingModal projects={filteredProjects} map={map} />
     </APIProvider>
   );
 }
diff --git a/components/ProjectItem/index.tsx b/components/ProjectItem/index.tsx
index 526298f..b0eb0cb 100644
--- a/components/ProjectItem/index.tsx
+++ b/components/ProjectItem/index.tsx
@@ -2,7 +2,6 @@
 
 import { useEffect, useState } from 'react';
 import Image from 'next/image';
-import { useMap } from '@vis.gl/react-google-maps';
 import {
   queryDefaultImages,
   queryProjectbyId,
@@ -36,7 +35,13 @@ import {
   StyledProjectItem,
 } from './styles';
 
-export default function ProjectItem({ project_id, map }: { project_id: number , map: google.maps.Map | null}) {
+export default function ProjectItem({
+  project_id,
+  map,
+}: {
+  project_id: number;
+  map: google.maps.Map | null;
+}) {
   const [project, setProject] = useState<Project | null>(null);
   const [defaultImage, setDefaultImage] = useState<string | null>(null);
   const [modalOpen, setModalOpen] = useState(false);
diff --git a/components/ProjectsListingModal/index.tsx b/components/ProjectsListingModal/index.tsx
index 7e7ae3d..36666fe 100644
--- a/components/ProjectsListingModal/index.tsx
+++ b/components/ProjectsListingModal/index.tsx
@@ -19,7 +19,7 @@ export default function ProjectsListingModal({
   map: google.maps.Map | null;
 }) {
   const projectItems = projects?.map((project: Project) => {
-    return <ProjectItem key={project.id} project_id={project.id} map={map}/>;
+    return <ProjectItem key={project.id} project_id={project.id} map={map} />;
   });
 
   return (