@adyen/adyen-platform-experience-web 1.0.0 → 1.0.2

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

@@ -1,199 +1,228 @@
-import { jsx as r } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { DataDetailsModal as mt } from "../../../../internal/DataOverviewDisplay/DataDetailsModal.js";
-import { TransactionsTable as dt } from "../TransactionsTable/TransactionsTable.js";
-import ct from "../../../../hooks/useBalanceAccountSelection.js";
-import { TypographyVariant as ut } from "../../../../internal/Typography/types.js";
-import pt from "../../../../internal/Typography/Typography.js";
-import ft from "../../../../internal/FilterBar/filters/DateFilter/DateFilter.js";
-import { FilterParam as e } from "../../../../types.js";
-import Ct from "../../../../../hooks/useModalDetails/useModalDetails.js";
-import Tt from "../../../../../core/Context/useCoreContext.js";
-import { useCallback as E, useMemo as l, useState as L, useEffect as N } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import { LIMIT_OPTIONS as At, DEFAULT_PAGE_LIMIT as St } from "../../../../internal/Pagination/constants.js";
-import Et from "../TransactionTotals/TransactionTotals.js";
-import { Balances as Nt } from "../Balances/Balances.js";
-import ht from "../../../../hooks/useDefaultOverviewFilterParams.js";
-import Mt from "../../hooks/useTransactionsOverviewMultiSelectionFilters.js";
-import { AmountFilter as _t } from "../../../../internal/FilterBar/filters/AmountFilter/AmountFilter.js";
-import { MAX_TRANSACTIONS_DATE_RANGE_MONTHS as Ft, BASE_CLASS as It, SUMMARY_CLASS as Dt, SUMMARY_ITEM_CLASS as b, BASE_CLASS_DETAILS as Ot } from "./constants.js";
-import { useResponsiveViewport as Ut, mediaQueries as gt } from "../../hooks/useResponsiveViewport.js";
+import { DataDetailsModal as ne } from "../../../../internal/DataOverviewDisplay/DataDetailsModal.js";
+import { TransactionsTable as ae } from "../TransactionsTable/TransactionsTable.js";
+import le from "../../../../hooks/useBalanceAccountSelection.js";
+import { TypographyVariant as me } from "../../../../internal/Typography/types.js";
+import de from "../../../../internal/Typography/Typography.js";
+import ce from "../../../../internal/FilterBar/filters/DateFilter/DateFilter.js";
+import { FilterParam as t } from "../../../../types.js";
+import ue from "../../../../../hooks/useModalDetails/useModalDetails.js";
+import pe from "../../../../../core/Context/useCoreContext.js";
+import { useCallback as A, useMemo as m, useState as g, useEffect as S } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { LIMIT_OPTIONS as fe, DEFAULT_PAGE_LIMIT as Ce } from "../../../../internal/Pagination/constants.js";
+import Te from "../TransactionTotals/TransactionTotals.js";
+import { Balances as Ae } from "../Balances/Balances.js";
+import Se from "../../../../hooks/useDefaultOverviewFilterParams.js";
+import Ee from "../../hooks/useTransactionsOverviewMultiSelectionFilters.js";
+import { AmountFilter as Ne } from "../../../../internal/FilterBar/filters/AmountFilter/AmountFilter.js";
+import { MAX_TRANSACTIONS_DATE_RANGE_MONTHS as he, BASE_CLASS as Me, SUMMARY_CLASS as _e, SUMMARY_ITEM_CLASS as L, BASE_CLASS_DETAILS as Fe } from "./constants.js";
+import { useResponsiveViewport as Ie, mediaQueries as De } from "../../hooks/useResponsiveViewport.js";
 import "./TransactionsOverview.scss.js";
-import Lt from "../../../../internal/Pagination/hooks/useCursorPaginatedRecords.js";
-import bt from "../../../../internal/FilterBar/FilterBar.js";
-import wt from "../../../../internal/FormFields/Select/BalanceAccountSelector/BalanceAccountSelector.js";
-import w from "../MultiSelectionFilter/MultiSelectionFilter.js";
-import { useAuthContext as Rt } from "../../../../../core/Auth/context.js";
+import { jsx as r } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import Oe from "../../../../internal/Pagination/hooks/useCursorPaginatedRecords.js";
+import Ue from "../../../../internal/FilterBar/FilterBar.js";
+import ge from "../../../../internal/FormFields/Select/BalanceAccountSelector/BalanceAccountSelector.js";
+import b from "../MultiSelectionFilter/MultiSelectionFilter.js";
+import { useAuthContext as Le } from "../../../../../core/Auth/context.js";
 import { listFrom as c } from "../../../../../utils/collection/main.js";
-import { isUndefined as R, isFunction as v } from "../../../../../utils/value/is.js";
-const me = ({
+import { isUndefined as w, isFunction as be } from "../../../../../utils/value/is.js";
+const at = ({
   onFiltersChanged: u,
-  onLimitChanged: p,
-  balanceAccounts: f,
-  allowLimitSelection: h,
-  preferredLimit: y = St,
-  onRecordSelection: M,
-  showDetails: _,
-  isLoadingBalanceAccount: x,
-  onContactSupport: k,
-  hideTitle: P
+  balanceAccounts: E,
+  allowLimitSelection: N,
+  preferredLimit: R = Ce,
+  onRecordSelection: h,
+  showDetails: M,
+  isLoadingBalanceAccount: y,
+  onContactSupport: v,
+  hideTitle: x
 }) => {
-  const { i18n: d } = Tt(), { getTransactions: C } = Rt().endpoints, { activeBalanceAccount: t, balanceAccountSelectionOptions: X, onBalanceAccountSelection: G } = ct(f), { defaultParams: m, nowTimestamp: T, refreshNowTimestamp: A } = ht("transactions", t), V = E(
-    async ({ balanceAccount: s, ...o }, lt) => C({ signal: lt, errorLevel: "error" }, {
-      query: {
-        ...o,
-        statuses: c(o[e.STATUSES]),
-        categories: c(o[e.CATEGORIES]),
-        currencies: c(o[e.CURRENCIES]),
-        createdSince: o[e.CREATED_SINCE] ?? m.current.defaultFilterParams[e.CREATED_SINCE],
-        createdUntil: o[e.CREATED_UNTIL] ?? m.current.defaultFilterParams[e.CREATED_UNTIL],
-        sortDirection: "desc",
-        balanceAccountId: (t == null ? void 0 : t.id) ?? "",
-        minAmount: R(o.minAmount) ? void 0 : parseFloat(o.minAmount),
-        maxAmount: R(o.maxAmount) ? void 0 : parseFloat(o.maxAmount)
-      }
-    }),
-    [t == null ? void 0 : t.id, m, C]
-  ), W = l(() => v(u) ? u : void 0, [u]), Y = l(() => v(p) ? p : void 0, [p]), j = l(() => h ? At : void 0, [h]), { canResetFilters: z, error: H, fetching: Q, filters: i, limit: J, limitOptions: K, records: Z, resetFilters: vt, updateFilters: n, updateLimit: $, ...q } = Lt({
-    fetchRecords: V,
+  const {
+    i18n: d
+  } = pe(), {
+    getTransactions: p
+  } = Le().endpoints, {
+    activeBalanceAccount: e,
+    balanceAccountSelectionOptions: k,
+    onBalanceAccountSelection: P
+  } = le(E), {
+    defaultParams: l,
+    nowTimestamp: f,
+    refreshNowTimestamp: C
+  } = Se("transactions", e), X = A(async ({
+    balanceAccount: s,
+    ...o
+  }, se) => p({
+    signal: se,
+    errorLevel: "error"
+  }, {
+    query: {
+      ...o,
+      statuses: c(o[t.STATUSES]),
+      categories: c(o[t.CATEGORIES]),
+      currencies: c(o[t.CURRENCIES]),
+      createdSince: o[t.CREATED_SINCE] ?? l.current.defaultFilterParams[t.CREATED_SINCE],
+      createdUntil: o[t.CREATED_UNTIL] ?? l.current.defaultFilterParams[t.CREATED_UNTIL],
+      sortDirection: "desc",
+      balanceAccountId: (e == null ? void 0 : e.id) ?? "",
+      minAmount: w(o.minAmount) ? void 0 : parseFloat(o.minAmount),
+      maxAmount: w(o.maxAmount) ? void 0 : parseFloat(o.maxAmount)
+    }
+  }), [e == null ? void 0 : e.id, l, p]), G = m(() => be(u) ? u : void 0, [u]), V = m(() => N ? fe : void 0, [N]), {
+    canResetFilters: z,
+    error: W,
+    fetching: Y,
+    filters: i,
+    limit: j,
+    limitOptions: H,
+    records: Q,
+    resetFilters: we,
+    updateFilters: n,
+    updateLimit: Z,
+    ...J
+  } = Oe({
+    fetchRecords: X,
     dataField: "data",
-    filterParams: m.current.defaultFilterParams,
+    filterParams: l.current.defaultFilterParams,
     initialFiltersSameAsDefault: !0,
-    onLimitChanged: Y,
-    onFiltersChanged: W,
-    preferredLimit: y,
-    preferredLimitOptions: j,
-    enabled: !!(t != null && t.id) && !!C
-  }), [a, F] = L([]), [B, tt] = L(!1), et = E((s, o) => {
-    F(s), tt(o);
-  }, []), { categoriesFilter: I, currenciesFilter: D, statusesFilter: S } = Mt(
-    {
-      filters: i,
-      updateFilters: n
-    },
-    a
-  );
-  N(() => {
-    F(void 0), n({
-      [e.BALANCE_ACCOUNT]: t == null ? void 0 : t.id,
-      [e.CURRENCIES]: void 0
+    onFiltersChanged: G,
+    preferredLimit: R,
+    preferredLimitOptions: V,
+    enabled: !!(e != null && e.id) && !!p
+  }), [a, _] = g([]), [K, $] = g(!1), q = A((s, o) => {
+    _(s), $(o);
+  }, []), {
+    categoriesFilter: F,
+    currenciesFilter: I,
+    statusesFilter: T
+  } = Ee({
+    filters: i,
+    updateFilters: n
+  }, a);
+  S(() => {
+    _(void 0), n({
+      [t.BALANCE_ACCOUNT]: e == null ? void 0 : e.id,
+      [t.CURRENCIES]: void 0
+    });
+  }, [n, e == null ? void 0 : e.id]), S(() => {
+    C();
+  }, [i, C]), S(() => {
+    T.updateSelection({
+      target: {
+        value: "Booked",
+        name: "status"
+      }
     });
-  }, [n, t == null ? void 0 : t.id]), N(() => {
-    A();
-  }, [i, A]), N(() => {
-    S.updateSelection({ target: { value: "Booked", name: "status" } });
-  }, [S]);
-  const O = Ut(gt.down.sm), rt = !!a && a.length > 1, U = l(
-    () => ({
-      showDetails: _ ?? !0,
-      callback: M
-    }),
-    [_, M]
-  ), it = l(() => ({ transaction: U }), [U]), { updateDetails: g, resetDetails: ot, selectedDetail: st } = Ct(it), nt = E(
-    (s) => {
-      g({
-        selection: { type: "transaction", data: { ...s, balanceAccountDescription: t == null ? void 0 : t.description } },
-        modalSize: "small"
-      }).callback({ id: s.id });
-    },
-    [g, t]
-  ), at = l(() => {
-    const s = new Date(T);
-    return s.setMonth(s.getMonth() - Ft), s.toString();
   }, [T]);
-  return /* @__PURE__ */ r("div", { className: It, children: [
-    !P && /* @__PURE__ */ r(pt, { variant: ut.TITLE, medium: !0, children: d.get("transactionsOverviewTitle") }),
-    /* @__PURE__ */ r(bt, { children: [
-      /* @__PURE__ */ r(
-        wt,
-        {
-          activeBalanceAccount: t,
-          balanceAccountSelectionOptions: X,
-          onBalanceAccountSelection: G
-        }
-      ),
-      /* @__PURE__ */ r(
-        ft,
-        {
-          canResetFilters: z,
-          defaultParams: m,
-          filters: i,
-          nowTimestamp: T,
-          refreshNowTimestamp: A,
-          sinceDate: at,
-          updateFilters: n
+  const D = Ie(De.down.sm), B = !!a && a.length > 1, O = m(() => ({
+    showDetails: M ?? !0,
+    callback: h
+  }), [M, h]), ee = m(() => ({
+    transaction: O
+  }), [O]), {
+    updateDetails: U,
+    resetDetails: te,
+    selectedDetail: re
+  } = ue(ee), ie = A((s) => {
+    U({
+      selection: {
+        type: "transaction",
+        data: {
+          ...s,
+          balanceAccount: e
         }
-      ),
-      /* @__PURE__ */ r(w, { ...I, placeholder: d.get("filterPlaceholder.category") }),
-      /* @__PURE__ */ r(
-        _t,
-        {
-          availableCurrencies: a,
-          selectedCurrencies: c(i[e.CURRENCIES]),
-          name: "range",
-          label: d.get("amount"),
-          minAmount: i[e.MIN_AMOUNT],
-          maxAmount: i[e.MAX_AMOUNT],
-          updateFilters: n,
-          onChange: n
-        }
-      ),
-      /* @__PURE__ */ r(w, { ...D, placeholder: d.get("filterPlaceholder.currency") })
-    ] }),
-    /* @__PURE__ */ r("div", { className: Dt, children: [
-      /* @__PURE__ */ r("div", { className: b, children: /* @__PURE__ */ r(
-        Et,
-        {
+      },
+      modalSize: "small"
+    }).callback({
+      id: s.id
+    });
+  }, [U, e]), oe = m(() => {
+    const s = new Date(f);
+    return s.setMonth(s.getMonth() - he), s.toString();
+  }, [f]);
+  return r("div", {
+    className: Me,
+    children: [!x && r(de, {
+      variant: me.TITLE,
+      medium: !0,
+      children: d.get("transactionsOverviewTitle")
+    }), r(Ue, {
+      children: [r(ge, {
+        activeBalanceAccount: e,
+        balanceAccountSelectionOptions: k,
+        onBalanceAccountSelection: P
+      }), r(ce, {
+        canResetFilters: z,
+        defaultParams: l,
+        filters: i,
+        nowTimestamp: f,
+        refreshNowTimestamp: C,
+        sinceDate: oe,
+        timezone: e == null ? void 0 : e.timeZone,
+        updateFilters: n
+      }), r(b, {
+        ...F,
+        placeholder: d.get("filterPlaceholder.category")
+      }), r(Ne, {
+        availableCurrencies: a,
+        selectedCurrencies: c(i[t.CURRENCIES]),
+        name: "range",
+        label: d.get("amount"),
+        minAmount: i[t.MIN_AMOUNT],
+        maxAmount: i[t.MAX_AMOUNT],
+        updateFilters: n,
+        onChange: n
+      }), r(b, {
+        ...I,
+        placeholder: d.get("filterPlaceholder.currency")
+      })]
+    }), r("div", {
+      className: _e,
+      children: [r("div", {
+        className: L,
+        children: r(Te, {
           availableCurrencies: a,
-          isAvailableCurrenciesFetching: B,
-          balanceAccountId: t == null ? void 0 : t.id,
-          statuses: S.selection,
-          categories: I.selection,
-          createdUntil: i[e.CREATED_UNTIL],
-          createdSince: i[e.CREATED_SINCE],
-          currencies: D.selection,
-          minAmount: i[e.MIN_AMOUNT] ? parseFloat(i[e.MIN_AMOUNT]) : void 0,
-          maxAmount: i[e.MAX_AMOUNT] ? parseFloat(i[e.MAX_AMOUNT]) : void 0,
-          fullWidth: O
-        }
-      ) }),
-      /* @__PURE__ */ r("div", { className: b, children: /* @__PURE__ */ r(
-        Nt,
-        {
-          balanceAccountId: t == null ? void 0 : t.id,
-          onCurrenciesChange: et,
-          defaultCurrencyCode: t == null ? void 0 : t.defaultCurrencyCode,
-          fullWidth: O
-        }
-      ) })
-    ] }),
-    /* @__PURE__ */ r(
-      mt,
-      {
-        selectedDetail: st,
-        resetDetails: ot,
-        className: Ot,
-        children: /* @__PURE__ */ r(
-          dt,
-          {
-            balanceAccounts: f,
-            availableCurrencies: a,
-            error: H,
-            hasMultipleCurrencies: rt,
-            limit: J,
-            limitOptions: K,
-            loading: Q || x || !f,
-            onContactSupport: k,
-            onLimitSelection: $,
-            onRowClick: nt,
-            showPagination: !0,
-            transactions: Z,
-            ...q
-          }
-        )
-      }
-    )
-  ] });
+          isAvailableCurrenciesFetching: K,
+          balanceAccountId: e == null ? void 0 : e.id,
+          statuses: T.selection,
+          categories: F.selection,
+          createdUntil: i[t.CREATED_UNTIL],
+          createdSince: i[t.CREATED_SINCE],
+          currencies: I.selection,
+          minAmount: i[t.MIN_AMOUNT] ? parseFloat(i[t.MIN_AMOUNT]) : void 0,
+          maxAmount: i[t.MAX_AMOUNT] ? parseFloat(i[t.MAX_AMOUNT]) : void 0,
+          fullWidth: D
+        })
+      }), r("div", {
+        className: L,
+        children: r(Ae, {
+          balanceAccountId: e == null ? void 0 : e.id,
+          onCurrenciesChange: q,
+          defaultCurrencyCode: e == null ? void 0 : e.defaultCurrencyCode,
+          fullWidth: D
+        })
+      })]
+    }), r(ne, {
+      selectedDetail: re,
+      resetDetails: te,
+      className: Fe,
+      children: r(ae, {
+        activeBalanceAccount: e,
+        availableCurrencies: a,
+        error: W,
+        hasMultipleCurrencies: B,
+        limit: j,
+        limitOptions: H,
+        loading: Y || y || !E,
+        onContactSupport: v,
+        onLimitSelection: Z,
+        onRowClick: ie,
+        showPagination: !0,
+        transactions: Q,
+        ...J
+      })
+    })]
+  });
 };
 export {
-  me as TransactionsOverview
+  at as TransactionsOverview
 };

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

@@ -1,21 +1,29 @@
-import { jsx as n } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import c from "../../../../hooks/useBalanceAccounts.js";
 import i from "../../../../internal/DataOverviewContainer/DataOverviewContainer.js";
 import { TransactionsOverview as s } from "../TransactionsOverview/TransactionsOverview.js";
 import { BASE_CLASS as u } from "./constants.js";
-function f({ ...o }) {
-  const { balanceAccounts: r, isBalanceAccountIdWrong: a, isFetching: t, error: e } = c(o.balanceAccountId);
-  return /* @__PURE__ */ n(
-    i,
-    {
-      balanceAccountsError: e,
-      className: u,
-      errorMessage: "weCouldNotLoadTheTransactionsOverview",
-      isBalanceAccountIdWrong: a,
-      onContactSupport: o.onContactSupport,
-      children: /* @__PURE__ */ n(s, { ...o, balanceAccounts: r, isLoadingBalanceAccount: t })
-    }
-  );
+import { jsx as n } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+function f({
+  ...o
+}) {
+  const {
+    balanceAccounts: r,
+    isBalanceAccountIdWrong: a,
+    isFetching: t,
+    error: e
+  } = c(o.balanceAccountId);
+  return n(i, {
+    balanceAccountsError: e,
+    className: u,
+    errorMessage: "weCouldNotLoadTheTransactionsOverview",
+    isBalanceAccountIdWrong: a,
+    onContactSupport: o.onContactSupport,
+    children: n(s, {
+      ...o,
+      balanceAccounts: r,
+      isLoadingBalanceAccount: t
+    })
+  });
 }
 export {
   f as default

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

@@ -1,28 +1,35 @@
-import { jsx as a } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import { PAYMENT_METHOD_CLASS as o, PAYMENT_METHOD_LOGO_CONTAINER_CLASS as s, PAYMENT_METHOD_LOGO_CLASS as i } from "./constants.js";
 import { Image as l } from "../../../../internal/Image/Image.js";
 import { parsePaymentMethodType as t } from "../utils.js";
 import { Tag as T } from "../../../../internal/Tag/Tag.js";
 import { TagVariant as f } from "../../../../internal/Tag/types.js";
 import N from "../../../../../core/Context/useCoreContext.js";
+import { jsx as a } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import { Fragment as _ } from "../../../../../external/preact/dist/preact.module.js";
 const C = ({
   paymentMethod: r,
   bankAccount: e
 }) => {
-  const { i18n: m } = N();
-  return /* @__PURE__ */ a("div", { className: o, children: r || e ? /* @__PURE__ */ a(_, { children: [
-    /* @__PURE__ */ a("div", { className: s, children: /* @__PURE__ */ a(
-      l,
-      {
-        name: r ? r.type : "bankTransfer",
-        alt: r ? r.type : "bankTransfer",
-        folder: "logos/",
-        className: i
-      }
-    ) }),
-    r ? t(r) : e == null ? void 0 : e.accountNumberLastFourDigits
-  ] }) : /* @__PURE__ */ a(T, { label: m.get("noData"), variant: f.WHITE }) });
+  const {
+    i18n: m
+  } = N();
+  return a("div", {
+    className: o,
+    children: r || e ? a(_, {
+      children: [a("div", {
+        className: s,
+        children: a(l, {
+          name: r ? r.type : "bankTransfer",
+          alt: r ? r.type : "bankTransfer",
+          folder: "logos/",
+          className: i
+        })
+      }), r ? t(r) : e == null ? void 0 : e.accountNumberLastFourDigits]
+    }) : a(T, {
+      label: m.get("noData"),
+      variant: f.WHITE
+    })
+  });
 }, D = C;
 export {
   D as default