Merge pull request #208 from jadmsaadaot/SUBMIT-task#258-B

Update Request - Add status badge for the package and the submission items
bcgov · Dec 23, 2024 · 00f94f6 · 00f94f6
2 parents d9b13ab + bc885cf
commit 00f94f6
Show file tree

Hide file tree

Showing 17 changed files with 121 additions and 32 deletions.
diff --git a/submit-web/src/components/PackageStatusChip/PackageStatusChipStack.tsx b/submit-web/src/components/PackageStatusChip/PackageStatusChipStack.tsx
@@ -1,20 +1,21 @@
 import {
   NON_CANONICAL_PACKAGE_STATUS,
-  NonCanonicalPackageStatus,
-  PackageStatus,
+  SubmissionPackage,
 } from "@/models/Package";
 import { Box, Stack } from "@mui/material";
 import PackageStatusChip from ".";
 import { When } from "react-if";
 
 type PackageStatusChipStackProps = {
-  status: PackageStatus[];
-  reviewStatus?: NonCanonicalPackageStatus;
+  submissionPackage: SubmissionPackage;
+  hideReviewStatus?: boolean;
 };
 export const PackageStatusChipStack = ({
-  status,
-  reviewStatus,
+  submissionPackage,
+  hideReviewStatus = false,
 }: PackageStatusChipStackProps) => {
+  const { status, review_status } = submissionPackage;
+  const isUpdateRequested = submissionPackage.update_requests?.length > 0;
   return (
     <Box sx={{ display: "inline-block", width: "fit-content" }}>
       <Stack direction="column" spacing={1} alignItems={"flex-end"}>
@@ -23,13 +24,20 @@ export const PackageStatusChipStack = ({
         ))}
         <When
           condition={
-            reviewStatus === NON_CANONICAL_PACKAGE_STATUS.PENDING_MANAGER_REVIEW
+            review_status ===
+              NON_CANONICAL_PACKAGE_STATUS.PENDING_MANAGER_REVIEW &&
+            !hideReviewStatus
           }
         >
           <PackageStatusChip
             status={NON_CANONICAL_PACKAGE_STATUS.PENDING_MANAGER_REVIEW}
           />
         </When>
+        <When condition={isUpdateRequested}>
+          <PackageStatusChip
+            status={NON_CANONICAL_PACKAGE_STATUS.UPDATE_REQUESTED}
+          />
+        </When>
       </Stack>
     </Box>
   );

diff --git a/submit-web/src/components/PackageStatusChip/index.tsx b/submit-web/src/components/PackageStatusChip/index.tsx
@@ -99,6 +99,16 @@ const statusStyles: Record<
     },
     label: "Passed Consultation Check",
   },
+  UPDATE_REQUESTED: {
+    sx: {
+      borderRadius: 1,
+      border: `1px solid #F18A15`,
+      background: "#FFDEB8",
+      height: "24px",
+      width: "140px",
+    },
+    label: "Update Requested",
+  },
 };
 
 export default function PackageStatusChip({

diff --git a/submit-web/src/components/Projects/ProjectTable/ProponentTableRow.tsx b/submit-web/src/components/Projects/ProjectTable/ProponentTableRow.tsx
@@ -55,7 +55,10 @@ export default function ProponentTableRow({ subPackage }: ProjectRowProps) {
           {subPackage.submitted_by ?? "--"}
         </StyledProjectTableCell>
         <StyledProjectTableCell align="center">
-          <PackageStatusChipStack status={subPackage.status} />
+          <PackageStatusChipStack
+            submissionPackage={subPackage}
+            hideReviewStatus
+          />
         </StyledProjectTableCell>
       </StyledProjectTableRow>
       <EmptyRow colSpan={4} />

diff --git a/submit-web/src/components/Projects/ProjectTable/StaffTableRow.tsx b/submit-web/src/components/Projects/ProjectTable/StaffTableRow.tsx
@@ -29,9 +29,7 @@ export default function StaffTableRow({ submissionPackage }: ProjectRowProps) {
     name,
     meta,
     days_since_submission = 0,
-    review_status,
     submitted_on,
-    status,
   } = submissionPackage;
 
   const { cc_completed_on, mp_review, type } = meta || {};
@@ -126,10 +124,7 @@ export default function StaffTableRow({ submissionPackage }: ProjectRowProps) {
             pr: BCDesignTokens.layoutPaddingSmall,
           }}
         >
-          <PackageStatusChipStack
-            status={status}
-            reviewStatus={review_status}
-          />
+          <PackageStatusChipStack submissionPackage={submissionPackage} />
         </StyledProjectTableCell>
       </StyledProjectTableRow>
       <EmptyRow colSpan={7} />

diff --git a/submit-web/src/components/Shared/CheckboxGroup/index.tsx b/submit-web/src/components/Shared/CheckboxGroup/index.tsx
@@ -5,6 +5,7 @@ type CheckboxGroupProps = {
   defaultSelectedValues?: unknown[];
   children: React.ReactNode;
   onChange: (selectedValues: unknown[]) => void;
+  errorMessage?: string;
 };
 export const CheckboxGroup = ({
   onChange,

diff --git a/submit-web/src/components/Submission/ItemsTable.tsx b/submit-web/src/components/Submission/ItemsTable.tsx
@@ -9,23 +9,33 @@ import {
 } from "@mui/material";
 import { BCDesignTokens } from "epic.theme";
 import SubmissionItemTableRow from "./SubmissionItemTableRow";
-import {
-  SUBMISSION_ITEM_METHOD,
-  SubmissionItem,
-} from "@/models/SubmissionItem";
+import { SUBMISSION_ITEM_METHOD } from "@/models/SubmissionItem";
 import { StyledTableHeadCell } from "../Shared/Table/common";
 import { SUBMISSION_STATUS, SUBMISSION_TYPE } from "@/models/Submission";
 import { usePackageTableStore } from "./packageTableStore";
 import { useAccount } from "@/store/accountStore";
 import { USER_TYPE } from "@/models/User";
 import { When } from "react-if";
 import InternalDocumentsRows from "../SubmissionItem/InternalDocuments/Rows";
+import { SubmissionPackage } from "@/models/Package";
+import { useMemo } from "react";
 
 export default function ItemsTable({
-  submissionItems,
+  submissionPackage,
 }: {
-  submissionItems: Array<SubmissionItem>;
+  submissionPackage: SubmissionPackage;
 }) {
+  const { items: submissionItems, update_requests } = submissionPackage;
+
+  const itemUpdateRequestMap = useMemo(() => {
+    return update_requests
+      .flatMap((update_request) => update_request.submission_item_ids)
+      .reduce((acc: { [key: number]: boolean }, id) => {
+        acc[id] = true;
+        return acc;
+      }, {});
+  }, [update_requests]);
+
   const { userType } = useAccount();
 
   const { isValidating } = usePackageTableStore();
@@ -37,15 +47,16 @@ export default function ItemsTable({
     submitted_by: subItem?.submitted_by,
     version: subItem.version,
     submissions: subItem.submissions.filter(
-      (submission) => submission.type === SUBMISSION_TYPE.DOCUMENT
+      (submission) => submission.type === SUBMISSION_TYPE.DOCUMENT,
     ),
     has_document:
       subItem.type.submission_method === SUBMISSION_ITEM_METHOD.DOCUMENT_UPLOAD,
     reviewStatus: subItem.review?.status,
+    isUpdateRequest: Boolean(itemUpdateRequestMap[subItem.id]),
   }));
 
   const internalStaffDocuments = submissionItems.flatMap(
-    (item) => item.internal_staff_documents ?? []
+    (item) => item.internal_staff_documents ?? [],
   );
 
   return (

diff --git a/submit-web/src/components/Submission/SubmissionItemTableRow/StaffSubmissionItemTableRow.tsx b/submit-web/src/components/Submission/SubmissionItemTableRow/StaffSubmissionItemTableRow.tsx
@@ -18,7 +18,15 @@ export default function StaffSubmissionItemTableRow({
 }: SubmissionItemTableRowProps) {
   const { projectId, submissionPackageId } = useParams({ strict: false });
   const navigate = useNavigate();
-  const { name, submissions, has_document, id, status, reviewStatus } = item;
+  const {
+    name,
+    submissions,
+    has_document,
+    id,
+    status,
+    reviewStatus,
+    isUpdateRequest,
+  } = item;
 
   const actionLabel = has_document ? "Review" : "View";
 
@@ -59,6 +67,7 @@ export default function StaffSubmissionItemTableRow({
           <SubmissionStatusChipStack
             status={status}
             reviewStatus={reviewStatus}
+            isUpdateRequested={isUpdateRequest}
           />
         </SubmissionItemTableCell>
 

diff --git a/submit-web/src/components/Submission/UpdateRequestWidget/AddRequestSection.tsx b/submit-web/src/components/Submission/UpdateRequestWidget/AddRequestSection.tsx
@@ -12,6 +12,7 @@ import { LoadingButton } from "@/components/Shared/LoadingButton";
 import { SubmissionPackage } from "@/models/Package";
 import { CheckboxGroup } from "@/components/Shared/CheckboxGroup";
 import { SUBMISSION_ITEM_METHOD } from "@/models/SubmissionItem";
+import { notify } from "@/components/Shared/Snackbar/snackbarStore";
 
 type AddRequestSectionProps = {
   submissionPackage: SubmissionPackage;
@@ -38,6 +39,15 @@ export default function AddRequestSection({
   >([]);
 
   const onCreateUpdateRequest = () => {
+    if (!noteText) {
+      notify.error("Please enter a note");
+      return;
+    }
+    if (selectedSubmissionItems.length === 0) {
+      notify.error("Please select at least one item");
+      return;
+    }
+
     handleCreateUpdateRequest({
       note: noteText,
       submissionItems: selectedSubmissionItems,

diff --git a/submit-web/src/components/Submission/UpdateRequestWidget/index.tsx b/submit-web/src/components/Submission/UpdateRequestWidget/index.tsx
@@ -15,6 +15,8 @@ import { SubmissionPackage } from "@/models/Package";
 import RequestSection from "./RequestSection";
 import { useCreatePackageUpdateRequest } from "@/hooks/api/usePackages";
 import AddRequestSection from "./AddRequestSection";
+import { notify } from "@/components/Shared/Snackbar/snackbarStore";
+import { isAxiosError } from "axios";
 
 type UpdateRequestWidgetProps = {
   submissionPackage: SubmissionPackage;
@@ -31,6 +33,20 @@ export default function UpdateRequestWidget({
     useCreatePackageUpdateRequest({
       accountProjectId: submissionPackage.account_project_id,
       packageId: submissionPackage.id,
+      options: {
+        onSuccess: () => {
+          notify.success("Update request created successfully");
+          setExpanded(false);
+        },
+        onError: (error) => {
+          const defaultMessage = "Failed to create update request";
+          notify.error(
+            isAxiosError(error)
+              ? (error.response?.data.message ?? defaultMessage)
+              : defaultMessage,
+          );
+        },
+      },
     });
 
   const handleIsCreateRequestOpen = () => {

diff --git a/submit-web/src/components/Submission/types.ts b/submit-web/src/components/Submission/types.ts
@@ -9,4 +9,5 @@ export type SubmissionItemTableRow = {
   submissions: Array<Submission>;
   has_document: boolean;
   reviewStatus?: string;
+  isUpdateRequest?: boolean;
 };
diff --git a/submit-web/src/components/SubmissionStatusChip/index.tsx b/submit-web/src/components/SubmissionStatusChip/index.tsx
@@ -69,6 +69,16 @@ const statusStyles: Record<string, StyleProps> = {
     },
     label: "Passed Consultation Check",
   },
+  UPDATE_REQUESTED: {
+    sx: {
+      borderRadius: 1,
+      border: `1px solid #F18A15`,
+      background: "#FFDEB8",
+      height: "24px",
+      width: "140px",
+    },
+    label: "Update Requested",
+  },
 };
 
 export function SubmissionStatusChip({ status }: { status: string }) {
@@ -91,10 +101,12 @@ export function SubmissionStatusChip({ status }: { status: string }) {
 type SubmissionStatusChipStackProps = {
   status: SubmissionStatus;
   reviewStatus?: string;
+  isUpdateRequested?: boolean;
 };
 export const SubmissionStatusChipStack = ({
   status,
   reviewStatus,
+  isUpdateRequested = false,
 }: SubmissionStatusChipStackProps) => {
   return (
     <Box sx={{ display: "inline-block" }}>
@@ -109,6 +121,12 @@ export const SubmissionStatusChipStack = ({
           NON_CANONICAL_SUBMISSION_STATUS.PENDING_MANAGER_REVIEW && (
           <SubmissionStatusChip status={reviewStatus} />
         )}
+
+        {isUpdateRequested && (
+          <SubmissionStatusChip
+            status={NON_CANONICAL_SUBMISSION_STATUS.UPDATE_REQUESTED}
+          />
+        )}
       </Stack>
     </Box>
   );

diff --git a/submit-web/src/hooks/api/types.ts b/submit-web/src/hooks/api/types.ts
@@ -1,6 +1,6 @@
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export type Options<TData = any> = {
   onSuccess?: (data?: TData) => void;
-  onError?: () => void;
+  onError?: (error?: Error) => void;
   onSettled?: (data?: TData) => void;
 };
diff --git a/submit-web/src/models/Package.ts b/submit-web/src/models/Package.ts
@@ -7,11 +7,14 @@ export type PackageType = {
 };
 
 // These statuses are just for UI purposes, the actual canonical business statuses are PackageStatus
-export type NonCanonicalPackageStatus = "PENDING_MANAGER_REVIEW";
+export type NonCanonicalPackageStatus =
+  | "PENDING_MANAGER_REVIEW"
+  | "UPDATE_REQUESTED";
 export const NON_CANONICAL_PACKAGE_STATUS = Object.freeze<
   Record<NonCanonicalPackageStatus, NonCanonicalPackageStatus>
 >({
   PENDING_MANAGER_REVIEW: "PENDING_MANAGER_REVIEW",
+  UPDATE_REQUESTED: "UPDATE_REQUESTED",
 });
 
 export type PackageStatus =

diff --git a/submit-web/src/models/Submission.ts b/submit-web/src/models/Submission.ts
@@ -1,10 +1,13 @@
 // NonCanonicalSubmissionStatus are just for display purpose, they are not canonical business statuses
-export type NonCanonicalSubmissionStatus = "PENDING_MANAGER_REVIEW";
+export type NonCanonicalSubmissionStatus =
+  | "PENDING_MANAGER_REVIEW"
+  | "UPDATE_REQUESTED";
 
 export const NON_CANONICAL_SUBMISSION_STATUS = Object.freeze<
   Record<NonCanonicalSubmissionStatus, NonCanonicalSubmissionStatus>
 >({
   PENDING_MANAGER_REVIEW: "PENDING_MANAGER_REVIEW",
+  UPDATE_REQUESTED: "UPDATE_REQUESTED",
 });
 
 export type SubmissionStatus =

diff --git a/submit-web/src/models/SubmissionItem.ts b/submit-web/src/models/SubmissionItem.ts
@@ -1,4 +1,4 @@
-import { Note } from "@/components/SubmissionItem/ConsultationRecord/ConsultationRecordStaffView/Note";
+import { Note } from "@/components/SubmissionItem/Note";
 import { Submission, SubmissionStatus } from "./Submission";
 import { SubmissionReview } from "./SubmissionReview";
 

diff --git a/...ectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout/index.tsx b/...ectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout/index.tsx
@@ -156,7 +156,9 @@ export default function SubmissionPage() {
                   >
                     Submission Status:
                   </Typography>
-                  <PackageStatusChipStack status={submissionPackage.status} />
+                  <PackageStatusChipStack
+                    submissionPackage={submissionPackage}
+                  />
                 </Box>
               </Box>
               <InfoBox submissionPackage={submissionPackage} />
@@ -166,7 +168,7 @@ export default function SubmissionPage() {
                   pt: BCDesignTokens.layoutPaddingSmall,
                 }}
               >
-                <ItemsTable submissionItems={submissionPackage.items} />
+                <ItemsTable submissionPackage={submissionPackage} />
               </Box>
               <When condition={isPackageSubmitted}>
                 <Box mb={BCDesignTokens.layoutMarginXlarge}>

diff --git a/...ectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout/index.tsx b/...ectId/_projectLayout/submission-packages/$submissionPackageId/_submissionLayout/index.tsx
@@ -116,8 +116,7 @@ export default function SubmissionPage() {
                     Submission Status:
                   </Typography>
                   <PackageStatusChipStack
-                    status={submissionPackage.status}
-                    reviewStatus={submissionPackage.review_status}
+                    submissionPackage={submissionPackage}
                   />
                 </Box>
               </Box>
@@ -128,7 +127,7 @@ export default function SubmissionPage() {
                   pt: BCDesignTokens.layoutPaddingSmall,
                 }}
               >
-                <ItemsTable submissionItems={submissionPackage.items} />
+                <ItemsTable submissionPackage={submissionPackage} />
               </Box>
               <UpdateRequestWidget submissionPackage={submissionPackage} />
               <Box