'use client'

import { usePathname } from 'next/navigation'

const navItems = [
  { href: '/dashboard', label: 'Filamenti' },
  { href: '/upadaj/colors', label: 'Boje' },
  { href: '/upadaj/requests', label: 'Zahtevi za boje' },
  { href: '/upadaj/sales', label: 'Prodaja' },
  { href: '/upadaj/customers', label: 'Kupci' },
  { href: '/upadaj/analytics', label: 'Analitika' },
]

export function AdminSidebar() {
  const pathname = usePathname()

  return (
    <div className="w-64 bg-white dark:bg-gray-800 shadow-lg h-screen sticky top-0 flex-shrink-0">
      <div className="p-6">
        <h2 className="text-xl font-bold text-gray-900 dark:text-white mb-6">Admin Panel</h2>
        <nav className="space-y-2">
          {navItems.map((item) => {
            const isActive = pathname === item.href
            return (
              <a
                key={item.href}
                href={item.href}
                className={`block px-4 py-2 rounded ${
                  isActive
                    ? 'bg-blue-100 dark:bg-blue-900 text-blue-700 dark:text-blue-300'
                    : 'text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700'
                }`}
              >
                {item.label}
              </a>
            )
          })}
        </nav>
      </div>
    </div>
  )
}
