
import React from "react";
import InvoiceSearch from "./InvoiceSearch";
import InvoiceSearchLoading from "./InvoiceSearchLoading";
import { fetchInvoices } from "@/app/api/invoices";
import { timestampToDateString } from "@/app/utils/formatUtil";


interface SubComponents {
  Loading: typeof InvoiceSearchLoading;
}

const InvoiceSearchWrapper: React.FC & SubComponents = async () => {
  const Invoices = await fetchInvoices();

  const temp = Invoices.map((invoice) => ({
    ...invoice,
    paymentMilestoneDate: timestampToDateString(invoice.paymentMilestoneDate)
  }))

  return <InvoiceSearch invoices={temp} />;
};

InvoiceSearchWrapper.Loading = InvoiceSearchLoading;

export default InvoiceSearchWrapper;
