setrip/app/(public)/verify/page.tsx

import { redirect } from "next/navigation";
import Link from "next/link";
import { Clock, RefreshCw, CircleX, ArrowLeft } from "lucide-react";
import { getServerSession } from "next-auth";
import { authOptions } from "@/lib/auth";
import { organizerService } from "@/server/services/organizer.service";
import { VerifyForm } from "@/features/organizer/components/verify-form";
import { VerifiedBadge } from "@/components/shared/verified-badge";

function reuploadFieldLabel(field: string): string {
  switch (field) {
    case "ktpImage":
      return "Foto KTP";
    case "liveness":
      return "Foto liveness (pegang kertas SETRIP)";
    case "nik":
      return "NIK";
    case "bankInfo":
      return "Info rekening";
    case "address":
      return "Alamat";
    default:
      return field;
  }
}

export default async function VerifyPage() {
  const session = await getServerSession(authOptions);
  if (!session?.user) {
    redirect("/login?callbackUrl=/verify");
  }

  const verification = await organizerService.getStatusForUser(session.user.id);

  const initial = verification
    ? {
        fullName: verification.fullName,
        nik: organizerService.decryptNik(verification.nikEncrypted),
        birthDate: verification.birthDate,
        address: verification.address,
        ktpImageKey: verification.ktpImageKey,
        livenessKey: verification.livenessKey,
        bankName: verification.bankName,
        bankAccountNumber: verification.bankAccountNumber,
        bankAccountName: verification.bankAccountName,
      }
    : null;

  return (
    <div className="mx-auto max-w-2xl px-4 py-8 sm:py-12">
      <div className="mb-6">
        <h1 className="text-2xl font-bold text-neutral-900 sm:text-3xl">
          Verifikasi Organizer
        </h1>
        <p className="mt-2 text-sm text-neutral-600">
          Lengkapi data berikut untuk mengaktifkan kemampuan membuat trip berbayar.
        </p>
      </div>

      {verification?.status === "APPROVED" && (
        <div className="mb-6 rounded-2xl border border-primary-200 bg-primary-50 p-5">
          <div className="mb-2 flex items-center gap-2">
            <VerifiedBadge size="md" />
            <span className="text-sm font-semibold text-primary-800">
              Akun terverifikasi
            </span>
          </div>
          <p className="text-sm text-neutral-700">
            Selamat! Kamu sudah bisa membuat trip berbayar.
          </p>
        </div>
      )}

      {verification?.status === "PENDING" && !verification.reuploadRequested && (
        <div className="mb-6 rounded-2xl border border-amber-200 bg-amber-50 p-5">
          <p className="mb-1 flex items-center gap-1.5 text-sm font-bold text-amber-800">
            <Clock size={15} strokeWidth={2} aria-hidden />
            Menunggu review admin
          </p>
          <p className="text-sm text-neutral-700">
            Pengajuanmu sedang diproses. Kami akan memberitahu via email setelah selesai.
          </p>
        </div>
      )}

      {verification?.reuploadRequested && (
        <div className="mb-6 rounded-2xl border-2 border-amber-400 bg-amber-50 p-5">
          <p className="mb-1 flex items-center gap-1.5 text-sm font-bold text-amber-900">
            <RefreshCw size={15} strokeWidth={2} aria-hidden />
            Admin minta kamu upload ulang
          </p>
          {verification.reuploadNote && (
            <p className="mb-3 text-sm text-neutral-700">
              <span className="font-semibold">Catatan admin:</span>{" "}
              {verification.reuploadNote}
            </p>
          )}
          {verification.reuploadFields.length > 0 && (
            <div className="mb-3">
              <p className="mb-1 text-xs font-semibold text-amber-900">
                Field yang perlu di-upload ulang:
              </p>
              <ul className="ml-4 list-disc text-xs text-neutral-700">
                {verification.reuploadFields.map((f) => (
                  <li key={f}>
                    <span className="font-semibold">
                      {reuploadFieldLabel(f)}
                    </span>
                  </li>
                ))}
              </ul>
            </div>
          )}
          <p className="text-xs text-neutral-700">
            Submit ulang form di bawah dengan data/foto yang sudah diperbaiki.
            Setelah submit, banner ini hilang otomatis.
          </p>
        </div>
      )}

      {verification?.status === "REJECTED" && (
        <div className="mb-6 rounded-2xl border border-red-200 bg-red-50 p-5">
          <p className="mb-1 flex items-center gap-1.5 text-sm font-bold text-red-800">
            <CircleX size={15} strokeWidth={2} aria-hidden />
            Pengajuan ditolak
          </p>
          {verification.rejectionReason && (
            <p className="text-sm text-neutral-700">
              <span className="font-semibold">Alasan:</span>{" "}
              {verification.rejectionReason}
            </p>
          )}
          <p className="mt-2 text-sm text-neutral-700">
            Kamu bisa memperbaiki data dan mengajukan ulang di bawah.
          </p>
        </div>
      )}

      {(verification?.status !== "APPROVED" &&
        (verification?.status !== "PENDING" ||
          verification?.reuploadRequested)) && <VerifyForm initial={initial} />}

      <p className="mt-6 text-center text-sm text-neutral-500">
        <Link
          href="/profile"
          className="inline-flex items-center gap-1 hover:text-primary-600"
        >
          <ArrowLeft size={14} strokeWidth={1.75} aria-hidden />
          Kembali ke profil
        </Link>
      </p>
    </div>
  );
}