apply GEL to reps

components/case/representation/representationAppellant.js

@@ -3,6 +3,7 @@ import { useRouter } from "next/router";
 import React from "react";
 import { connect } from "react-redux";
 import { Field, change, reduxForm } from "redux-form";
+import { useState } from "react";
 
 import { bytesToSize, getThumbnailIconByExtension } from "../../utils";
 import {
@@ -31,6 +32,7 @@ const RepAppellant = (props) => {
         setRepFileName,
     } = props;
     const { acceptedFiles, getRootProps, getInputProps } = useDropzone();
+    const [savingStatus, setSavingStatus] = useState(false);
 
     setRepFileName(formObj.representationForm.values);
 
@@ -53,7 +55,6 @@ const RepAppellant = (props) => {
                             >
                                 {t("myrepresentations:kind-of-rep-label")}
                             </label>
-
                             <Field
                                 name="representationType"
                                 component={RenderPickList}
@@ -193,7 +194,7 @@ const RepAppellant = (props) => {
                         >
                             {t("common:continue-button")}
                         </button>
-                        {router.query.state != "edit" && (
+                        {/* {router.query.state != "edit" && (
                             <a
                                 onClick={() => {
                                     setRepresentationCapacity();
@@ -207,6 +208,45 @@ const RepAppellant = (props) => {
                             >
                                 {t("common:back-link")}
                             </a>
+                        )} */}
+
+                        {savingStatus ? (
+                            <span className=" progress-save-active">
+                                {router.locale == "cy"
+                                    ? "Nôl data"
+                                    : "Saving data"}
+                                <img
+                                    className="data-loading-icon"
+                                    src="/assets/images/loading.gif"
+                                    alt={
+                                        router.locale == "cy"
+                                            ? "Nôl data"
+                                            : "Saving data"
+                                    }
+                                />
+                            </span>
+                        ) : (
+                            <button
+                                className="govuk-button progress-save "
+                                onClick={() => {
+                                    let valuesObj =
+                                        props.props.form[props.form].values ||
+                                        {};
+
+                                    console.log("valuesobj:", valuesObj);
+
+                                    delete valuesObj["_pinswg_appellant_value"];
+
+                                    console.log("on save:", valuesObj);
+                                    updateRepresentation(
+                                        valuesObj,
+                                        false,
+                                        true
+                                    );
+                                }}
+                            >
+                                {t("common:save-exit-button")}
+                            </button>
                         )}
                     </div>
                 </div>