diff --git a/bciers/libs/components/src/navigation/Bread.test.tsx b/bciers/libs/components/src/navigation/Bread.test.tsx index 4a8b51cc28..a020efffde 100644 --- a/bciers/libs/components/src/navigation/Bread.test.tsx +++ b/bciers/libs/components/src/navigation/Bread.test.tsx @@ -17,12 +17,12 @@ describe("The Breadcrumb component", () => { const testCases = [ { url: "http://localhost:3000/administration/contacts", - expectedBreadcrumbs: ["Home", "Administration", "Contacts"], + expectedBreadcrumbs: ["Dashboard", "Administration", "Contacts"], }, { url: "http://localhost:3000/administration/contacts/add-contact", expectedBreadcrumbs: [ - "Home", + "Dashboard", "Administration", "Contacts", "Add Contact", @@ -30,16 +30,21 @@ describe("The Breadcrumb component", () => { }, { url: "http://localhost:3000/administration/contacts/10?contacts_title=Henry%20Ives", - expectedBreadcrumbs: ["Home", "Administration", "Contacts", "Henry Ives"], + expectedBreadcrumbs: [ + "Dashboard", + "Administration", + "Contacts", + "Henry Ives", + ], }, { url: "http://localhost:3000/administration/operations", - expectedBreadcrumbs: ["Home", "Administration", "Operations"], + expectedBreadcrumbs: ["Dashboard", "Administration", "Operations"], }, { url: "http://localhost:3000/administration/operations/002d5a9e-32a6-4191-938c-2c02bfec592d?operations_title=Operation+2", expectedBreadcrumbs: [ - "Home", + "Dashboard", "Administration", "Operations", "Operation 2", @@ -48,29 +53,56 @@ describe("The Breadcrumb component", () => { { url: "http://localhost:3000/administration/operations/002d5a9e-32a6-4191-938c-2c02bfec592d/facilities?operations_title=Operation+2", expectedBreadcrumbs: [ - "Home", + "Dashboard", "Administration", "Operations", "Operation 2", + "Facilities", ], }, { url: "http://localhost:3000/administration/operations/002d5a9e-32a6-4191-938c-2c02bfec592d/facilities/f486f2fb-62ed-438d-bb3e-0819b51e3aeb?operations_title=Operation%202&facilities_title=Facility%201", expectedBreadcrumbs: [ - "Home", + "Dashboard", "Administration", "Operations", "Operation 2", + "Facilities", "Facility 1", ], }, { url: "http://localhost:3000/registration/register-an-operation", - expectedBreadcrumbs: ["Home", "Registration", "Register An Operation"], + expectedBreadcrumbs: [ + "Dashboard", + "Registration", + "Register An Operation", + ], }, { url: "http://localhost:3000/registration/register-an-operation/2", - expectedBreadcrumbs: ["Home", "Registration", "Register An Operation"], + expectedBreadcrumbs: [ + "Dashboard", + "Registration", + "Register An Operation", + ], + }, + { + url: "http://localhost:3000/reporting/reports", + expectedBreadcrumbs: ["Dashboard", "Reporting", "Reports"], + }, + { + url: "http://localhost:3000/reporting/reports/1/review-operator-data", + expectedBreadcrumbs: [ + "Dashboard", + "Reporting", + "Reports", + "Review Operator Data", + ], + }, + { + url: "http://localhost:3000/reporting/reports/1/facilities/f486f2fb-62ed-438d-bb3e-0819b51e3aff/activities", + expectedBreadcrumbs: ["Dashboard", "Reporting", "Reports", "Activities"], }, ]; @@ -82,7 +114,7 @@ describe("The Breadcrumb component", () => { , ); diff --git a/bciers/libs/components/src/navigation/Bread.tsx b/bciers/libs/components/src/navigation/Bread.tsx index 3975eab078..fee1c64f12 100644 --- a/bciers/libs/components/src/navigation/Bread.tsx +++ b/bciers/libs/components/src/navigation/Bread.tsx @@ -59,8 +59,17 @@ export default function Bread({ const slicedPathNames = lastLinkIndex !== -1 ? pathNames.slice(0, lastLinkIndex + 1) : pathNames; - // 🛠️ Function to translate an uuid or number segment using querystring value - function translateNumericPart(segment: string, index: number): string | null { + // 🛠️ Function to transform path segment crumb content based on conditions: segmant paths; uuid; number + function transformPathSegment(segment: string, index: number): string | null { + // Check if "reports" is in the pathNames and the current segment is "Facilities" + if ( + pathNames.some((path) => path.toLowerCase() === "reports") && + segment.toLowerCase() === "facilities" + ) { + return null; + } + + // Check if the current segment is an ID if (isValidUUID(segment) || isNumeric(segment)) { const precedingSegment = pathNames[index - 1] ? unslugifyAndCapitalize(pathNames[index - 1]) @@ -78,7 +87,7 @@ export default function Bread({ return crumbTitles?.title || null; } - // If the segment is not a UUID or numeric value, return it as-is + // Return segment as-is return segment; } @@ -111,11 +120,11 @@ export default function Bread({ {slicedPathNames.map((link, index) => { const isLastItem = index === slicedPathNames.length - 1; const content = capitalizeLinks - ? translateNumericPart(unslugifyAndCapitalize(link), index) - : translateNumericPart(link, index); + ? transformPathSegment(unslugifyAndCapitalize(link), index) + : transformPathSegment(link, index); - // 🚨 Skip rendering if content is null (segment should be omitted) or if content is facilities - if (!content || content === "Facilities") { + // 🚨 Skip rendering if content is null (segment should be omitted) + if (!content) { return null; }