/* eslint-disable @typescript-eslint/no-explicit-any */
"use client";

import React from "react";
import { DataTable } from "../../../components/DataTable";
import { useAuth } from "../../../context/AuthContext";
import { downloadPDF } from "../../../lib/utils/downloadPDF";
import { formatDate } from "../../../components/Investments/InvestmentHistory";

export default function LoanHistoryViewAll() {
  const { loanHistory } = useAuth();

  const columns = [
    {
      key: "amount",
      label: "Loan Amount",
      render: (value: number) => `₦${value?.toLocaleString()}`,
    },
    {
      key: "createdOn",
      label: "Date Requested",
      render: (value: string) => formatDate(value),
    },
    {
      key: "dateApproved",
      label: "Date Approved",
      render: (value: string) =>
        value ? formatDate(value) : "-",
    },
    {
      key: "dateRejected",
      label: "Date Rejected",
      render: (value: string) =>
        value ? formatDate(value) : "-",
    },
    {
      key: "dueDate",
      label: "Due Date",
      render: (value: string) => formatDate(value),
    },
    {
      key: "status",
      label: "Status",
      render: (value: string) => (
        <span
          className={`inline-flex items-center px-3 py-1 rounded-full text-sm font-medium ${
            value === "Paid"
              ? "text-green-700 bg-green-50"
              : "text-red-700 bg-red-50"
          }`}
        >
          {value}
        </span>
      ),
    },
  ];

  const data = Array.isArray(loanHistory)
    ? loanHistory.map((item) => ({
        ...item,
      }))
    : [];

  const handleFilterClick = () => {
    console.log("Filter clicked");
  };

  const handleDownloadLoan = (data: any[]) => {
    const columns = [
      "Loan Amount",
      "Date Requested",
      "Date Approved",
      "Date Rejected",
      "Due Date",
      "Status",
    ];

    const rows = data.map((item) => [
      `₦${Number(item.amount).toLocaleString()}`,
      formatDate(item.createdOn),
      item.dateApproved ? formatDate(item.dateApproved) : "-",
      item.dateRejected ? formatDate(item.dateRejected) : "-",
      formatDate(item.dueDate),
      item.status || "-",
    ]);

    downloadPDF(columns, rows, {
      title: "Loan History Report",
      fileName: "loan-history",
      brandName: "SubaCapital",
      themeColor: [108, 99, 255],
    });
  };

  return (
    <div className="min-h-screen bg-gray-50">
      <div className="max-w-7xl mx-auto">
        <main className="flex-1 overflow-y-auto bg-gray-50">
          <DataTable
            columns={columns}
            data={data}
            itemsPerPage={50}
            showSearch={true}
            showFilter={true}
            showDownload={true}
            onFilterClick={handleFilterClick}
            onDownloadClick={() => handleDownloadLoan(data)}
          />
        </main>
      </div>
    </div>
  );
}