From 459ca013decfe7954dce30bbccc6d26cb4ea1b2f Mon Sep 17 00:00:00 2001
From: Paulo Gomes da Cruz Junior <paulo.cruz@gov.bc.ca>
Date: Thu, 5 Dec 2024 05:22:56 -0800
Subject: [PATCH] fix(SILVA-582): enabling map on recent openings

---
 .../Opening/RecentOpeningsDataTable.test.tsx  | 27 +++++++------------
 .../Opening/RecentOpeningsDataTable/index.tsx | 22 +++++++--------
 frontend/src/components/OpeningsMap/index.tsx |  1 -
 frontend/src/components/OpeningsTab/index.tsx | 12 +++------
 4 files changed, 23 insertions(+), 39 deletions(-)

diff --git a/frontend/src/__test__/components/Dashboard/Opening/RecentOpeningsDataTable.test.tsx b/frontend/src/__test__/components/Dashboard/Opening/RecentOpeningsDataTable.test.tsx
index cb8c535f8..84d90f056 100644
--- a/frontend/src/__test__/components/Dashboard/Opening/RecentOpeningsDataTable.test.tsx
+++ b/frontend/src/__test__/components/Dashboard/Opening/RecentOpeningsDataTable.test.tsx
@@ -14,27 +14,23 @@ describe("OpeningsSearchBar", () => {
   // Create a new QueryClient instance for each test
   const queryClient = new QueryClient();
   const handleCheckboxChange = vi.fn()
-  const setLoadId = vi.fn()
-    const toggleSpatial = vi.fn()
-    const showSpatial = false
-    const data = { data: [], perPage: 0, totalPages: 0 }
-    const headers = []
+  const setOpeningIds = vi.fn()
+  const showSpatial = false
+  const data = { data: [], perPage: 0, totalPages: 0 }
+  const headers = []
 
   it("shows appropriate message when no data is in the table", () => {
     render(
       <MemoryRouter>
         <QueryClientProvider client={queryClient}>
             <PaginationProvider>
-             <RecentOpeningsDataTable
+              <RecentOpeningsDataTable
                 rows={data?.data || []}
                 headers={headers}
-                defaultColumns={headers}
-                handleCheckboxChange={handleCheckboxChange}
-                setOpeningId={setLoadId}
-                toggleSpatial={toggleSpatial}
+                setOpeningIds={setOpeningIds}
                 showSpatial={showSpatial}
                 totalItems={(data?.perPage ?? 0) * (data?.totalPages ?? 0)}
-                />
+              />
             </PaginationProvider>
       </QueryClientProvider>
       </MemoryRouter>
@@ -48,16 +44,13 @@ describe("OpeningsSearchBar", () => {
       <MemoryRouter>
         <QueryClientProvider client={queryClient}>
             <PaginationProvider>
-             <RecentOpeningsDataTable
+              <RecentOpeningsDataTable
                 rows={[]}
                 headers={headers}
-                defaultColumns={headers}
-                handleCheckboxChange={handleCheckboxChange}
-                setOpeningId={setLoadId}
-                toggleSpatial={toggleSpatial}
+                setOpeningIds={setOpeningIds}
                 showSpatial={showSpatial}
                 totalItems={(data?.perPage ?? 0) * (data?.totalPages ?? 0)}
-                />
+              />
             </PaginationProvider>
       </QueryClientProvider>
       </MemoryRouter>
diff --git a/frontend/src/components/Dashboard/Opening/RecentOpeningsDataTable/index.tsx b/frontend/src/components/Dashboard/Opening/RecentOpeningsDataTable/index.tsx
index dce2c34ef..77cc66a75 100644
--- a/frontend/src/components/Dashboard/Opening/RecentOpeningsDataTable/index.tsx
+++ b/frontend/src/components/Dashboard/Opening/RecentOpeningsDataTable/index.tsx
@@ -18,10 +18,7 @@ import ComingSoonModal from "../../../ComingSoonModal";
 interface IRecentOpeningsDataTable {
   rows: OpeningsSearch[];
   headers: ITableHeader[];
-  defaultColumns: ITableHeader[];
-  handleCheckboxChange: Function;
-  setOpeningId: Function;
-  toggleSpatial: Function;
+  setOpeningIds: (openingIds: number[]) => void;
   showSpatial: boolean;
   totalItems: number;
 }
@@ -30,7 +27,8 @@ const RecentOpeningsDataTable: React.FC<IRecentOpeningsDataTable> = ({
   rows,
   headers,
   showSpatial,
-  totalItems,
+  setOpeningIds,
+  totalItems
 }) => {
   const {
     itemsPerPage,
@@ -43,6 +41,10 @@ const RecentOpeningsDataTable: React.FC<IRecentOpeningsDataTable> = ({
     setInitialItemsPerPage(itemsPerPage);
   }, [rows, totalItems]);
 
+  useEffect(() => {
+    setOpeningIds(selectedRows.map((id) => parseFloat(id)));
+  },[selectedRows]);
+
   // Function to handle row selection changes
   const handleRowSelectionChanged = (rowId: string) => {
     setSelectedRows((prevSelectedRows) =>
@@ -53,12 +55,7 @@ const RecentOpeningsDataTable: React.FC<IRecentOpeningsDataTable> = ({
   };
 
   return (
-    <>
-      <TableContainer className="search-data-table">
-        <TableToolbar aria-label="data table toolbar">
-          {/* Toolbar content... */}
-        </TableToolbar>
-
+    <TableContainer className="search-data-table">
         <Table aria-label="sample table">
           <TableHead>
             <TableRow>
@@ -98,7 +95,6 @@ const RecentOpeningsDataTable: React.FC<IRecentOpeningsDataTable> = ({
           setOpeningDetails={setOpeningDetails}
         />
       </TableContainer>
-    </>
-  );
+    );
 };
 export default RecentOpeningsDataTable;
diff --git a/frontend/src/components/OpeningsMap/index.tsx b/frontend/src/components/OpeningsMap/index.tsx
index 900a0af47..55bc16977 100644
--- a/frontend/src/components/OpeningsMap/index.tsx
+++ b/frontend/src/components/OpeningsMap/index.tsx
@@ -111,7 +111,6 @@ const OpeningsMap: React.FC<MapProps> = ({
       setOpenings(results.filter((opening) => opening !== null));
 
     } else {
-      setOpeningPolygonNotFound(true);
       setOpenings([]);
     }
 
diff --git a/frontend/src/components/OpeningsTab/index.tsx b/frontend/src/components/OpeningsTab/index.tsx
index 6c29ec468..0cafe2528 100644
--- a/frontend/src/components/OpeningsTab/index.tsx
+++ b/frontend/src/components/OpeningsTab/index.tsx
@@ -15,7 +15,7 @@ interface Props {
 }
 
 const OpeningsTab: React.FC<Props> = ({ showSpatial, setShowSpatial }) => {
-  const [loadId, setLoadId] = useState<number | null>(null);
+  const [selectedOpeningIds,setSelectedOpeningIds] = useState<number[]>([]);
   const [openingPolygonNotFound, setOpeningPolygonNotFound] = useState<boolean>(false);
   const { data, isFetching } = useUserRecentOpeningQuery(10);
 
@@ -36,7 +36,6 @@ const OpeningsTab: React.FC<Props> = ({ showSpatial, setShowSpatial }) => {
             renderIcon={Location}
             type="button"
             onClick={() => toggleSpatial()}
-            disabled
           >
             {showSpatial ? 'Hide map' : 'Show map'}
           </Button>
@@ -45,8 +44,8 @@ const OpeningsTab: React.FC<Props> = ({ showSpatial, setShowSpatial }) => {
           <div className="row px-2">
             <div className="leaflet-container">
               <OpeningsMap
-                openingId={loadId}
-                openingIds={null}
+                openingId={null}
+                openingIds={selectedOpeningIds}
                 setOpeningPolygonNotFound={setOpeningPolygonNotFound}
               />
             </div>
@@ -70,10 +69,7 @@ const OpeningsTab: React.FC<Props> = ({ showSpatial, setShowSpatial }) => {
           <RecentOpeningsDataTable
             rows={data?.data || []}
             headers={headers}
-            defaultColumns={headers}
-            handleCheckboxChange={() => {}}
-            setOpeningId={setLoadId}
-            toggleSpatial={toggleSpatial}
+            setOpeningIds={setSelectedOpeningIds}
             showSpatial={showSpatial}
             totalItems={(data?.perPage ?? 0) * (data?.totalPages ?? 0)}
           />