import { jsx as o } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
import { useState as x, useCallback as I, useMemo as $ } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
import H from "../../../../internal/DataOverviewError/DataOverviewError.js";
import { getCurrencyCode as D } from "../../../../../core/Localization/amount/amount-util.js";
import U from "../../../../../hooks/useTimezoneAwareDateFormatting.js";
import { Tooltip as K } from "../../../../internal/Tooltip/Tooltip.js";
import { TypographyVariant as c, TypographyElement as m } from "../../../../internal/Typography/types.js";
import l from "../../../../internal/Typography/Typography.js";
import { getTransactionCategory as G, getTransactionCategoryDescription as V } from "../../../../utils/translation/getters.js";
import { useResponsiveContainer as u, containerQueries as v } from "../../../../../hooks/useResponsiveContainer.js";
import { BASE_CLASS as j, DATE_AND_PAYMENT_METHOD_CLASS as q, DATE_METHOD_CLASS as z, AMOUNT_CLASS as w } from "./constants.js";
/* empty css                      */
import E from "./PaymentMethodCell.js";
import { useTableColumns as Q } from "../../../../../hooks/useTableColumns.js";
import { Tag as X } from "../../../../internal/Tag/Tag.js";
import { TRANSACTION_FIELDS as Z } from "./fields.js";
import J from "../../../../../core/Context/preact/useCoreContext.js";
import N from "../../../../internal/DataGrid/DataGrid.js";
import W from "../../../../internal/Pagination/Pagination.js";
import { DATE_FORMAT_TRANSACTIONS_MOBILE as tt, DATE_FORMAT_TRANSACTIONS as ot } from "../../../../../constants/dateFormats.js";
const y = {
  createdAt: "transactions.overview.list.fields.createdAt",
  currency: "transactions.overview.list.fields.currency",
  grossAmount: "transactions.overview.list.fields.grossAmount",
  netAmount: "transactions.overview.list.fields.netAmount",
  paymentMethod: "transactions.overview.list.fields.paymentMethod",
  // status: 'transactions.overview.list.fields.status',
  transactionType: "transactions.overview.list.fields.transactionType"
}, wt = ({
  activeBalanceAccount: M,
  availableCurrencies: n,
  error: d,
  hasMultipleCurrencies: s,
  loading: C,
  onContactSupport: T,
  onRowClick: _,
  showDetails: et,
  showPagination: b,
  transactions: O,
  customColumns: B,
  ...L
}) => {
  const { i18n: r } = J(), { dateFormat: f } = U(M?.timeZone), [R, g] = x(), A = u(v.up.sm), p = u(v.up.md), h = u(v.down.xs), F = Q({
    customColumns: B,
    fields: Z,
    fieldsKeys: y,
    columnConfig: {
      netAmount: {
        label: s ? void 0 : `${r.get(y.netAmount)} ${n && n[0] ? `(${D(n[0])})` : ""}`,
        position: "right",
        flex: A ? 1.5 : void 0
      },
      grossAmount: {
        label: s ? void 0 : `${r.get(y.grossAmount)} ${n && n[0] ? `(${D(n[0])})` : ""}`,
        position: "right",
        flex: A ? 1.5 : void 0,
        visible: p
      },
      currency: { visible: p && s },
      transactionType: { visible: p },
      paymentMethod: { visible: A }
    }
  }), P = {
    title: "transactions.overview.errors.listEmpty",
    message: ["common.errors.updateFilters"]
  }, Y = I(
    (t) => {
      g(t ?? void 0);
    },
    [g]
  ), k = $(
    () => () => /* @__PURE__ */ o(H, { error: d, onContactSupport: T, errorMessage: "transactions.overview.errors.listUnavailable" }),
    [d, T]
  );
  return /* @__PURE__ */ o("div", { className: j, children: /* @__PURE__ */ o(
    N,
    {
      autoFitColumns: h,
      errorDisplay: k,
      error: d,
      columns: F,
      data: O,
      loading: C,
      outline: !1,
      onRowClick: { callback: _ },
      onRowHover: Y,
      emptyTableMessage: P,
      customCells: {
        // Remove status column temporarily
        // status: ({ item }) => {
        //     return (
        //         <Tag
        //             label={getTransactionStatus(i18n, item.status)}
        //             variant={getTagVariantForTransaction(item)}
        //         />
        //     );
        // },
        transactionType: ({ item: t, rowIndex: e }) => {
          const i = G(r, t.category);
          if (i) {
            const a = V(r, t.category), S = () => /* @__PURE__ */ o(l, { el: m.SPAN, variant: c.BODY, children: i });
            return a ? /* @__PURE__ */ o(K, { content: a, isUnderlineVisible: e === R, children: /* @__PURE__ */ o("span", { children: S() }) }) : S();
          }
          return null;
        },
        currency: ({ item: t }) => /* @__PURE__ */ o(X, { children: t.amountBeforeDeductions.currency }),
        netAmount: ({ value: t }) => {
          const { value: e, currency: i } = t, a = r.amount(e, i, { hideCurrency: !s });
          return /* @__PURE__ */ o(l, { el: m.SPAN, variant: c.BODY, className: w, children: a });
        },
        grossAmount: ({ item: t }) => {
          const { value: e, currency: i } = t.amountBeforeDeductions, a = r.amount(e, i, { hideCurrency: !s });
          return /* @__PURE__ */ o(l, { el: m.SPAN, variant: c.BODY, className: w, children: a });
        },
        createdAt: ({ item: t, value: e }) => h ? /* @__PURE__ */ o("div", { className: q, children: [
          /* @__PURE__ */ o(E, { paymentMethod: t.paymentMethod, bankAccount: t.bankAccount }),
          /* @__PURE__ */ o("time", { dateTime: t.createdAt, className: z, children: /* @__PURE__ */ o(l, { el: m.SPAN, variant: c.BODY, children: f(t.createdAt, tt) }) })
        ] }) : /* @__PURE__ */ o("time", { dateTime: e, children: /* @__PURE__ */ o(l, { el: m.SPAN, variant: c.BODY, children: f(e, ot) }) }),
        paymentMethod: ({ item: t }) => /* @__PURE__ */ o(E, { paymentMethod: t.paymentMethod, bankAccount: t.bankAccount })
      },
      children: b && /* @__PURE__ */ o(N.Footer, { children: /* @__PURE__ */ o(
        W,
        {
          ...L,
          ariaLabelKey: "transactions.overview.pagination.label",
          limitSelectAriaLabelKey: "transactions.overview.pagination.controls.limitSelect.label"
        }
      ) })
    }
  ) });
};
export {
  wt as TransactionsTable
};
