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

Navigation: Add persistence to collapsible nav items (#47292)

Browse Source
This commit is contained in:
kay delaney 2022-04-05 09:17:02 +01:00 committed by GitHub
parent e430f5021d
commit 2018d83e1c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 4 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
public/app/core/components/NavBar/Next/NavBarMenu.tsx
View File

@ -9,6 +9,7 @@ import { NavBarMenuItem } from './NavBarMenuItem';
import { NavBarItemWithoutMenu } from './NavBarItemWithoutMenu'; import { NavBarItemWithoutMenu } from './NavBarItemWithoutMenu';
import { isMatchOrChildMatch } from '../utils'; import { isMatchOrChildMatch } from '../utils';
import { NavBarToggle } from './NavBarToggle'; import { NavBarToggle } from './NavBarToggle';
import { useLocalStorage } from 'react-use';
export interface Props { export interface Props {
activeItem?: NavModelItem; activeItem?: NavModelItem;
@ -217,6 +218,7 @@ function CollapsibleNavItem({
className?: string; className?: string;
}) { }) {
const styles = useStyles2(getCollapsibleStyles); const styles = useStyles2(getCollapsibleStyles);
const [sectionExpanded, setSectionExpanded] = useLocalStorage(`grafana.navigation.expanded[${link.text}]`, false);
return ( return (
<li className={cx(styles.menuItem, className)}> <li className={cx(styles.menuItem, className)}>
@ -235,7 +237,8 @@ function CollapsibleNavItem({
</NavBarItemWithoutMenu> </NavBarItemWithoutMenu>
<div className={styles.collapsibleSectionWrapper}> <div className={styles.collapsibleSectionWrapper}>
<CollapsableSection <CollapsableSection
isOpen={false} isOpen={Boolean(sectionExpanded)}
onToggle={(isOpen) => setSectionExpanded(isOpen)}
className={styles.collapseWrapper} className={styles.collapseWrapper}
contentClassName={styles.collapseContent} contentClassName={styles.collapseContent}
label={ label={