import { PropsWithChildren } from 'react'
import { useUser } from '../app/user/user.ts'
import NavButton from './buttons/NavButton.tsx'

type NavBarProps = unknown

export default function NavBar({ children }: PropsWithChildren<NavBarProps>) {
  const user = useUser()
  const isSuperUser = user?.roles.includes('SuperUser')
  return (
    <nav className={`w-full flex flex-row justify-end gap-4 px-4 md:px-8 py-3`}>
      {children}
      {isSuperUser && <NavButton to={'/admin/codes'}>admin</NavButton>}
    </nav>
  )
}