From 18571af8a69ebb811185075a08ca8f0f72258a0b Mon Sep 17 00:00:00 2001 From: Nitheesh T Ganesh Date: Mon, 30 Dec 2024 15:28:38 -0700 Subject: [PATCH 1/3] COMP-268: Card Display (Acts, CA, Schedule A) --- .../Requirements/RequirementSourceCard.tsx | 177 ++++++++++++++++++ .../Requirements/RequirementSourceModal.tsx | 10 +- 2 files changed, 180 insertions(+), 7 deletions(-) create mode 100644 compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementSourceCard.tsx diff --git a/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementSourceCard.tsx b/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementSourceCard.tsx new file mode 100644 index 0000000..0cf916d --- /dev/null +++ b/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementSourceCard.tsx @@ -0,0 +1,177 @@ +import { FC, memo, useState } from "react"; +import { + Box, + Typography, + Button, + Stack, + Accordion, + AccordionSummary, + AccordionDetails, + IconButton, + Tooltip, +} from "@mui/material"; +import { + AddRounded, + DeleteOutlineRounded, + EditOutlined, + ExpandLessRounded, + ExpandMoreRounded, + PostAddOutlined, +} from "@mui/icons-material"; +import { RequirementSourceFormData } from "@/models/InspectionRequirement"; +import { BCDesignTokens } from "epic.theme"; +import ParagraphWithReadMore from "@/components/Shared/ParagraphWithReadMore"; +import { RequirementSourceEnum } from "@/utils/constants"; + +type RequirementSourceCardProps = { + data: RequirementSourceFormData; + index: number; +}; + +const RequirementSourceCard: FC = memo( + ({ data, index }) => { + const [isExpanded, setIsExpanded] = useState(index === 0); + + const isCondition = [ + RequirementSourceEnum.SCHEDULE_B, + RequirementSourceEnum.EAC, + RequirementSourceEnum.EACA, + ].includes(data.requirementSource?.id as RequirementSourceEnum); + + return ( + { + setIsExpanded(expanded); + }} + sx={{ + marginTop: "1rem", + border: `1px solid ${BCDesignTokens.surfaceColorBorderDefault}`, + borderRadius: BCDesignTokens.layoutBorderRadiusMedium, + "&.Mui-expanded:first-of-type": { + marginTop: "1rem", + }, + }} + > + + + {isExpanded ? : } + + {data.requirementSource?.name} + {data.requirementSource?.id === RequirementSourceEnum.EACA && + ` #${data.sourceAmendmentNumber}`} + + + + + + + + + + + + + + + + + + + + + + + + + + + {isCondition ? "Condition #:" : "Section #:"} + + + {data.sourceNumber} + + + + + Title: + + + {data.sourceTitle} + + + + + + Description: + + + {data.description?.text} + + } + /> + + + + + ); + } +); + +export default RequirementSourceCard; diff --git a/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementSourceModal.tsx b/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementSourceModal.tsx index f75ce68..13c15b6 100644 --- a/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementSourceModal.tsx +++ b/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementSourceModal.tsx @@ -14,14 +14,14 @@ import { useRequirementSourcesData } from "@/hooks/useComplaints"; import { RequirementSourceEnum } from "@/utils/constants"; type RequirementSourceModalProps = { - onSubmit: (submitMsg: string) => void; + onSubmit: (data: RequirementSourceFormData) => void; }; const requirementSourceFormSchema = yup.object().shape({ requirementSource: yup .object() .nullable() - .required("Name is required"), + .required("Requirement Source is required"), sourceNumber: yup.string().nullable(), sourceTitle: yup.string().nullable(), sourceAmendmentNumber: yup.string().nullable(), @@ -72,14 +72,10 @@ const RequirementSourceModal: React.FC = ({ reset(defaultValues); }, [defaultValues, reset]); - const onSuccess = () => { - onSubmit("Successfully added!"); - }; - const onSubmitHandler = (data: RequirementSourceSchemaType) => { // eslint-disable-next-line no-console console.log(data); - onSuccess(); + onSubmit(data as RequirementSourceFormData); }; return ( From 9ca3c36dc2a883bba37b9127df5de1fe7ed540ba Mon Sep 17 00:00:00 2001 From: Nitheesh T Ganesh Date: Mon, 30 Dec 2024 15:28:53 -0700 Subject: [PATCH 2/3] COMP-269: Card Display (Schedule B, EAC Certificate) --- .../Requirements/RequirementDrawer.tsx | 6 ++--- .../Requirements/RequirementFormRight.tsx | 26 ++++++++++++------- 2 files changed, 19 insertions(+), 13 deletions(-) diff --git a/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementDrawer.tsx b/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementDrawer.tsx index bdbd300..569b061 100644 --- a/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementDrawer.tsx +++ b/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementDrawer.tsx @@ -29,12 +29,12 @@ const RequirementFormSchema = yup.object().shape({ complianceFinding: yup .object() .nullable() - .required("Primary is required"), + .required("Compliance Finding is required"), enforcementAction: yup .array() .of(yup.object()) - .min(1, "At least one Type is required") - .required("Type is required"), + .min(1, "At least one Enforcement Action is required") + .required("Enforcement Action is required"), findings: yup .object({ html: yup.string().required("Entry is required"), diff --git a/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementFormRight.tsx b/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementFormRight.tsx index 7ce2c68..01be96e 100644 --- a/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementFormRight.tsx +++ b/compliance-web/src/components/App/Inspections/Profile/Requirements/RequirementFormRight.tsx @@ -1,19 +1,24 @@ -import { FC } from "react"; +import { FC, useState } from "react"; import { Box, Button } from "@mui/material"; import { AddRounded } from "@mui/icons-material"; import { useModal } from "@/store/modalStore"; -import { notify } from "@/store/snackbarStore"; import RequirementSourceModal from "./RequirementSourceModal"; - +import { RequirementSourceFormData } from "@/models/InspectionRequirement"; +import RequirementSourceCard from "./RequirementSourceCard"; const RequirementFormRight: FC = () => { const { setOpen, setClose } = useModal(); + const [requirementSourceFormData, setRequirementSourceFormData] = useState< + RequirementSourceFormData[] + >([]); - const handleOnSubmit = (submitMsg: string) => { + const handleOnSubmit = (data: RequirementSourceFormData) => { setClose(); - notify.success(submitMsg); + // eslint-disable-next-line no-console + console.log(data); + setRequirementSourceFormData((prevData) => [...prevData, data]); }; - + const handleAddRequirementSourceModal = () => { setOpen({ content: , @@ -24,21 +29,22 @@ const RequirementFormRight: FC = () => { return ( + {requirementSourceFormData.map((data, index) => ( + + ))} ); }; From 416f0732d0900fe8881abefe2d895281fff94c4c Mon Sep 17 00:00:00 2001 From: Nitheesh T Ganesh Date: Mon, 30 Dec 2024 15:29:09 -0700 Subject: [PATCH 3/3] COMP-270: Card Display (EAC Amendment) --- .../Inspections/Profile/InspectionFileTabs.tsx | 15 +++++++++++++++ .../Profile/InspectionGeneralInformation.tsx | 4 ++-- 2 files changed, 17 insertions(+), 2 deletions(-) diff --git a/compliance-web/src/components/App/Inspections/Profile/InspectionFileTabs.tsx b/compliance-web/src/components/App/Inspections/Profile/InspectionFileTabs.tsx index 10142dc..1fb0d95 100644 --- a/compliance-web/src/components/App/Inspections/Profile/InspectionFileTabs.tsx +++ b/compliance-web/src/components/App/Inspections/Profile/InspectionFileTabs.tsx @@ -23,6 +23,11 @@ const InspectionFileTabs: React.FC = () => { = () => { "& .MuiTabs-flexContainer": { gap: "1rem", }, + "& .MuiTab-root": { + paddingX: "0.5rem", + "&:first-of-type": { + paddingLeft: "0", + }, + }, + "& .Mui-selected": { + color: BCDesignTokens.typographyColorPrimary, + fontWeight: BCDesignTokens.typographyFontWeightsBold, + }, }} > diff --git a/compliance-web/src/components/App/Inspections/Profile/InspectionGeneralInformation.tsx b/compliance-web/src/components/App/Inspections/Profile/InspectionGeneralInformation.tsx index 3847afc..6d4a8ce 100644 --- a/compliance-web/src/components/App/Inspections/Profile/InspectionGeneralInformation.tsx +++ b/compliance-web/src/components/App/Inspections/Profile/InspectionGeneralInformation.tsx @@ -82,8 +82,8 @@ const InspectionGeneralInformation: React.FC< key={property.name} propertyName={property.name} propertyValue={property.value} - linksList={property.link ? [property.value] : null} - linkRoute={property.link ? "/ce-database/case-files" : null} + linksList={property.link ? [property.value] : undefined} + linkRoute={property.link ? "/ce-database/case-files" : undefined} /> ))}