"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import Link from "next/link";
import { ExternalLink } from "lucide-react";
import { useTranslations } from "next-intl";
import {
  Table,
  TableBody,
  TableCell,
  TableHead,
  TableHeader,
  TableRow
} from "../ui/table.js";
import { InvoiceStatusBadge } from "./InvoiceStatusBadge.js";
import { InvoicesEmptyState } from "./InvoicesEmptyState.js";
import { InvoicesPagination } from "./InvoicesPagination.js";
function InvoicesTable({
  invoices,
  isLoading = false,
  total,
  limit,
  offset,
  onPageChange
}) {
  const t = useTranslations("settings.billing.invoices");
  const currentPage = Math.floor(offset / limit) + 1;
  const totalPages = Math.ceil(total / limit);
  const formatDate = (dateString) => {
    const date = new Date(dateString);
    return new Intl.DateTimeFormat("en-US", {
      year: "numeric",
      month: "short",
      day: "numeric"
    }).format(date);
  };
  const formatCurrency = (amount, currency) => {
    return new Intl.NumberFormat("en-US", {
      style: "currency",
      currency
    }).format(amount);
  };
  if (!isLoading && invoices.length === 0) {
    return /* @__PURE__ */ jsx(InvoicesEmptyState, {});
  }
  return /* @__PURE__ */ jsxs("div", { className: "space-y-4", "data-cy": "invoices-table", children: [
    /* @__PURE__ */ jsx("div", { className: "rounded-md border", children: /* @__PURE__ */ jsxs(Table, { children: [
      /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
        /* @__PURE__ */ jsx(TableHead, { className: "w-[140px]", children: t("table.date") }),
        /* @__PURE__ */ jsx(TableHead, { className: "w-[120px]", children: t("table.amount") }),
        /* @__PURE__ */ jsx(TableHead, { children: t("table.invoiceNumber") }),
        /* @__PURE__ */ jsx(TableHead, { className: "w-[120px]", children: t("table.status") }),
        /* @__PURE__ */ jsx(TableHead, { className: "w-[50px]" })
      ] }) }),
      /* @__PURE__ */ jsx(TableBody, { children: isLoading ? /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colSpan: 5, className: "text-center py-8", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2", children: [
        /* @__PURE__ */ jsx("div", { className: "h-4 w-4 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
        /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: t("loading") })
      ] }) }) }) : invoices.map((invoice) => /* @__PURE__ */ jsxs(
        TableRow,
        {
          "data-cy": "invoices-row",
          className: "cursor-pointer hover:bg-muted/50",
          children: [
            /* @__PURE__ */ jsx(TableCell, { className: "font-medium", children: /* @__PURE__ */ jsx(
              Link,
              {
                href: `/dashboard/settings/invoices/${encodeURIComponent(invoice.invoiceNumber)}`,
                className: "block",
                children: formatDate(invoice.date)
              }
            ) }),
            /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(
              Link,
              {
                href: `/dashboard/settings/invoices/${encodeURIComponent(invoice.invoiceNumber)}`,
                className: "block",
                children: formatCurrency(invoice.amount, invoice.currency)
              }
            ) }),
            /* @__PURE__ */ jsx(TableCell, { className: "font-mono text-sm", children: /* @__PURE__ */ jsx(
              Link,
              {
                href: `/dashboard/settings/invoices/${encodeURIComponent(invoice.invoiceNumber)}`,
                className: "block",
                children: invoice.invoiceNumber
              }
            ) }),
            /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(
              Link,
              {
                href: `/dashboard/settings/invoices/${encodeURIComponent(invoice.invoiceNumber)}`,
                className: "block",
                children: /* @__PURE__ */ jsx(InvoiceStatusBadge, { status: invoice.status })
              }
            ) }),
            /* @__PURE__ */ jsx(TableCell, { className: "text-right", children: /* @__PURE__ */ jsx(
              Link,
              {
                href: `/dashboard/settings/invoices/${encodeURIComponent(invoice.invoiceNumber)}`,
                className: "inline-flex items-center text-muted-foreground hover:text-foreground",
                "aria-label": t("download.tooltip"),
                children: /* @__PURE__ */ jsx(ExternalLink, { className: "h-4 w-4", "aria-hidden": "true" })
              }
            ) })
          ]
        },
        invoice.id
      )) })
    ] }) }),
    !isLoading && total > limit && /* @__PURE__ */ jsx(
      InvoicesPagination,
      {
        currentPage,
        totalPages,
        totalInvoices: total,
        limit,
        offset,
        onPageChange,
        isLoading
      }
    )
  ] });
}
export {
  InvoicesTable
};
