'use client'

import Link from 'next/link'
import { LayoutDashboard, Users, Home, FileText, Briefcase, Tags, LogOut } from 'lucide-react'
import { signOut } from 'next-auth/react'

const links = [
  { href: '/admin', label: 'Dashboard', icon: LayoutDashboard },
  { href: '/admin/listings', label: 'Listings', icon: Home },
  { href: '/admin/categories', label: 'Categories', icon: Tags },
  { href: '/admin/agents', label: 'Agents', icon: Users },
  { href: '/admin/crm', label: 'CRM', icon: Briefcase },
  { href: '/admin/audit', label: 'Audit log', icon: FileText },
]

interface AdminSidebarProps {
  name: string
  email: string
}

export function AdminSidebar({ name, email }: AdminSidebarProps) {
  return (
    <aside className="w-64 bg-[#1D2019] text-white min-h-screen p-6 flex flex-col">
      <h2 className="text-xl font-bold mb-1">Admin</h2>
      <p className="text-xs text-gray-400 mb-8">Kevin Victor Real Estate</p>
      <nav className="space-y-2 flex-1">
        {links.map(({ href, label, icon: Icon }) => (
          <Link
            key={href}
            href={href}
            className="flex items-center gap-3 px-4 py-2 rounded-lg hover:bg-[#374527] transition"
          >
            <Icon size={18} />
            {label}
          </Link>
        ))}
      </nav>
      <div className="border-t border-gray-700 pt-4">
        <p className="text-sm font-medium truncate">{name}</p>
        <p className="text-xs text-gray-400 mb-3 truncate">{email}</p>
        <button
          onClick={() => signOut({ callbackUrl: '/login' })}
          className="flex items-center gap-2 text-sm text-gray-300 hover:text-white transition"
        >
          <LogOut size={16} />
          Sign out
        </button>
      </div>
    </aside>
  )
}