import Link from "next/link";

import { PublicPostArchiveList } from "@/components/PublicPostArchiveList";
import { getApiBaseUrl } from "@/lib/api";
import { fetchPublicPosts } from "@/lib/posts";

type SearchParams = Promise<{ page?: string }>;

export default async function PostsListPage({ searchParams }: { searchParams: SearchParams }) {
  const sp = await searchParams;
  const page = Math.max(1, parseInt(sp.page ?? "1", 10) || 1);
  const pageSize = 10;

  let data;
  let error: string | null = null;
  try {
    data = await fetchPublicPosts({ page, pageSize });
  } catch (e) {
    error = e instanceof Error ? e.message : "Chưa mở được sổ bài.";
    data = { items: [], page: 1, pageSize, total: 0 };
  }

  const totalPages = Math.max(1, Math.ceil(data.total / data.pageSize));
  const hasApi = Boolean(getApiBaseUrl());

  const hrefForPage = (p: number) => (p <= 1 ? "/posts" : `/posts?page=${p}`);

  return (
    <main className="mx-auto max-w-[1100px] px-4 py-12 sm:px-8 sm:py-20 lg:py-24">
      {/* Page title + intro */}
      <header className="mx-auto max-w-3xl text-center">
        <div className="ctkp-rule mx-auto mb-6 w-24 sm:mb-8" aria-hidden />
        <h1 className="font-ctkp-display text-pretty text-[clamp(1.75rem,6.5vw,3rem)] font-semibold leading-[1.12] tracking-tight text-stone-100 sm:text-5xl sm:leading-[1.08]">
          Sổ bài đã ấn
        </h1>
        <p className="mx-auto mt-5 max-w-2xl text-pretty text-base leading-[1.82] text-stone-400 sm:mt-6 sm:leading-[1.75]">
          Những trang đã được ấn định trên cổ thư — mỗi bài là một nhịp trong kho tàng. Lật từng thiên
          để đọc lời xưa còn vang.
        </p>
        <p className="mt-5 text-sm leading-relaxed text-stone-500">
          Chỉ những thiên đã ấn định mới hiện — lấy từ nguồn chữ công khai.
          {data.total > 0 ? (
            <span className="mt-2 block font-medium text-amber-200/45">
              {data.total} thiên ghi nhận · đang xem trang {page}
            </span>
          ) : null}
          {error ? (
            <span className="mt-3 block rounded-lg border border-amber-900/25 bg-amber-950/15 px-3 py-2 text-amber-100/75">
              {error}
            </span>
          ) : null}
        </p>
        <div className="ctkp-rule mx-auto mt-10 max-w-xs" aria-hidden />
      </header>

      <PublicPostArchiveList
        items={data.items}
        page={page}
        totalPages={totalPages}
        hrefForPage={hrefForPage}
        emptyTitle={
          !hasApi
            ? "Chưa nối nguồn chữ"
            : error
              ? "Sổ chưa mở được"
              : "Sổ còn im"
        }
        emptyMessage={
          !hasApi ? (
            <>
              Để lật các thiên đã ấn, cần nối ứng dụng tới máy chủ nội dung. Kiểm tra cấu hình triển khai, rồi làm
              mới trang — không cần vội.
            </>
          ) : error ? (
            <>Cổ thư chưa nhận được trang. Thử lại sau; dòng báo gợi ý nằm phía trên.</>
          ) : (
            <>
              Chưa có thiên nào ấn định, hoặc sổ này chưa được gán bài. Khi có trang mới, chúng sẽ hiện dần ở đây.
            </>
          )
        }
      />

      <div className="ctkp-rule mx-auto mt-16 max-w-[10rem] opacity-50 sm:mt-20" aria-hidden />
      <p className="pb-4 text-center sm:pb-2">
        <Link href="/" className="ctkp-text-link text-sm">
          ← Về trang chủ
        </Link>
      </p>
    </main>
  );
}