import { formatFigure, getColorNameFromHex } from "../../utils/appUtils";

export const PurchaseColumn = [
  {
    key: "purchaseInvoiceUId",
    label: "Invoice Id",

    className: "text-start",
    render: (item) => (
      <div className="d-flex justify-content-start align-items-center p-1">
        <span className="fw-normal">{item?.purchaseInvoiceUId || "NA"}</span>
      </div>
    ),
  },
  {
    key: "title",
    label: "Title",

    className: "text-start",
    render: (item) => (
      <div className="d-flex justify-content-start align-items-center">
        <span className="fw-normal">{item?.title || "NA"}</span>
      </div>
    ),
  },
  {
    key: "project",
    label: "Project",
    className: "text-start ",
    render: (item) => <span>{item?.project?.name || "NA"}</span>,
  },
  {
    key: "supplier",
    label: "Supplier",
    className: "text-start ",
    render: (item) => <span>{item?.supplier?.name || "NA"}</span>,
  },
  {
    key: "status",
    label: "Status",
    className: "text-start",
    render: (item) => {
      let color = getColorNameFromHex(item.status?.color);
      return (
        <span className={`badge rounded-pill bg-label-${color}`}>
          <span className={`badge badge-dot bg-${color} me-1`}></span>
          {item?.status.displayName || "NA"}
        </span>
      );
    },
  },
  {
    key: "totalAmount",
    label: "Total Amount",
    className: "text-end",
    render: (item) => (
      <span>{formatFigure(item?.totalAmount, { type: "currency" })}</span>
    ),
  },
];