Merge pull request #1650 from bcgov/feat/prashanth-update-cr-txt-1593

Feat: LCFS - Update CR schedule text

frontend/src/App.jsx

@@ -333,39 +333,39 @@ const router = createBrowserRouter([
         path: ROUTES.REPORTS_ADD_NOTIONAL_TRANSFERS,
         element: <AddEditNotionalTransfers />,
         handle: {
-          title: 'New Notional Transfer',
+          title: 'Notional transfer of eligible renewable fuels',
           mode: 'add'
         }
       },
       {
         path: ROUTES.REPORTS_ADD_ALLOCATION_AGREEMENTS,
         element: <AddEditAllocationAgreements />,
         handle: {
-          title: 'New Allocation Agreement',
+          title: 'Allocation agreements',
           mode: 'add'
         }
       },
       {
         path: ROUTES.REPORTS_ADD_OTHER_USE_FUELS,
         element: <AddEditOtherUses />,
         handle: {
-          title: 'New Fuel for Other Use',
+          title: 'Fuels for other use',
           mode: 'add'
         }
       },
       {
         path: ROUTES.REPORTS_ADD_FINAL_SUPPLY_EQUIPMENTS,
         element: <AddEditFinalSupplyEquipments />,
         handle: {
-          title: 'Final Supply Equipment',
+          title: 'Final supply equipment',
           mode: 'add'
         }
       },
       {
         path: ROUTES.REPORTS_ADD_SUPPLY_OF_FUEL,
         element: <AddEditFuelSupplies />,
         handle: {
-          title: 'Supply of fuels',
+          title: 'Supply of fuel',
           mode: 'add'
         }
       },

frontend/src/assets/locales/en/allocationAgreement.json

@@ -1,8 +1,11 @@
 {
-  "allocationAgreementTitle": "Allocation Agreement",
+  "allocationAgreementTitle": "Allocation agreements",
   "noAllocationAgreementsFound": "No allocation agreements found",
   "addAllocationAgreementRowsTitle": "Allocation agreements (e.g., allocating responsibility for fuel)",
-  "allocationAgreementSubtitle": "Enter allocation agreement details below",
+  "allocationAgreementGuides": [
+    "Report fuel volumes for which you have an allocation agreement. Report both fuels that you have allocated responsibility to another organization, and fuels you have received responsibly from another organization.",
+    "Fuels that you have received responsibility for must also be reported in fuel supply."
+  ],
   "fuelCodeFieldRequiredError": "Error updating row: Fuel code field required",
   "allocationAgreementColLabels": {
     "allocationTransactionType": "Responsibility",

frontend/src/assets/locales/en/finalSupplyEquipment.json

@@ -1,8 +1,11 @@
 {
   "fseTitle": "Final supply equipment (FSE)",
-  "addFSErowsTitle": "Add new final supply equipment(s) (FSE)",
-  "fseSubtitle": "Report dates of supply for your FSE. If your billing location is different from your equipment location provided below use the Notes field. Use the Notes field if you use any Other options.",
-  "reportingResponsibilityInfo": "If you are reporting on behalf of an FSE for which you hold allocated reporting responsibility, please list the utility account holder's organization name associated with the specific station, rather than your own organization's name.",
+  "addFSErowsTitle": "Final supply equipment",
+  "reportingResponsibilityInfo": [
+    "Report dates of supply for your final supply equipment (FSE).",
+    "<strong>Organization:</strong> Enter your organization name unless you are reporting FSE that you have received allocated responsibility. In this case, enter the utility account holder's organization name.",
+    "Enter the billing address in the <strong>Notes</strong> field if it is different than the equipment address. Also, enter an explanation in the <strong>Notes</strong> field if you select <i>'Other'</i> from any of the select options."
+  ],
   "newFinalSupplyEquipmentBtn": "New final supply equipment",
   "noFinalSupplyEquipmentsFound": "No final supply equipments found",
   "finalSupplyEquipmentDownloadBtn": "Download as Excel",
@@ -30,15 +33,15 @@
     "complianceReportId": "Compliance Report ID",
     "organizationName": "Organization",
     "supplyFrom": "Supply date range",
-    "kwhUsage":"kWh usage",
+    "kwhUsage": "kWh usage",
     "supplyFromDate": "Dates of supply from",
     "supplyToDate": "Dates of supply to",
     "registrationNbr": "Registration #",
     "serialNbr": "Serial #",
     "manufacturer": "Manufacturer",
-    "model":"Model",
+    "model": "Model",
     "levelOfEquipment": "Level of equipment",
-    "ports":"Ports",
+    "ports": "Ports",
     "fuelMeasurementType": "Fuel measurement type",
     "intendedUses": "Intended use",
     "intendedUsers": "Intended users",

frontend/src/assets/locales/en/fuelExport.json

@@ -1,8 +1,8 @@
 {
   "fuelExportTitle": "Export fuel",
   "noFuelExportsFound": "No fuel exports found",
-  "addFuelExportRowsTitle": "Add new fuel export",
-  "fuelExportSubtitle": "You must report fuel that was marketed or supplied in B.C. and then exported out of the province. Only negative compliance units (debits) can be issued, credits cannot be issued for exported fuel.",
+  "addFuelExportRowsTitle": "Export fuels",
+  "fuelExportGuide": "Report fuel volumes that were marketed or supplied in B.C. and then exported out of the province. Only negative compliance units (debits) can be issued, credits cannot be issued for exported fuel.",
   "fuelExportDownloadBtn": "Download as Excel",
   "fuelExportDownloadingMsg": "Downloading export fuels information",
   "fuelExportDownloadFailMsg": "Failed to download export fuel information.",

frontend/src/assets/locales/en/fuelSupply.json

@@ -1,8 +1,8 @@
 {
-  "fuelSupplyTitle": "Supply of fuels",
+  "fuelSupplyTitle": "Supply of fuel",
   "noFuelSuppliesFound": "No fuel supplies found",
   "addFuelSupplyRowsTitle": "Add new supply of fuel",
-  "fuelSupplySubtitle": "Report the fuel volumes supplied for various uses.",
+  "fuelSupplyGuide": "Report fuel volumes you supplied for the various end uses.",
   "fuelSupplyDownloadBtn": "Download as Excel",
   "fuelSupplyDownloadingMsg": "Downloading supply of fuels information",
   "fuelSupplyDownloadFailMsg": "Failed to download supply of fuel information.",
@@ -16,7 +16,7 @@
     "fuelType": "Fuel type",
     "fuelTypeOther": "Fuel type other",
     "fuelCategoryId": "Fuel category",
-    "endUseId": "End use",
+    "endUse": "End use",
     "provisionOfTheActId": "Determining carbon intensity",
     "fuelCode": "Fuel code",
     "quantity": "Quantity supplied",

frontend/src/assets/locales/en/notionalTransfer.json

@@ -7,7 +7,8 @@
   "notionalTransferDownloadFailMsg": "Failed to download notional transfer information.",
   "LoadFailMsg": "Failed to load notional transfer rows.",
   "notionalTransferLoadFailMsg": "Failed to load notional transfer information.",
-  "newNotionalTransferTitle": "Add new notional transfer(s)",
+  "newNotionalTransferTitle": "Notional transfer of eligible renewable fuels",
+  "newNotionalTransferGuide": "Report renewable fuel volumes that you received or transferred through a notional transfer.",
   "editNotionalTransferTitle": "Edit draft notional transfer",
   "approvedNotionalTransferTitle": "Approved draft notional transfer",
   "deletedNotionalTransferTitle": "Deleted draft notional transfer",

frontend/src/assets/locales/en/otherUses.json

@@ -6,7 +6,8 @@
   "otherUsesDownloadingMsg": "Downloading other uses information",
   "otherUsesDownloadFailMsg": "Failed to download other uses information.",
   "otherUsesLoadFailMsg": "Failed to load other uses information.",
-  "newOtherUsesTitle": "Add new other use(s)",
+  "newOtherUsesTitle": "Fuels for other use",
+  "newOtherUsesGuide": "Report fuel volumes that you supplied for heating or other prescribed uses other than transportation.",
   "editOtherUsesTitle": "Edit other use entry",
   "approvedOtherUsesTitle": "Approved other use entry",
   "deletedOtherUsesTitle": "Deleted other use entry",

frontend/src/views/AllocationAgreements/AddEditAllocationAgreements.jsx

@@ -29,6 +29,9 @@ export const AddEditAllocationAgreements = () => {
   const alertRef = useRef()
   const location = useLocation()
   const { t } = useTranslation(['common', 'allocationAgreement', 'reports'])
+  const guides = useMemo(() =>
+    t('allocationAgreement:allocationAgreementGuides', { returnObjects: true })
+  )
   const params = useParams()
   const { complianceReportId, compliancePeriod } = params
   const navigate = useNavigate()
@@ -69,22 +72,28 @@ export const AddEditAllocationAgreements = () => {
     }
   }, [location.state?.message, location.state?.severity])
 
-  const validate = (params, validationFn, errorMessage, alertRef, field = null) => {
-    const value = field ? params.node?.data[field] : params;
+  const validate = (
+    params,
+    validationFn,
+    errorMessage,
+    alertRef,
+    field = null
+  ) => {
+    const value = field ? params.node?.data[field] : params
 
     if (field && params.colDef.field !== field) {
-      return true;
+      return true
     }
 
     if (!validationFn(value)) {
       alertRef.current?.triggerAlert({
         message: errorMessage,
-        severity: 'error',
-      });
-      return false;
+        severity: 'error'
+      })
+      return false
     }
-    return true; // Proceed with the update
-  };
+    return true // Proceed with the update
+  }
 
   const onGridReady = useCallback(
     async (params) => {
@@ -119,7 +128,11 @@ export const AddEditAllocationAgreements = () => {
   )
 
   useEffect(() => {
-    const updatedColumnDefs = allocationAgreementColDefs(optionsData, errors, currentUser)
+    const updatedColumnDefs = allocationAgreementColDefs(
+      optionsData,
+      errors,
+      currentUser
+    )
     setColumnDefs(updatedColumnDefs)
   }, [errors, optionsData, currentUser])
 
@@ -179,7 +192,8 @@ export const AddEditAllocationAgreements = () => {
       if (params.colDef.field === 'transactionPartner') {
         if (params.newValue === currentUser.organization.name) {
           alertRef.current?.triggerAlert({
-            message: 'You cannot select your own organization as the transaction partner.',
+            message:
+              'You cannot select your own organization as the transaction partner.',
             severity: 'error'
           })
           params.node.setDataValue('transactionPartner', '')
@@ -190,12 +204,12 @@ export const AddEditAllocationAgreements = () => {
       const isValid = validate(
         params,
         (value) => {
-          return value !== null && !isNaN(value) && value > 0;
+          return value !== null && !isNaN(value) && value > 0
         },
         'Quantity supplied must be greater than 0.',
         alertRef,
-        'quantity',
-      );
+        'quantity'
+      )
 
       if (!isValid) {
         return
@@ -332,16 +346,21 @@ export const AddEditAllocationAgreements = () => {
       <Grid2 className="add-edit-allocation-agreement-container" mx={-1}>
         <div className="header">
           <BCTypography variant="h5" color="primary">
-            {t('allocationAgreement:addAllocationAgreementRowsTitle')}
-          </BCTypography>
-          <BCTypography
-            variant="body4"
-            color="primary"
-            sx={{ marginY: '2rem' }}
-            component="div"
-          >
-            {t('allocationAgreement:allocationAgreementSubtitle')}
+            {t('allocationAgreement:allocationAgreementTitle')}
           </BCTypography>
+          <BCBox my={2}>
+            {guides.map((v, i) => (
+              <BCTypography
+                key={i}
+                variant="body4"
+                color="primary"
+                my={0.5}
+                component="div"
+              >
+                {v}
+              </BCTypography>
+            ))}
+          </BCBox>
         </div>
         <BCBox my={2} component="div" style={{ height: '100%', width: '100%' }}>
           <BCGridEditor

frontend/src/views/AllocationAgreements/__tests__/AddEditAllocationAgreements.test.jsx

@@ -32,10 +32,20 @@ vi.mock('react-router-dom', () => ({
   useParams: () => mockUseParams()
 }))
 
+// Mock react-i18next
 // Mock react-i18next
 vi.mock('react-i18next', () => ({
   useTranslation: () => ({
-    t: (key) => key
+    t: vi.fn((key, options = {}) => {
+      // Handle specific keys with returnObjects
+      if (
+        key === 'allocationAgreement:allocationAgreementGuides' &&
+        options.returnObjects
+      ) {
+        return ['Guide 1', 'Guide 2', 'Guide 3'] // Mocked guide objects
+      }
+      return key
+    })
   })
 }))
 
@@ -107,7 +117,7 @@ describe('AddEditAllocationAgreements', () => {
   it('renders the component', () => {
     render(<AddEditAllocationAgreements />, { wrapper })
     expect(
-      screen.getByText('allocationAgreement:addAllocationAgreementRowsTitle')
+      screen.getByText('allocationAgreement:allocationAgreementTitle')
     ).toBeInTheDocument()
   })
 

frontend/src/views/FinalSupplyEquipments/AddEditFinalSupplyEquipments.jsx

@@ -25,6 +25,9 @@ export const AddEditFinalSupplyEquipments = () => {
   const alertRef = useRef()
   const location = useLocation()
   const { t } = useTranslation(['common', 'finalSupplyEquipment', 'reports'])
+  const subTitles = t('finalSupplyEquipment:reportingResponsibilityInfo', {
+    returnObjects: true
+  })
   const params = useParams()
   const { complianceReportId, compliancePeriod } = params
   const navigate = useNavigate()
@@ -277,24 +280,20 @@ export const AddEditFinalSupplyEquipments = () => {
       <Grid2 className="add-edit-final-supply-equipment-container" mx={-1}>
         <div className="header">
           <BCTypography variant="h5" color="primary">
-            {t('finalSupplyEquipment:addFSErowsTitle')}
-          </BCTypography>
-          <BCTypography
-            variant="body4"
-            color="primary"
-            sx={{ marginTop: '2rem' }}
-            component="div"
-          >
-            {t('finalSupplyEquipment:fseSubtitle')}
-          </BCTypography>
-          <BCTypography
-            variant="body4"
-            color="primary"
-            sx={{ marginBottom: '2rem', marginTop: '1rem' }}
-            component="div"
-          >
-            {t('finalSupplyEquipment:reportingResponsibilityInfo')}
+            {t('finalSupplyEquipment:fseTitle')}
           </BCTypography>
+          <BCBox my={2.5} component="div">
+            {subTitles.map((v, i) => (
+              <BCTypography
+                key={i}
+                variant="body4"
+                color="primary"
+                mt={0.5}
+                component="div"
+                dangerouslySetInnerHTML={{ __html: v }}
+              />
+            ))}
+          </BCBox>
         </div>
         <BCBox my={2} component="div" style={{ height: '100%', width: '100%' }}>
           <BCGridEditor

frontend/src/views/FuelExports/AddEditFuelExports.jsx

@@ -281,10 +281,10 @@ export const AddEditFuelExports = () => {
           <BCTypography
             variant="body4"
             color="primary"
-            sx={{ marginY: '2rem' }}
+            my={2}
             component="div"
           >
-            {t('fuelExport:fuelExportSubtitle')}
+            {t('fuelExport:fuelExportGuide')}
           </BCTypography>
         </div>
         <BCBox my={2} component="div" style={{ height: '100%', width: '100%' }}>

frontend/src/views/FuelSupplies/AddEditFuelSupplies.jsx

@@ -360,12 +360,12 @@ export const AddEditFuelSupplies = () => {
       <Grid2 className="add-edit-fuel-supply-container" mx={-1}>
         <div className="header">
           <BCTypography variant="h5" color="primary">
-            {t('fuelSupply:addFuelSupplyRowsTitle')}
+            {t('fuelSupply:fuelSupplyTitle')}
           </BCTypography>
           <BCTypography
             variant="body4"
             color="primary"
-            sx={{ marginY: '2rem' }}
+            my={2}
             component="div"
           >
             {t('fuelSupply:fuelSupplySubtitle')}

frontend/src/views/FuelSupplies/__tests__/AddEditFuelSupplies.test.jsx

@@ -92,7 +92,7 @@ describe('AddEditFuelSupplies', () => {
     render(<AddEditFuelSupplies />, { wrapper })
     // Check for a title or any text that indicates successful rendering
     expect(
-      screen.getByText('fuelSupply:addFuelSupplyRowsTitle')
+      screen.getByText('fuelSupply:fuelSupplyTitle')
     ).toBeInTheDocument()
   })