"use client";

import { useParams } from "next/navigation";
import useSWR from "swr";
import { Card, Spin, Alert, Descriptions, Typography } from "antd";
import PageHead from "@/app/Components/PageHead";

const { Link } = Typography;

const fetcher = (url) => fetch(url).then((res) => res.json());

export default function KycListsSingle() {
  const params = useParams();
  const id = params?.id;

  const {
    data: getData,
    error,
    isLoading,
  } = useSWR(id ? `/api/kyc?id=${id}` : null, fetcher);

  const kyc = getData?.data?.[0];

  return (
    <>
      <PageHead title="KYC Details" />
      <div className="large-container sm:pt-5">
        <Card title="KYC Information">
          {isLoading ? (
            <div className="p-4 text-center">
              <Spin />
            </div>
          ) : error ? (
            <div className="p-4">
              <Alert message="Failed to load data" type="error" />
            </div>
          ) : !kyc ? (
            <Alert message="No KYC record found" type="info" />
          ) : (
            <Descriptions bordered column={2}>
              <Descriptions.Item label="Customer ID">
                {kyc.customerId}
              </Descriptions.Item>
              <Descriptions.Item label="Legal Name">
                {kyc.legal_name}
              </Descriptions.Item>
              <Descriptions.Item label="Trade Name">
                {kyc.trade_name}
              </Descriptions.Item>
              <Descriptions.Item label="Entity Type">
                {kyc.entity_type}
              </Descriptions.Item>
              <Descriptions.Item label="Other Entity Type">
                {kyc.other_entity_type}
              </Descriptions.Item>
              <Descriptions.Item label="Incorporation Date">
                {kyc.incorporation_date}
              </Descriptions.Item>
              <Descriptions.Item label="Country">
                {kyc.incorporation_country}
              </Descriptions.Item>
              <Descriptions.Item label="Registration Number">
                {kyc.registration_number}
              </Descriptions.Item>
              <Descriptions.Item label="Tax ID">{kyc.tax_id}</Descriptions.Item>

              <Descriptions.Item label="Reg Address" span={2}>
                {kyc.reg_address_1}, {kyc.reg_address_2}, {kyc.reg_city},{" "}
                {kyc.reg_state}, {kyc.reg_country} - {kyc.reg_postal}
              </Descriptions.Item>

              <Descriptions.Item label="Billing Address" span={2}>
                {kyc.bill_same_as_reg === "1"
                  ? "Same as registration address"
                  : `${kyc.bill_address_1}, ${kyc.bill_address_2}, ${kyc.bill_city}, ${kyc.bill_state}, ${kyc.bill_country} - ${kyc.bill_postal}`}
              </Descriptions.Item>

              <Descriptions.Item label="Primary Name">
                {kyc.primary_name}
              </Descriptions.Item>
              <Descriptions.Item label="Designation">
                {kyc.primary_designation}
              </Descriptions.Item>
              <Descriptions.Item label="Phone">
                {kyc.primary_phone}
              </Descriptions.Item>
              <Descriptions.Item label="Email">
                {kyc.primary_email}
              </Descriptions.Item>

              <Descriptions.Item label="Alt Contact">
                {kyc.alt_name}
              </Descriptions.Item>
              <Descriptions.Item label="Alt Designation">
                {kyc.alt_designation}
              </Descriptions.Item>
              <Descriptions.Item label="Alt Phone">
                {kyc.alt_phone}
              </Descriptions.Item>
              <Descriptions.Item label="Alt Email">
                {kyc.alt_email}
              </Descriptions.Item>

              <Descriptions.Item label="Declaration Confirmed">
                {kyc.declaration_confirmed === "1" ? "Yes" : "No"}
              </Descriptions.Item>

              <Descriptions.Item label="Created At">
                {kyc.created_at}
              </Descriptions.Item>

              {/* File attachments */}
              <Descriptions.Item label="Trade License">
                {kyc.doc_trade_license ? (
                  <Link href={kyc.doc_trade_license} target="_blank">
                    View File
                  </Link>
                ) : (
                  "Not uploaded"
                )}
              </Descriptions.Item>

              <Descriptions.Item label="Tax Certificate">
                {kyc.doc_tax_cert ? (
                  <Link href={kyc.doc_tax_cert} target="_blank">
                    View File
                  </Link>
                ) : (
                  "Not uploaded"
                )}
              </Descriptions.Item>

              <Descriptions.Item label="Signatory ID">
                {kyc.doc_signatory_id ? (
                  <Link href={kyc.doc_signatory_id} target="_blank">
                    View File
                  </Link>
                ) : (
                  "Not uploaded"
                )}
              </Descriptions.Item>

              <Descriptions.Item label="Power of Attorney">
                {kyc.doc_poa ? (
                  <Link href={kyc.doc_poa} target="_blank">
                    View File
                  </Link>
                ) : (
                  "Not uploaded"
                )}
              </Descriptions.Item>
            </Descriptions>
          )}
        </Card>
      </div>
    </>
  );
}
