From 89f1691c8f5ab1aa8557de806cbf4b6c176ab93f Mon Sep 17 00:00:00 2001
From: rdbsolutions <rob@rdbsolutions.co.uk>
Date: Wed, 11 Jun 2025 18:26:14 +0100
Subject: [PATCH] 16580 contact fields for owners and tenants

---
 components/elements/index.js          | 118 ++++++++++++++++++--------
 components/newappeal/buildcheckrow.js |  17 ++--
 locales/cy/newappeal.json             |   3 +-
 locales/en/newappeal.json             |   3 +-
 4 files changed, 99 insertions(+), 42 deletions(-)

diff --git a/components/elements/index.js b/components/elements/index.js
index 931edf43..3fcdda03 100644
--- a/components/elements/index.js
+++ b/components/elements/index.js
@@ -748,7 +748,7 @@ const RenderDatePicker = ({
                                     : value
                                 : null
                         } //{parseISO(value) || null}
-                        className="govuk-input govuk-input--width-10"
+                        className="govuk-input govuk-input--width-12"
                         minDate={minDate}
                         maxDate={maxDate}
                         autoComplete="off"
@@ -2179,7 +2179,8 @@ const RenderFileUpload = (field) => {
                     ).then((data) => {
                         console.log(data);
                         let buildAppealFilesArray = [];
-                        let values = field.form.appealForm.values;
+                        //let values = field.form.appealForm.values;
+                        let values = field.props.form.appealForm.values;
                         let filesUploadObj = renamedAcceptedFiles;
 
                         for (let key in filesUploadObj) {
@@ -2434,6 +2435,18 @@ const RenderSubFields = ({ fields, meta: { touched, error }, ...custom }) => {
     const required = (value) =>
         value ? undefined : t("newappeal:is-required-label");
 
+    const email = (value) => {
+        let errors;
+
+        const emailRegex =
+            /(?:[a-z0-9!#$%&'*+\/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+\/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/gi;
+
+        if (!emailRegex.test(value)) {
+            errors = t("newappeal:invalid-email-address-errormsg");
+        }
+        return errors;
+    };
+
     //fields.push({});
     fields.length == 0 && fields.push({});
     return (
@@ -2445,40 +2458,75 @@ const RenderSubFields = ({ fields, meta: { touched, error }, ...custom }) => {
                     </h4>
 
                     <div className="fieldArrayContainer">
-                        <Field
-                            id={`${member}.${fields.name}`}
-                            name={`${member}.${fields.name}`}
-                            type="text"
-                            component={RenderTextfield}
-                            validate={[checkValue]}
-                            label={
-                                subTitle == "owners"
-                                    ? "Owner name"
-                                    : "Tenant name"
-                            }
-                            className="govuk-input govuk-input--width-10"
-                            showErrorBottom={true}
-                        />
-                        <Field
-                            name={`${member}.dateserved`}
-                            type="text"
-                            component={RenderDatePicker}
-                            label="Date served "
-                            dateStart={"-6m"}
-                            dateEnd={"0"}
-                            validate={[required]}
-                            className="govuk-input govuk-input--width-10"
-                            showErrorBottom={true}
-                        />
-
-                        <button
-                            type="button"
-                            title="Remove"
-                            onClick={() => fields.remove(index)}
-                            className="govuk-button fieldArrayDelete"
+                        <div className="govuk-grid-column-full">
+                            <div
+                                className="gouk-grid-row"
+                                style={{
+                                    display: "flex",
+                                    marginBottom: "20px",
+                                }}
+                            >
+                                <Field
+                                    id={`${member}.${fields.name}_firstname`}
+                                    name={`${member}.${fields.name}_firstname`}
+                                    type="text"
+                                    component={RenderTextfield}
+                                    validate={[checkValue]}
+                                    label={"First name"}
+                                    className="govuk-input govuk-input--width-12"
+                                    showErrorBottom={true}
+                                />
+                                <Field
+                                    id={`${member}.${fields.name}_lastname`}
+                                    name={`${member}.${fields.name}_lastname`}
+                                    type="text"
+                                    component={RenderTextfield}
+                                    validate={[checkValue]}
+                                    label={"Last name"}
+                                    className="govuk-input govuk-input--width-12"
+                                    showErrorBottom={true}
+                                />
+                            </div>
+                            <div
+                                className="gouk-grid-row"
+                                style={{ display: "flex" }}
+                            >
+                                <Field
+                                    id={`${member}.${fields.name}_email`}
+                                    name={`${member}.${fields.name}_email`}
+                                    type="text"
+                                    component={RenderTextfield}
+                                    validate={[email]}
+                                    label={"Email"}
+                                    className="govuk-input govuk-input--width-12"
+                                    showErrorBottom={true}
+                                />
+                                <Field
+                                    name={`${member}.dateserved`}
+                                    type="text"
+                                    component={RenderDatePicker}
+                                    label="Date served "
+                                    dateStart={"-6m"}
+                                    dateEnd={"0"}
+                                    validate={[required]}
+                                    className="govuk-input govuk-input--width-12"
+                                    showErrorBottom={true}
+                                />
+                            </div>
+                        </div>
+                        <div
+                            className="gouk-grid-row"
+                            style={{ display: "flex" }}
                         >
-                            X
-                        </button>
+                            <button
+                                type="button"
+                                title="Remove"
+                                onClick={() => fields.remove(index)}
+                                className="govuk-button fieldArrayDelete"
+                            >
+                                X
+                            </button>
+                        </div>
                     </div>
                 </div>
             ))}
diff --git a/components/newappeal/buildcheckrow.js b/components/newappeal/buildcheckrow.js
index 3934ed05..bfdc866b 100644
--- a/components/newappeal/buildcheckrow.js
+++ b/components/newappeal/buildcheckrow.js
@@ -317,11 +317,11 @@ let BuildCheckRow = (props) => {
                                             datafieldname[0].value
                                         ].map((tenant, index) => {
                                             console.log(
-                                                typeof tenant.pinswg_owners
+                                                typeof tenant.pinswg_owners_firstname
                                             );
-                                            return typeof tenant.pinswg_owners !=
+                                            return typeof tenant.pinswg_owners_firstname !=
                                                 "undefined" ||
-                                                typeof tenant.pinswg_agriculturaltenantname !=
+                                                typeof tenant.pinswg_agriculturaltenantname_firstname !=
                                                     "undefined" ? (
                                                 <div
                                                     key={index}
@@ -330,8 +330,15 @@ let BuildCheckRow = (props) => {
                                                     }}
                                                 >
                                                     <div className="govuk-!-width-one-half">
-                                                        {tenant.pinswg_agriculturaltenantname ||
-                                                            tenant.pinswg_owners}
+                                                        {tenant?.pinswg_agriculturaltenantname_firstname &&
+                                                            tenant.pinswg_agriculturaltenantname_firstname +
+                                                                " " +
+                                                                tenant.pinswg_agriculturaltenantname_lastname}
+
+                                                        {tenant?.pinswg_owners_firstname &&
+                                                            tenant.pinswg_owners_firstname +
+                                                                " " +
+                                                                tenant.pinswg_owners_lastname}
                                                     </div>
                                                     <div className="govuk-!-width-one-half">
                                                         Served:{" "}
diff --git a/locales/cy/newappeal.json b/locales/cy/newappeal.json
index 3fc577ac..a7ff3284 100644
--- a/locales/cy/newappeal.json
+++ b/locales/cy/newappeal.json
@@ -119,5 +119,6 @@
     "previously-added-files": "Ffeiliau wedi'u llwytho i fyny",
     "new-appeal-finalising-heading": "Cwblhau cyflwyniad eich apêl",
     "new-appeal-finalising-label": "Wrthi'n uwchlwytho ffeiliau ar hyn o bryd a chwblhau eich cyflwyniad apêl",
-    "new-appeal-wait-label": "Arhoswch os gwelwch yn dda"
+    "new-appeal-wait-label": "Arhoswch os gwelwch yn dda",
+    "invalid-email-address-errormsg": "Cyfeiriad e-bost annilys"
 }
\ No newline at end of file
diff --git a/locales/en/newappeal.json b/locales/en/newappeal.json
index 0dbdb358..7efe0599 100644
--- a/locales/en/newappeal.json
+++ b/locales/en/newappeal.json
@@ -119,5 +119,6 @@
     "previously-added-files": "Uploaded files",
     "new-appeal-finalising-heading": "Finalising your appeal submission",
     "new-appeal-finalising-label": "Currently uploading files and finalising your appeal submission",
-    "new-appeal-wait-label": "Please wait"
+    "new-appeal-wait-label": "Please wait",
+    "invalid-email-address-errormsg": "Invalid email address"
 }
\ No newline at end of file