import { FileText, Eye, Tag, Users } from "lucide-react";
import { prisma } from "@/lib/db";

export const dynamic = "force-dynamic";

async function getStats() {
  const [articles, published, drafts, categories, totalViews] = await Promise.all([
    prisma.article.count(),
    prisma.article.count({ where: { status: "published" } }),
    prisma.article.count({ where: { status: "draft" } }),
    prisma.category.count(),
    prisma.article.aggregate({ _sum: { viewCount: true } }),
  ]);
  return { articles, published, drafts, categories, totalViews: totalViews._sum.viewCount ?? 0 };
}

export default async function AdminDashboard() {
  const s = await getStats();

  return (
    <div>
      <h1 className="font-display text-2xl lg:text-3xl font-bold mb-1">Tổng quan</h1>
      <p className="text-sm text-ink-muted mb-6">
        Số liệu sống cập nhật mỗi request — không cache.
      </p>

      <div className="grid gap-3 grid-cols-2 lg:grid-cols-4">
        <StatCard label="Bài viết" value={s.articles} hint={`${s.published} đăng · ${s.drafts} nháp`} Icon={FileText} />
        <StatCard label="Chuyên mục" value={s.categories} Icon={Tag} />
        <StatCard label="Lượt xem" value={s.totalViews.toLocaleString("vi-VN")} Icon={Eye} />
        <StatCard label="Author" value={1} hint="ahem you" Icon={Users} />
      </div>

      <div className="mt-10 rounded-xl border border-stroke-subtle bg-bg-elevated/40 p-6">
        <h2 className="font-display text-lg font-semibold mb-2">Bắt đầu</h2>
        <ul className="text-sm text-ink-secondary space-y-2">
          <li>
            ➊ <a href="/admin/articles/new" className="text-brand hover:underline">Tạo bài viết mới</a>{" "}
            — chọn chuyên mục, viết hoặc dùng AI Writer
          </li>
          <li>
            ➋ <a href="/admin/super-seo" className="text-brand hover:underline">Cấu hình SEO mặc định</a>{" "}
            — title template, OG, JSON-LD
          </li>
          <li>
            ➌ <a href="/admin/api-tokens" className="text-brand hover:underline">Sinh API token</a>{" "}
            — để tự động đăng bài từ ngoài vào
          </li>
          <li>
            ➍ <a href="/admin/settings" className="text-brand hover:underline">Cấu hình AI provider</a>{" "}
            — endpoint OpenAI-compatible + API key
          </li>
        </ul>
      </div>
    </div>
  );
}

function StatCard({
  label,
  value,
  hint,
  Icon,
}: {
  label: string;
  value: string | number;
  hint?: string;
  Icon: typeof FileText;
}) {
  return (
    <div className="rounded-xl border border-stroke-subtle bg-bg-elevated/40 p-5">
      <div className="flex items-center justify-between">
        <span className="text-[11px] uppercase tracking-[0.18em] text-ink-muted">{label}</span>
        <Icon className="h-4 w-4 text-brand/70" />
      </div>
      <div className="font-display text-3xl font-semibold mt-2">{value}</div>
      {hint ? <div className="text-xs text-ink-muted mt-1">{hint}</div> : null}
    </div>
  );
}
