22541 extract shared case-reference breadcrumb list item helper
This commit is contained in:
+16
-40
@@ -100,6 +100,12 @@ const Breadcrumbs = (props) => {
|
||||
</li>
|
||||
);
|
||||
|
||||
const renderCaseReferenceCrumb = (referenceValue) => (
|
||||
<li className="govuk-breadcrumbs__list-item">
|
||||
{t("common:breadcrumb-case-reference")}: {referenceValue}
|
||||
</li>
|
||||
);
|
||||
|
||||
const { breadcrumbHref, caseResultsHref, breadcrumbLabel } =
|
||||
resolveCaseBreadcrumbState({
|
||||
query: router.query,
|
||||
@@ -419,10 +425,7 @@ const Breadcrumbs = (props) => {
|
||||
{t("common:breadcrumb-my-portal")}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="govuk-breadcrumbs__list-item">
|
||||
{t("common:breadcrumb-case-reference")}:{" "}
|
||||
{currentReference}
|
||||
</li>
|
||||
{renderCaseReferenceCrumb(currentReference)}
|
||||
</>
|
||||
)}
|
||||
{isPath("/case/[ticketnumber]") && (
|
||||
@@ -435,10 +438,7 @@ const Breadcrumbs = (props) => {
|
||||
{breadcrumbLabel}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="govuk-breadcrumbs__list-item">
|
||||
{t("common:breadcrumb-case-reference")}:{" "}
|
||||
{fallbackSearchTitle}
|
||||
</li>
|
||||
{renderCaseReferenceCrumb(fallbackSearchTitle)}
|
||||
</>
|
||||
)}
|
||||
{isPath("/case/id/[incident]") && (
|
||||
@@ -475,10 +475,7 @@ const Breadcrumbs = (props) => {
|
||||
)}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="govuk-breadcrumbs__list-item">
|
||||
{t("common:breadcrumb-case-reference")}:{" "}
|
||||
{currentReference}
|
||||
</li>
|
||||
{renderCaseReferenceCrumb(currentReference)}
|
||||
</>
|
||||
)}
|
||||
{isPath("/myportal/case/id/[incident]") && (
|
||||
@@ -521,10 +518,7 @@ const Breadcrumbs = (props) => {
|
||||
)}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="govuk-breadcrumbs__list-item">
|
||||
{t("common:breadcrumb-case-reference")}:{" "}
|
||||
{currentReference}
|
||||
</li>
|
||||
{renderCaseReferenceCrumb(currentReference)}
|
||||
</>
|
||||
)}
|
||||
{isPath("/myportal/case/[ticketnumber]") && (
|
||||
@@ -538,10 +532,7 @@ const Breadcrumbs = (props) => {
|
||||
{breadcrumbLabel}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="govuk-breadcrumbs__list-item">
|
||||
{t("common:breadcrumb-case-reference")}:{" "}
|
||||
{caseReferenceDisplay}
|
||||
</li>
|
||||
{renderCaseReferenceCrumb(caseReferenceDisplay)}
|
||||
</>
|
||||
)}
|
||||
{isPath("/myportal/dnsapplications") && (
|
||||
@@ -564,10 +555,7 @@ const Breadcrumbs = (props) => {
|
||||
{t("dnsCommon:service-name")}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="govuk-breadcrumbs__list-item">
|
||||
{t("common:breadcrumb-case-reference")}:{" "}
|
||||
{currentReference}
|
||||
</li>
|
||||
{renderCaseReferenceCrumb(currentReference)}
|
||||
</>
|
||||
)}
|
||||
{isPath("/myportal/dns/[developmentName]") && (
|
||||
@@ -592,10 +580,7 @@ const Breadcrumbs = (props) => {
|
||||
{t("dnsCommon:service-name")}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="govuk-breadcrumbs__list-item">
|
||||
{t("common:breadcrumb-case-reference")}:{" "}
|
||||
{caseReferenceDisplay}
|
||||
</li>
|
||||
{renderCaseReferenceCrumb(caseReferenceDisplay)}
|
||||
</>
|
||||
)}
|
||||
{isPath("/case") && (
|
||||
@@ -623,10 +608,7 @@ const Breadcrumbs = (props) => {
|
||||
{t("common:breadcrumb-search-results")}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="govuk-breadcrumbs__list-item">
|
||||
{t("common:breadcrumb-case-reference")}:{" "}
|
||||
{currentReference}
|
||||
</li>
|
||||
{renderCaseReferenceCrumb(currentReference)}
|
||||
</>
|
||||
)}
|
||||
{isPath("/myportal/representation") && (
|
||||
@@ -758,10 +740,7 @@ const Breadcrumbs = (props) => {
|
||||
{t("dnsCommon:service-name")}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="govuk-breadcrumbs__list-item">
|
||||
{t("common:breadcrumb-case-reference")}:{" "}
|
||||
{currentReference}
|
||||
</li>
|
||||
{renderCaseReferenceCrumb(currentReference)}
|
||||
</>
|
||||
)}
|
||||
{isPath("/dns/[developmentName]") && (
|
||||
@@ -779,10 +758,7 @@ const Breadcrumbs = (props) => {
|
||||
{t("dnsCommon:service-name")}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="govuk-breadcrumbs__list-item">
|
||||
{t("common:breadcrumb-case-reference")}:{" "}
|
||||
{caseReferenceDisplay}
|
||||
</li>
|
||||
{renderCaseReferenceCrumb(caseReferenceDisplay)}
|
||||
</>
|
||||
)}
|
||||
{isPath("/dns/application-process") && (
|
||||
|
||||
@@ -137,6 +137,31 @@ Follow-ups:
|
||||
|
||||
- Next bounded slice can target additional repeated breadcrumb list-item patterns (e.g., repeated case-reference tail item blocks) with same behavior parity approach.
|
||||
|
||||
### CL-22541-E: breadcrumbs case-reference crumb helper extraction
|
||||
|
||||
date: 2026-04-09
|
||||
author: Cline
|
||||
scope: `components/breadcrumbs.js`
|
||||
type: change
|
||||
rationale: Continue bounded breadcrumbs decomposition by extracting repeated case-reference tail breadcrumb markup into one local helper and replacing repeated inline blocks.
|
||||
impact: Refactor-only JSX deduplication in breadcrumb rendering; no intended route/auth/session/API/EN-CY/a11y behavior change.
|
||||
status: completed
|
||||
|
||||
Summary:
|
||||
|
||||
- Added local `renderCaseReferenceCrumb(referenceValue)` helper in `components/breadcrumbs.js`.
|
||||
- Replaced repeated `{t("common:breadcrumb-case-reference")}: ...` list-item blocks across case/dns route branches with helper calls.
|
||||
- Corrected initial over-wrap by using helper calls directly (so generated `<li>` is not nested in another `<li>`).
|
||||
|
||||
Validation:
|
||||
|
||||
- `npx eslint components/breadcrumbs.js` -> pass.
|
||||
- `node tests/phase22/index.test.cjs` -> pass (combined suite).
|
||||
|
||||
Follow-ups:
|
||||
|
||||
- Next bounded slice can target remaining repeated linked breadcrumb list-item patterns (e.g., recurring address-search result link pairs) via small local render helpers.
|
||||
|
||||
### CL-00X: 22500 `components/elements/index.js` Phase 1 helper extraction
|
||||
|
||||
date: 2026-04-07
|
||||
|
||||
Reference in New Issue
Block a user