Merge pull request #4824 from bcgov/dev-rook

Dev rook
bcgov · Dec 2, 2023 · dd2c678 · dd2c678
2 parents 22a9122 + 50e5b0c
commit dd2c678
Show file tree

Hide file tree

Showing 10 changed files with 79 additions and 77 deletions.
diff --git a/forms-flow-web/src/components/FOI/FOIRequest/FOIRequest.js b/forms-flow-web/src/components/FOI/FOIRequest/FOIRequest.js
@@ -163,8 +163,7 @@ const FOIRequest = React.memo(({ userDetail }) => {
   const [attachments, setAttachments] = useState(requestAttachments);
   const [comment, setComment] = useState([]);
   const [requestState, setRequestState] = useState(StateEnum.unopened.name);
-  const disableInput =
-    requestState?.toLowerCase() === StateEnum.closed.name.toLowerCase();
+  const [disableInput, setDisableInput] = useState(requestState?.toLowerCase() === StateEnum.closed.name.toLowerCase());
   const [_tabStatus, settabStatus] = React.useState(requestState);
   let foitabheaderBG = getTabBG(_tabStatus, requestState);
 
@@ -257,8 +256,25 @@ const FOIRequest = React.memo(({ userDetail }) => {
   const [isIAORestricted, setIsIAORestricted] = useState(false);
   const [redactedSections, setRedactedSections] = useState("");
   const [isMCFPersonal, setIsMCFPersonal] = useState(bcgovcode.replaceAll('"', '') == "MCF" && requestDetails.requestType == FOI_COMPONENT_CONSTANTS.REQUEST_TYPE_PERSONAL);
-  const {oipcData, addOIPC, removeOIPC, updateOIPC, isOIPCReview, setIsOIPCReview} = useOIPCHook();
-
+  const {oipcData, addOIPC, removeOIPC, updateOIPC, isOIPCReview, setIsOIPCReview, removeAllOIPCs} = useOIPCHook();
+  const [oipcDataInitial, setOipcDataInitial] = useState(oipcData);
+
+  //Update disableInput when requestState changes
+  useEffect(() => {
+    setDisableInput(requestState?.toLowerCase() === StateEnum.closed.name.toLowerCase())
+  }, [requestState])
+
+  useEffect(() => {
+    if (!oipcDataInitial) {
+      setOipcDataInitial(oipcData);
+      return;
+    }
+    //check to see if oipcData has been updated, if so, enable save button
+    if (JSON.stringify(oipcData) != JSON.stringify(oipcDataInitial)) {
+      setDisableInput(false)
+    }
+  }, [oipcData]);
+
   useEffect(() => {
     if (window.location.href.indexOf("comments") > -1) {
       tabclick("Comments");
@@ -649,6 +665,9 @@ const FOIRequest = React.memo(({ userDetail }) => {
 
   const oipcSectionRef = React.useRef(null);
   const handleOipcReviewFlagChange = (isSelected) => {
+    if (!isSelected) {
+      removeAllOIPCs();
+    }
     setIsOIPCReview(isSelected);
     requestDetails.isoipcreview = isSelected;
     oipcSectionRef.current.scrollIntoView();

diff --git a/forms-flow-web/src/components/FOI/FOIRequest/MinistryReview/MinistryReview.js b/forms-flow-web/src/components/FOI/FOIRequest/MinistryReview/MinistryReview.js
@@ -18,10 +18,6 @@ import {
 import {
   fetchFOIMinistryAssignedToList,
   fetchFOIPersonalDivisionsAndSections,
-  fetchOIPCInquiryoutcomes,
-  fetchOIPCOutcomes,
-  fetchOIPCReviewtypes,
-  fetchOIPCStatuses,
 } from "../../../../apiManager/services/FOI/foiMasterDataServices";
 
 import { fetchFOIRequestAttachmentsList } from "../../../../apiManager/services/FOI/foiAttachmentServices";
@@ -66,8 +62,6 @@ import { UnsavedModal } from "../../customComponents";
 import { DISABLE_GATHERINGRECORDS_TAB } from "../../../../constants/constants";
 import _ from "lodash";
 import { MinistryNeedsScanning } from "../../../../constants/FOI/enum";
-import OIPCDetails from "../OIPCDetails/Index";
-import useOIPCHook from "../OIPCDetails/oipcHook";
 
 const useStyles = makeStyles((theme) => ({
   root: {
@@ -114,7 +108,6 @@ const MinistryReview = React.memo(({ userDetail }) => {
 
   const [_currentrequestStatus, setcurrentrequestStatus] = React.useState("");
   const [_tabStatus, settabStatus] = React.useState(requestState);
-  const {oipcData, addOIPC, removeOIPC, updateOIPC, isOIPCReview, setIsOIPCReview} = useOIPCHook();
 
   //gets the request detail from the store
   const IsDivisionalCoordinator = () => {
@@ -218,12 +211,6 @@ const MinistryReview = React.memo(({ userDetail }) => {
       dispatch(fetchPDFStitchStatusForHarms(requestId, ministryId));
       dispatch(fetchPDFStitchStatusForRedlines(requestId, ministryId));
       dispatch(fetchPDFStitchStatusForResponsePackage(requestId, ministryId));
-
-      dispatch(fetchOIPCOutcomes());
-      dispatch(fetchOIPCStatuses());
-      dispatch(fetchOIPCReviewtypes());
-      dispatch(fetchOIPCInquiryoutcomes());
-
       fetchCFRForm(ministryId, dispatch);
       if (bcgovcode) dispatch(fetchFOIMinistryAssignedToList(bcgovcode));
     }
@@ -332,11 +319,6 @@ const MinistryReview = React.memo(({ userDetail }) => {
     hasincompleteDivstage ||
     !hasReceivedDate;
 
-  const isOipcReviewValidationError = (oipcData?.length > 0 && requestDetails.isoipcreview && oipcData?.some((oipc) => {
-    return oipc.oipcno === "" || oipc.receiveddate === null || oipc.receiveddate === "" || oipc.reviewtypeid === null || oipc.reasonid === null || oipc.statusid === null || 
-    oipc.inquiryattributes?.orderno === "" || oipc.inquiryattributes?.inquiryoutcome === null || oipc.inquiryattributes?.inquirydate === null || oipc.inquiryattributes?.inquirydate === ""; 
-  }))
-
   const createMinistrySaveRequestObject = (_propName, _value, _value2) => {
     const requestObject = { ...saveMinistryRequestObject };
     setUnSavedRequest(true);
@@ -601,19 +583,6 @@ const MinistryReview = React.memo(({ userDetail }) => {
     (state) => state.foiRequests.showEventQueue
   );
 
-  const oipcSectionRef = React.useRef(null);
-  const handleOipcReviewFlagChange = (isSelected) => {
-    setIsOIPCReview(isSelected);
-    requestDetails.isoipcreview = isSelected;
-    oipcSectionRef.current.scrollIntoView();
-    //timeout to allow react state to update after setState call
-    if (isSelected) {
-      setTimeout(() => {
-        oipcSectionRef.current.scrollIntoView();
-      }, (10));
-    }
-  }
-
   return !isLoading &&
     requestDetails &&
     Object.keys(requestDetails).length !== 0 &&
@@ -784,7 +753,6 @@ const MinistryReview = React.memo(({ userDetail }) => {
                             setSaveMinistryRequestObject
                           }
                           ministryAssigneeValue={ministryAssignedToValue}
-                          handleOipcReviewFlagChange={handleOipcReviewFlagChange}
                         />
                         <ApplicantDetails requestDetails={requestDetails} />
                         <ChildDetails requestDetails={requestDetails} />
@@ -800,20 +768,11 @@ const MinistryReview = React.memo(({ userDetail }) => {
                         />
                         {divisionsBox}
                         {/* <RequestNotes /> */}
-                        <div ref={oipcSectionRef}></div>
-                        {isOIPCReview && requestState && requestState.toLowerCase() !== StateEnum.intakeinprogress.name.toLowerCase() && requestState.toLowerCase() !== StateEnum.unopened.name.toLowerCase() && (
-                          <OIPCDetails 
-                            oipcData={oipcData}
-                            updateOIPC={updateOIPC}
-                            addOIPC={addOIPC}
-                            removeOIPC={removeOIPC}
-                          />
-                        )}
                         <BottomButtonGroup
                           requestState={requestState}
                           stateChanged={stateChanged}
                           attachmentsArray={requestAttachments}
-                          isValidationError={isValidationError || isOipcReviewValidationError}
+                          isValidationError={isValidationError}
                           saveMinistryRequestObject={saveMinistryRequestObject}
                           unSavedRequest={unSavedRequest}
                           recordsUploading={recordsUploading}

diff --git a/forms-flow-web/src/components/FOI/FOIRequest/MinistryReview/RequestHeader.js b/forms-flow-web/src/components/FOI/FOIRequest/MinistryReview/RequestHeader.js
@@ -20,8 +20,7 @@ const RequestHeader = React.memo(({
     userDetail,
     handleMinistryAssignedToValue,
     setSaveMinistryRequestObject,
-    ministryAssigneeValue,
-    handleOipcReviewFlagChange
+    ministryAssigneeValue
 }) => {
     const { requestId, ministryId } = useParams();
     const _requestDetails = requestDetails;
@@ -109,7 +108,6 @@ const RequestHeader = React.memo(({
               type="oipcreview"
               requestDetails={requestDetails}
               isActive={requestDetails.isoipcreview}
-              handleSelect={handleOipcReviewFlagChange}
             />
             {/* <RequestFlag
               type="phasedrelease"

diff --git a/forms-flow-web/src/components/FOI/FOIRequest/OIPCDetails/OIPCItem.jsx b/forms-flow-web/src/components/FOI/FOIRequest/OIPCDetails/OIPCItem.jsx
@@ -148,11 +148,14 @@ const OIPCItem = (props) => {
     return (
         <> 
             <div style={{display: "flex", flexDirection: "row", justifyContent: "flex-end"}}>
-                <button onClick={() => setShowDeleteModal(true)} style={{ border: "none", background: "none" }}>
+                <button onClick={(e) => {
+                    e.preventDefault()
+                    setShowDeleteModal(true)
+                    }} style={{ border: "none", background: "none" }}>
                     <FontAwesomeIcon icon={faTrash} color="#38598A" />
                 </button>
             </div>
-            {showDeleteModal && <RemoveOIPCModal removeOIPC={removeOIPC} showModal={showDeleteModal} setShowModal={setShowDeleteModal} oipcid={oipc.id} />}
+            {showDeleteModal && <RemoveOIPCModal removeOIPC={removeOIPC} showModal={showDeleteModal} setShowModal={setShowDeleteModal} oipc={oipc} />}
             {showOutcomeModal && <OutcomeModal updateOIPC={updateOIPC} showModal={showOutcomeModal} setShowModal={setShowOutcomeModal} setOipc={setOipc} oipc={oipc} />}
             {showAmendModal && <AmendModal updateOIPC={updateOIPC} showModal={showAmendModal} setShowModal={setShowAmendModal} setOipc={setOipc} oipc={oipc} />}
             <Grid container spacing={1}>
@@ -191,13 +194,16 @@ const OIPCItem = (props) => {
                         select
                         variant="outlined"
                         fullWidth
-                        value={oipc.reviewtypeid}
+                        value={oipc.reviewtypeid ? oipc.reviewtypeid : -1}
                         label="Review Type"
                         onChange={(event) => handleReviewType(event.target.value)}
                         error={(!oipc.outcomeid || oipc.outcomeid === 5) && oipc.reviewtypeid === null}
                         required
                         disabled={oipc.outcomeid && oipc.outcomeid !== 5}
                     >
+                        <MenuItem disabled value={-1}>
+                            Select Review Type
+                        </MenuItem>
                         {uniqueReviewTypes(oipcReviewtypes).map((reviewtype) => {
                             return <MenuItem key={reviewtype.reviewtypeid} value={reviewtype.reviewtypeid}>{reviewtype.type_name}</MenuItem>
                         })}
@@ -209,13 +215,16 @@ const OIPCItem = (props) => {
                         select
                         variant="outlined"
                         fullWidth
-                        value={oipc.reasonid}
+                        value={oipc.reasonid ? oipc.reasonid : -1}
                         label="Reason"
                         onChange = {(event) => handleReason(event.target.value)}
                         error={(!oipc.outcomeid || oipc.outcomeid === 5) && oipc.reasonid === null}
                         required
                         disabled={oipc.outcomeid && oipc.outcomeid !== 5}
                     >
+                        <MenuItem disabled value={-1}>
+                            Select Review Type & Reason
+                        </MenuItem>
                         {oipc.reviewtypeid ? 
                             oipcReviewtypes.map((reviewtype) => {
                             if (reviewtype.reviewtypeid === oipc.reviewtypeid) {
@@ -230,13 +239,16 @@ const OIPCItem = (props) => {
                         select
                         variant="outlined"
                         fullWidth
-                        value={oipc.statusid}
+                        value={oipc.statusid ? oipc.statusid : -1}
                         label="Status"
                         onChange = {(event) => handleStatus(event.target.value)}
                         error={(!oipc.outcomeid || oipc.outcomeid === 5) && oipc.statusid === null}
                         required
                         disabled={oipc.outcomeid && oipc.outcomeid !== 5}
                     >
+                        <MenuItem disabled value={-1}>
+                            Select Status
+                        </MenuItem>
                         {oipcStatuses.map((status) => {
                             return <MenuItem key={status.statusid} value={status.statusid}>{status.name}</MenuItem>
                         })}
@@ -261,9 +273,12 @@ const OIPCItem = (props) => {
                         variant="outlined"
                         onChange = {(event) => handleOutcome(event.target.value)}
                         fullWidth
-                        value={oipc.outcomeid}
+                        value={oipc.outcomeid ? oipc.outcomeid : -1}
                         label="Outcome"
                     >
+                        <MenuItem disabled value={-1}>
+                            Select Outcome
+                        </MenuItem>
                         {oipcOutcomes.map((outcome) => {
                             if (outcome.outcomeid !== 5) {
                                 return <MenuItem disabled={oipc.outcomeid && oipc.outcomeid !== 5} key={outcome.outcomeid} value={outcome.outcomeid}>{outcome.name}</MenuItem>
@@ -378,12 +393,15 @@ const OIPCItem = (props) => {
                         variant="outlined"
                         onChange = {(event) => handleInquiryFields(event.target.value, "INQUIRYOUTCOME")}
                         fullWidth
-                        value={oipc.inquiryattributes.inquiryoutcome}
+                        value={oipc.inquiryattributes.inquiryoutcome ? oipc.inquiryattributes.inquiryoutcome : -1}
                         label="Outcome"
                         error={(!oipc.outcomeid || oipc.outcomeid === 5) && oipc.inquiryattributes.inquiryoutcome === null}
                         required
                         disabled={oipc.outcomeid && oipc.outcomeid !== 5}
-                    >   
+                    >
+                        <MenuItem disabled value={-1}>
+                            Select Inquiry Outcome
+                        </MenuItem>   
                         {oipcInquiryoutcomes.map((inquiryoutcome) => {
                             return <MenuItem key={inquiryoutcome.inquiryoutcomeid} value={inquiryoutcome.inquiryoutcomeid}>{inquiryoutcome.name}</MenuItem>
                         })}

diff --git a/forms-flow-web/src/components/FOI/FOIRequest/OIPCDetails/RemoveOIPCModal.jsx b/forms-flow-web/src/components/FOI/FOIRequest/OIPCDetails/RemoveOIPCModal.jsx
@@ -10,12 +10,12 @@ const RemoveOIPCModal= ({
     showModal,
     removeOIPC,
     setShowModal,
-    oipcid,
+    oipc,
 }) =>{ 
 
     const handleSave = () => {
         setShowModal(false);
-        removeOIPC(oipcid)
+        removeOIPC(oipc.id)
     };
     const handleClose = () => {
         setShowModal(false);

diff --git a/forms-flow-web/src/components/FOI/FOIRequest/OIPCDetails/oipcHook.js b/forms-flow-web/src/components/FOI/FOIRequest/OIPCDetails/oipcHook.js
@@ -5,7 +5,6 @@ const useOIPCHook = () => {
   //OIPC State
   const requestDetails = useSelector((state) => state.foiRequests.foiRequestDetail);
   const stageOIPCData = (isoipcreview, oipcData) => {
-    console.log(isoipcreview)
     if (isoipcreview) {
       if (oipcData?.length > 0) {
         return oipcData.map((item, index) => {
@@ -33,13 +32,14 @@ const useOIPCHook = () => {
   }
   const [oipcData, setOipcData] = useState(requestDetails.oipcdetails);
   const [isOIPCReview, setIsOIPCReview] = useState(requestDetails.isoipcreview);
-
+  const [resettoInitial, setResettoInitial] = useState(false);
   useEffect(() => {
+    if (resettoInitial == false) {
     const stagedOIPCData = stageOIPCData(isOIPCReview, requestDetails.oipcdetails);
     setOipcData(stagedOIPCData);
+    }
   }, [isOIPCReview])
 
-
   //OIPC Functions
   const addOIPC = () => {
     setOipcData((prev) => {
@@ -61,11 +61,17 @@ const useOIPCHook = () => {
     })
   }
   const removeOIPC = (oipcId) => {
+    if (oipcData.length === 1) {
+      setOipcData([]);  
+      setResettoInitial(true);
+    }
+    else {
     setOipcData((prev) => {
       const previousOIPCData = [...prev];
-      return previousOIPCData.filter(oipc => oipcId !== oipc.id);
+      return previousOIPCData.filter(oipc => oipcId !== oipc.id);     
     });
   }
+  }
   const updateOIPC = (newOIPCObj) => {
     setOipcData((prev) => {
       const previousOIPCData = [...prev];
@@ -80,6 +86,7 @@ const useOIPCHook = () => {
   }
   const removeAllOIPCs = () => {
     setOipcData([]);
+    setResettoInitial(true);
   }
 
   return {

diff --git a/forms-flow-web/src/components/FOI/FOIRequest/OIPCDetails/oipcdetails.scss b/forms-flow-web/src/components/FOI/FOIRequest/OIPCDetails/oipcdetails.scss
@@ -32,7 +32,7 @@
 }
 
 .MuiDivider-root {
-    margin: 10px 0px 16px 0px !important;
-    height: 1.5px !important;
+    margin: 10px 0px 16px 0px;
+    height: 1.5px;
 }
 
diff --git a/forms-flow-web/src/components/FOI/customComponents/RequestFlag.js b/forms-flow-web/src/components/FOI/customComponents/RequestFlag.js
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import "./requestflag.scss";
 import OutlinedInput from "@material-ui/core/OutlinedInput";
 import MenuItem from "@material-ui/core/MenuItem";
@@ -13,8 +13,6 @@ import DialogTitle from "@material-ui/core/DialogTitle";
 import CloseIcon from "@material-ui/icons/Close";
 import IconButton from "@material-ui/core/IconButton";
 import TextField from "@mui/material/TextField";
-import { useParams } from "react-router-dom";
-import { useDispatch } from "react-redux";
 
 //Types are:
 //oipcreview
@@ -26,9 +24,13 @@ const RequestFlag = ({ isActive, type, handleSelect, showFlag = true }) => {
   const [modalMessage, setModalMessage] = useState("");
   const [modalDescription, setModalDescription] = useState("");
 
-  const { requestId, ministryId } = useParams();
-
-  const dispatch = useDispatch();
+  useEffect(() => {
+    if (isActive == null) {
+      setIsSelected(false);
+    } else {
+    setIsSelected(isActive);
+    }
+  }, [isActive])
 
   // These need to be set for each type
   let options;

diff --git a/forms-flow-web/src/components/FOI/customComponents/requestflag.scss b/forms-flow-web/src/components/FOI/customComponents/requestflag.scss
@@ -1,6 +1,5 @@
 .request-flag {
 
-    margin-left: -50px;
     padding-top: 50px;
 
     .request-flag-dropdown-all {