import prisma from '@/lib/prisma'
import { Plus } from 'lucide-react'
import Link from 'next/link'
import CategoryAccordion from './CategoryAccordion'

export const metadata = {
  title: 'Ürün Yönetimi - Admin',
}

export default async function ProductsPage() {
  const categories = await prisma.categories.findMany({
    orderBy: { order_num: 'asc' },
    include: {
      products: {
        orderBy: { id: 'asc' },
      },
    },
  })

  return (
    <div className="space-y-8">
      <div className="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
        <div>
          <h1 className="text-2xl font-extrabold text-slate-900 tracking-tight">Ürün Yönetimi</h1>
          <p className="text-sm text-slate-500 mt-1">Tüm kategorilerdeki ürünlerinizi görüntüleyin ve düzenleyin.</p>
        </div>
        <Link href="/admin/products/new" className="bg-blue-600 hover:bg-blue-700 text-white px-5 py-2.5 rounded-xl font-medium flex items-center gap-2 transition-all shadow-sm hover:shadow-md hover:-translate-y-0.5">
          <Plus size={18} /> Yeni Ürün Ekle
        </Link>
      </div>

      <div className="space-y-4">
        {categories.map((category) => {
          const serializedCategory = {
            ...category,
            products: category.products.map(p => ({
              ...p,
              price: p.price ? p.price.toString() : '0'
            }))
          }
          return (
            <CategoryAccordion 
              key={category.id} 
              category={serializedCategory as any} 
              defaultOpen={false} 
            />
          )
        })}
      </div>
    </div>
  )
}