IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

only render direct children on the landing page routes (#56720)

Browse Source
This commit is contained in:
Ashley Harrison
2022-10-12 10:01:33 +01:00
committed by GitHub
parent 26bb139470
commit dd9e1498f9
5 changed files with 10 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
public/app/core/components/AppChrome/NavLandingPage.test.tsx
View File

@@ -80,24 +80,4 @@ describe('NavLandingPage', () => {
expect(screen.getByText(mockChild1.subTitle)).toBeInTheDocument();
expect(screen.getByText(mockChild2.subTitle)).toBeInTheDocument();
});
it('renders the heading for nested sections', () => {
setup();
expect(screen.getByRole('heading', { name: mockChild3.text })).toBeInTheDocument();
});
it('renders the subTitle for a nested section', () => {
setup();
expect(screen.getByText(mockChild3.subTitle)).toBeInTheDocument();
});
it('renders a link for a nested child', () => {
setup();
expect(screen.getByRole('link', { name: mockChild3.children[0].text })).toBeInTheDocument();
});
it('renders the subTitle for a nested child', () => {
setup();
expect(screen.getByText(mockChild3.children[0].subTitle)).toBeInTheDocument();
});
});

29
public/app/core/components/AppChrome/NavLandingPage.tsx
View File

@@ -17,16 +17,15 @@ interface Props {
export function NavLandingPage({ navId }: Props) {
const { node } = useNavModel(navId);
const styles = useStyles2(getStyles);
const directChildren = node.children?.filter((child) => !child.hideFromTabs && !child.children);
const nestedChildren = node.children?.filter((child) => child.children && child.children.length);
const children = node.children?.filter((child) => !child.hideFromTabs);
return (
<Page navId={node.id}>
<Page.Contents>
<div className={styles.content}>
{directChildren && directChildren.length > 0 && (
{children && children.length > 0 && (
<section className={styles.grid}>
{directChildren?.map((child) => (
{children?.map((child) => (
<NavLandingPageCard
key={child.id}
description={getNavSubTitle(child.id) ?? child.subTitle}
@@ -36,22 +35,6 @@ export function NavLandingPage({ navId }: Props) {
))}
</section>
)}
{nestedChildren?.map((child) => (
<section key={child.id}>
<h2 className={styles.nestedTitle}>{getNavTitle(child.id) ?? child.text}</h2>
<div className={styles.nestedDescription}>{getNavSubTitle(child.id) ?? child.subTitle}</div>
<div className={styles.grid}>
{child.children?.map((child) => (
<NavLandingPageCard
key={child.id}
description={getNavSubTitle(child.id) ?? child.subTitle}
text={getNavTitle(child.id) ?? child.text}
url={child.url ?? ''}
/>
))}
</div>
</section>
))}
</div>
</Page.Contents>
</Page>
@@ -71,10 +54,4 @@ const getStyles = (theme: GrafanaTheme2) => ({
gridAutoRows: '130px',
padding: theme.spacing(2, 0),
}),
nestedTitle: css({
margin: theme.spacing(2, 0),
}),
nestedDescription: css({
color: theme.colors.text.secondary,
}),
});