diff --git a/public/app/core/components/Breadcrumbs/utils.test.ts b/public/app/core/components/Breadcrumbs/utils.test.ts index bc76522cb2b..86d932fb32b 100644 --- a/public/app/core/components/Breadcrumbs/utils.test.ts +++ b/public/app/core/components/Breadcrumbs/utils.test.ts @@ -141,5 +141,28 @@ describe('breadcrumb utils', () => { { text: 'My page', href: '/my-page' }, ]); }); + + it('does not ignore duplicates with different text', () => { + const pageNav: NavModelItem = { + text: 'My page', + url: '/my-page', + parentItem: { + text: 'Another section', + // same url as section nav, but this one should win/overwrite it + url: '/my-section?from=1h&to=now', + }, + }; + + const sectionNav: NavModelItem = { + text: 'My section', + url: '/my-section', + }; + + expect(buildBreadcrumbs(sectionNav, pageNav, mockHomeNav)).toEqual([ + { text: 'My section', href: '/my-section' }, + { text: 'Another section', href: '/my-section?from=1h&to=now' }, + { text: 'My page', href: '/my-page' }, + ]); + }); }); }); diff --git a/public/app/core/components/Breadcrumbs/utils.ts b/public/app/core/components/Breadcrumbs/utils.ts index 4537585ca89..be1d1c31d3e 100644 --- a/public/app/core/components/Breadcrumbs/utils.ts +++ b/public/app/core/components/Breadcrumbs/utils.ts @@ -7,6 +7,7 @@ export function buildBreadcrumbs(sectionNav: NavModelItem, pageNav?: NavModelIte const crumbs: Breadcrumb[] = []; let foundHome = false; let lastPath: string | undefined = undefined; + let lastText: string | undefined = undefined; function addCrumbs(node: NavModelItem) { if (foundHome) { @@ -33,10 +34,14 @@ export function buildBreadcrumbs(sectionNav: NavModelItem, pageNav?: NavModelIte // This enabled app plugins to control breadcrumbs of their root pages const isSamePathAsLastBreadcrumb = urlToMatch.length > 0 && lastPath === urlToMatch; + const isSameTextAsLastBreadcrumb = node.text === lastText; + // Remember this path for the next breadcrumb lastPath = urlToMatch; + lastText = node.text; - if (!node.hideFromBreadcrumbs && !isSamePathAsLastBreadcrumb) { + const shouldMergeBreadcrumb = isSamePathAsLastBreadcrumb && isSameTextAsLastBreadcrumb; + if (!node.hideFromBreadcrumbs && !shouldMergeBreadcrumb) { crumbs.unshift({ text: node.text, href: node.url ?? '' }); }