import type { FC} from 'react'; import React, { useContext } from 'react'; import { context, Link, NavLink } from 'dumi/theme'; import LocaleSelect from './LocaleSelect'; import SlugList from './SlugList'; import './SideMenu.less'; interface INavbarProps { mobileMenuCollapsed: boolean; location: any; } const SideMenu: FC = ({ mobileMenuCollapsed, location }) => { const { config: { logo, title, description, mode, repository: { url: repoUrl }, }, menu, nav: navItems, base, meta, } = useContext(context); const isHiddenMenus = Boolean((meta.hero || meta.features || meta.gapless) && mode === 'site') || meta.sidemenu === false || undefined; return (

{title}

{description}

{/* github star badge */} {/github\.com/.test(repoUrl) && mode === 'doc' && (

)} {/* mobile nav list */} {navItems.length ? (
    {navItems.map(nav => { const child = Boolean(nav.children?.length) && (
      {nav.children.map(item => (
    • {item.title}
    • ))}
    ); return (
  • {nav.path ? {nav.title} : nav.title} {child}
  • ); })}
{/* site mode locale select */}
) : (
{/* doc mode locale select */}
)} {/* menu list */}
    {!isHiddenMenus && menu.map(item => { // always use meta from routes to reduce menu data size const hasSlugs = Boolean(meta.slugs?.length); const hasChildren = item.children && Boolean(item.children.length); const show1LevelSlugs = meta.toc === 'menu' && !hasChildren && hasSlugs && item.path === location.pathname.replace(/([^^])\/$/, '$1'); return (
  • {item.title} {/* group children */} {Boolean(item.children && item.children.length) && (
      {item.children.map(child => (
    • {child.title} {/* group children slugs */} {Boolean( meta.toc === 'menu' && typeof window !== 'undefined' && child.path === location.pathname && hasSlugs, ) && }
    • ))}
    )} {/* group slugs */} {show1LevelSlugs && }
  • ); })}
); }; export default SideMenu;