mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
ensure the first item in the sectionnav is always the section root (#56815)
This commit is contained in:
parent
8846778f9b
commit
61fd369b3f
@ -26,7 +26,7 @@ export function SectionNav({ model, isExpanded }: Props) {
|
|||||||
>
|
>
|
||||||
<CustomScrollbar showScrollIndicators>
|
<CustomScrollbar showScrollIndicators>
|
||||||
<div className={styles.items} role="tablist">
|
<div className={styles.items} role="tablist">
|
||||||
<SectionNavItem item={model.main} />
|
<SectionNavItem item={model.main} isSectionRoot />
|
||||||
</div>
|
</div>
|
||||||
</CustomScrollbar>
|
</CustomScrollbar>
|
||||||
</nav>
|
</nav>
|
||||||
|
@ -4,19 +4,18 @@ import React from 'react';
|
|||||||
import { GrafanaTheme2, NavModelItem } from '@grafana/data';
|
import { GrafanaTheme2, NavModelItem } from '@grafana/data';
|
||||||
import { selectors } from '@grafana/e2e-selectors';
|
import { selectors } from '@grafana/e2e-selectors';
|
||||||
import { useStyles2, Icon } from '@grafana/ui';
|
import { useStyles2, Icon } from '@grafana/ui';
|
||||||
import { HOME_NAV_ID } from 'app/core/reducers/navModel';
|
|
||||||
|
|
||||||
import { getNavTitle } from '../NavBar/navBarItem-translations';
|
import { getNavTitle } from '../NavBar/navBarItem-translations';
|
||||||
|
|
||||||
export interface Props {
|
export interface Props {
|
||||||
item: NavModelItem;
|
item: NavModelItem;
|
||||||
|
isSectionRoot?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export function SectionNavItem({ item }: Props) {
|
export function SectionNavItem({ item, isSectionRoot = false }: Props) {
|
||||||
const styles = useStyles2(getStyles);
|
const styles = useStyles2(getStyles);
|
||||||
|
|
||||||
const children = item.children?.filter((x) => !x.hideFromTabs);
|
const children = item.children?.filter((x) => !x.hideFromTabs);
|
||||||
const isSectionRoot = item.parentItem?.id === HOME_NAV_ID;
|
|
||||||
const hasActiveChild = Boolean(children?.length && children.find((x) => x.active));
|
const hasActiveChild = Boolean(children?.length && children.find((x) => x.active));
|
||||||
|
|
||||||
// If first root child is a section skip the bottom margin (as sections have top margin already)
|
// If first root child is a section skip the bottom margin (as sections have top margin already)
|
||||||
|
Loading…
Reference in New Issue
Block a user