Home / Function/ SidebarSkeleton() — supabase Function Reference

SidebarSkeleton() — supabase Function Reference

Architecture documentation for the SidebarSkeleton() function in MainSkeleton.tsx from the supabase codebase.

Entity Profile

Dependency Diagram

graph TD
  e211d40b_0256_3b3c_951b_d9a9b265c15e["SidebarSkeleton()"]
  9b299289_e1d2_9370_40e3_8e057fa3d09a["getMenuId()"]
  e211d40b_0256_3b3c_951b_d9a9b265c15e -->|calls| 9b299289_e1d2_9370_40e3_8e057fa3d09a
  eb196185_fb88_9716_d1f2_9f9f9226152c["useMenuMobileOpen()"]
  e211d40b_0256_3b3c_951b_d9a9b265c15e -->|calls| eb196185_fb88_9716_d1f2_9f9f9226152c
  style e211d40b_0256_3b3c_951b_d9a9b265c15e fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/docs/layouts/MainSkeleton.tsx lines 376–431

function SidebarSkeleton({
  children,
  menuId: _menuId,
  menuName,
  NavigationMenu,
  hideFooter = !footerEnabled,
  className,
  hideSideNav,
  additionalNavItems,
}: SkeletonProps) {
  const pathname = usePathname()
  const menuId = _menuId ?? getMenuId(pathname)

  const mobileMenuOpen = useMenuMobileOpen()

  return (
    <div className={cn('flex flex-row h-full relative', className)}>
      {!hideSideNav && (
        <NavContainer>
          {NavigationMenu ?? (
            <DefaultNavigationMenu menuId={menuId} additionalNavItems={additionalNavItems} />
          )}
        </NavContainer>
      )}
      <Container>
        <div
          className={cn(
            'flex lg:hidden w-full top-0 left-0 right-0 z-50',
            hideSideNav && 'sticky',
            mobileMenuOpen && 'z-10'
          )}
        >
          <TopNavBar />
        </div>
        <div
          className={cn(
            'sticky',
            'transition-all top-0 z-10',
            'backdrop-blur backdrop-filter bg-background'
          )}
        >
          {hideSideNav ? null : menuName ? (
            <MobileHeader menuName={menuName} />
          ) : (
            <MobileHeader menuId={menuId} />
          )}
        </div>
        <div className="grow">
          {children}
          {!hideFooter && <Footer />}
        </div>
        <MobileMenuBackdrop />
      </Container>
    </div>
  )
}

Subdomains

Frequently Asked Questions

What does SidebarSkeleton() do?
SidebarSkeleton() is a function in the supabase codebase.
What does SidebarSkeleton() call?
SidebarSkeleton() calls 2 function(s): getMenuId, useMenuMobileOpen.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free