export function MobileNav()

in beta/src/components/Layout/Nav/MobileNav.tsx [24:63]

38 lines of code
4 McCabe index (conditional complexity)


export function MobileNav() {
  const {pathname} = useRouter();
  const [section, setSection] = React.useState(() => inferSection(pathname));

  let tree = null;
  switch (section) {
    case 'home':
      tree = sidebarHome.routes[0];
      break;
    case 'learn':
      tree = sidebarLearn.routes[0];
      break;
    case 'apis':
      tree = sidebarReference.routes[0];
      break;
  }

  return (
    <>
      <div className="sticky top-0 px-5 mb-2 bg-wash dark:bg-wash-dark flex justify-end border-b border-border dark:border-border-dark items-center self-center w-full z-10">
        <TabButton
          isActive={section === 'home'}
          onClick={() => setSection('home')}>
          Home
        </TabButton>
        <TabButton
          isActive={section === 'learn'}
          onClick={() => setSection('learn')}>
          Learn
        </TabButton>
        <TabButton
          isActive={section === 'apis'}
          onClick={() => setSection('apis')}>
          API
        </TabButton>
      </div>
      <SidebarRouteTree routeTree={tree as RouteItem} isMobile={true} />
    </>
  );
}