ORV2-2823 - FE: Add rejectionHistory to Application response data type

frontend/src/features/permits/helpers/deserializeApplication.ts

@@ -2,7 +2,13 @@ import { Dayjs } from "dayjs";
 
 import { applyWhenNotNullable } from "../../../common/helpers/util";
 import { Application, ApplicationResponseData } from "../types/application";
-import { getEndOfDate, getStartOfDate, now, toLocalDayjs, utcToLocalDayjs } from "../../../common/helpers/formatDate";
+import {
+  getEndOfDate,
+  getStartOfDate,
+  now,
+  toLocalDayjs,
+  utcToLocalDayjs,
+} from "../../../common/helpers/formatDate";
 import { getDurationOrDefault } from "./getDefaultApplicationFormData";
 import { getExpiryDate } from "./permitState";
 import { minDurationForPermitType } from "./dateSelection";

frontend/src/features/permits/pages/Application/components/review/PermitReview.tsx

@@ -22,6 +22,8 @@ import { ReviewFeeSummary } from "./ReviewFeeSummary";
 import { ReviewPermitDetails } from "./ReviewPermitDetails";
 import { ReviewPermitLOAs } from "./ReviewPermitLOAs";
 import { ReviewVehicleInfo } from "./ReviewVehicleInfo";
+import { ApplicationRejectionHistory } from "../../../../types/ApplicationRejectionHistory";
+import { ReviewApplicationRejectionHistory } from "./ReviewApplicationRejectionHistory";
 import { isPermitStartOrExpiryDateInPast } from "../../../../helpers/dateSelection";
 
 interface PermitReviewProps {
@@ -58,9 +60,15 @@ interface PermitReviewProps {
   calculatedFee: string;
   doingBusinessAs?: Nullable<string>;
   loas?: Nullable<PermitLOA[]>;
+  applicationRejectionHistory?: Nullable<ApplicationRejectionHistory[]>;
 }
 
 export const PermitReview = (props: PermitReviewProps) => {
+  const shouldShowRejectionHistory =
+    props.reviewContext === PERMIT_REVIEW_CONTEXTS.QUEUE &&
+    props.applicationRejectionHistory &&
+    props.applicationRejectionHistory.length > 0;
+
   const invalidPermitDates =
     props.permitStartDate && props.permitExpiryDate
       ? isPermitStartOrExpiryDateInPast(
@@ -115,6 +123,12 @@ export const PermitReview = (props: PermitReviewProps) => {
           oldFields={props.oldFields?.permitData?.vehicleDetails}
         />
 
+        {shouldShowRejectionHistory && props.applicationRejectionHistory && (
+          <ReviewApplicationRejectionHistory
+            applicationRejectionHistory={props.applicationRejectionHistory}
+          />
+        )}
+
         <ReviewFeeSummary
           hasAttemptedSubmission={props.hasAttemptedCheckboxes}
           areAllConfirmed={props.allConfirmed}

frontend/src/features/permits/pages/Application/components/review/ReviewApplicationRejectionHistory.scss

@@ -0,0 +1,21 @@
+@use "../../../../../../themes/orbcStyles";
+
+@include orbcStyles.permit-main-box-style(".rejection-history");
+@include orbcStyles.permit-left-box-style(".rejection-history__header");
+@include orbcStyles.permit-right-box-style(".rejection-history__body");
+
+.rejection-history {
+  &__info {
+    padding-top: 1.5rem;
+  }
+
+  &__item, .item {
+
+    padding-bottom: 1.5rem;
+
+    &__row {
+      &--flex {
+        display: flex;
+      }
+  }}
+}

frontend/src/features/permits/pages/Application/components/review/ReviewApplicationRejectionHistory.tsx

@@ -0,0 +1,52 @@
+import { Box, Typography } from "@mui/material";
+import { ApplicationRejectionHistory } from "../../../../types/ApplicationRejectionHistory";
+import "./ReviewApplicationRejectionHistory.scss";
+import {
+  DATE_FORMATS,
+  toLocal,
+} from "../../../../../../common/helpers/formatDate";
+import { canViewApplicationQueue } from "../../../../../queue/helpers/canViewApplicationQueue";
+import { useContext } from "react";
+import OnRouteBCContext from "../../../../../../common/authentication/OnRouteBCContext";
+
+export const ReviewApplicationRejectionHistory = ({
+  applicationRejectionHistory,
+}: {
+  applicationRejectionHistory: ApplicationRejectionHistory[];
+}) => {
+  const { idirUserDetails } = useContext(OnRouteBCContext);
+  return (
+    <Box className="rejection-history">
+      <Box className="rejection-history__header">
+        <Typography
+          variant={"h3"}
+          className="rejection-history__title"
+          data-testid="rejection-history-title"
+        >
+          Rejection History
+        </Typography>
+      </Box>
+      <Box className="rejection-history__body">
+        <Box className="rejection-history__info">
+          {applicationRejectionHistory.map((item) => (
+            <Box
+              className="rejection-history__item item"
+              key={item.caseActivityId}
+            >
+              <div className="item__row item__row--flex">
+                <Typography>
+                  {canViewApplicationQueue(idirUserDetails?.userRole)
+                    ? `${item.userName}, ${toLocal(item.dateTime, DATE_FORMATS.LONG)}`
+                    : toLocal(item.dateTime, DATE_FORMATS.LONG)}
+                </Typography>
+              </div>
+              <div className="item__row">
+                <Typography>{item.caseNotes}</Typography>
+              </div>
+            </Box>
+          ))}
+        </Box>
+      </Box>
+    </Box>
+  );
+};

frontend/src/features/permits/types/ApplicationRejectionHistory.ts

@@ -0,0 +1,6 @@
+export interface ApplicationRejectionHistory {
+  caseActivityId: number;
+  userName: string;
+  dateTime: string;
+  caseNotes: string;
+}

frontend/src/features/permits/types/application.ts

@@ -8,6 +8,7 @@ import { PermitApplicationOrigin } from "./PermitApplicationOrigin";
 import { PermitApprovalSource } from "./PermitApprovalSource";
 import { PermitData } from "./PermitData";
 import { ApplicationQueueStatus } from "../../queue/types/ApplicationQueueStatus";
+import { ApplicationRejectionHistory } from "./ApplicationRejectionHistory";
 
 /**
  * A partial permit type that consists of all common fields used for a permit.
@@ -39,6 +40,7 @@ export interface Application extends PartialApplication {
   updatedDateTime?: Nullable<Dayjs>;
   permitData: PermitData;
   applicant?: Nullable<string>;
+  rejectionHistory?: Nullable<ApplicationRejectionHistory[]>;
 }
 
 /**

frontend/src/features/queue/components/ApplicationInQueueReview.tsx

@@ -140,6 +140,7 @@ export const ApplicationInQueueReview = ({
           }
           doingBusinessAs={doingBusinessAs}
           calculatedFee={fee}
+          applicationRejectionHistory={applicationData?.rejectionHistory}
         />
       </FormProvider>
       {showRejectApplicationModal && (