mirror of
https://github.com/fosrl/pangolin.git
synced 2025-05-12 21:30:35 +01:00
improve sidebar rendering
This commit is contained in:
parent
237960fc5b
commit
1ff3a9b2f9
1 changed files with 24 additions and 32 deletions
|
@ -37,7 +37,30 @@ export function SidebarNav({
|
|||
const niceId = params.niceId as string;
|
||||
const resourceId = params.resourceId as string;
|
||||
const userId = params.userId as string;
|
||||
const [expandedItems, setExpandedItems] = useState<Set<string>>(new Set());
|
||||
const [expandedItems, setExpandedItems] = useState<Set<string>>(() => {
|
||||
const autoExpanded = new Set<string>();
|
||||
|
||||
function findAutoExpandedAndActivePath(
|
||||
items: SidebarNavItem[],
|
||||
parentHrefs: string[] = []
|
||||
) {
|
||||
items.forEach((item) => {
|
||||
const hydratedHref = hydrateHref(item.href);
|
||||
const currentPath = [...parentHrefs, hydratedHref];
|
||||
|
||||
if (item.autoExpand || pathname.startsWith(hydratedHref)) {
|
||||
currentPath.forEach((href) => autoExpanded.add(href));
|
||||
}
|
||||
|
||||
if (item.children) {
|
||||
findAutoExpandedAndActivePath(item.children, currentPath);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
findAutoExpandedAndActivePath(items);
|
||||
return autoExpanded;
|
||||
});
|
||||
const { licenseStatus, isUnlocked } = useLicenseStatusContext();
|
||||
|
||||
const { user } = useUserContext();
|
||||
|
@ -50,37 +73,6 @@ export function SidebarNav({
|
|||
.replace("{userId}", userId);
|
||||
}
|
||||
|
||||
// Initialize expanded items based on autoExpand property and current path
|
||||
useEffect(() => {
|
||||
const autoExpanded = new Set<string>();
|
||||
|
||||
function findAutoExpandedAndActivePath(
|
||||
items: SidebarNavItem[],
|
||||
parentHrefs: string[] = []
|
||||
) {
|
||||
items.forEach((item) => {
|
||||
const hydratedHref = hydrateHref(item.href);
|
||||
|
||||
// Add current item's href to the path
|
||||
const currentPath = [...parentHrefs, hydratedHref];
|
||||
|
||||
// Auto expand if specified or if this item or any child is active
|
||||
if (item.autoExpand || pathname.startsWith(hydratedHref)) {
|
||||
// Expand all parent sections when a child is active
|
||||
currentPath.forEach((href) => autoExpanded.add(href));
|
||||
}
|
||||
|
||||
// Recursively check children
|
||||
if (item.children) {
|
||||
findAutoExpandedAndActivePath(item.children, currentPath);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
findAutoExpandedAndActivePath(items);
|
||||
setExpandedItems(autoExpanded);
|
||||
}, [items, pathname]);
|
||||
|
||||
function toggleItem(href: string) {
|
||||
setExpandedItems((prev) => {
|
||||
const newSet = new Set(prev);
|
||||
|
|
Loading…
Reference in a new issue