Frontend Routing: Always render standalone plugin pages using the <AppRootPage> (#57771)

* chore: fix go lint issues

* feat(Routing): route standalone plugin pages to the `AppRoutePage`

* feat(plugin.json): introduce a new field called `isCorePage` for `includes`

* chore: add explanatory comments for types

* refactor(AppRootPage): receive the `pluginId` and `pluginSection` through the props

Now we are able to receive these as props as the pluginId is defined on navLinks
that are registered by plugins.

* chore: update teests for AppRootPage

* fix: remove rebase issue

* tests(applinks): add a test for checking isCorePage plugin page setting

* refactor(applinks): update tests to use FindById() and be more resilient to changes

* fix: Go lint issues

* refactor(routes): use cleaner types when working with plugin nav nodes

Co-authored-by: Marcus Andersson <marcus.andersson@grafana.com>

* chore: fix linting issues

* t: remove `isCorePage` field from includes

Co-authored-by: Marcus Andersson <marcus.andersson@grafana.com>
This commit is contained in:
Levente Balogh
2022-11-07 15:19:31 +01:00
committed by GitHub
parent f9c88e72ae
commit eb3ee35e1c
10 changed files with 249 additions and 176 deletions

View File

@@ -1,6 +1,4 @@
import { Location as HistoryLocation } from 'history';
import { NavIndex, NavModelItem } from '@grafana/data';
import { NavModelItem } from '@grafana/data';
import { config } from '@grafana/runtime';
import { HOME_NAV_ID } from 'app/core/reducers/navModel';
@@ -52,73 +50,36 @@ describe('buildPluginSectionNav', () => {
app1.parentItem = appsSection;
const navIndex: NavIndex = {
apps: appsSection,
[app1.id!]: appsSection.children[0],
[standalonePluginPage.id]: standalonePluginPage,
[HOME_NAV_ID]: home,
};
it('Should return pluginNav if topnav is disabled', () => {
config.featureToggles.topnav = false;
const result = buildPluginSectionNav({} as HistoryLocation, pluginNav, {}, 'app1');
const result = buildPluginSectionNav(appsSection, pluginNav, '/a/plugin1/page1');
expect(result).toBe(pluginNav);
});
it('Should return return section nav if topnav is enabled', () => {
config.featureToggles.topnav = true;
const result = buildPluginSectionNav({} as HistoryLocation, pluginNav, navIndex, 'app1');
const result = buildPluginSectionNav(appsSection, pluginNav, '/a/plugin1/page1');
expect(result?.main.text).toBe('apps');
});
it('Should set active page', () => {
config.featureToggles.topnav = true;
const result = buildPluginSectionNav(
{ pathname: '/a/plugin1/page2', search: '' } as HistoryLocation,
null,
navIndex,
'app1'
);
const result = buildPluginSectionNav(appsSection, null, '/a/plugin1/page2');
expect(result?.main.children![0].children![1].active).toBe(true);
expect(result?.node.text).toBe('page2');
});
it('Should set app section to active', () => {
config.featureToggles.topnav = true;
const result = buildPluginSectionNav(
{ pathname: '/a/plugin1', search: '' } as HistoryLocation,
null,
navIndex,
'app1'
);
const result = buildPluginSectionNav(appsSection, null, '/a/plugin1');
expect(result?.main.children![0].active).toBe(true);
expect(result?.node.text).toBe('App1');
});
it('Should handle standalone page', () => {
config.featureToggles.topnav = true;
const result = buildPluginSectionNav(
{ pathname: '/a/app2/config', search: '' } as HistoryLocation,
pluginNav,
navIndex,
'app2'
);
const result = buildPluginSectionNav(adminSection, pluginNav, '/a/app2/config');
expect(result?.main.text).toBe('Admin');
expect(result?.node.text).toBe('Standalone page');
});
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(HOME_NAV_ID);
});
it('Should throw error if app has no section', () => {
config.featureToggles.topnav = true;
app1.parentItem = undefined;
const action = () => {
buildPluginSectionNav({} as HistoryLocation, pluginNav, navIndex, 'app1');
};
expect(action).toThrowError();
});
});