import { Card } from "@/components/ui/card";
import { requireAdmin } from "@/lib/auth";
import { UploadClient } from "@/app/(app)/upload/upload-client";
import { getRegionMembers } from "@/lib/regions";

export default async function UploadPage({
  searchParams,
}: {
  searchParams: Promise<{ scope?: string }>;
}) {
  const viewer = await requireAdmin();
  const params = await searchParams;
  const requestedScope = (params.scope ?? "").trim().toUpperCase();
  const selectedScopeCountries =
    viewer.role === "admin" ? getRegionMembers(requestedScope) : [];
  const selectedScope = selectedScopeCountries.length > 0 ? requestedScope : "";

  return (
    <>
      <Card className="bg-[linear-gradient(120deg,#ffffff_0%,#f4f9ff_62%,#fff4e9_100%)]">
        <p className="caption text-xs uppercase tracking-[0.2em] text-[#2663AC]">VEEVA Data Ingest</p>
        <h2 className="mt-2 text-3xl font-black tracking-tight text-slate-900">Import Otsuka VAE Data</h2>
        <p className="mt-2 text-sm text-slate-600">
          Upload an Excel workbook or CSV, preview normalized rows, then commit merge updates into
          canonical VEEVA email events keyed by <code>Sent Email Name</code>.
        </p>
      </Card>

      <UploadClient
        role={viewer.role}
        allowedCountries={viewer.allowedCountries}
        selectedScope={selectedScope}
        selectedScopeCountries={selectedScopeCountries}
      />
    </>
  );
}
