robbond/pedwfrontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged PR 2240: refactor(newappeal): simplify nested prop boundaries (Slice 7)

Browse Source 
refactor(newappeal): simplify nested prop boundaries (Slice 7)

Related work items: #22588
This commit is contained in:
Robert Bond
2026-04-13 12:25:45 +00:00
parent 783786b9eb
commit ffcccf8981
7 changed files with 98 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/newappeal/buildcheckrow.js
+45 -43
View File
@@ -27,6 +27,9 @@ import {
let BuildCheckRow = (props) => { let BuildCheckRow = (props) => {
let { t } = useTranslation(); let { t } = useTranslation();
const legacyProps = props.props;
const legacyFormState = legacyProps.form;
const legacyFormData = legacyProps.formData;
const router = useRouter(); const router = useRouter();
const { locale } = router; const { locale } = router;
@@ -140,7 +143,7 @@ let BuildCheckRow = (props) => {
// ) { // ) {
const fieldTypeValue = fieldtype[0].value; const fieldTypeValue = fieldtype[0].value;
const fieldValue = const fieldValue =
props.props.form["appealForm"].values[ legacyFormState["appealForm"].values[
datafieldname[0].value datafieldname[0].value
]; ];
@@ -190,7 +193,8 @@ let BuildCheckRow = (props) => {
{getDocumentTypeFromFilename( {getDocumentTypeFromFilename(
blob.name blob.name
) === ) ===
documentTypeCode[0].value && ( documentTypeCode[0]
.value && (
<div <div
style={{ style={{
display: "flex", display: "flex",
@@ -230,44 +234,42 @@ let BuildCheckRow = (props) => {
); );
const renderTenantValue = () => const renderTenantValue = () =>
typeof fieldValue != "undefined" && fieldValue != null ? ( typeof fieldValue != "undefined" && fieldValue != null
fieldValue.map((tenant, index) => { ? fieldValue.map((tenant, index) => {
console.log( console.log(
typeof tenant.pinswg_owners_firstname typeof tenant.pinswg_owners_firstname
); );
return typeof tenant.pinswg_owners_firstname != return typeof tenant.pinswg_owners_firstname !=
"undefined" || "undefined" ||
typeof tenant.pinswg_agriculturaltenantname_firstname != typeof tenant.pinswg_agriculturaltenantname_firstname !=
"undefined" ? ( "undefined" ? (
<div <div
key={index} key={index}
style={{ style={{
display: "flex" display: "flex"
}} }}
> >
<div className="govuk-!-width-one-half"> <div className="govuk-!-width-one-half">
{tenant?.pinswg_agriculturaltenantname_firstname && {tenant?.pinswg_agriculturaltenantname_firstname &&
tenant.pinswg_agriculturaltenantname_firstname + tenant.pinswg_agriculturaltenantname_firstname +
" " + " " +
tenant.pinswg_agriculturaltenantname_lastname} tenant.pinswg_agriculturaltenantname_lastname}
{tenant?.pinswg_owners_firstname && {tenant?.pinswg_owners_firstname &&
tenant.pinswg_owners_firstname + tenant.pinswg_owners_firstname +
" " + " " +
tenant.pinswg_owners_lastname} tenant.pinswg_owners_lastname}
</div> </div>
<div className="govuk-!-width-one-half"> <div className="govuk-!-width-one-half">
Served:{" "} Served:{" "}
{formatDate(tenant.dateserved)} {formatDate(tenant.dateserved)}
</div> </div>
</div> </div>
) : ( ) : (
"" ""
); );
}) })
) : ( : "N/A";
"N/A"
);
const formatterMap = { const formatterMap = {
"{E0DECE4B-6666-4a8f-A065-082708572369}": () => ( "{E0DECE4B-6666-4a8f-A065-082708572369}": () => (
@@ -281,13 +283,13 @@ let BuildCheckRow = (props) => {
formatDate(fieldValue), formatDate(fieldValue),
"{3EF39988-22BB-4f0b-BBBE-64B5A3748AEE}": () => "{3EF39988-22BB-4f0b-BBBE-64B5A3748AEE}": () =>
getPickListLabel( getPickListLabel(
props.props.formData.pickListData, legacyFormData.pickListData,
datafieldname[0].value, datafieldname[0].value,
fieldValue fieldValue
), ),
"{07FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}": () => "{07FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}": () =>
getRadioLabel( getRadioLabel(
props.props.formData.pickListData, legacyFormData.pickListData,
datafieldname[0].value, datafieldname[0].value,
fieldValue fieldValue
), ),
@@ -297,8 +299,8 @@ let BuildCheckRow = (props) => {
? "Nac ydw" ? "Nac ydw"
: "No" : "No"
: router.locale == "cy" : router.locale == "cy"
? "Oes" ? "Oes"
: "Yes", : "Yes",
"{16D63FD6-119B-4353-BDCA-18358721C3FE}": "{16D63FD6-119B-4353-BDCA-18358721C3FE}":
renderFileUploadValue, renderFileUploadValue,
"{0273EDBD-AC1D-40d3-9FB2-095C621B552D}": "{0273EDBD-AC1D-40d3-9FB2-095C621B552D}":
components/newappeal/buildchecksection.js
+13 -8
View File
@@ -55,6 +55,11 @@ let BuildCheckSection = (props) => {
docsOffline docsOffline
} = props; } = props;
const legacyProps = props.props;
const legacyAppealType = legacyProps.appealType;
const legacyFormState = legacyProps.form;
const legacyAccountDetails = legacyProps.accountDetails;
const parser = new DOMParser(); const parser = new DOMParser();
var doc = parser.parseFromString(props.formXML, "text/xml"); var doc = parser.parseFromString(props.formXML, "text/xml");
var titles = xpath.select( var titles = xpath.select(
@@ -89,7 +94,7 @@ let BuildCheckSection = (props) => {
let buildAppealFilesArray = []; let buildAppealFilesArray = [];
//console.log("attached docs: - ", buildAppealFilesArray); //console.log("attached docs: - ", buildAppealFilesArray);
buildAppealFilesArray = props.props.appealType.fileList?.value[0] || []; buildAppealFilesArray = legacyAppealType.fileList?.value[0] || [];
//let filesUploadObj = buildAppealFilesArray; //let filesUploadObj = buildAppealFilesArray;
// let filesUploadObj = props.appealType.fileList.hasOwnProperty("value") // let filesUploadObj = props.appealType.fileList.hasOwnProperty("value")
// ? props.appealType.fileList.value[0] // ? props.appealType.fileList.value[0]
@@ -113,13 +118,13 @@ let BuildCheckSection = (props) => {
"name" "name"
); );
let pdfObj = props.props.form.appealForm.values; let pdfObj = legacyFormState.appealForm.values;
pdfObj = updateLinks(pdfObj); pdfObj = updateLinks(pdfObj);
Object.assign(pdfObj, { Object.assign(pdfObj, {
"filesList": buildAppealFilesArray, "filesList": buildAppealFilesArray,
"containerID": props.props.accountDetails.containerID, "containerID": legacyAccountDetails.containerID,
"casefolderID": props.appealType.caseReference.ticketnumber "casefolderID": props.appealType.caseReference.ticketnumber
}); });
@@ -162,7 +167,7 @@ let BuildCheckSection = (props) => {
? (setFinaliseAppealProcess(true), ? (setFinaliseAppealProcess(true),
await generateAppealPDFEffect( await generateAppealPDFEffect(
pdfObj, pdfObj,
props.props.accountDetails.containerID, legacyAccountDetails.containerID,
props.appealType.caseReference.ticketnumber, props.appealType.caseReference.ticketnumber,
router.query.appealtypes, router.query.appealtypes,
pdfObj.filesList pdfObj.filesList
@@ -171,9 +176,9 @@ let BuildCheckSection = (props) => {
.then((data) => { .then((data) => {
console.log("have generated pdf:", data); console.log("have generated pdf:", data);
sendCaseCompleteMessageEffect( sendCaseCompleteMessageEffect(
props.props.accountDetails.containerID, legacyAccountDetails.containerID,
props.appealType.caseReference.ticketnumber, props.appealType.caseReference.ticketnumber,
props.props.accountDetails.accountDetails legacyAccountDetails.accountDetails
.pinswg_typeofinvolvement .pinswg_typeofinvolvement
); );
}) })
@@ -202,8 +207,8 @@ let BuildCheckSection = (props) => {
const containerID = const containerID =
props.accountDetails?.containerID || props.accountDetails?.containerID ||
props.props?.accountDetails?.containerID || legacyProps?.accountDetails?.containerID ||
props.props?.props?.accountDetails?.containerID; legacyProps?.props?.accountDetails?.containerID;
const caseRef = const caseRef =
props?.currentView?.caseReference?.ticketnumber || props?.currentView?.caseReference?.ticketnumber ||
props?.appealType?.caseReference?.ticketnumber; props?.appealType?.caseReference?.ticketnumber;
components/newappeal/buildfield.js
+1 -1
View File
@@ -209,7 +209,7 @@ export default function BuildField(props) {
uploadCount={uploadCount} uploadCount={uploadCount}
setFileCount={setFileCount} setFileCount={setFileCount}
setUploadCount={setUploadCount} setUploadCount={setUploadCount}
props={props?.props?.props?.props} props={pageProps}
/> />
</div> </div>
), ),
components/newappeal/buildrow.js
+7 -5
View File
@@ -23,6 +23,8 @@ import {
export default function BuildRow(props) { export default function BuildRow(props) {
let { t } = useTranslation(); let { t } = useTranslation();
const legacyProps = props.props;
const legacyPageProps = legacyProps.props;
const router = useRouter(); const router = useRouter();
const { locale } = router; const { locale } = router;
@@ -128,7 +130,7 @@ export default function BuildRow(props) {
key={key} key={key}
props={props} props={props}
picklistData={ picklistData={
props.props.props.formData.pickListData legacyPageProps.formData.pickListData
} }
mandatoryFieldsData={mandatoryFieldsData} mandatoryFieldsData={mandatoryFieldsData}
documentTypeCode={documentTypeCode} documentTypeCode={documentTypeCode}
@@ -158,7 +160,7 @@ export default function BuildRow(props) {
key={key} key={key}
props={props} props={props}
picklistData={ picklistData={
props.props.props.formData.pickListData legacyPageProps.formData.pickListData
} }
mandatoryFieldsData={mandatoryFieldsData} mandatoryFieldsData={mandatoryFieldsData}
hint={hint} hint={hint}
@@ -168,13 +170,13 @@ export default function BuildRow(props) {
maxFieldLength={maxFieldLength} maxFieldLength={maxFieldLength}
dateStart={dateStart} dateStart={dateStart}
dateEnd={dateEnd} dateEnd={dateEnd}
setDocumentsList={props.props.setDocumentsList} setDocumentsList={legacyProps.setDocumentsList}
documentList={ documentList={
props.props.appealType.documentList legacyProps.appealType.documentList
} }
documentTypeCode={documentTypeCode} documentTypeCode={documentTypeCode}
setFilesForAppeal={ setFilesForAppeal={
props.props.setFilesForAppeal legacyProps.setFilesForAppeal
} }
maxSubField={maxSubField} maxSubField={maxSubField}
setFileCount={setFileCount} setFileCount={setFileCount}
components/newappeal/buildsection.js
+18 -13
View File
@@ -72,6 +72,12 @@ let BuildSection = (props) => {
mandatoryFieldsData mandatoryFieldsData
} = props; } = props;
const legacyProps = props.props;
const legacyAccountDetails = legacyProps.accountDetails;
const legacyFormState = legacyProps.form;
const legacyAppealType = legacyProps.appealType;
const legacyUrl = legacyProps.url;
const documentListObj = props.appealType.documentList; const documentListObj = props.appealType.documentList;
const currentSection = props.appealType.currentSection; const currentSection = props.appealType.currentSection;
@@ -130,8 +136,8 @@ let BuildSection = (props) => {
await uploadAppealFilesEffect( await uploadAppealFilesEffect(
dataObj, dataObj,
fileListObj, fileListObj,
props.props.accountDetails.containerID, legacyAccountDetails.containerID,
props.props.appealType.caseReference.ticketnumber legacyAppealType.caseReference.ticketnumber
).then((data) => { ).then((data) => {
//console.log("$1", data); //console.log("$1", data);
setCompletedUploadFiles(true); setCompletedUploadFiles(true);
@@ -223,7 +229,7 @@ let BuildSection = (props) => {
Object.assign(updateBody, { Object.assign(updateBody, {
"pinswg_appealcasetype": props.appealType.appealTypeID, "pinswg_appealcasetype": props.appealType.appealTypeID,
"pinswg_Appellant@odata.bind": "pinswg_Appellant@odata.bind":
"/contacts(" + props.props.accountDetails.loggedinUserId + ")", "/contacts(" + legacyAccountDetails.loggedinUserId + ")",
"pinswg_name": props.appealType.caseReference.ticketnumber, "pinswg_name": props.appealType.caseReference.ticketnumber,
[updateBindAppealTypeToIncident + "@odata.bind"]: [updateBindAppealTypeToIncident + "@odata.bind"]:
"/incidents(" + incidentId + ")" "/incidents(" + incidentId + ")"
@@ -241,12 +247,12 @@ let BuildSection = (props) => {
const reference = "PEDW-PARTIAL"; const reference = "PEDW-PARTIAL";
const templateId = "021b0a7b-df00-41f1-b94e-c269bee98c75"; const templateId = "021b0a7b-df00-41f1-b94e-c269bee98c75";
const templateIdCY = "f3c4a56b-bfb8-4d39-97dd-888df3062b0a"; const templateIdCY = "f3c4a56b-bfb8-4d39-97dd-888df3062b0a";
const emailAddress = props.props.accountDetails.loggedinUserEmail; const emailAddress = legacyAccountDetails.loggedinUserEmail;
const personalisation = { const personalisation = {
"caseReference": props.appealType.caseReference.ticketnumber, "caseReference": props.appealType.caseReference.ticketnumber,
"emailAddress": props.props.accountDetails.loggedinUserEmail, "emailAddress": legacyAccountDetails.loggedinUserEmail,
"returnLink": "returnLink":
props.props.url + legacyUrl +
(router.locale != "en" ? "/cy/fymhorth/" : "/myportal/") + (router.locale != "en" ? "/cy/fymhorth/" : "/myportal/") +
appTypeCollection.UrlName + appTypeCollection.UrlName +
"?lpa=" + "?lpa=" +
@@ -354,7 +360,7 @@ let BuildSection = (props) => {
const [hasErrors, setHasErrors] = useState(""); const [hasErrors, setHasErrors] = useState("");
const getErrors = () => { const getErrors = () => {
let errorsobj = props.props.form["appealForm"]; let errorsobj = legacyFormState["appealForm"];
//setHasErrors(errorsobj.hasOwnProperty("syncErrors")); //setHasErrors(errorsobj.hasOwnProperty("syncErrors"));
window.scrollTo(0, 0); window.scrollTo(0, 0);
}; };
@@ -385,7 +391,7 @@ let BuildSection = (props) => {
}; };
const hasUploadFiles = () => { const hasUploadFiles = () => {
const formArr = props.props.form["appealForm"].values; const formArr = legacyFormState["appealForm"].values;
const prefix = "pinswg_fileUpload"; const prefix = "pinswg_fileUpload";
const hasFiles = Object.keys(formArr).some((key) => const hasFiles = Object.keys(formArr).some((key) =>
key.startsWith(prefix) key.startsWith(prefix)
@@ -431,11 +437,10 @@ let BuildSection = (props) => {
onClick={() => { onClick={() => {
getErrors(); getErrors();
let valuesObj = _.has( let valuesObj = _.has(
props.props.form[props.form], legacyFormState[props.form],
"values" "values"
) )
? props.props.form[props.form] ? legacyFormState[props.form].values
.values
: {}; : {};
//console.log("valuesobj:", valuesObj); //console.log("valuesobj:", valuesObj);
@@ -470,7 +475,7 @@ let BuildSection = (props) => {
className="govuk-button progress-save " className="govuk-button progress-save "
onClick={() => { onClick={() => {
let valuesObj = let valuesObj =
props.props.form[props.form] legacyFormState[props.form]
.values || {}; .values || {};
// console.log( // console.log(
@@ -532,7 +537,7 @@ let BuildSection = (props) => {
className="govuk-button progress-save " className="govuk-button progress-save "
onClick={() => { onClick={() => {
let valuesObj = let valuesObj =
props.props.form[props.form] legacyFormState[props.form]
.values || {}; .values || {};
// console.log( // console.log(
components/newappeal/complete.js
+12 -8
View File
@@ -10,9 +10,13 @@ import { setCurrentSection } from "../../store/appealType/action";
import { getFormCollectionByID } from "../utils"; import { getFormCollectionByID } from "../utils";
let CompleteAppeal = (props) => { let CompleteAppeal = (props) => {
const legacyProps = props.props;
const legacyFormState = legacyProps.form;
const legacyAccountDetails = legacyProps.accountDetails;
useEffect(() => { useEffect(() => {
let incidentId = props.appealType.caseReference.incidentid; let incidentId = props.appealType.caseReference.incidentid;
let updateBody = props.props.form.appealForm.values; let updateBody = legacyFormState.appealForm.values;
let appTypeCollection = getFormCollectionByID( let appTypeCollection = getFormCollectionByID(
props.appealType.appealTypeID props.appealType.appealTypeID
@@ -24,7 +28,7 @@ let CompleteAppeal = (props) => {
Object.assign(updateBody, { Object.assign(updateBody, {
"pinswg_Appellant@odata.bind": "pinswg_Appellant@odata.bind":
"/contacts(" + props.props.accountDetails.loggedinUserId + ")", "/contacts(" + legacyAccountDetails.loggedinUserId + ")",
"pinswg_LocalPlanningAuthority@odata.bind": "pinswg_LocalPlanningAuthority@odata.bind":
"/accounts(" + props.appealType.appealLPA + ")", "/accounts(" + props.appealType.appealLPA + ")",
"pinswg_name": props.appealType.caseReference.ticketnumber, "pinswg_name": props.appealType.caseReference.ticketnumber,
@@ -44,10 +48,10 @@ let CompleteAppeal = (props) => {
: "618e0463-b092-4733-a024-bf8a3bbde808"; : "618e0463-b092-4733-a024-bf8a3bbde808";
const reference = "PEDW-COMPLETE" + isWelsh && "-CY"; const reference = "PEDW-COMPLETE" + isWelsh && "-CY";
const emailAddress = props.props.accountDetails.loggedinUserEmail; const emailAddress = legacyAccountDetails.loggedinUserEmail;
const personalisation = { const personalisation = {
"caseReference": props.appealType.caseReference.ticketnumber, "caseReference": props.appealType.caseReference.ticketnumber,
"emailAddress": props.props.accountDetails.loggedinUserEmail, "emailAddress": legacyAccountDetails.loggedinUserEmail,
"linkExpiry": 10 * 60 "linkExpiry": 10 * 60
}; };
sendCompletionEmailEffect( sendCompletionEmailEffect(
@@ -68,12 +72,12 @@ let CompleteAppeal = (props) => {
window.scrollTo({ top: 0, behavior: "smooth" }); window.scrollTo({ top: 0, behavior: "smooth" });
}, [ }, [
props.appealType.caseReference, props.appealType.caseReference,
props.props.form.appealForm.values, legacyFormState.appealForm.values,
props.appealType.appealLPA, props.appealType.appealLPA,
props.props.accountDetails.loggedinUserId, legacyAccountDetails.loggedinUserId,
props.appealType.appealTypeID, props.appealType.appealTypeID,
props.props.accountDetails.loggedinUserEmail, legacyAccountDetails.loggedinUserEmail,
props.props.accountDetails.containerID legacyAccountDetails.containerID
]); ]);
let { t } = useTranslation(); let { t } = useTranslation();
context/refactor-tracker.md
+2 -2
View File
@@ -4,7 +4,7 @@ Base branch for this tracker: `refactor`
## Status ## Status
Current slice: Slice 7 — Props Boundary Cleanup Current slice: Slice 8 — Start Flow Cleanup (CreateCase / AboutYou)
Status: READY TO START Status: READY TO START
--- ---
@@ -68,7 +68,7 @@ Status: COMPLETE
### Slice 7 — Props Boundary Cleanup ### Slice 7 — Props Boundary Cleanup
Status: NOT STARTED Status: COMPLETE
--- ---