base flow for representations

2021-08-09 10:16:54 +01:00
parent f9f36bd065
commit b3fe6bf5f5
31 changed files with 2494 additions and 64 deletions
@@ -0,0 +1,299 @@
+import Link from "next/link";
+import { useState, useEffect } from "react";
+import { useRouter } from "next/router";
+import useTranslation from "next-translate/useTranslation";
+import jsonpath from "jsonpath";
+import _ from "lodash";
+import {
+    Field,
+    FieldArray,
+    reduxForm,
+    formValueSelector,
+    reset,
+} from "redux-form";
+import { connect } from "react-redux";
+import { useDropzone } from "react-dropzone";
+
+import {
+    setRepresentationCapacity,
+    setRepresentationSubmit,
+    setSubmitBack,
+    setRepresentationSubmitConfirmation,
+} from "../../../store/currentView/action";
+import RepCapacitySelection from "./representationCapacitySelection";
+import RepDetails from "./representationDetails";
+import RepAppellant from "./representationAppellant";
+import RepAgent from "./representationAgent";
+import RepInterestedPartyPerson from "./representationInterestedPartyPerson";
+import RepLandOwner from "./representationLandowner";
+import RepCompleteSubmit from "./representationCompleteSubmit";
+
+import {
+    RenderPickList,
+    RenderRadioList,
+    RenderTextfield,
+} from "./representationElements";
+
+let MakeRepresentation = (props) => {
+    let { t } = useTranslation();
+    const { acceptedFiles, getRootProps, getInputProps } = useDropzone();
+
+    const [clearRepForm, setClearRepForm] = useState(false);
+
+    const router = useRouter();
+    const { locale } = router;
+    const {
+        caseReference,
+        myCases,
+        myRepresentations,
+        watchedCases,
+        awaitingSubmission,
+        searchResultsObj,
+        currentType,
+        currentView,
+        setRepresentationCapacity,
+        setRepresentationSubmit,
+        setSubmitBack,
+        handleSubmit,
+        setRepresentationSubmitConfirmation,
+    } = props;
+    const formObj = props.props.form;
+    let setCaseQueryObj = props[currentType];
+    var casesObj = {};
+
+    currentType == "searchResultsObj"
+        ? (casesObj = jsonpath.query(
+              setCaseQueryObj,
+              '$..[?(@.title=="' + caseReference + '")]'
+          ))
+        : (casesObj = jsonpath.query(
+              setCaseQueryObj,
+              '$..[?(@.reference=="' + caseReference + '")]'
+          ));
+
+    casesObj = Object.assign({}, ...casesObj);
+
+    const capacityOptionsArr = [
+        "Appellant",
+        "Agent",
+        "Interested Party/Person",
+        "Land Owner",
+    ];
+
+    const appellantApplicantRepresentationArr = [
+        "Other",
+        "Statement",
+        "Statement of common ground",
+        "Written statement of evidence",
+    ];
+
+    const interestedPersonRepresentationArr = [
+        "Interested Party/Person correspondence",
+    ];
+
+    const landOwnerRepresentationArr = [
+        "Other",
+        "Statement",
+        "Written statement of evidence",
+    ];
+
+    const repCapacityType = () => {
+        return _.isEmpty(formObj["representationForm"])
+            ? false
+            : _.isEmpty(formObj["representationForm"].values)
+            ? false
+            : _.isEmpty(
+                  formObj["representationForm"].values.representationCapacity
+              )
+            ? false
+            : formObj["representationForm"].values.representationCapacity
+                  .replace(/[\s\-\+\(\)\,\/]/g, "")
+                  .toLowerCase();
+    };
+
+    const whichControl = () => {
+        switch (currentView.representationCapacity) {
+            case false:
+                return (
+                    <RepCapacitySelection
+                        formObj={formObj}
+                        capacityOptionsArr={capacityOptionsArr}
+                        currentType={currentType}
+                        casesObj={casesObj}
+                        setRepresentationCapacity={setRepresentationCapacity}
+                        setRepresentationSubmit={setRepresentationSubmit}
+                        onHandleSubmit={onHandleSubmit}
+                        currentView={currentView}
+                        setSubmitBack={setSubmitBack}
+                    />
+                );
+                break;
+            case "appellant":
+                //setRepresentationCapacity("appellant");
+                return (
+                    <RepAppellant
+                        formObj={formObj}
+                        appellantApplicantRepresentationArr={
+                            appellantApplicantRepresentationArr
+                        }
+                        setRepresentationCapacity={setRepresentationCapacity}
+                        setRepresentationSubmit={setRepresentationSubmit}
+                        onHandleSubmit={onHandleSubmit}
+                        currentView={currentView}
+                        setSubmitBack={setSubmitBack}
+                    />
+                );
+                break;
+            case "agent":
+                //setRepresentationCapacity("agent");
+                return (
+                    <RepAgent
+                        formObj={formObj}
+                        appellantApplicantRepresentationArr={
+                            appellantApplicantRepresentationArr
+                        }
+                        setRepresentationCapacity={setRepresentationCapacity}
+                        setRepresentationSubmit={setRepresentationSubmit}
+                        onHandleSubmit={onHandleSubmit}
+                        currentView={currentView}
+                        setSubmitBack={setSubmitBack}
+                    />
+                );
+                break;
+            case "interestedpartyperson":
+                // setRepresentationCapacity("interestedpartyperson");
+                return (
+                    <RepInterestedPartyPerson
+                        formObj={formObj}
+                        interestedPersonRepresentationArr={
+                            interestedPersonRepresentationArr
+                        }
+                        setRepresentationCapacity={setRepresentationCapacity}
+                        setRepresentationSubmit={setRepresentationSubmit}
+                        onHandleSubmit={onHandleSubmit}
+                        currentView={currentView}
+                        setSubmitBack={setSubmitBack}
+                    />
+                );
+                break;
+            case "landowner":
+                //setRepresentationCapacity("landowner");
+                return (
+                    <RepLandOwner
+                        formObj={formObj}
+                        landOwnerRepresentationArr={landOwnerRepresentationArr}
+                        setRepresentationCapacity={setRepresentationCapacity}
+                        onHandleSubmit={onHandleSubmit}
+                        setRepresentationSubmit={setRepresentationSubmit}
+                        currentView={currentView}
+                        setSubmitBack={setSubmitBack}
+                    />
+                );
+                break;
+            default:
+                return (
+                    <RepCapacitySelection
+                        formObj={formObj}
+                        capacityOptionsArr={capacityOptionsArr}
+                        currentType={currentType}
+                        casesObj={casesObj}
+                        setRepresentationCapacity={setRepresentationCapacity}
+                        setRepresentationSubmit={setRepresentationSubmit}
+                        currentView={currentView}
+                        setSubmitBack={setSubmitBack}
+                    />
+                );
+        }
+    };
+
+    const onHandleSubmit = (values) => {
+        console.log(
+            values.representationCapacity,
+            currentView.representationCapacity
+        );
+
+        // console.log(_.isEmpty(currentView.representationCapacity));
+        // console.log(
+        //     values.representationCapacity
+        //         .replace(/[\s\-\+\(\)\,\/]/g, "")
+        //         .toLowerCase() == currentView.representationCapacity
+        // );
+
+        _.isEmpty(currentView.representationCapacity)
+            ? setRepresentationCapacity(
+                  values.representationCapacity
+                      .replace(/[\s\-\+\(\)\,\/]/g, "")
+                      .toLowerCase()
+              )
+            : setRepresentationSubmit(true);
+    };
+
+    const repForm = props.props.form;
+
+    return (
+        <div>
+            {repForm["representationForm.submitSucceeded"] == true ? (
+                <RepCompleteSubmit
+                    formObj={formObj}
+                    capacityOptionsArr={capacityOptionsArr}
+                    currentType={currentType}
+                    casesObj={casesObj}
+                    setRepresentationCapacity={setRepresentationCapacity}
+                    setRepresentationSubmit={setRepresentationSubmit}
+                    currentView={currentView}
+                    setSubmitBack={setSubmitBack}
+                    setRepresentationSubmitConfirmation={
+                        setRepresentationSubmitConfirmation
+                    }
+                />
+            ) : (
+                <form onSubmit={handleSubmit(onHandleSubmit)}>
+                    {whichControl()}
+                </form>
+            )}
+
+            {console.log("is submitted", currentView.representationSubmit)}
+        </div>
+    );
+};
+
+const mapStateToProps = (state) => {
+    return {
+        search: state.search,
+        searchResultsObj: state.searchResultsObj,
+        formData: state.formData,
+        appealType: state.appealType,
+        currentView: state.currentView,
+        //form: state.form,
+    };
+};
+
+const mapDispatchToProps = (dispatch) => {
+    return {
+        setRepresentationCapacity: (representationCapacity) => {
+            dispatch(setRepresentationCapacity(representationCapacity));
+            dispatch(reset("representationForm"));
+        },
+        setRepresentationSubmit: (representationSubmit) => {
+            dispatch(setRepresentationSubmit(representationSubmit));
+        },
+        setSubmitBack: () => {
+            dispatch(setRepresentationSubmit(false));
+        },
+        setRepresentationSubmitConfirmation: () => {
+            dispatch(setRepresentationSubmitConfirmation(true));
+        },
+    };
+};
+
+const selector = formValueSelector("representationForm");
+
+export default connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(
+    reduxForm({
+        form: "representationForm",
+        destroyOnUnmount: false,
+    })(MakeRepresentation)
+);