@adyen/adyen-platform-experience-web 1.10.0 → 1.10.1

package/dist/es/components/external/TransactionsOverview/components/TransactionsOverview/TransactionsOverview.js

@@ -1,104 +1,122 @@
-import { jsx as r } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import I from "classnames";
-import H from "../../hooks/useTransactionsList.js";
-import W from "../../hooks/useTransactionsTotals.js";
+import { jsx as t } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import B from "classnames";
+import _ from "../../hooks/useTransactionsList.js";
+import G from "../../hooks/useTransactionsViewSwitcher.js";
+import R from "../../hooks/useTransactionsTotals.js";
 import j from "../../../../../hooks/useAccountBalances.js";
-import k from "../../../../../core/Context/useCoreContext.js";
-import G from "./TransactionsOverviewList.js";
-import K from "./TransactionsOverviewInsights.js";
-import q from "../TransactionFilters/TransactionFilters.js";
-import D from "../TransactionsExport/TransactionsExport.js";
-import J from "../../../../internal/SegmentedControl/SegmentedControl.js";
-import { INITIAL_FILTERS as P, TRANSACTIONS_VIEW_TABS as C, classes as a } from "../../constants.js";
-import { TransactionsView as B } from "../../types.js";
-import { useRef as Q, useState as u, useMemo as p, useEffect as U } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import { compareTransactionsFilters as X } from "../utils.js";
+import q from "../../../../../core/Context/useCoreContext.js";
+import K from "../../hooks/useCurrenciesLookup.js";
+import J from "./TransactionsOverviewList.js";
+import U from "./TransactionsOverviewInsights.js";
+import W from "../TransactionFilters/TransactionFilters.js";
+import X from "../TransactionsExport/TransactionsExport.js";
+import Y from "../../../../internal/SegmentedControl/SegmentedControl.js";
+import { TransactionsView as Z } from "../../types.js";
+import { useState as d, useCallback as $, useMemo as E } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { classes as c, INITIAL_FILTERS as z } from "../../constants.js";
 /* empty css                          */
-import { Fragment as d } from "../../../../../external/preact/dist/preact.module.js";
-import { useFilterBarState as Y, FilterBarMobileSwitch as Z } from "../../../../internal/FilterBar/FilterBar.js";
-import { Header as $ } from "../../../../internal/Header/Header.js";
-const Sr = ({
-  onFiltersChanged: F,
-  balanceAccounts: h,
-  allowLimitSelection: N,
-  preferredLimit: R,
-  onRecordSelection: b,
-  showDetails: x,
-  isLoadingBalanceAccount: y,
-  onContactSupport: E,
-  hideTitle: A,
-  dataCustomization: T
+import { Fragment as w } from "../../../../../external/preact/dist/preact.module.js";
+import { useFilterBarState as tt, FilterBarMobileSwitch as et } from "../../../../internal/FilterBar/FilterBar.js";
+import { Header as st } from "../../../../internal/Header/Header.js";
+const rt = /* @__PURE__ */ new Set(["balanceAccount", "createdDate"]), ot = ({ balanceAccountId: o, createdSince: n, createdUntil: l }) => ({ balanceAccountId: o, createdSince: n, createdUntil: l }), at = (o) => o, Lt = ({
+  onFiltersChanged: o,
+  balanceAccounts: n,
+  allowLimitSelection: l,
+  preferredLimit: x,
+  onRecordSelection: N,
+  showDetails: A,
+  isLoadingBalanceAccount: V,
+  onContactSupport: k,
+  hideTitle: P,
+  dataCustomization: g
 }) => {
-  const c = Q(P), l = Y(), [t, L] = u(c.current), [m, O] = u(B.TRANSACTIONS), [V, M] = u(), { balanceAccount: e } = t, { isMobileContainer: s } = l, { i18n: v } = k(), i = m !== B.INSIGHTS, f = p(
-    () => i && !!(e != null && e.id) && X(t, c.current),
-    [i, e, t]
-  ), n = j({ balanceAccount: e }), o = H({
+  const [s, Q] = d(z), [a, D] = d(Date.now()), [v, H] = d(), m = tt(), { balanceAccount: i } = s, { isMobileContainer: r } = m, { i18n: C } = q(), { activeView: u, onViewChange: S, viewTabs: p } = G(), e = u !== Z.INSIGHTS, f = !!i?.id, M = $((O) => {
+    D(Date.now()), Q(O);
+  }, []), b = j({ balanceAccount: i }), I = R({
+    fetchEnabled: !e && f,
+    getQueryParams: ot,
+    applicableFilters: rt,
+    now: a,
+    filters: s
+  }), y = R({
+    fetchEnabled: e && f,
+    getQueryParams: at,
+    now: a,
+    filters: s
+  }), T = _({
     fetchEnabled: f,
-    allowLimitSelection: N,
-    dataCustomization: T,
-    filters: t,
-    onFiltersChanged: F,
-    preferredLimit: R
-  }), S = W({
-    currencies: n.currencies,
-    fetchEnabled: !!(e != null && e.id),
-    loadingBalances: n.isWaiting,
-    filters: t
-  }), g = p(
-    () => i ? /* @__PURE__ */ r(D, { disabled: o.records.length < 1 || o.fetching, filters: t }) : null,
-    [t, i, o.fetching, o.records]
-  ), w = p(
-    () => C.length > 1 ? /* @__PURE__ */ r(
-      J,
+    now: a,
+    allowLimitSelection: l,
+    dataCustomization: g,
+    onFiltersChanged: o,
+    preferredLimit: x,
+    filters: s
+  }), h = K({
+    defaultCurrency: i?.defaultCurrencyCode,
+    balances: b.balances,
+    totals: (e ? y : I).totals
+  }), F = E(
+    () => e ? /* @__PURE__ */ t(X, { disabled: !T.page, filters: s, now: a }) : null,
+    [s, e, a, T.page]
+  ), L = E(
+    () => p.length > 1 ? /* @__PURE__ */ t(
+      Y,
       {
-        "aria-label": v.get("transactions.overview.viewSelect.a11y.label"),
-        activeItem: m,
-        items: C,
-        onChange: ({ id: _ }) => O(_)
+        "aria-label": C.get("transactions.overview.viewSelect.a11y.label"),
+        activeItem: u,
+        items: p,
+        onChange: S
       }
     ) : null,
-    [m, v]
+    [u, S, p, C]
   );
-  return U(() => {
-    f && (c.current = t);
-  }, [f, t]), /* @__PURE__ */ r("div", { className: I(a.root, { [a.rootSmall]: s }), children: [
-    /* @__PURE__ */ r($, { hideTitle: A, titleKey: "transactions.overview.title", children: /* @__PURE__ */ r("div", { className: I({ [a.filterBarSmall]: s }), children: [
-      s && g,
-      /* @__PURE__ */ r(Z, { ...l }),
-      !s && /* @__PURE__ */ r(d, { children: w })
+  return /* @__PURE__ */ t("div", { className: B(c.root, { [c.rootSmall]: r }), children: [
+    /* @__PURE__ */ t(st, { hideTitle: P, titleKey: "transactions.overview.title", children: /* @__PURE__ */ t("div", { className: B({ [c.filterBarSmall]: r }), children: [
+      r && F,
+      /* @__PURE__ */ t(et, { ...m }),
+      !r && /* @__PURE__ */ t(w, { children: L })
     ] }) }),
-    s && /* @__PURE__ */ r(d, { children: w }),
-    /* @__PURE__ */ r("div", { role: "toolbar", className: a.toolbar, children: [
-      /* @__PURE__ */ r(
-        q,
+    r && /* @__PURE__ */ t(w, { children: L }),
+    /* @__PURE__ */ t("div", { role: "toolbar", className: c.toolbar, children: [
+      /* @__PURE__ */ t(
+        W,
         {
-          ...l,
-          availableCurrencies: n.currencies,
-          balanceAccounts: h,
-          isTransactionsView: i,
-          setInsightsCurrency: M,
-          onChange: L
+          ...m,
+          availableCurrencies: h.sortedCurrencies,
+          balanceAccounts: n,
+          isTransactionsView: e,
+          insightsCurrency: v,
+          setInsightsCurrency: H,
+          onChange: M
         }
       ),
-      !s && /* @__PURE__ */ r(d, { children: g })
+      !r && /* @__PURE__ */ t(w, { children: F })
     ] }),
-    i ? /* @__PURE__ */ r(
-      G,
+    e ? /* @__PURE__ */ t(
+      J,
+      {
+        accountBalancesResult: b,
+        balanceAccount: i,
+        balanceAccounts: n,
+        currenciesLookupResult: h,
+        dataCustomization: g,
+        isLoadingBalanceAccount: V,
+        onContactSupport: k,
+        onRecordSelection: N,
+        showDetails: A,
+        transactionsListResult: T,
+        transactionsTotalsResult: y
+      }
+    ) : /* @__PURE__ */ t(
+      U,
       {
-        accountBalancesResult: n,
-        balanceAccount: e,
-        balanceAccounts: h,
-        dataCustomization: T,
-        isLoadingBalanceAccount: y,
-        onContactSupport: E,
-        onRecordSelection: b,
-        showDetails: x,
-        transactionsListResult: o,
-        transactionsTotalsResult: S
+        currency: v,
+        currenciesLookupResult: h,
+        transactionsTotalsResult: I
       }
-    ) : /* @__PURE__ */ r(K, { currency: V, transactionsTotalsResult: S })
+    )
   ] });
 };
 export {
-  Sr as TransactionsOverview
+  Lt as TransactionsOverview
 };

package/dist/es/components/external/TransactionsOverview/components/TransactionsOverview/TransactionsOverviewInsights.js

@@ -1,15 +1,12 @@
-import { jsx as i } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { TRANSACTION_ANALYTICS_SUBCATEGORY_INSIGHTS as n, TRANSACTION_ANALYTICS_CATEGORY as T } from "../../constants.js";
-import { useDurationEvent as A } from "../../../../../hooks/useAnalytics/useDurationEvent.js";
-import { useLandedPageEvent as m } from "../../../../../hooks/useAnalytics/useLandedPageEvent.js";
-import p from "../InsightsTotals/InsightsTotals.js";
+import { jsx as o } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { TRANSACTION_ANALYTICS_SUBCATEGORY_INSIGHTS as s, TRANSACTION_ANALYTICS_CATEGORY as e } from "../../constants.js";
+import { useDurationEvent as a } from "../../../../../hooks/useAnalytics/useDurationEvent.js";
+import { useLandedPageEvent as n } from "../../../../../hooks/useAnalytics/useLandedPageEvent.js";
+import i from "../InsightsTotals/InsightsTotals.js";
 const t = {
-  category: T,
-  subCategory: n
-}, N = ({ currency: o, transactionsTotalsResult: r }) => {
-  const { isWaiting: s, totalsLookup: a, error: e } = r;
-  return m(t), A(t), /* @__PURE__ */ i(p, { currency: o, loadingTotals: s, totals: a, error: e });
-};
+  category: e,
+  subCategory: s
+}, u = (r) => (n(t), a(t), /* @__PURE__ */ o(i, { ...r }));
 export {
-  N as default
+  u as default
 };

package/dist/es/components/external/TransactionsOverview/components/TransactionsOverview/TransactionsOverviewList.js

@@ -1,64 +1,59 @@
 import { jsx as r } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { useCallback as E, useMemo as d } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import { TRANSACTION_ANALYTICS_SUBCATEGORY_LIST as S, TRANSACTION_ANALYTICS_CATEGORY as B, classes as s } from "../../constants.js";
-import { useLandedPageEvent as L } from "../../../../../hooks/useAnalytics/useLandedPageEvent.js";
-import { useDurationEvent as O } from "../../../../../hooks/useAnalytics/useDurationEvent.js";
-import R from "../TransactionsList/TransactionsList.js";
-import Y from "../TransactionTotals/TransactionTotals.js";
-import _ from "../Balances/Balances.js";
-import { Alert as k } from "../../../../internal/Alert/Alert.js";
+import { useMemo as b, useCallback as h } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { classes as o, TRANSACTION_ANALYTICS_SUBCATEGORY_LIST as B, TRANSACTION_ANALYTICS_CATEGORY as S } from "../../constants.js";
+import { useLandedPageEvent as O } from "../../../../../hooks/useAnalytics/useLandedPageEvent.js";
+import { useDurationEvent as L } from "../../../../../hooks/useAnalytics/useDurationEvent.js";
+import Y from "../TransactionsList/TransactionsList.js";
+import _ from "../TransactionTotals/TransactionTotals.js";
+import R from "../Balances/Balances.js";
+import { Alert as w } from "../../../../internal/Alert/Alert.js";
 import x from "../../../../../core/Context/useCoreContext.js";
-import { AlertTypeOption as F } from "../../../../internal/Alert/types.js";
-import { ButtonVariant as G } from "../../../../internal/Button/types.js";
-import W from "../../../../internal/Button/Button.js";
-import { Fragment as w } from "../../../../../external/preact/dist/preact.module.js";
-const f = {
-  category: B,
-  subCategory: S
-}, Z = ({
-  accountBalancesResult: a,
-  balanceAccount: t,
-  balanceAccounts: p,
-  isLoadingBalanceAccount: u,
-  transactionsListResult: T,
-  transactionsTotalsResult: C,
+import { AlertTypeOption as G } from "../../../../internal/Alert/types.js";
+import { ButtonVariant as W } from "../../../../internal/Button/types.js";
+import k from "../../../../internal/Button/Button.js";
+import { Fragment as D } from "../../../../../external/preact/dist/preact.module.js";
+const p = {
+  category: S,
+  subCategory: B
+}, $ = ({
+  accountBalancesResult: m,
+  balanceAccount: T,
+  balanceAccounts: f,
+  currenciesLookupResult: c,
+  isLoadingBalanceAccount: A,
+  transactionsListResult: u,
+  transactionsTotalsResult: l,
   ...v
 }) => {
-  const { i18n: i, updateCore: N } = x(), { isWaiting: g, balances: n } = a, { isWaiting: y, totals: m, error: A } = C, o = t == null ? void 0 : t.defaultCurrencyCode, e = E(
-    ({ currency: l }, { currency: c }) => {
-      if (o) {
-        if (l === o) return -1;
-        if (c === o) return 1;
-      }
-      return l.localeCompare(c);
-    },
-    [o]
-  ), I = d(() => [...n].sort(e), [n, e]), h = d(() => [...m].sort(e), [m, e]);
-  return L(f), O(f), /* @__PURE__ */ r(w, { children: [
-    /* @__PURE__ */ r("div", { className: s.summary, children: [
-      A ? /* @__PURE__ */ r(
-        k,
-        {
-          className: s.totalsError,
-          type: F.WARNING,
-          title: i.get("transactions.overview.totals.error"),
-          description: /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r(W, { variant: G.TERTIARY, onClick: N, children: i.get("common.actions.refresh.labels.default") }) })
-        }
-      ) : /* @__PURE__ */ r("div", { className: s.summaryItem, children: /* @__PURE__ */ r(Y, { totals: h, loadingTotals: y }) }),
-      /* @__PURE__ */ r("div", { className: s.summaryItem, children: /* @__PURE__ */ r(_, { balances: I, loadingBalances: g }) })
+  const { i18n: a } = x(), { error: C, isWaiting: N } = m, { error: g, isWaiting: y } = l, { currenciesDictionary: e, defaultCurrencySortedCurrencies: s } = c, { sortedBalances: E, sortedTotals: I } = b(() => {
+    const n = s.map((t) => e[t].balances), i = s.map((t) => e[t].totals);
+    return { sortedBalances: n, sortedTotals: i };
+  }, [e, s]), d = h(({ canRefresh: n, refresh: i }, t) => /* @__PURE__ */ r(
+    w,
+    {
+      className: o.totalsError,
+      type: G.WARNING,
+      title: a.get(t),
+      description: /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r(k, { variant: W.TERTIARY, onClick: i, disabled: !n, children: a.get("common.actions.refresh.labels.default") }) })
+    }
+  ), [a]);
+  return O(p), L(p), /* @__PURE__ */ r(D, { children: [
+    /* @__PURE__ */ r("div", { className: o.summary, children: [
+      /* @__PURE__ */ r("div", { className: o.summaryItem, children: g ? d(l, "transactions.overview.totals.error") : /* @__PURE__ */ r(_, { totals: I, loadingTotals: y }) }),
+      /* @__PURE__ */ r("div", { className: o.summaryItem, children: C ? d(m, "transactions.overview.balances.error") : /* @__PURE__ */ r(R, { balances: E, loadingBalances: N }) })
     ] }),
     /* @__PURE__ */ r(
-      R,
+      Y,
       {
-        accountBalancesResult: a,
-        balanceAccount: t,
-        loadingBalanceAccounts: u || !p,
-        transactionsListResult: T,
+        balanceAccount: T,
+        currenciesLookupResult: c,
+        loadingBalanceAccounts: A || !f,
+        transactionsListResult: u,
         ...v
       }
     )
   ] });
 };
 export {
-  Z as default
+  $ as default
 };

package/dist/es/components/external/TransactionsOverview/components/TransactionsTable/PaymentMethodCell.js

@@ -6,24 +6,24 @@ import { TagVariant as n } from "../../../../internal/Tag/types.js";
 import { TypographyVariant as T } from "../../../../internal/Typography/types.js";
 import f from "../../../../internal/Typography/Typography.js";
 import { useResponsiveContainer as l, containerQueries as p } from "../../../../../hooks/useResponsiveContainer.js";
-import { parsePaymentMethodType as g } from "../utils.js";
-import { PAYMENT_METHOD_CLASS as _, PAYMENT_METHOD_LOGO_CONTAINER_CLASS as N, PAYMENT_METHOD_LOGO_CLASS as O } from "./constants.js";
-import { Fragment as C } from "../../../../../external/preact/dist/preact.module.js";
-const x = ({ paymentMethod: r, bankAccount: a }) => {
+import { parsePaymentMethodType as c } from "../utils.js";
+import { PAYMENT_METHOD_CLASS as g, PAYMENT_METHOD_LOGO_CONTAINER_CLASS as _, PAYMENT_METHOD_LOGO_CLASS as N } from "./constants.js";
+import { Fragment as O } from "../../../../../external/preact/dist/preact.module.js";
+const P = ({ paymentMethod: r, bankAccount: a }) => {
   const { i18n: i } = m(), e = l(p.down.xs);
-  return /* @__PURE__ */ o("div", { className: _, children: r || a ? /* @__PURE__ */ o(C, { children: [
-    /* @__PURE__ */ o("div", { className: N, children: /* @__PURE__ */ o(
+  return /* @__PURE__ */ o("div", { className: g, children: r || a ? /* @__PURE__ */ o(O, { children: [
+    /* @__PURE__ */ o("div", { className: _, children: /* @__PURE__ */ o(
       s,
       {
         name: r ? r.type : "bankTransfer",
         alt: r ? r.type : "bankTransfer",
         folder: "logos/",
-        className: O
+        className: N
       }
     ) }),
-    /* @__PURE__ */ o(f, { variant: T.BODY, stronger: e, children: r ? g(r) : a == null ? void 0 : a.accountNumberLastFourDigits })
+    /* @__PURE__ */ o(f, { variant: T.BODY, stronger: e, children: r ? c(r) : a?.accountNumberLastFourDigits })
   ] }) : /* @__PURE__ */ o(t, { label: i.get("common.tags.noData"), variant: n.LIGHT_WITH_OUTLINE }) });
 };
 export {
-  x as default
+  P as default
 };

package/dist/es/components/external/TransactionsOverview/components/TransactionsTable/TransactionsTable.js

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

package/dist/es/components/external/TransactionsOverview/components/utils.js

@@ -1,47 +1,50 @@
-import { INITIAL_FILTERS as s } from "../constants.js";
-import { EMPTY_OBJECT as o } from "../../../../utils/value/constants.js";
-const i = Object.keys(s), u = Object.freeze({
+import { getDateRangeTimestamps as i } from "../../../internal/Calendar/calendar/timerange/utils.js";
+import { INITIAL_FILTERS as u } from "../constants.js";
+import { EMPTY_OBJECT as l } from "../../../../utils/value/constants.js";
+const s = Object.keys(u), g = new Set(s), p = Object.freeze({
   klarna: "Klarna",
   paypal: "PayPal",
   klarna_paynow: "Klarna Pay Now"
-}), p = (e, a) => {
-  const { lastFourDigits: t, description: n, type: r } = e ?? o;
-  return t ? a === "detail" ? `•••• •••• •••• ${t}` : t : n || u[r] || r;
-}, l = (e) => {
-  var a;
+}), P = (e, n) => {
+  const { lastFourDigits: a, description: t, type: r } = e ?? l;
+  return a ? n === "detail" ? `•••• •••• •••• ${a}` : a : t || p[r] || r;
+}, d = (e, n) => {
+  const { from: a, to: t } = i(e.createdDate, n, e.balanceAccount?.timeZone);
   return {
-    balanceAccountId: (a = e.balanceAccount) == null ? void 0 : a.id,
+    balanceAccountId: e.balanceAccount?.id,
     // using null assertion to ensure correct type inference
     categories: e.categories,
-    createdSince: new Date(e.createdDate.from).toISOString(),
-    createdUntil: new Date(e.createdDate.to).toISOString(),
+    createdSince: new Date(a).toISOString(),
+    createdUntil: new Date(t).toISOString(),
     currencies: e.currencies,
     paymentPspReference: e.paymentPspReference,
     statuses: e.statuses
   };
-}, S = (e) => {
-  const { balanceAccountId: a, categories: t, currencies: n, statuses: r, ...c } = l(e);
+}, T = (e, n) => {
+  const { balanceAccountId: a, categories: t, currencies: r, statuses: c, ...o } = d(e, n);
   return {
-    ...c,
+    ...o,
     balanceAccountId: a || void 0,
     categories: String(t) || void 0,
-    currencies: String(n) || void 0,
-    statuses: String(r) || void 0
+    currencies: String(r) || void 0,
+    statuses: String(c) || void 0
   };
-}, m = (e, a) => i.some((t) => {
-  const n = e[t], r = a[t];
-  switch (t) {
-    case "categories":
-    case "currencies":
-    case "statuses":
-      return String(n) !== String(r);
-    default:
-      return n !== r;
+}, I = (e, n, a = g) => s.some((t) => {
+  if (a.has(t)) {
+    const r = e[t], c = n[t];
+    switch (t) {
+      case "categories":
+      case "currencies":
+      case "statuses":
+        return String(r) !== String(c);
+      default:
+        return r !== c;
+    }
   }
 });
 export {
-  m as compareTransactionsFilters,
-  S as getTransactionsFilterParams,
-  l as getTransactionsFilterQueryParams,
-  p as parsePaymentMethodType
+  I as compareTransactionsFilters,
+  T as getTransactionsFilterParams,
+  d as getTransactionsFilterQueryParams,
+  P as parsePaymentMethodType
 };