From 3c31944506fac4c4097fec2b6130709d62f03787 Mon Sep 17 00:00:00 2001 From: David Paul Graham Date: Wed, 30 Aug 2023 21:00:34 -0400 Subject: [PATCH] add error message and validation rule for federal waste codes --- .../HazardousWasteForm/HazardousWasteForm.tsx | 24 +++++++++++-- .../Manifest/WasteLine/WasteLineForm.tsx | 2 ++ .../WasteLineTable/WasteRowActions.tsx | 2 +- .../Manifest/WasteLine/wasteLineSchema.ts | 36 ++++++++----------- 4 files changed, 39 insertions(+), 25 deletions(-) diff --git a/client/src/components/Manifest/WasteLine/HazardousWasteForm/HazardousWasteForm.tsx b/client/src/components/Manifest/WasteLine/HazardousWasteForm/HazardousWasteForm.tsx index 2ea5de7ba..fceae1e46 100644 --- a/client/src/components/Manifest/WasteLine/HazardousWasteForm/HazardousWasteForm.tsx +++ b/client/src/components/Manifest/WasteLine/HazardousWasteForm/HazardousWasteForm.tsx @@ -1,12 +1,13 @@ import { HtForm } from 'components/Ht'; import { ManifestContext, ManifestContextType } from 'components/Manifest/ManifestForm'; import { StateWasteCodeSelect } from 'components/Manifest/WasteLine/HazardousWasteForm/StateWasteCodeSelect'; -import { Code } from 'components/Manifest/WasteLine/wasteLineSchema'; +import { Code, HazardousWaste, WasteLine } from 'components/Manifest/WasteLine/wasteLineSchema'; import React, { useContext } from 'react'; import { Col, Row } from 'react-bootstrap'; import { Controller, useFormContext } from 'react-hook-form'; import Select, { components, GroupBase, MultiValueProps, StylesConfig } from 'react-select'; import { useGetFedWasteCodesQuery } from 'store/wasteCode.slice'; +import { ErrorMessage } from '@hookform/error-message'; interface HazardousWasteFormProps { epaWaste: boolean; @@ -18,7 +19,10 @@ interface HazardousWasteFormProps { * @constructor */ export function HazardousWasteForm({ epaWaste }: HazardousWasteFormProps) { - const { control } = useFormContext(); + const { + control, + formState: { errors }, + } = useFormContext(); const { generatorStateCode, tsdfStateCode } = useContext(ManifestContext); // Retrieve federal waste codes from the server const { @@ -56,6 +60,8 @@ export function HazardousWasteForm({ epaWaste }: HazardousWasteFormProps) { {props.data.code} ); + console.log('federal erros', errors); + return ( <> @@ -78,6 +84,7 @@ export function HazardousWasteForm({ epaWaste }: HazardousWasteFormProps) { options={federalWasteCodes} isLoading={federalLoading} getOptionLabel={(option) => + // @ts-ignore `${option.code}: ${option.description.toLowerCase()}` } getOptionValue={(option) => option.code} @@ -87,10 +94,21 @@ export function HazardousWasteForm({ epaWaste }: HazardousWasteFormProps) { isMulti isClearable hideSelectedOptions + classNames={{ + control: () => + `form-control p-0 rounded-2 ${ + errors.hazardousWaste?.federalWasteCodes && 'border-danger' + } `, + }} /> ); }} - > + /> + {message}} + /> {federalError ? ( We experienced an error retrieving the federal waste codes diff --git a/client/src/components/Manifest/WasteLine/WasteLineForm.tsx b/client/src/components/Manifest/WasteLine/WasteLineForm.tsx index d6c9b696c..6abb9c5d5 100644 --- a/client/src/components/Manifest/WasteLine/WasteLineForm.tsx +++ b/client/src/components/Manifest/WasteLine/WasteLineForm.tsx @@ -59,6 +59,8 @@ export function WasteLineForm({ * @param wasteLine the data submitted from the form */ const onSubmit = (wasteLine: WasteLine) => { + console.log('epaWaste', wasteLine.epaWaste); + console.log('waste codes', wasteLine.hazardousWaste?.federalWasteCodes); if (waste) { wasteArrayMethods.update(lineNumber, wasteLine); // append the new waste line to the manifest } else { diff --git a/client/src/components/Manifest/WasteLine/WasteLineTable/WasteRowActions.tsx b/client/src/components/Manifest/WasteLine/WasteLineTable/WasteRowActions.tsx index 2f283f1e9..bbd018705 100644 --- a/client/src/components/Manifest/WasteLine/WasteLineTable/WasteRowActions.tsx +++ b/client/src/components/Manifest/WasteLine/WasteLineTable/WasteRowActions.tsx @@ -13,7 +13,7 @@ interface WasteRowActionProps { } /** - * WasteRowActions - actions for controlling waste lines on a manifest + * WasteRowActions - actions for controlling wast lines on a manifest * @constructor */ function WasteRowActions({ diff --git a/client/src/components/Manifest/WasteLine/wasteLineSchema.ts b/client/src/components/Manifest/WasteLine/wasteLineSchema.ts index a311ebe0d..16eb6ef67 100644 --- a/client/src/components/Manifest/WasteLine/wasteLineSchema.ts +++ b/client/src/components/Manifest/WasteLine/wasteLineSchema.ts @@ -51,6 +51,8 @@ const hazardousWasteSchema = z.object({ generatorStateWasteCodes: z.array(codeSchema).optional(), }); +export type HazardousWaste = z.infer; + const dotInformationSchema = z.object({ idNumber: codeSchema, printedDotInformation: z.string(), @@ -100,6 +102,16 @@ export const wasteLineSchema = z message: 'DOT ID number is required', } ) + .refine( + (wasteLine) => { + // If stream is federally hazardous waste, a federal waste code is required + return wasteLine.epaWaste && wasteLine.hazardousWaste?.federalWasteCodes; + }, + { + path: ['hazardousWaste.federalWasteCodes'], + message: 'Federal waste code is required if the waste is EPA Waste', + } + ) .refine( (wasteLine) => { // If material is DOT hazardous, then dotInformation.idNumber.code is required @@ -111,26 +123,8 @@ export const wasteLineSchema = z } ); +/** + * WasteLine is the interface for the waste line object in the manifest + */ export type WasteLine = z.infer; - -// /** -// * Represents waste information captures on EPA's hazardous waste manifest -// */ -// interface WasteLine { -// dotHazardous: boolean; -// epaWaste: boolean; -// pcb: boolean; -// lineNumber: number; -// dotInformation?: DotInformation; -// wasteDescription?: string; -// quantity?: Quantity; -// brInfo?: BrInfo; -// br: boolean; -// hazardousWaste?: HazardousWaste; -// pcbInfos?: PcbInfo[]; -// discrepancyResidueInfo?: DiscrepancyResidueInfo; -// managementMethod?: Code; -// additionalInfo?: AdditionalInfo; -// } - export type { ContainerDescription };