import { NavMenuPortal } from '@tidbcloud/uikit/biz'

import { useNextGenMode } from 'dbaas/features/Organization/mode'
import { NavMenu } from 'dbaas/layouts/v5/SideNavbar/components/NavMenu'

import { useOrgSettingsNavList } from './Navbar'

export const OrgSettingsShell = ({ children }: React.PropsWithChildren<{}>) => {
  const enabledNavList = useOrgSettingsNavList()
  const { isNextGen } = useNextGenMode()
  return (
    <>
      {!isNextGen && (
        <NavMenuPortal>
          <NavMenu navList={enabledNavList} defaultOpenedSub />
        </NavMenuPortal>
      )}
      {children}
    </>
  )
}