import { prisma } from '@peyzajart/db'
import Link from 'next/link'
import AdminBlogToggle from '../../../components/AdminBlogToggle'

export const dynamic = 'force-dynamic'

export default async function AdminBlogPage() {
  const posts = await prisma.blog.findMany({ orderBy: { createdAt: 'desc' } })

  return (
    <div className="p-6 md:p-8">
      <div className="mb-6 flex items-center justify-between">
        <div>
          <h1 className="font-display text-4xl font-light text-brown">Blog</h1>
          <p className="font-body text-sm text-brown/50 mt-1">{posts.length} yazı</p>
        </div>
        <Link href="/admin/blog/new"
          className="px-5 py-2 rounded-lg bg-brown text-cream font-body text-sm tracking-widest uppercase hover:bg-earth transition-colors">
          + Yeni Yazı
        </Link>
      </div>

      <div className="bg-white shadow-sm rounded-xl overflow-hidden">
        <table className="w-full">
          <thead>
            <tr className="bg-sand/50 text-left">
              {['Başlık', 'Slug', 'Tarih', 'Yayın', ''].map(h => (
                <th key={h} className="px-5 py-3 font-body text-xs text-brown/50 tracking-widest uppercase">{h}</th>
              ))}
            </tr>
          </thead>
          <tbody className="divide-y divide-sand">
            {posts.map(p => (
              <tr key={p.id} className="hover:bg-sand/20 transition-colors">
                <td className="px-5 py-3 font-body text-sm text-brown">{p.titleTr}</td>
                <td className="px-5 py-3 font-mono text-xs text-brown/50">{p.slug}</td>
                <td className="px-5 py-3 font-body text-xs text-brown/50">
                  {new Date(p.createdAt).toLocaleDateString('tr-TR')}
                </td>
                <td className="px-5 py-3">
                  <AdminBlogToggle id={p.id} isPublished={p.isPublished} />
                </td>
                <td className="px-5 py-3">
                  <Link href={`/admin/blog/${p.id}/edit`}
                    className="font-body text-xs text-earth hover:text-brown transition-colors">
                    Düzenle
                  </Link>
                </td>
              </tr>
            ))}
          </tbody>
        </table>
        {posts.length === 0 && (
          <p className="font-body text-sm text-brown/40 p-8 text-center">Henüz yazı yok.</p>
        )}
      </div>
    </div>
  )
}