Merged PR 2239: refactor(newappeal): replace BuildCheckRow formatter chain with map (Slice 6)
refactor(newappeal): replace BuildCheckRow formatter chain with map (Slice 6) Related work items: #22587
This commit is contained in:
Robert Bond
@@ -138,72 +138,59 @@ let BuildCheckRow = (props) => {
|
|||||||
// datafieldname[0].value
|
// datafieldname[0].value
|
||||||
// ] != "undefined"
|
// ] != "undefined"
|
||||||
// ) {
|
// ) {
|
||||||
return (
|
const fieldTypeValue = fieldtype[0].value;
|
||||||
<div className="govuk-summary-list__row" key={key}>
|
const fieldValue =
|
||||||
<dt className="govuk-summary-list__key">
|
props.props.form["appealForm"].values[
|
||||||
{FieldsTranslations(rows[0].value)}
|
datafieldname[0].value
|
||||||
</dt>
|
];
|
||||||
|
|
||||||
<dd className="govuk-summary-list__value">
|
const renderFileUploadValue = () => (
|
||||||
{fieldtype[0].value ==
|
<>
|
||||||
"{E0DECE4B-6666-4a8f-A065-082708572369}" ? (
|
{props.filesArray.map((blob, i) => (
|
||||||
<div
|
<div key={i}>
|
||||||
dangerouslySetInnerHTML={{
|
{getDocumentTypeFromFilename(blob.name) ===
|
||||||
__html: props.props.form[
|
documentTypeCode[0].value && (
|
||||||
"appealForm"
|
<div
|
||||||
].values[datafieldname[0].value]
|
style={{
|
||||||
}}
|
display: "flex",
|
||||||
/>
|
alignItems: "flex-start"
|
||||||
) : fieldtype[0].value ==
|
}}
|
||||||
"{5B773807-9FB2-42db-97C3-7A91EFF8ADFF}" ? (
|
className="govuk-!-margin-bottom-2"
|
||||||
formatDate(
|
>
|
||||||
props.props.form["appealForm"].values[
|
<img
|
||||||
datafieldname[0].value
|
style={{
|
||||||
]
|
minWidth: "50",
|
||||||
)
|
width: "50"
|
||||||
) : fieldtype[0].value ==
|
}}
|
||||||
"{3EF39988-22BB-4f0b-BBBE-64B5A3748AEE}" ? (
|
src={getThumbnailIconByExtension(
|
||||||
getPickListLabel(
|
blob.name
|
||||||
props.props.formData.pickListData,
|
)}
|
||||||
datafieldname[0].value,
|
alt={blob.name}
|
||||||
props.props.form["appealForm"].values[
|
width="50"
|
||||||
datafieldname[0].value
|
/>
|
||||||
]
|
<span
|
||||||
)
|
style={{
|
||||||
) : fieldtype[0].value ==
|
maxWidth: "85%"
|
||||||
"{07FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}" ? (
|
}}
|
||||||
getRadioLabel(
|
className="govuk-body govuk-!-font-size-14 govuk-!-margin-left-2"
|
||||||
props.props.formData.pickListData,
|
>
|
||||||
datafieldname[0].value,
|
{blob.name} -{" "}
|
||||||
props.props.form["appealForm"].values[
|
{bytesToSize(blob.size)}{" "}
|
||||||
datafieldname[0].value
|
</span>
|
||||||
]
|
</div>
|
||||||
)
|
)}
|
||||||
) : fieldtype[0].value ==
|
</div>
|
||||||
"{67FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}" ? (
|
))}
|
||||||
props.props.form["appealForm"].values[
|
<br />
|
||||||
datafieldname[0].value
|
{typeof fieldValue != "undefined" &&
|
||||||
] == "false" ? (
|
fieldValue.map(
|
||||||
router.locale == "cy" ? (
|
(blob, i) =>
|
||||||
"Nac ydw"
|
isObjectAndNotEmpty(blob) && (
|
||||||
) : (
|
|
||||||
"No"
|
|
||||||
)
|
|
||||||
) : router.locale == "cy" ? (
|
|
||||||
"Oes"
|
|
||||||
) : (
|
|
||||||
"Yes"
|
|
||||||
)
|
|
||||||
) : fieldtype[0].value ==
|
|
||||||
"{16D63FD6-119B-4353-BDCA-18358721C3FE}" ? (
|
|
||||||
<>
|
|
||||||
{props.filesArray.map((blob, i) => (
|
|
||||||
<div key={i}>
|
<div key={i}>
|
||||||
{getDocumentTypeFromFilename(
|
{getDocumentTypeFromFilename(
|
||||||
blob.name
|
blob.name
|
||||||
) ===
|
) ===
|
||||||
documentTypeCode[0]
|
documentTypeCode[0].value && (
|
||||||
.value && (
|
|
||||||
<div
|
<div
|
||||||
style={{
|
style={{
|
||||||
display: "flex",
|
display: "flex",
|
||||||
@@ -237,124 +224,98 @@ let BuildCheckRow = (props) => {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
))}
|
)
|
||||||
<br />
|
|
||||||
{typeof props.props.form["appealForm"]
|
|
||||||
.values[datafieldname[0].value] !=
|
|
||||||
"undefined" &&
|
|
||||||
props.props.form[
|
|
||||||
"appealForm"
|
|
||||||
].values[
|
|
||||||
datafieldname[0].value
|
|
||||||
].map(
|
|
||||||
(blob, i) =>
|
|
||||||
isObjectAndNotEmpty(
|
|
||||||
blob
|
|
||||||
) && (
|
|
||||||
<div key={i}>
|
|
||||||
{getDocumentTypeFromFilename(
|
|
||||||
blob.name
|
|
||||||
) ===
|
|
||||||
documentTypeCode[0]
|
|
||||||
.value && (
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
display:
|
|
||||||
"flex",
|
|
||||||
alignItems:
|
|
||||||
"flex-start"
|
|
||||||
}}
|
|
||||||
className="govuk-!-margin-bottom-2"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
style={{
|
|
||||||
minWidth:
|
|
||||||
"50",
|
|
||||||
width: "50"
|
|
||||||
}}
|
|
||||||
src={getThumbnailIconByExtension(
|
|
||||||
blob.name
|
|
||||||
)}
|
|
||||||
alt={
|
|
||||||
blob.name
|
|
||||||
}
|
|
||||||
width="50"
|
|
||||||
/>
|
|
||||||
<span
|
|
||||||
style={{
|
|
||||||
maxWidth:
|
|
||||||
"85%"
|
|
||||||
}}
|
|
||||||
className="govuk-body govuk-!-font-size-14 govuk-!-margin-left-2"
|
|
||||||
>
|
|
||||||
{
|
|
||||||
blob.name
|
|
||||||
}{" "}
|
|
||||||
-{" "}
|
|
||||||
{bytesToSize(
|
|
||||||
blob.size
|
|
||||||
)}{" "}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
) : fieldtype[0].value ==
|
|
||||||
"{0273EDBD-AC1D-40d3-9FB2-095C621B552D}" ? (
|
|
||||||
typeof props.props.form["appealForm"]
|
|
||||||
.values[datafieldname[0].value] !=
|
|
||||||
"undefined" &&
|
|
||||||
props.props.form["appealForm"].values[
|
|
||||||
datafieldname[0].value
|
|
||||||
] != null ? (
|
|
||||||
props.props.form["appealForm"].values[
|
|
||||||
datafieldname[0].value
|
|
||||||
].map((tenant, index) => {
|
|
||||||
console.log(
|
|
||||||
typeof tenant.pinswg_owners_firstname
|
|
||||||
);
|
|
||||||
return typeof tenant.pinswg_owners_firstname !=
|
|
||||||
"undefined" ||
|
|
||||||
typeof tenant.pinswg_agriculturaltenantname_firstname !=
|
|
||||||
"undefined" ? (
|
|
||||||
<div
|
|
||||||
key={index}
|
|
||||||
style={{
|
|
||||||
display: "flex"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<div className="govuk-!-width-one-half">
|
|
||||||
{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:{" "}
|
|
||||||
{formatDate(
|
|
||||||
tenant.dateserved
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
""
|
|
||||||
);
|
|
||||||
})
|
|
||||||
) : (
|
|
||||||
"N/A"
|
|
||||||
)
|
|
||||||
) : (
|
|
||||||
props.props.form["appealForm"].values[
|
|
||||||
datafieldname[0].value
|
|
||||||
]
|
|
||||||
)}
|
)}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
|
||||||
|
const renderTenantValue = () =>
|
||||||
|
typeof fieldValue != "undefined" && fieldValue != null ? (
|
||||||
|
fieldValue.map((tenant, index) => {
|
||||||
|
console.log(
|
||||||
|
typeof tenant.pinswg_owners_firstname
|
||||||
|
);
|
||||||
|
return typeof tenant.pinswg_owners_firstname !=
|
||||||
|
"undefined" ||
|
||||||
|
typeof tenant.pinswg_agriculturaltenantname_firstname !=
|
||||||
|
"undefined" ? (
|
||||||
|
<div
|
||||||
|
key={index}
|
||||||
|
style={{
|
||||||
|
display: "flex"
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div className="govuk-!-width-one-half">
|
||||||
|
{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:{" "}
|
||||||
|
{formatDate(tenant.dateserved)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
""
|
||||||
|
);
|
||||||
|
})
|
||||||
|
) : (
|
||||||
|
"N/A"
|
||||||
|
);
|
||||||
|
|
||||||
|
const formatterMap = {
|
||||||
|
"{E0DECE4B-6666-4a8f-A065-082708572369}": () => (
|
||||||
|
<div
|
||||||
|
dangerouslySetInnerHTML={{
|
||||||
|
__html: fieldValue
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
"{5B773807-9FB2-42db-97C3-7A91EFF8ADFF}": () =>
|
||||||
|
formatDate(fieldValue),
|
||||||
|
"{3EF39988-22BB-4f0b-BBBE-64B5A3748AEE}": () =>
|
||||||
|
getPickListLabel(
|
||||||
|
props.props.formData.pickListData,
|
||||||
|
datafieldname[0].value,
|
||||||
|
fieldValue
|
||||||
|
),
|
||||||
|
"{07FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}": () =>
|
||||||
|
getRadioLabel(
|
||||||
|
props.props.formData.pickListData,
|
||||||
|
datafieldname[0].value,
|
||||||
|
fieldValue
|
||||||
|
),
|
||||||
|
"{67FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}": () =>
|
||||||
|
fieldValue == "false"
|
||||||
|
? router.locale == "cy"
|
||||||
|
? "Nac ydw"
|
||||||
|
: "No"
|
||||||
|
: router.locale == "cy"
|
||||||
|
? "Oes"
|
||||||
|
: "Yes",
|
||||||
|
"{16D63FD6-119B-4353-BDCA-18358721C3FE}":
|
||||||
|
renderFileUploadValue,
|
||||||
|
"{0273EDBD-AC1D-40d3-9FB2-095C621B552D}":
|
||||||
|
renderTenantValue
|
||||||
|
};
|
||||||
|
|
||||||
|
const defaultFormatter = () => fieldValue;
|
||||||
|
const renderFieldValue =
|
||||||
|
formatterMap[fieldTypeValue] || defaultFormatter;
|
||||||
|
return (
|
||||||
|
<div className="govuk-summary-list__row" key={key}>
|
||||||
|
<dt className="govuk-summary-list__key">
|
||||||
|
{FieldsTranslations(rows[0].value)}
|
||||||
|
</dt>
|
||||||
|
|
||||||
|
<dd className="govuk-summary-list__value">
|
||||||
|
{renderFieldValue()}
|
||||||
</dd>
|
</dd>
|
||||||
|
|
||||||
<dd className="govuk-summary-list__actions">
|
<dd className="govuk-summary-list__actions">
|
||||||
|
|||||||
@@ -4,7 +4,7 @@ Base branch for this tracker: `refactor`
|
|||||||
|
|
||||||
## Status
|
## Status
|
||||||
|
|
||||||
Current slice: Slice 6 — BuildCheckRow Formatter Map
|
Current slice: Slice 7 — Props Boundary Cleanup
|
||||||
Status: READY TO START
|
Status: READY TO START
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -62,7 +62,7 @@ Status: COMPLETE
|
|||||||
|
|
||||||
### Slice 6 — BuildCheckRow Formatter Map
|
### Slice 6 — BuildCheckRow Formatter Map
|
||||||
|
|
||||||
Status: NOT STARTED
|
Status: COMPLETE
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user