import Link from "next/link";
import {
  Globe,
  Sparkles,
  FileText,
  Users,
  BookOpen,
  Calendar,
  DollarSign,
  HelpCircle,
  Phone,
} from "lucide-react";

const CARDS = [
  { href: "/admin/meta", label: "SEO / Мета", icon: Globe, desc: "Заголовок и описание сайта" },
  { href: "/admin/hero", label: "Главный экран", icon: Sparkles, desc: "Заголовок, подзаголовок, кнопка" },
  { href: "/admin/about", label: "О студии", icon: FileText, desc: "Текст о студии" },
  { href: "/admin/team", label: "Команда", icon: Users, desc: "Тренеры и инструкторы" },
  { href: "/admin/classes", label: "Направления", icon: BookOpen, desc: "Типы занятий" },
  { href: "/admin/schedule", label: "Расписание", icon: Calendar, desc: "Расписание занятий" },
  { href: "/admin/pricing", label: "Цены", icon: DollarSign, desc: "Абонементы и аренда" },
  { href: "/admin/faq", label: "FAQ", icon: HelpCircle, desc: "Часто задаваемые вопросы" },
  { href: "/admin/contact", label: "Контакты", icon: Phone, desc: "Адреса, телефон, карта" },
];

export default function AdminDashboard() {
  return (
    <div>
      <h1 className="text-2xl font-bold">Панель управления</h1>
      <p className="mt-1 text-neutral-400">Выберите раздел для редактирования</p>

      <div className="mt-8 grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
        {CARDS.map((card) => {
          const Icon = card.icon;
          return (
            <Link
              key={card.href}
              href={card.href}
              className="group rounded-xl border border-white/10 bg-neutral-900 p-5 transition-all hover:border-gold/30 hover:bg-neutral-900/80"
            >
              <div className="flex items-center gap-3">
                <div className="flex h-10 w-10 items-center justify-center rounded-lg bg-gold/10 text-gold">
                  <Icon size={20} />
                </div>
                <div>
                  <h2 className="font-medium text-white group-hover:text-gold transition-colors">
                    {card.label}
                  </h2>
                  <p className="text-xs text-neutral-500">{card.desc}</p>
                </div>
              </div>
            </Link>
          );
        })}
      </div>
    </div>
  );
}
