diff --git a/packages/web/components/templates/navMenu/NavigationMenu.tsx b/packages/web/components/templates/navMenu/NavigationMenu.tsx index 2f442c9b6..bf12a1852 100644 --- a/packages/web/components/templates/navMenu/NavigationMenu.tsx +++ b/packages/web/components/templates/navMenu/NavigationMenu.tsx @@ -57,6 +57,8 @@ export type Shortcut = { label?: Label join?: string + + children?: Shortcut[] } type NavigationMenuProps = { @@ -93,7 +95,20 @@ export function NavigationMenu(props: NavigationMenuProps): JSX.Element { zIndex: 5, }} > + {/* This gives a header when scrolling so the menu button is visible still */} + + @@ -518,8 +533,38 @@ const ShortcutsTree = (props: ShortcutsTreeProps): JSX.Element => { [tree, router] ) + function countTotalShortcuts(shortcuts: Shortcut[]): number { + let total = 0 + + for (const shortcut of shortcuts) { + // Count the current shortcut + total++ + + // If the shortcut has children, recursively count them + if (shortcut.children && shortcut.children.length > 0) { + total += countTotalShortcuts(shortcut.children) + } + } + + return total + } + + const maximumHeight = useMemo(() => { + // recurse the tree + return countTotalShortcuts(data as Shortcut[]) * 36 + }, [data]) + + console.log('maximumHeight: ', maximumHeight) + return ( -
+ {!isValidating && ( { rowHeight={36} initialOpenState={folderOpenState} width={width} - height={640} + height={maximumHeight} > {NodeRenderer} )} -
+ ) }