fix: Disable navigating unless report is draft

* Only execute navigate if report is in Draft status to prevent draft clicks from going to edit
bcgov · Dec 18, 2024 · a464e91 · a464e91
1 parent cb5f7aa
commit a464e91
Show file tree

Hide file tree

Showing 7 changed files with 80 additions and 54 deletions.
diff --git a/frontend/src/views/AllocationAgreements/AllocationAgreementSummary.jsx b/frontend/src/views/AllocationAgreements/AllocationAgreementSummary.jsx
@@ -8,8 +8,9 @@ import { useEffect, useMemo, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useLocation, useParams, useNavigate } from 'react-router-dom'
 import { v4 as uuid } from 'uuid'
+import { COMPLIANCE_REPORT_STATUSES } from '@/constants/statuses.js'
 
-export const AllocationAgreementSummary = ({ data }) => {
+export const AllocationAgreementSummary = ({ data, status }) => {
   const [alertMessage, setAlertMessage] = useState('')
   const [alertSeverity, setAlertSeverity] = useState('info')
   const [gridKey, setGridKey] = useState(`allocation-agreements-grid`)
@@ -137,12 +138,14 @@ export const AllocationAgreementSummary = ({ data }) => {
   }
 
   const handleRowClicked = (params) => {
-    navigate(
-      ROUTES.REPORTS_ADD_ALLOCATION_AGREEMENTS.replace(
-        ':compliancePeriod',
-        compliancePeriod
-      ).replace(':complianceReportId', complianceReportId)
-    )
+    if (status === COMPLIANCE_REPORT_STATUSES.DRAFT) {
+      navigate(
+        ROUTES.REPORTS_ADD_ALLOCATION_AGREEMENTS.replace(
+          ':compliancePeriod',
+          compliancePeriod
+        ).replace(':complianceReportId', complianceReportId)
+      )
+    }
   }
 
   return (

diff --git a/frontend/src/views/ComplianceReports/components/ReportDetails.jsx b/frontend/src/views/ComplianceReports/components/ReportDetails.jsx
@@ -81,7 +81,9 @@ const ReportDetails = ({ currentStatus = 'Draft' }) => {
           ),
         useFetch: useGetFuelSupplies,
         component: (data) =>
-          data.fuelSupplies.length > 0 && <FuelSupplySummary data={data} />
+          data.fuelSupplies.length > 0 && (
+            <FuelSupplySummary status={currentStatus} data={data} />
+          )
       },
       {
         name: t('finalSupplyEquipment:fseTitle'),
@@ -95,7 +97,7 @@ const ReportDetails = ({ currentStatus = 'Draft' }) => {
         useFetch: useGetFinalSupplyEquipments,
         component: (data) =>
           data.finalSupplyEquipments.length > 0 && (
-            <FinalSupplyEquipmentSummary data={data} />
+            <FinalSupplyEquipmentSummary status={currentStatus} data={data} />
           )
       },
       {
@@ -110,7 +112,7 @@ const ReportDetails = ({ currentStatus = 'Draft' }) => {
         useFetch: useGetAllocationAgreements,
         component: (data) =>
           data.allocationAgreements.length > 0 && (
-            <AllocationAgreementSummary data={data} />
+            <AllocationAgreementSummary status={currentStatus} data={data} />
           )
       },
       {
@@ -124,7 +126,9 @@ const ReportDetails = ({ currentStatus = 'Draft' }) => {
           ),
         useFetch: useGetAllNotionalTransfers,
         component: (data) =>
-          data.length > 0 && <NotionalTransferSummary data={data} />
+          data.length > 0 && (
+            <NotionalTransferSummary status={currentStatus} data={data} />
+          )
       },
       {
         name: t('otherUses:summaryTitle'),
@@ -136,7 +140,10 @@ const ReportDetails = ({ currentStatus = 'Draft' }) => {
             ).replace(':complianceReportId', complianceReportId)
           ),
         useFetch: useGetAllOtherUses,
-        component: (data) => data.length > 0 && <OtherUsesSummary data={data} />
+        component: (data) =>
+          data.length > 0 && (
+            <OtherUsesSummary status={currentStatus} data={data} />
+          )
       },
       {
         name: t('fuelExport:fuelExportTitle'),
@@ -149,7 +156,9 @@ const ReportDetails = ({ currentStatus = 'Draft' }) => {
           ),
         useFetch: useGetFuelExports,
         component: (data) =>
-          !isArrayEmpty(data) && <FuelExportSummary data={data} />
+          !isArrayEmpty(data) && (
+            <FuelExportSummary status={currentStatus} data={data} />
+          )
       }
     ],
     [

diff --git a/frontend/src/views/FinalSupplyEquipments/FinalSupplyEquipmentSummary.jsx b/frontend/src/views/FinalSupplyEquipments/FinalSupplyEquipmentSummary.jsx
@@ -9,8 +9,9 @@ import { useTranslation } from 'react-i18next'
 import { useLocation, useParams, useNavigate } from 'react-router-dom'
 import { v4 as uuid } from 'uuid'
 import { numberFormatter } from '@/utils/formatters.js'
+import { COMPLIANCE_REPORT_STATUSES } from '@/constants/statuses.js'
 
-export const FinalSupplyEquipmentSummary = ({ data }) => {
+export const FinalSupplyEquipmentSummary = ({ data, status }) => {
   const [alertMessage, setAlertMessage] = useState('')
   const [alertSeverity, setAlertSeverity] = useState('info')
   const [gridKey, setGridKey] = useState('final-supply-equipments-grid')
@@ -187,13 +188,15 @@ export const FinalSupplyEquipmentSummary = ({ data }) => {
     setGridKey(`final-supply-equipments-grid-${uuid()}`)
   }
 
-  const handleRowClicked = (params) => {
-    navigate(
-      ROUTES.REPORTS_ADD_FINAL_SUPPLY_EQUIPMENTS.replace(
-        ':compliancePeriod',
-        compliancePeriod
-      ).replace(':complianceReportId', complianceReportId)
-    )
+  const handleRowClicked = () => {
+    if (status === COMPLIANCE_REPORT_STATUSES.DRAFT) {
+      navigate(
+        ROUTES.REPORTS_ADD_FINAL_SUPPLY_EQUIPMENTS.replace(
+          ':compliancePeriod',
+          compliancePeriod
+        ).replace(':complianceReportId', complianceReportId)
+      )
+    }
   }
 
   return (

diff --git a/frontend/src/views/FuelExports/FuelExportSummary.jsx b/frontend/src/views/FuelExports/FuelExportSummary.jsx
@@ -9,8 +9,9 @@ import { useTranslation } from 'react-i18next'
 import { useLocation, useParams, useNavigate } from 'react-router-dom'
 import i18n from '@/i18n'
 import { ROUTES } from '@/constants/routes'
+import { COMPLIANCE_REPORT_STATUSES } from '@/constants/statuses.js'
 
-export const FuelExportSummary = ({ data }) => {
+export const FuelExportSummary = ({ data, status }) => {
   const [alertMessage, setAlertMessage] = useState('')
   const [alertSeverity, setAlertSeverity] = useState('info')
   const { complianceReportId, compliancePeriod } = useParams()
@@ -124,13 +125,15 @@ export const FuelExportSummary = ({ data }) => {
     return params.data.fuelExportId.toString()
   }
 
-  const handleRowClicked = (params) => {
-    navigate(
-      ROUTES.REPORTS_ADD_FUEL_EXPORTS.replace(
-        ':compliancePeriod',
-        compliancePeriod
-      ).replace(':complianceReportId', complianceReportId)
-    )
+  const handleRowClicked = () => {
+    if (status === COMPLIANCE_REPORT_STATUSES.DRAFT) {
+      navigate(
+        ROUTES.REPORTS_ADD_FUEL_EXPORTS.replace(
+          ':compliancePeriod',
+          compliancePeriod
+        ).replace(':complianceReportId', complianceReportId)
+      )
+    }
   }
 
   return (

diff --git a/frontend/src/views/FuelSupplies/FuelSupplySummary.jsx b/frontend/src/views/FuelSupplies/FuelSupplySummary.jsx
@@ -10,8 +10,9 @@ import { useLocation, useNavigate, useParams } from 'react-router-dom'
 import { v4 as uuid } from 'uuid'
 import i18n from '@/i18n'
 import { StandardCellWarningAndErrors } from '@/utils/grid/errorRenderers'
+import { COMPLIANCE_REPORT_STATUSES } from '@/constants/statuses.js'
 
-export const FuelSupplySummary = ({ data }) => {
+export const FuelSupplySummary = ({ data, status }) => {
   const [alertMessage, setAlertMessage] = useState('')
   const [alertSeverity, setAlertSeverity] = useState('info')
   const [gridKey, setGridKey] = useState(`fuel-supplies-grid`)
@@ -126,13 +127,15 @@ export const FuelSupplySummary = ({ data }) => {
     setGridKey(`fuel-supplies-grid-${uuid()}`)
   }
 
-  const handleRowClicked = (params) => {
-    navigate(
-      ROUTES.REPORTS_ADD_SUPPLY_OF_FUEL.replace(
-        ':compliancePeriod',
-        compliancePeriod
-      ).replace(':complianceReportId', complianceReportId)
-    )
+  const handleRowClicked = () => {
+    if (status === COMPLIANCE_REPORT_STATUSES.DRAFT) {
+      navigate(
+        ROUTES.REPORTS_ADD_SUPPLY_OF_FUEL.replace(
+          ':compliancePeriod',
+          compliancePeriod
+        ).replace(':complianceReportId', complianceReportId)
+      )
+    }
   }
 
   return (

diff --git a/frontend/src/views/NotionalTransfers/NotionalTransferSummary.jsx b/frontend/src/views/NotionalTransfers/NotionalTransferSummary.jsx
@@ -8,8 +8,9 @@ import { useTranslation } from 'react-i18next'
 import { useLocation, useParams, useNavigate } from 'react-router-dom'
 import { formatNumberWithCommas as valueFormatter } from '@/utils/formatters'
 import { ROUTES } from '@/constants/routes'
+import { COMPLIANCE_REPORT_STATUSES } from '@/constants/statuses.js'
 
-export const NotionalTransferSummary = ({ data }) => {
+export const NotionalTransferSummary = ({ data, status }) => {
   const [alertMessage, setAlertMessage] = useState('')
   const [alertSeverity, setAlertSeverity] = useState('info')
   const { complianceReportId, compliancePeriod } = useParams()
@@ -34,14 +35,15 @@ export const NotionalTransferSummary = ({ data }) => {
     []
   )
 
-  const handleRowClicked = (params) => {
-    console.log('Row clicked', params)
-    navigate(
-      ROUTES.REPORTS_ADD_NOTIONAL_TRANSFERS.replace(
-        ':compliancePeriod',
-        compliancePeriod
-      ).replace(':complianceReportId', complianceReportId)
-    )
+  const handleRowClicked = () => {
+    if (status === COMPLIANCE_REPORT_STATUSES.DRAFT) {
+      navigate(
+        ROUTES.REPORTS_ADD_NOTIONAL_TRANSFERS.replace(
+          ':compliancePeriod',
+          compliancePeriod
+        ).replace(':complianceReportId', complianceReportId)
+      )
+    }
   }
 
   const columns = [

diff --git a/frontend/src/views/OtherUses/OtherUsesSummary.jsx b/frontend/src/views/OtherUses/OtherUsesSummary.jsx
@@ -11,8 +11,9 @@ import {
 } from '@/utils/formatters'
 import { useTranslation } from 'react-i18next'
 import { ROUTES } from '@/constants/routes'
+import { COMPLIANCE_REPORT_STATUSES } from '@/constants/statuses.js'
 
-export const OtherUsesSummary = ({ data }) => {
+export const OtherUsesSummary = ({ data, status }) => {
   const [alertMessage, setAlertMessage] = useState('')
   const [alertSeverity, setAlertSeverity] = useState('info')
   const { t } = useTranslation(['common', 'otherUses'])
@@ -86,13 +87,15 @@ export const OtherUsesSummary = ({ data }) => {
 
   const getRowId = (params) => params.data.otherUsesId
 
-  const handleRowClicked = (params) => {
-    navigate(
-      ROUTES.REPORTS_ADD_OTHER_USE_FUELS.replace(
-        ':compliancePeriod',
-        compliancePeriod
-      ).replace(':complianceReportId', complianceReportId)
-    )
+  const handleRowClicked = () => {
+    if (status === COMPLIANCE_REPORT_STATUSES.DRAFT) {
+      navigate(
+        ROUTES.REPORTS_ADD_OTHER_USE_FUELS.replace(
+          ':compliancePeriod',
+          compliancePeriod
+        ).replace(':complianceReportId', complianceReportId)
+      )
+    }
   }
 
   return (