Merged PR 1140: fixes for rep complete queue

fixes for rep complete queue

Related work items: #11021

actions/azurestorage.js

@@ -1141,7 +1141,8 @@ export const createCaseCompleteMessage = async (
 
 export const createRepCompleteMessage = async (
     containerName,
-    caseReference
+    caseReference,
+    filename
 ) => {
     const whichQueue = "pedw-submitted-representations";
     const queueToken = await createQueueSas(whichQueue);
@@ -1153,9 +1154,23 @@ export const createRepCompleteMessage = async (
     const message = {
         containerName: containerName,
         caseref: caseReference,
-        reppath: endpointURL + "/" + containerName + "/" + caseReference + "/",
+        reppath:
+            endpointURL +
+            "/" +
+            containerName +
+            "/" +
+            caseReference +
+            "/" +
+            filename,
         filespath:
-            endpointURL + "/" + containerName + "/" + caseReference + "/files",
+            endpointURL +
+            "/" +
+            containerName +
+            "/" +
+            caseReference +
+            "/" +
+            filename +
+            "/files",
     };
 
     const sendMessageResponse = await queueServiceClient

actions/index.js

@@ -1774,12 +1774,18 @@ export const sendCaseCompleteMessageProxy = async (
         });
 };
 
-export const sendRepCompleteMessage = async (containerID, caseReference) => {
+export const sendRepCompleteMessage = async (
+    containerID,
+    caseReference,
+    fileName
+) => {
     var queryUrl =
         "/api/file/createrepcompletemessage_api?container=" +
         containerID +
         "&tempcaseref=" +
-        caseReference;
+        caseReference +
+        "&repid=" +
+        fileName;
 
     var config = {
         method: "get",

components/case/representation/representationComplete.js

@@ -21,6 +21,7 @@ const RepComplete = (props) => {
         setSubmitBack,
         setRepresentationSubmitConfirmation,
         setRepresentationMessageSent,
+        repFormData,
     } = props;
     const { acceptedFiles, getRootProps, getInputProps } = useDropzone();
     const files = acceptedFiles.map((file) => (
@@ -46,7 +47,8 @@ const RepComplete = (props) => {
         props.props.currentView.representationMessageSent != true &&
             (sendRepCompleteMessage(
                 props.props.props.props.accountDetails.containerID,
-                props.props.currentView.caseReference.currentReference
+                props.props.currentView.caseReference.currentReference,
+                props.repFormData.repfile_name
             ),
             sendEmail(templateId, emailAddress, personalisation, reference),
             setRepresentationMessageSent(true));

components/case/representation/representationCompleteSubmit.js

@@ -37,7 +37,58 @@ const RepCompleteSubmit = (props) => {
 
     const repFormData = formObj.representationForm.values;
 
-    console.log("///////// formObj:", formObj);
+    const repDate = new Date();
+
+    let day = repDate.getDate();
+    let month = repDate.getMonth() + 1;
+    let year = repDate.getFullYear();
+    let time = repDate.getTime();
+
+    let repType = "";
+    switch (repFormData.representationCapacity) {
+        case t("myrepresentations:capacity-options-arr-appellant"):
+            repType = "APPELLANT";
+            break;
+        case t("myrepresentations:capacity-options-arr-agent"):
+            repType = "AGENT";
+            break;
+        case t("myrepresentations:capacity-options-arr-interested"):
+            repType = "IP";
+            break;
+        case "Land Owner":
+            repType = "LO";
+            break;
+        case "lpa":
+            repType = "LPA";
+            break;
+
+        default:
+        // code block
+    }
+
+    Object.assign(repFormData, {
+        "repfile_name": repFormData.hasOwnProperty("repfile_name")
+            ? repFormData.repfile_name
+            : year +
+              "-" +
+              month +
+              "-" +
+              day +
+              "-" +
+              time +
+              "-" +
+              repType +
+              "-REP" +
+              "_" +
+              props.props.props.accountDetails.accountDetails.lastname,
+        "pinswg_name": props.props.currentView.caseReference.currentReference,
+        "containerID": props.props.props.accountDetails.containerID,
+        "appealType": props.props.currentView.caseReference.appealType,
+        "incidentID": props.props.currentView.caseReference.incidentid,
+        "caseRef": props.props.currentView.caseReference.currentReference,
+    });
+
+    console.log("///////// repFormData:", repFormData);
 
     const whichQuestionnaireCheck = () => {
         {
@@ -72,6 +123,7 @@ const RepCompleteSubmit = (props) => {
         <>
             {currentView.representationSubmitConfirmation == true ? (
                 <RepComplete
+                    repFormData={repFormData}
                     props={props}
                     setRepresentationMessageSent={setRepresentationMessageSent}
                     setRepresentationReset={setRepresentationReset}

components/newappeal/buildchecksection.js

@@ -103,6 +103,7 @@ let BuildCheckSection = (props) => {
     });
 
     const [confirmSections, setConfirmSections] = useState(false);
+    const [finaliseAppealProcess, setFinaliseAppealProcess] = useState(false);
 
     const FieldsTranslations = (label) => {
         const router = useRouter();
@@ -135,6 +136,10 @@ let BuildCheckSection = (props) => {
                     props.appealType.caseReference.ticketnumber
                 );
             })
+            .then((data) => {
+                setFinaliseAppealProcess(true);
+                return data;
+            })
             .then((data) => {
                 console.log("have sent comple message :", data);
                 setCurrentSection(9999);
@@ -221,68 +226,85 @@ let BuildCheckSection = (props) => {
                         </div>
                     </dl>
                 </div>
-
+                {finaliseAppealProcess ? (
-                <div className="govuk-form-group ">
+                    <div className="">
-                    <fieldset className="govuk-fieldset">
+                        <h3 className="govuk-heading-m govuk-!-margin-top-9">
-                        <div className="govuk-checkboxes govuk-checkboxes--small">
+                            Finalising your appeal submission
-                            <div className="govuk-checkboxes__item">
+                        </h3>
-                                <input
+                        <p className="govuk-body">
-                                    name="pinswg_checkconfirmation"
+                            Currenly uploading files and finalising your appeal
-                                    id="pinswg_checkconfirmation"
+                            submission
-                                    type="checkbox"
+                        </p>
-                                    className="govuk-checkboxes__input"
+                        <p className="govuk-body textloading">Please wait</p>
-                                    value=""
+                    </div>
-                                    onChange={(e) => {
+                ) : (
-                                        setConfirmSections(!confirmSections);
+                    <>
-                                    }}
+                        <div className="govuk-form-group ">
-                                />
+                            <fieldset className="govuk-fieldset">
-                                <label
+                                <div className="govuk-checkboxes govuk-checkboxes--small">
-                                    className="govuk-label govuk-checkboxes__label"
+                                    <div className="govuk-checkboxes__item">
-                                    htmlFor="pinswg_checkconfirmation"
+                                        <input
-                                >
+                                            name="pinswg_checkconfirmation"
+                                            id="pinswg_checkconfirmation"
+                                            type="checkbox"
+                                            className="govuk-checkboxes__input"
+                                            value=""
+                                            onChange={(e) => {
+                                                setConfirmSections(
+                                                    !confirmSections
+                                                );
+                                            }}
+                                        />
+                                        <label
+                                            className="govuk-label govuk-checkboxes__label"
+                                            htmlFor="pinswg_checkconfirmation"
+                                        >
+                                            {t(
+                                                "newappeal:new-appeal-check-confirm-label"
+                                            )}
+                                        </label>
+                                    </div>
+                                </div>
+                            </fieldset>
+                            <div>
+                                <p className="govuk-body">
                                     {t(
-                                        "newappeal:new-appeal-check-confirm-label"
+                                        "newappeal:new-appeal-check-confirm-paragraph-one"
                                     )}
-                                </label>
+                                </p>
+                            </div>
+                            <div>
+                                <p className="govuk-body">
+                                    {t(
+                                        "newappeal:new-appeal-check-confirm-paragraph-two"
+                                    )}{" "}
+                                    <Link
+                                        href={t(
+                                            "newappeal:new-appeal-check-confirm-paragraph-two-link"
+                                        )}
+                                    >
+                                        {t(
+                                            "newappeal:new-appeal-check-confirm-paragraph-two-link"
+                                        )}
+                                    </Link>
+                                </p>
                             </div>
                         </div>
-                    </fieldset>
+
-                    <div>
+                        <div className="govuk-button-group">
-                        <p className="govuk-body">
+                            <a
-                            {t(
+                                disabled={confirmSections ? false : true}
-                                "newappeal:new-appeal-check-confirm-paragraph-one"
+                                className="govuk-button"
-                            )}
+                                data-module="govuk-button"
-                        </p>
+                                onClick={() => {
-                    </div>
+                                    finaliseAppeal();
-                    <div>
+                                }}
-                        <p className="govuk-body">
-                            {t(
-                                "newappeal:new-appeal-check-confirm-paragraph-two"
-                            )}{" "}
-                            <Link
-                                href={t(
-                                    "newappeal:new-appeal-check-confirm-paragraph-two-link"
-                                )}
                             >
-                                {t(
+                                {t("newappeal:submit-appeal-button")}
-                                    "newappeal:new-appeal-check-confirm-paragraph-two-link"
+                            </a>
-                                )}
+                        </div>
-                            </Link>
+                    </>
-                        </p>
+                )}
-                    </div>
-                </div>
-                <div className="govuk-button-group">
-                    <a
-                        disabled={confirmSections ? false : true}
-                        className="govuk-button"
-                        data-module="govuk-button"
-                        onClick={() => {
-                            finaliseAppeal();
-                        }}
-                    >
-                        {t("newappeal:submit-appeal-button")}
-                    </a>
-                </div>
             </div>
         </div>
     );

pages/api/file/createrepcompletemessage_api.js

@@ -13,6 +13,7 @@ ApiProxy.use(middleware);
 ApiProxy.get(async (req, res) => {
     var containerName = req.query.container;
     var tempCaseRef = req.query.tempcaseref;
+    var filename = req.query.repid;
 
     console.log(
         "/////Create Rep complete Message:\n",
@@ -24,9 +25,11 @@ ApiProxy.get(async (req, res) => {
     // console.log(hashAPIPath(checkquerypath) == "&hash=" + checkHash);
 
     //if (hashAPIPath(checkquerypath) == "&hash=" + checkHash) {
-    await createRepCompleteMessage(containerName, tempCaseRef).then((data) => {
+    await createRepCompleteMessage(containerName, tempCaseRef, filename).then(
-        return res.status(200).json(data);
+        (data) => {
-    });
+            return res.status(200).json(data);
+        }
+    );
     // } else {
     //     return res.status(400).json();
     // }

styles/sass/welshgov/_application.scss

@@ -2474,4 +2474,27 @@ fade {
         margin-top: 32px;
         padding-top: 4px !important;
     }
+}
+
+.textloading:after {
+    overflow: hidden;
+    display: inline-block;
+    vertical-align: bottom;
+    -webkit-animation: ellipsis steps(4, end) 900ms infinite;
+    animation: ellipsis steps(4, end) 900ms infinite;
+    content: "\2026";
+    /* ascii code for the ellipsis character */
+    width: 0px;
+}
+
+@keyframes ellipsis {
+    to {
+        width: 40px;
+    }
+}
+
+@-webkit-keyframes ellipsis {
+    to {
+        width: 40px;
+    }
 }