import type { Metadata } from "next";
import { Suspense } from "react";
import { cookies } from "next/headers";
import MediaLibrary from "./MediaLibrary";
import { authCookieHeader } from "@/lib/cookies";
import { fetchAdminMediaLibrary, type MediaLibraryItem } from "@/lib/api";
import { getMeCached } from "@/lib/serverData";
import { isSuperOrOwner } from "@/lib/roles";
import Forbidden from "../Forbidden";
import AdminPageHeader from "@/components/admin/AdminPageHeader";
import { Images } from "lucide-react";

export const metadata: Metadata = {
  title: "媒体库",
};

export default async function AdminMediaPage() {
  const cookie = authCookieHeader(await cookies());
  const me = await getMeCached(cookie || undefined);
  if (!me.user || !isSuperOrOwner(me.user.role)) {
    return <Forbidden text="媒体库仅超级管理员及以上角色可查看。" />;
  }

  let items: MediaLibraryItem[] = [];
  let counts: Record<string, number> = {};
  let total = 0;
  let initError = "";
  try {
    const res = await fetchAdminMediaLibrary(cookie || undefined);
    items = res.items ?? [];
    counts = res.counts ?? {};
    total = res.total ?? 0;
  } catch (e) {
    initError = e instanceof Error ? e.message : "加载失败";
  }

  return (
    <div>
      <AdminPageHeader
        icon={Images}
        title="媒体库"
        description={`站点内全部图片资源盘点（共 ${total} 张）。同名图片同时存在原图与 WebP 时仅展示 WebP，点开可查看原图。`}
      />
      <Suspense fallback={<p className="meta px-1 py-6">加载中…</p>}>
        <MediaLibrary items={items} counts={counts} total={total} initError={initError} />
      </Suspense>
    </div>
  );
}