import React from 'react'
import { useRouter } from 'next/router'
import Link from 'next/link'

import styles from './adminNav.module.css'

export default function AdminNav({}){
  const {asPath: fullpath} = useRouter()
  const withoutQuery = fullpath.split('?')[0]

  const adminRoutes = new RegExp('^/admin(/.*|$)')

  if(!withoutQuery.match(adminRoutes))
    return null

  return (
    <div className={styles.adminBar}>
      <Link href="/admin/items"><a>Items</a></Link>
      <Link href="/admin/categories"><a>Categories</a></Link>
      <Link href="/admin/users"><a>Users</a></Link>
      <Link href="/admin/shipping"><a>Shipping</a></Link>
    </div>
  )
}