function NavDrawer()

in theme/src/components/nav-drawer.js [42:82]
41 lines of code
2 McCabe index (conditional complexity)

function NavDrawer({isOpen, onDismiss}) {
  const siteMetadata = useSiteMetadata()
  return (
    <Drawer isOpen={isOpen} onDismiss={onDismiss}>
      <Flex
        style={{overflow: 'auto', WebkitOverflowScrolling: 'touch'}}
        sx={{flexDirection: 'column', height: '100%', bg: 'canvas.default'}}
      >
        <Flex sx={{flexDirection: 'column', flex: '0 0 auto', color: 'fg.default', bg: 'canvas.default'}}>
          <BorderBox sx={{borderWidth: 0, borderRadius: 0, borderBottomWidth: 1, borderColor: 'border.muted'}}>
            <Flex sx={{py: 3, pl: 4, pr: 3, alignItems: 'center', justifyContent: 'space-between'}}>
              <Link href="https://primer.style" sx={{fontFamily: 'mono', color: 'inherit'}}>
                Primer
              </Link>
              <Button aria-label="Close" onClick={onDismiss}>
                <XIcon />
              </Button>
            </Flex>
          </BorderBox>
          <Flex sx={{flexDirection: 'column'}}>
            <PrimerNavItems items={primerNavItems} />
          </Flex>
        </Flex>
        {navItems.length > 0 ? (
          <ThemeProvider colorMode="day">
            <Flex sx={{flexDirection: 'column', flex: '1 0 auto', color: 'fg.default', bg: 'canvas.default'}}>
              <Link
                as={GatsbyLink}
                to="/"
                sx={{display: 'inline-block', color: 'inherit', fontFamily: 'mono', mx: 4, my: 4}}
              >
                {siteMetadata.title}
              </Link>
              <NavItems items={navItems} />
            </Flex>
          </ThemeProvider>
        ) : null}
      </Flex>
    </Drawer>
  )
}