1import { SidebarNodeProps } from './Sidebar';
2import { SidebarGroup, SidebarCollapsible, SidebarLink } from './index';
3
4export const SidebarSection = ({ route, ...rest }: SidebarNodeProps) => {
5  // If the section or group is hidden, or has no content, we should not render it
6  if (route.hidden || !route.children?.length) {
7    return null;
8  }
9
10  return (
11    <SidebarCollapsible key={`section-${route.name}`} info={route}>
12      <div className="mb-2">
13        {route.children.map(child =>
14          child.type === 'page' ? (
15            <SidebarLink key={`${route.name}-${child.name}`} info={child}>
16              {child.sidebarTitle || child.name}
17            </SidebarLink>
18          ) : (
19            <SidebarGroup
20              {...rest}
21              key={`group-${child.name}-${route.name}`}
22              route={child}
23              parentRoute={route}
24            />
25          )
26        )}
27      </div>
28    </SidebarCollapsible>
29  );
30};
31