AccordionMenuItem() — supabase Function Reference

Architecture documentation for the AccordionMenuItem() function in GlobalMobileMenu.tsx from the supabase codebase.

Function tsx DocumentationSystem ReferenceGen calls 1

Entity Profile

DocumentationSystem→ ReferenceGen→ AccordionMenuItem() — supabase Function Reference

Dependency Diagram

graph TD
  66f8c08c_e430_be77_02f9_6c4b92fbbc4e["AccordionMenuItem()"]
  6b24c547_76b2_a6b3_c5ce_f64931f9696a["useActiveMenuLabel()"]
  66f8c08c_e430_be77_02f9_6c4b92fbbc4e -->|calls| 6b24c547_76b2_a6b3_c5ce_f64931f9696a
  style 66f8c08c_e430_be77_02f9_6c4b92fbbc4e fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/docs/components/Navigation/NavigationMenu/GlobalMobileMenu.tsx lines 35–85

const AccordionMenuItem = ({ section }: { section: DropdownMenuItem[] }) => {
  const activeLabel = useActiveMenuLabel(GLOBAL_MENU_ITEMS)

  return (
    <m.div
      variants={listItem}
      className="border-b border-muted [&>div]:!rounded-none [&_div[data-state=open]>div]:py-1"
      key={section[0].label}
    >
      {section[0].menuItems ? (
        <Accordion.Item
          header={section[0].label}
          id={section[0].label}
          className={cn(
            'relative',
            activeLabel === section[0].label && '!text-foreground',
            itemClassName
          )}
        >
          {section[0].menuItems?.map((menuItem, menuItemIndex) => (
            <Fragment key={`desktop-docs-menu-section-${menuItemIndex}`}>
              {menuItem
                .filter((item) => item.enabled !== false)
                .map((item) =>
                  !item.href ? (
                    <div className="font-mono tracking-wider flex items-center text-foreground-muted text-xs uppercase rounded-md p-2 leading-none">
                      {item.label}
                    </div>
                  ) : (
                    <MenuItem
                      href={item.href}
                      title={item.label}
                      community={item.community}
                      icon={item.icon}
                    />
                  )
                )}
            </Fragment>
          ))}
        </Accordion.Item>
      ) : (
        <Link
          href={section[0].href || '#'}
          className={cn(activeLabel === section[0].label && '!text-foreground', itemClassName)}
        >
          {section[0].label}
        </Link>
      )}
    </m.div>
  )
}