Make lookup more eficient for stallingskosten

Stichting-CROW · Jul 17, 2024 · e25eda4 · e25eda4
1 parent ec29666
commit e25eda4
Show file tree

Hide file tree

Showing 7 changed files with 73 additions and 37 deletions.
diff --git a/src/components/Parking.tsx b/src/components/Parking.tsx
@@ -4,14 +4,16 @@ import { useSession } from "next-auth/react";
 import { AppState } from "~/store/store";
 
 import { type ParkingDetailsType } from "~/types/";
+import type { fietsenstallingen } from "@prisma/client";
+
 import { getParkingDetails, getNewStallingDefaultRecord } from "~/utils/parkings";
 
 import Modal from "src/components/Modal";
 import ParkingEdit from "~/components/parking/ParkingEdit";
 import ParkingView from "~/components/parking/ParkingView";
 import toast from 'react-hot-toast';
 
-const Parking = ({ id, stallingId, onStallingIdChanged, onClose }: { id: string, stallingId: string | undefined, onStallingIdChanged: (newId: string | undefined) => void, onClose: () => void }) => {
+const Parking = ({ id, stallingId, fietsenstallingen, onStallingIdChanged, onClose }: { id: string, stallingId: string | undefined, fietsenstallingen: fietsenstallingen[], onStallingIdChanged: (newId: string | undefined) => void, onClose: () => void }) => {
   const session = useSession();
   // const router = useRouter();
 
@@ -85,7 +87,7 @@ const Parking = ({ id, stallingId, onStallingIdChanged, onClose }: { id: string,
   if (allowEdit === true && (editMode === true)) {
     content = (<ParkingEdit parkingdata={currentStalling} onClose={handleCloseEdit} onChange={handleUpdateRevision} />);
   } else {
-    content = (<ParkingView parkingdata={currentStalling} onEdit={allowEdit ? () => { setEditMode(true) } : undefined} onToggleStatus={handleToggleStatus} isLoggedIn={session.status === "authenticated"} />);
+    content = (<ParkingView parkingdata={currentStalling} fietsenstallingen={fietsenstallingen} onEdit={allowEdit ? () => { setEditMode(true) } : undefined} onToggleStatus={handleToggleStatus} isLoggedIn={session.status === "authenticated"} />);
   }
 
   return (

diff --git a/src/components/parking/ParkingView.tsx b/src/components/parking/ParkingView.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 
 import { openRoute } from "~/utils/map/index";
 import { useRouter } from "next/navigation";
@@ -18,19 +18,59 @@ import ParkingViewBeheerder from "~/components/parking/ParkingViewBeheerder";
 import ParkingViewServices from "~/components/parking/ParkingViewServices";
 
 import { type ParkingDetailsType } from "~/types/";
-import { createVeiligstallenOrgLink } from "~/utils/parkings";
+import type { fietsenstallingen, contacts } from "@prisma/client";
+import { createVeiligstallenOrgOpwaardeerLinkForMunicipality } from "~/utils/parkings";
+
+
+import { getMunicipalities } from "~/utils/municipality";
+import { useDispatch, useSelector } from "react-redux";
+import { setMunicipalities } from "~/store/geoSlice";
+import type { AppState } from "~/store/store";
 
 const ParkingView = ({
   parkingdata,
+  fietsenstallingen,
   onEdit = undefined,
   onToggleStatus = undefined,
   isLoggedIn,
 }: {
   parkingdata: ParkingDetailsType;
+  fietsenstallingen: fietsenstallingen[];
   onEdit: Function | undefined;
   onToggleStatus: Function | undefined;
   isLoggedIn: boolean;
 }) => {
+  const [urlOpwaarderen, setUrlOpwaarderen] = useState<string>("");
+  const dispatch = useDispatch();
+
+  const municipalities = useSelector(
+    (state: AppState) => state.geo.municipalities
+  );
+
+  useEffect(() => {
+    // Don't ask the API if we have all municipalities already
+    if (municipalities && municipalities.length > 0) {
+      return;
+    }
+    (async () => {
+      const response = await getMunicipalities();
+      dispatch(setMunicipalities(response));
+    })();
+  }, []);
+
+  useEffect(() => {
+    if (!municipalities) {
+      setUrlOpwaarderen("");
+      return;
+    }
+
+    const municipality = municipalities.find((m: contacts) => m.ID === parkingdata.SiteID) as any as contacts | undefined;
+    if (municipality) {
+      const url = createVeiligstallenOrgOpwaardeerLinkForMunicipality(municipality, fietsenstallingen);
+      setUrlOpwaarderen(url);
+    }
+  }, [municipalities, parkingdata, fietsenstallingen]);
+
   const renderAddress = () => {
     const location = parkingdata.Location || "";
     const pcplaats = (
@@ -87,16 +127,10 @@ const ParkingView = ({
     key="b-opwaarderen"
     className="mt-3 text-center flex-shrink"
     onClick={() => {
-      const doIt = async () => {
-        const url = await createVeiligstallenOrgLink(parkingdata);
-        if (url === "") {
-          alert("Deze stalling kan niet worden opgewaardeerd");
-          return;
-        }
-        window.open(url, '_blank');
+      if (urlOpwaarderen === "") {
+        return;
       }
-
-      doIt();
+      window.open(urlOpwaarderen, '_blank');
     }}
   >
     Stallingstegoed<br ></br>opwaarderen
@@ -172,7 +206,7 @@ const ParkingView = ({
           <SectionBlock heading="Soort stalling">
             <div className="flex flex-col">
               {parkingdata.Type || "Onbekend"}
-              {buttonOpwaarderen}
+              {urlOpwaarderen !== "" ? buttonOpwaarderen : null}
             </div>
           </SectionBlock>
 

diff --git a/src/pages/content.tsx b/src/pages/content.tsx
@@ -235,7 +235,9 @@ const Content: NextPage = ({ fietsenstallingen }: any) => {
           title={currentStalling.Title || ""}
           onClose={() => setCurrentStallingId(undefined)}
         >
-          <Parking id={'parking-' + currentStallingId} stallingId={currentStalling.ID}
+          <Parking id={'parking-' + currentStallingId}
+            stallingId={currentStalling.ID}
+            fietsenstallingen={fietsenstallingen}
             onStallingIdChanged={setCurrentStallingId}
             onClose={() => setCurrentStallingId(undefined)}
           />
@@ -252,6 +254,7 @@ const Content: NextPage = ({ fietsenstallingen }: any) => {
             stallingId={fietsenstallingen.find((stalling: any) => {
               return stalling.ID === currentStallingId;
             }).ID}
+            fietsenstallingen={fietsenstallingen}
             onStallingIdChanged={setCurrentStallingId}
             onClose={() => setCurrentStallingId(undefined)}
 

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -285,7 +285,7 @@ const Home: NextPage = ({
         <AppHeader onStallingAanmelden={handleStallingAanmelden} />
 
         {activeParkingId !== undefined && (
-          <Parking id={'parking-modal'} stallingId={activeParkingId} onStallingIdChanged={(newId) => { updateStallingId(newId) }} onClose={handleCloseParking} />
+          <Parking id={'parking-modal'} stallingId={activeParkingId} fietsenstallingen={fietsenstallingen} onStallingIdChanged={(newId) => { updateStallingId(newId) }} onClose={handleCloseParking} />
         )}
 
         <div

diff --git a/src/pages/reports/index.tsx b/src/pages/reports/index.tsx
@@ -3,10 +3,11 @@ import { NextPage } from "next/types";
 import { GetServerSidePropsContext } from 'next';
 import { getServerSession } from "next-auth/next"
 import { authOptions } from '~/pages/api/auth/[...nextauth]'
-import type { fietsenstallingen } from "@prisma/client";
+import type { fietsenstallingen, contacts } from "@prisma/client";
 import moment from "moment";
 
 import { getParkingsFromDatabase } from "~/utils/prisma";
+import { getMunicipalities } from "~/utils/municipality";
 
 import ReportTable from "~/utils/reports/report-table";
 import { noReport, type ReportContent } from "~/utils/reports/types";
@@ -109,6 +110,7 @@ const Report: NextPage = ({ fietsenstallingen }: any) => {
     const [loading, setLoading] = useState<boolean>(false);
 
     const [contacts, setContacts] = useState<any | undefined>(undefined);
+    const [municipalities, setMunicipalities] = useState<any | contacts>(undefined);
 
     const abortControllerRef = useRef<AbortController | null>(null);
 
@@ -136,8 +138,8 @@ const Report: NextPage = ({ fietsenstallingen }: any) => {
 
     useEffect(() => {
         const go = async () => {
-            const response = await fetch(`/api/contacts`);
-            setContacts(await response.json());
+            const response = await getMunicipalities();
+            setContacts(response);
         };
 
         go();
@@ -164,7 +166,7 @@ const Report: NextPage = ({ fietsenstallingen }: any) => {
                         return createFixBadDataReport(filtered, contacts, showData);
                     });
                     break;
-                case 'stallingtegoed':
+                case 'stallingstegoed':
                     launchReport((filtered: any): Promise<ReportContent> => {
                         return createStallingtegoedReport(filtered, contacts, showData);
                     });
@@ -228,7 +230,7 @@ const Report: NextPage = ({ fietsenstallingen }: any) => {
                         <option value="" disabled>Select Report</option>
                         <option value="openclose">Open/Closing times</option>
                         <option value="baddata">Test for Bad Data</option>
-                        <option value="stallingtegoed">Stallingtegoed</option>
+                        <option value="stallingstegoed">Stallingstegoed</option>
                         {/* Add more options as needed */}
                     </select>
 

diff --git a/src/utils/parkings.tsx b/src/utils/parkings.tsx
@@ -228,21 +228,12 @@ export const createVeiligstallenOrgOpwaardeerLink = (parkingdata: ParkingDetails
   return visible ? `https://veiligstallen.nl/${municipality}/stallingstegoed` : '';
 }
 
-export const createVeiligstallenOrgOpwaardeerLinkForMunicipality = (municipality: string, fietsenstallingen: fietsenstallingen[], contacts: contacts[]): string => {
-  const thecontact = contacts.find((contact: contacts) => {
-    if (contact.Gemeentecode !== null) {
-      return `GM${contact.Gemeentecode.toString().padStart(4, '0')}` === municipality;
-    } else {
-      return false
-    }
-  })
-
-  if (thecontact === undefined) { return '' }
+export const createVeiligstallenOrgOpwaardeerLinkForMunicipality = (municipality: contacts, fietsenstallingen: fietsenstallingen[]): string => {
+  if (municipality === undefined) { return '' }
 
   // check if there are any parkings for this SiteID and BerekentStallingskosten === false -> yes? create URL
-  const others = fietsenstallingen.filter((fs) => (thecontact.ID === fs.SiteID) && (fs.BerekentStallingskosten === false));
+  const others = fietsenstallingen.filter((fs) => (municipality.ID === fs.SiteID) && (fs.BerekentStallingskosten === false));
+  const visible = others.length > 0
 
-  const visible = others.length > 0 && municipality !== ""
-
-  return visible ? `https://veiligstallen.nl/${municipality}/stallingstegoed` : '';
+  return visible ? `https://veiligstallen.nl/${municipality.UrlName}/stallingstegoed` : '';
 }
diff --git a/src/utils/reports/stallingtegoed.tsx b/src/utils/reports/stallingtegoed.tsx
@@ -1,7 +1,7 @@
 import type { fietsenstallingen, contacts } from "@prisma/client";
 import { ReportContent } from "./types";
 import { ParkingDetailsType } from "~/types";
-import { createVeiligstallenOrgOpwaardeerLink, createVeiligstallenOrgLink } from "~/utils/parkings";
+import { createVeiligstallenOrgOpwaardeerLinkForMunicipality, createVeiligstallenOrgLink } from "~/utils/parkings";
 
 export const createStallingtegoedReport = async (fietsenstallingen: fietsenstallingen[], contacts: contacts[], showData: boolean): Promise<ReportContent> => {
     const alwaysvisibleColumns = [
@@ -15,6 +15,7 @@ export const createStallingtegoedReport = async (fietsenstallingen: fietsenstall
     const allColumns = [
         ...alwaysvisibleColumns,
         "link_url",
+        "UrlName",
         "BerekentStallingskosten",
     ];
 
@@ -109,7 +110,9 @@ export const createStallingtegoedReport = async (fietsenstallingen: fietsenstall
         const parkingdata = fietsenstalling as any as ParkingDetailsType;
         const isNS = parkingdata.EditorCreated === "NS-connector"
 
-        const url = createVeiligstallenOrgOpwaardeerLink(parkingdata, fietsenstallingen, contacts);
+
+        const municipality: contacts = contacts.find((c: contacts) => c.ID === parkingdata.SiteID) as any as contacts;
+        let url = municipality ? createVeiligstallenOrgOpwaardeerLinkForMunicipality(municipality, fietsenstallingen) : "";
         const toonOpwaarderen = url !== "";
 
         report.data.records.push({
@@ -120,6 +123,7 @@ export const createStallingtegoedReport = async (fietsenstallingen: fietsenstall
             "isNs": isNS ? "NS" : "",
             "button_opwaarderen": toonOpwaarderen ? getOpwaarderenButton(parkingdata.ID, url) : null,
             "link_url": toonOpwaarderen ? url : "",
+            "UrlName": municipality ? municipality.UrlName : "",
             "BerekentStallingskosten": parkingdata.BerekentStallingskosten ? "Stalling berekent kosten stallingstransacties" : "FMS berekent kosten stallingstransacties",
         });
     };