diff --git a/public/app/core/components/Page/usePageTitle.ts b/public/app/core/components/Page/usePageTitle.ts index b7512bb7b46..730c696fc27 100644 --- a/public/app/core/components/Page/usePageTitle.ts +++ b/public/app/core/components/Page/usePageTitle.ts @@ -7,22 +7,21 @@ import { Branding } from '../Branding/Branding'; export function usePageTitle(navModel?: NavModel, pageNav?: NavModelItem) { useEffect(() => { const parts: string[] = []; - if (pageNav) { if (pageNav.children) { const activePage = pageNav.children.find((x) => x.active); if (activePage) { - parts.push(activePage.text); + addTitleSegment(parts, activePage); } } - parts.push(pageNav.text); + addTitleSegment(parts, pageNav); } if (navModel) { if (navModel.node !== navModel.main) { - parts.push(navModel.node.text); + addTitleSegment(parts, navModel.node); } - parts.push(navModel.main.text); + addTitleSegment(parts, navModel.main); } parts.push(Branding.AppTitle); @@ -30,3 +29,9 @@ export function usePageTitle(navModel?: NavModel, pageNav?: NavModelItem) { document.title = parts.join(' - '); }, [navModel, pageNav]); } + +function addTitleSegment(parts: string[], node: NavModelItem) { + if (!node.hideFromBreadcrumbs) { + parts.push(node.text); + } +} diff --git a/public/app/core/components/PageNew/Page.test.tsx b/public/app/core/components/PageNew/Page.test.tsx index 795c2182acd..4ea9862923b 100644 --- a/public/app/core/components/PageNew/Page.test.tsx +++ b/public/app/core/components/PageNew/Page.test.tsx @@ -89,4 +89,15 @@ describe('Render', () => { expect(screen.getByRole('tab', { name: 'Tab Child1' })).toBeInTheDocument(); expect(screen.getByRole('tab', { name: 'Tab pageNav child1' })).toBeInTheDocument(); }); + + it('should update document title', async () => { + setup({ navId: 'child1', pageNav }); + expect(document.title).toBe('pageNav child1 - pageNav title - Child1 - Section name - Grafana'); + }); + + it('should not include hideFromBreadcrumb nodes in title', async () => { + pageNav.children![0].hideFromBreadcrumbs = true; + setup({ navId: 'child1', pageNav }); + expect(document.title).toBe('pageNav title - Child1 - Section name - Grafana'); + }); }); diff --git a/public/app/features/plugins/utils.test.ts b/public/app/features/plugins/utils.test.ts index 60a22f3dd3e..dd6e16f75b1 100644 --- a/public/app/features/plugins/utils.test.ts +++ b/public/app/features/plugins/utils.test.ts @@ -30,14 +30,16 @@ describe('buildPluginSectionNav', () => { children: [app1], }; + const home = { + id: HOME_NAV_ID, + text: 'Home', + }; + const adminSection: NavModelItem = { text: 'Admin', id: 'admin', children: [], - parentItem: { - id: HOME_NAV_ID, - text: 'Home', - }, + parentItem: home, }; const standalonePluginPage = { @@ -54,6 +56,7 @@ describe('buildPluginSectionNav', () => { apps: appsSection, [app1.id!]: appsSection.children[0], [standalonePluginPage.id]: standalonePluginPage, + [HOME_NAV_ID]: home, }; it('Should return pluginNav if topnav is disabled', () => { @@ -107,9 +110,7 @@ describe('buildPluginSectionNav', () => { it('Should not throw error just return a root nav model without children for plugins that dont exist in navtree', () => { config.featureToggles.topnav = true; const result = buildPluginSectionNav({} as HistoryLocation, pluginNav, navIndex, 'app3'); - expect(result?.main.id).toBe('root-plugin-page'); - expect(result?.main.hideFromBreadcrumbs).toBe(true); - expect(result?.main.children?.length).toBe(0); + expect(result?.main.id).toBe(HOME_NAV_ID); }); it('Should throw error if app has no section', () => { diff --git a/public/app/features/plugins/utils.ts b/public/app/features/plugins/utils.ts index 45a10a2a1ed..2bdf2885b7c 100644 --- a/public/app/features/plugins/utils.ts +++ b/public/app/features/plugins/utils.ts @@ -2,6 +2,7 @@ import { Location as HistoryLocation } from 'history'; import { GrafanaPlugin, NavIndex, NavModel, NavModelItem, PanelPluginMeta, PluginType } from '@grafana/data'; import { config } from '@grafana/runtime'; +import { HOME_NAV_ID } from 'app/core/reducers/navModel'; import { getRootSectionForNode } from 'app/core/selectors/navModel'; import { importPanelPluginFromMeta } from './importPanelPlugin'; @@ -99,7 +100,7 @@ export function getPluginSection(location: HistoryLocation, navIndex: NavIndex, // Some plugins like cloud home don't have any precense in the navtree so we need to allow those const navTreeNodeForPlugin = navIndex[`plugin-page-${pluginId}`]; if (!navTreeNodeForPlugin) { - return { id: 'root-plugin-page', text: 'Root plugin page', hideFromBreadcrumbs: true }; + return navIndex[HOME_NAV_ID]; } if (!navTreeNodeForPlugin.parentItem) {