function MenuNode()

in ui/src/components/AccordionNav/index.tsx [31:112]
79 lines of code
12 McCabe index (conditional complexity)

function MenuNode({
  menu,
  callback,
  activeKey,
  expanding = false,
  path = '/',
}) {
  const { t } = useTranslation('translation', { keyPrefix: 'nav_menus' });
  const isLeaf = !menu.children.length;
  const href = isLeaf ? `${path}${menu.path}` : '#';

  return (
    <Nav.Item key={menu.path} className="w-100">
      {isLeaf ? (
        <Nav.Link
          eventKey={menu.path}
          as={NavLink}
          to={href}
          onClick={(evt) => {
            callback(evt, menu, href, isLeaf);
          }}
          className={classNames(
            'text-nowrap d-flex flex-nowrap align-items-center w-100',
            { expanding, active: activeKey === menu.path },
          )}>
          {menu?.icon && <Icon name={menu.icon} className="me-2" />}

          <span className="me-auto text-truncate">
            {menu.displayName ? menu.displayName : t(menu.name)}
          </span>
          {menu.badgeContent ? (
            <span className="badge text-bg-dark">{menu.badgeContent}</span>
          ) : null}
          {!isLeaf && (
            <Icon className="collapse-indicator" name="chevron-right" />
          )}
        </Nav.Link>
      ) : (
        <Nav.Link
          eventKey={menu.path}
          as="button"
          href={href}
          onClick={(evt) => {
            callback(evt, menu, href, isLeaf);
          }}
          className={classNames(
            'text-nowrap d-flex flex-nowrap align-items-center w-100',
            { expanding, active: activeKey === menu.path },
          )}>
          {menu?.icon && <Icon name={menu.icon} className="me-2" />}
          <span className="me-auto text-truncate">
            {menu.displayName ? menu.displayName : t(menu.name)}
          </span>
          {menu.badgeContent ? (
            <span className="badge text-bg-dark">{menu.badgeContent}</span>
          ) : null}
          {!isLeaf && (
            <Icon className="collapse-indicator" name="chevron-right" />
          )}
        </Nav.Link>
      )}

      {menu.children.length ? (
        <Accordion.Collapse eventKey={menu.path} className="ms-4">
          <>
            {menu.children.map((leaf) => {
              return (
                <MenuNode
                  menu={leaf}
                  callback={callback}
                  activeKey={activeKey}
                  path={path}
                  key={leaf.path}
                />
              );
            })}
          </>
        </Accordion.Collapse>
      ) : null}
    </Nav.Item>
  );
}