@mx-cartographer/experiences 9.3.0-alpha.bb1 → 9.3.0-alpha.bb2

package/dist/transactions/components/shared/transactiondetails/actions/ExcludeAction.es.js

@@ -0,0 +1,90 @@
+import { useEvent as f, useGlobalCopyStore as h, useTransactionStore as C } from "../../../../../common/context/hooks.es.js";
+import A from "../../../../../common/components/dialog/Dialog.es.js";
+import { useTransactionsUiStore as T } from "../../../../context/hooks.es.js";
+import { ON_CLICK_EVENTS as i } from "../../../../constants/OnClickEvents.es.js";
+import s from "react";
+import { observer as y } from "mobx-react-lite";
+import { Text as E } from "@mxenabled/mxui";
+import { Icon as d } from "@mxenabled/mx-icons";
+import { jsx as o, jsxs as l } from "react/jsx-runtime";
+import { useTheme as b } from "@mui/material/styles";
+import O from "@mui/material/ListItem";
+import S from "@mui/material/ListItemButton";
+import g from "@mui/material/ListItemIcon";
+import v from "@mui/material/ListItemText";
+import L from "@mui/material/Avatar";
+import D from "@mui/material/ListItemAvatar";
+import R from "@mui/material/Switch";
+var k = ({ transaction: r }) => {
+  const { onEvent: n } = f(), { setAlert: a, updateTransaction: m } = C(), { setShouldDisableDrawerScroll: _ } = T(), { common: u, transactions: t } = h(), p = b(), [x, c] = s.useState(!1), e = r.is_hidden, I = async () => {
+    try {
+      await m({
+        ...r,
+        is_hidden: !r.is_hidden
+      }), n(e ? i.ON_TRANSACTION_UNHIDDEN : i.ON_TRANSACTION_HIDDEN), a(e ? t.transaction_included : t.transaction_excluded);
+    } catch {
+      a(e ? t.transaction_not_included : t.transaction_not_excluded);
+    }
+  }, N = p.palette.mode === "dark" ? "grey.800" : "grey.100";
+  return /* @__PURE__ */ o(s.Fragment, { children: r && /* @__PURE__ */ l(O, {
+    className: "mx-txn-hide-transaction",
+    disableGutters: !0,
+    disablePadding: !0,
+    children: [/* @__PURE__ */ l(S, {
+      "aria-checked": e,
+      "aria-labelledby": "hide-transaction-text",
+      onClick: () => {
+        n(e ? i.ON_TRANSACTION_UNHIDE_CLICK : i.ON_TRANSACTION_HIDE_CLICK), n(e ? "transaction_details_click_unhide_transaction" : "transaction_details_click_hide_transaction", { transaction_guid: r.guid }), c(!0);
+      },
+      role: "switch",
+      tabIndex: 0,
+      children: [
+        /* @__PURE__ */ o(D, { children: /* @__PURE__ */ o(L, {
+          sx: { bgcolor: N },
+          variant: "rounded",
+          children: e ? /* @__PURE__ */ o(d, {
+            name: "visibility_off",
+            sx: { color: "text.primary" }
+          }) : /* @__PURE__ */ o(d, {
+            name: "visibility",
+            sx: { color: "text.primary" }
+          })
+        }) }),
+        /* @__PURE__ */ o(v, {
+          id: "hide-transaction-text",
+          primary: t.exclude_transaction,
+          secondary: t.excluding_transaction
+        }),
+        /* @__PURE__ */ o(g, {
+          "aria-hidden": "true",
+          children: /* @__PURE__ */ o(R, {
+            checked: e,
+            slotProps: { input: { tabIndex: -1 } },
+            sx: { pointerEvents: "none" },
+            tabIndex: -1
+          })
+        })
+      ]
+    }), /* @__PURE__ */ o(A, {
+      copy: { title: e ? t.include_transaction : t.exclude_transaction },
+      isOpen: x,
+      onClose: () => {
+        _(!1), c(!1);
+      },
+      onPrimaryAction: I,
+      onSecondaryAction: () => n(e ? i.ON_TRANSACTION_UNHIDE_CANCEL_CLICK : i.ON_TRANSACTION_HIDE_CANCEL_CLICK),
+      primaryText: e ? t.include : t.exclude,
+      secondaryText: u.cancel_button,
+      children: /* @__PURE__ */ o(E, {
+        truncate: !1,
+        variant: "subtitle1",
+        children: e ? t.including_transaction : t.excluding_transaction
+      })
+    })]
+  }) });
+}, X = y(k);
+export {
+  X as default
+};
+
+//# sourceMappingURL=ExcludeAction.es.js.map

package/dist/transactions/components/shared/transactiondetails/actions/ExcludeAction.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExcludeAction.es.js","names":[],"sources":["../../../../../../src/transactions/components/shared/transactiondetails/actions/ExcludeAction.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Avatar from '@mui/material/Avatar'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemAvatar from '@mui/material/ListItemAvatar'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemIcon from '@mui/material/ListItemIcon'\nimport ListItemText from '@mui/material/ListItemText'\nimport Switch from '@mui/material/Switch'\nimport { useTheme } from '@mui/material/styles'\n\nimport { Text } from '@mxenabled/mxui'\nimport { Icon } from '@mxenabled/mx-icons'\n\nimport { Dialog, useEvent, useGlobalCopyStore, useTransactionStore } from '../../../../../common'\n\nimport type { Transaction } from '../../../../../core'\n\nimport { useTransactionsUiStore } from '../../../../context/hooks'\nimport { ON_CLICK_EVENTS } from '../../../../constants/OnClickEvents'\n\ninterface ExcludeActionProps {\n  transaction: Transaction\n}\n\nconst ExcludeAction: React.FC<ExcludeActionProps> = ({ transaction }) => {\n  const { onEvent } = useEvent()\n  const { setAlert, updateTransaction } = useTransactionStore()\n  const { setShouldDisableDrawerScroll } = useTransactionsUiStore()\n  const { common: commonCopy, transactions: copy } = useGlobalCopyStore()\n  const theme = useTheme()\n  const [open, setOpen] = React.useState(false)\n\n  const isExcluded = transaction.is_hidden\n\n  const toggleExclude = async () => {\n    try {\n      await updateTransaction({ ...transaction, is_hidden: !transaction.is_hidden })\n      onEvent(\n        isExcluded\n          ? ON_CLICK_EVENTS.ON_TRANSACTION_UNHIDDEN\n          : ON_CLICK_EVENTS.ON_TRANSACTION_HIDDEN,\n      )\n      setAlert(isExcluded ? copy.transaction_included : copy.transaction_excluded)\n    } catch {\n      setAlert(isExcluded ? copy.transaction_not_included : copy.transaction_not_excluded)\n    }\n  }\n\n  const bgColor = theme.palette.mode === 'dark' ? 'grey.800' : 'grey.100'\n\n  return (\n    <React.Fragment>\n      {transaction && (\n        <ListItem className=\"mx-txn-hide-transaction\" disableGutters={true} disablePadding={true}>\n          <ListItemButton\n            aria-checked={isExcluded}\n            aria-labelledby=\"hide-transaction-text\"\n            onClick={() => {\n              onEvent(\n                isExcluded\n                  ? ON_CLICK_EVENTS.ON_TRANSACTION_UNHIDE_CLICK\n                  : ON_CLICK_EVENTS.ON_TRANSACTION_HIDE_CLICK,\n              )\n              onEvent(\n                isExcluded\n                  ? 'transaction_details_click_unhide_transaction'\n                  : 'transaction_details_click_hide_transaction',\n                {\n                  transaction_guid: transaction.guid,\n                },\n              )\n              setOpen(true)\n            }}\n            role=\"switch\"\n            tabIndex={0}\n          >\n            <ListItemAvatar>\n              <Avatar sx={{ bgcolor: bgColor }} variant=\"rounded\">\n                {isExcluded ? (\n                  <Icon name=\"visibility_off\" sx={{ color: 'text.primary' }} />\n                ) : (\n                  <Icon name=\"visibility\" sx={{ color: 'text.primary' }} />\n                )}\n              </Avatar>\n            </ListItemAvatar>\n            <ListItemText\n              id=\"hide-transaction-text\"\n              primary={copy.exclude_transaction}\n              secondary={copy.excluding_transaction}\n            />\n            <ListItemIcon aria-hidden=\"true\">\n              <Switch\n                checked={isExcluded}\n                slotProps={{ input: { tabIndex: -1 } }}\n                sx={{ pointerEvents: 'none' }}\n                tabIndex={-1}\n              />\n            </ListItemIcon>\n          </ListItemButton>\n\n          <Dialog\n            copy={{\n              title: isExcluded ? copy.include_transaction : copy.exclude_transaction,\n            }}\n            isOpen={open}\n            onClose={() => {\n              setShouldDisableDrawerScroll(false)\n              setOpen(false)\n            }}\n            onPrimaryAction={toggleExclude}\n            onSecondaryAction={() =>\n              onEvent(\n                isExcluded\n                  ? ON_CLICK_EVENTS.ON_TRANSACTION_UNHIDE_CANCEL_CLICK\n                  : ON_CLICK_EVENTS.ON_TRANSACTION_HIDE_CANCEL_CLICK,\n              )\n            }\n            primaryText={isExcluded ? copy.include : copy.exclude}\n            secondaryText={commonCopy.cancel_button}\n          >\n            <Text truncate={false} variant=\"subtitle1\">\n              {isExcluded ? copy.including_transaction : copy.excluding_transaction}\n            </Text>\n          </Dialog>\n        </ListItem>\n      )}\n    </React.Fragment>\n  )\n}\n\nexport default observer(ExcludeAction)\n"],"mappings":"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"}

package/dist/transactions/components/shared/transactiondetails/actions/MemoAction.es.js

@@ -0,0 +1,101 @@
+import { useEvent as T, useGlobalCopyStore as h, useTransactionStore as C } from "../../../../../common/context/hooks.es.js";
+import I from "../../../../../common/components/drawer/Drawer.es.js";
+import { ANALYTICS_EVENTS as v } from "../../../../../common/constants/Analytics.es.js";
+import { useTransactionsUiStore as y } from "../../../../context/hooks.es.js";
+import { ON_CLICK_EVENTS as A } from "../../../../constants/OnClickEvents.es.js";
+import S from "../TransactionAmountHeader.es.js";
+import a from "react";
+import { observer as g } from "mobx-react-lite";
+import { Text as L } from "@mxenabled/mxui";
+import { Icon as c } from "@mxenabled/mx-icons";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { useTheme as E } from "@mui/material/styles";
+import N from "@mui/material/ListItem";
+import b from "@mui/material/ListItemButton";
+import M from "@mui/material/ListItemIcon";
+import O from "@mui/material/ListItemText";
+import w from "@mui/material/TextField";
+import K from "@mui/material/Avatar";
+import P from "@mui/material/ListItemAvatar";
+var R = ({ transaction: e }) => {
+  const { onEvent: n } = T(), { updateTransaction: p } = C(), { updateManualTransaction: d } = y(), { common: u, transactions: r } = h(), f = E(), [m, t] = a.useState(!1), [i, l] = a.useState("");
+  a.useEffect(() => {
+    m && l(e.memo ? e.memo : "");
+  }, [m]);
+  const x = async () => {
+    if (e.is_manual && !e.guid) {
+      d({
+        ...e,
+        memo: i
+      }), t(!1);
+      return;
+    }
+    await p({
+      ...e,
+      memo: i
+    }), n(v.TRANSACTION_DETAILS_CLICK_MEMO, { transaction_guid: e.guid }), t(!1);
+  };
+  return /* @__PURE__ */ s(N, {
+    className: "mx-txn-memo-action",
+    disableGutters: !0,
+    disablePadding: !0,
+    children: [/* @__PURE__ */ s(b, {
+      onClick: () => {
+        n(A.ON_TRANSACTION_MEMO_CLICK), t(!0);
+      },
+      children: [
+        /* @__PURE__ */ o(P, { children: /* @__PURE__ */ o(K, {
+          sx: { bgcolor: f.palette.mode === "dark" ? "grey.800" : "grey.100" },
+          variant: "rounded",
+          children: /* @__PURE__ */ o(c, {
+            name: "article",
+            sx: { color: "text.primary" }
+          })
+        }) }),
+        /* @__PURE__ */ o(O, {
+          primary: r.memo_title,
+          secondary: /* @__PURE__ */ o(L, {
+            bold: !0,
+            sx: { color: "text.primary" },
+            variant: "body1",
+            children: e.memo ? e.memo : r.memo_desc
+          }),
+          slotProps: { primary: {
+            variant: "caption",
+            fontSize: 11,
+            fontWeight: "normal"
+          } }
+        }),
+        /* @__PURE__ */ o(M, { children: /* @__PURE__ */ o(c, {
+          name: "chevron_right",
+          sx: { color: "text.primary" }
+        }) })
+      ]
+    }), /* @__PURE__ */ s(I, {
+      ariaLabelClose: u.close_aria,
+      isOpen: m,
+      onClose: () => t(!1),
+      onPrimaryAction: x,
+      title: r.memo_title,
+      children: [/* @__PURE__ */ o(S, { transaction: e }), /* @__PURE__ */ o(w, {
+        "aria-label": r.memo_desc_aria,
+        focused: !0,
+        multiline: !0,
+        name: "memo",
+        onChange: (_) => l(_.target.value),
+        placeholder: r.memo_desc,
+        rows: 4,
+        sx: {
+          mx: 16,
+          width: "calc(100% - 32px)"
+        },
+        value: i
+      })]
+    })]
+  });
+}, oe = g(R);
+export {
+  oe as default
+};
+
+//# sourceMappingURL=MemoAction.es.js.map

package/dist/transactions/components/shared/transactiondetails/actions/MemoAction.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MemoAction.es.js","names":[],"sources":["../../../../../../src/transactions/components/shared/transactiondetails/actions/MemoAction.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Avatar from '@mui/material/Avatar'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemAvatar from '@mui/material/ListItemAvatar'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemIcon from '@mui/material/ListItemIcon'\nimport ListItemText from '@mui/material/ListItemText'\nimport TextField from '@mui/material/TextField'\nimport { useTheme } from '@mui/material/styles'\n\nimport { Text } from '@mxenabled/mxui'\nimport { Icon } from '@mxenabled/mx-icons'\n\nimport { ANALYTICS_EVENTS, Drawer, useGlobalCopyStore } from '../../../../../common'\n\nimport type { Transaction } from '../../../../../core'\n\nimport { useTransactionsUiStore } from '../../../../context/hooks'\nimport { useEvent, useTransactionStore } from '../../../../../common'\nimport { ON_CLICK_EVENTS } from '../../../../constants/OnClickEvents'\n\nimport TransactionAmountHeader from '../TransactionAmountHeader'\n\ninterface MemoActionProps {\n  transaction: Transaction\n}\n\nconst MemoAction: React.FC<MemoActionProps> = ({ transaction }) => {\n  const { onEvent } = useEvent()\n  const { updateTransaction } = useTransactionStore()\n  const { updateManualTransaction } = useTransactionsUiStore()\n  const { common: commonCopy, transactions: copy } = useGlobalCopyStore()\n\n  const theme = useTheme()\n\n  const [open, setOpen] = React.useState(false)\n  const [memoText, setMemoText] = React.useState('')\n\n  React.useEffect(() => {\n    if (open) {\n      setMemoText(transaction.memo ? transaction.memo : '')\n    }\n  }, [open])\n\n  const handleSave = async () => {\n    if (transaction.is_manual && !transaction.guid) {\n      updateManualTransaction({ ...transaction, memo: memoText })\n      setOpen(false)\n      return\n    }\n\n    await updateTransaction({ ...transaction, memo: memoText })\n    onEvent(ANALYTICS_EVENTS.TRANSACTION_DETAILS_CLICK_MEMO, { transaction_guid: transaction.guid })\n    setOpen(false)\n  }\n\n  const bgColor = theme.palette.mode === 'dark' ? 'grey.800' : 'grey.100'\n\n  return (\n    <ListItem className=\"mx-txn-memo-action\" disableGutters={true} disablePadding={true}>\n      <ListItemButton\n        onClick={() => {\n          onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_MEMO_CLICK)\n          setOpen(true)\n        }}\n      >\n        <ListItemAvatar>\n          <Avatar sx={{ bgcolor: bgColor }} variant=\"rounded\">\n            <Icon name=\"article\" sx={{ color: 'text.primary' }} />\n          </Avatar>\n        </ListItemAvatar>\n        <ListItemText\n          primary={copy.memo_title}\n          secondary={\n            <Text bold={true} sx={{ color: 'text.primary' }} variant=\"body1\">\n              {transaction.memo ? transaction.memo : copy.memo_desc}\n            </Text>\n          }\n          slotProps={{ primary: { variant: 'caption', fontSize: 11, fontWeight: 'normal' } }}\n        />\n        <ListItemIcon>\n          <Icon name=\"chevron_right\" sx={{ color: 'text.primary' }} />\n        </ListItemIcon>\n      </ListItemButton>\n\n      <Drawer\n        ariaLabelClose={commonCopy.close_aria}\n        isOpen={open}\n        onClose={() => setOpen(false)}\n        onPrimaryAction={handleSave}\n        title={copy.memo_title}\n      >\n        <TransactionAmountHeader transaction={transaction} />\n        <TextField\n          aria-label={copy.memo_desc_aria}\n          focused={true}\n          multiline={true}\n          name=\"memo\"\n          onChange={(e: React.ChangeEvent<HTMLInputElement>) => setMemoText(e.target.value)}\n          placeholder={copy.memo_desc}\n          rows={4}\n          sx={{ mx: 16, width: 'calc(100% - 32px)' }}\n          value={memoText}\n        />\n      </Drawer>\n    </ListItem>\n  )\n}\n\nexport default observer(MemoAction)\n"],"mappings":"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"}

package/dist/transactions/components/shared/transactiondetails/actions/SplitAction.es.js

@@ -0,0 +1,150 @@
+import { buildDynamicCopy as m } from "../../../../../core/utils/Localization.es.js";
+import { useCategoryStore as B, useEvent as F, useGlobalCopyStore as H, useTransactionStore as q } from "../../../../../common/context/hooks.es.js";
+import { useAriaLive as z } from "../../../../../common/hooks/useAriaLive.es.js";
+import G from "../../../../../common/components/dialog/Dialog.es.js";
+import J from "../../../../../common/components/drawer/Drawer.es.js";
+import { ANALYTICS_EVENTS as A } from "../../../../../common/constants/Analytics.es.js";
+import { useTransactionsUiStore as Q } from "../../../../context/hooks.es.js";
+import { ON_CLICK_EVENTS as f } from "../../../../constants/OnClickEvents.es.js";
+import W from "../TransactionAmountHeader.es.js";
+import X from "../../../splitmanager/SplitManager.es.js";
+import c from "react";
+import { observer as Z } from "mobx-react-lite";
+import { P as tt } from "@mxenabled/mxui";
+import { Icon as h } from "@mxenabled/mx-icons";
+import { jsx as i, jsxs as C } from "react/jsx-runtime";
+import { useTheme as et } from "@mui/material/styles";
+import ot from "@mui/material/ListItem";
+import it from "@mui/material/ListItemButton";
+import nt from "@mui/material/ListItemIcon";
+import rt from "@mui/material/ListItemText";
+import st from "@mui/material/Avatar";
+import at from "@mui/material/ListItemAvatar";
+var lt = ({ transaction: t }) => {
+  const { onEvent: p } = F(), { announce: u, ariaLive: L } = z(), { splitTransaction: b, unSplitTransaction: N, transactionSplitting: y } = q(), { common: _, transactions: n } = H(), { setShouldDisableDrawerScroll: v } = Q(), { categories: E } = B(), O = et(), T = {
+    ...t,
+    amount: t.amount - 1,
+    guid: "",
+    has_been_split: !1,
+    parent_guid: t.guid
+  }, d = {
+    ...t,
+    amount: 1,
+    category_guid: void 0,
+    category: n.split_transaction_select_category_btn,
+    guid: "",
+    has_been_split: !1,
+    parent_guid: t.guid,
+    top_level_category_guid: void 0
+  }, [D, g] = c.useState(!1), [P, I] = c.useState(!1), [r, a] = c.useState([]), x = () => {
+    const e = [...r];
+    e.push({ ...d }), e[0].amount -= 1, a(e), u(m(n.split_transaction_add_split_announcement, e.length));
+  }, w = (e) => {
+    if (e > 0) {
+      const s = r[e], o = [...r];
+      o.splice(e, 1), o[0].amount += s.amount, a(o), u(m(n.split_transaction_delete_split_announcement, e + 1));
+    }
+  }, R = (e, s) => {
+    const o = [...r];
+    o[e].amount = s, o[0].amount = t.amount - o.reduce((l, S, $) => l + ($ !== 0 ? S.amount : 0), 0), a(o);
+  }, U = (e, s) => {
+    const o = [...r], l = E.find((S) => S.guid === s);
+    l && (o[e] = {
+      ...o[e],
+      category_guid: s,
+      category: l.name,
+      top_level_category_guid: l.parent_guid || s
+    }, a(o), u(m(n.split_transaction_select_category_announcement, l.name, e + 1)));
+  }, K = () => {
+    if (t.parent_guid || t.has_been_split) {
+      I(!0);
+      return;
+    }
+    a([{ ...T }, { ...d }]), p(A.TRANSACTION_DETAILS_CLICK_SPLIT, { transaction_guid: t.guid }), g(!0);
+  }, k = async () => {
+    p(f.ON_TRANSACTION_SPLIT_SAVE_CLICK), await b({
+      ...t,
+      has_been_split: !0
+    }, r), g(!1);
+  }, M = async () => {
+    y || (p(f.ON_TRANSACTION_SPLIT_CANCEL_CLICK), a([{ ...T }, { ...d }]), g(!1));
+  }, V = async () => {
+    p(A.TRANSACTION_DETAILS_CLICK_UNSPLIT, { transaction_guid: t.guid });
+    const e = t.parent_guid ?? t.guid;
+    await N(e);
+  }, j = c.useMemo(() => {
+    const e = r.some((o) => !o.category_guid), s = r.some((o) => o.amount <= 0);
+    return e || s;
+  }, [r]), Y = O.palette.mode === "dark" ? "grey.800" : "grey.100";
+  return /* @__PURE__ */ i(c.Fragment, { children: t && /* @__PURE__ */ C(ot, {
+    disableGutters: !0,
+    disablePadding: !0,
+    children: [
+      /* @__PURE__ */ C(it, {
+        onClick: K,
+        children: [
+          /* @__PURE__ */ i(at, { children: /* @__PURE__ */ i(st, {
+            sx: { bgcolor: Y },
+            variant: "rounded",
+            children: /* @__PURE__ */ i(h, {
+              name: "call_split",
+              sx: { color: "text.primary" }
+            })
+          }) }),
+          /* @__PURE__ */ i(rt, {
+            primary: t.has_been_split || t.parent_guid ? n.split_transaction_unsplit_title : n.split_transaction_title,
+            secondary: t.has_been_split || t.parent_guid ? n.split_transaction_unsplit_subtitle : n.split_transaction_desc
+          }),
+          /* @__PURE__ */ i(nt, { children: t.has_been_split || t.parent_guid ? /* @__PURE__ */ i(h, { name: "delete" }) : /* @__PURE__ */ i(h, {
+            name: "chevron_right",
+            sx: { color: "text.primary" }
+          }) })
+        ]
+      }),
+      /* @__PURE__ */ C(J, {
+        ariaLabelClose: _.close_aria,
+        isOpen: D,
+        isPrimaryDisabled: j || y,
+        onClose: M,
+        onPrimaryAction: k,
+        primaryText: _.save_button,
+        secondaryText: _.cancel_button,
+        title: n.split_transaction_title,
+        children: [
+          L,
+          /* @__PURE__ */ i(W, { transaction: t }),
+          /* @__PURE__ */ i(X, {
+            onAddSplit: x,
+            onCategoryChanged: U,
+            onDeleteSplit: w,
+            onUpdateAmount: R,
+            splits: r,
+            transaction: t
+          })
+        ]
+      }),
+      /* @__PURE__ */ i(G, {
+        copy: { title: n.split_transaction_unsplit_title },
+        isOpen: P,
+        onClose: () => {
+          v(!1), I(!1);
+        },
+        onPrimaryAction: V,
+        onSecondaryAction: () => {
+          p(f.ON_TRANSACTION_UNSPLIT_CANCEL);
+        },
+        primaryText: _.delete_button,
+        secondaryText: _.cancel_button,
+        children: /* @__PURE__ */ i(tt, {
+          variant: "subtitle1",
+          children: m(n.split_transaction_unsplit_description, t.description)
+        })
+      })
+    ]
+  }) });
+}, Pt = Z(lt);
+export {
+  Pt as default
+};
+
+//# sourceMappingURL=SplitAction.es.js.map

package/dist/transactions/components/shared/transactiondetails/actions/SplitAction.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitAction.es.js","names":[],"sources":["../../../../../../src/transactions/components/shared/transactiondetails/actions/SplitAction.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Avatar from '@mui/material/Avatar'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemAvatar from '@mui/material/ListItemAvatar'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemIcon from '@mui/material/ListItemIcon'\nimport ListItemText from '@mui/material/ListItemText'\nimport { useTheme } from '@mui/material/styles'\n\nimport { P } from '@mxenabled/mxui'\nimport { Icon } from '@mxenabled/mx-icons'\n\nimport {\n  Dialog,\n  Drawer,\n  useCategoryStore,\n  useGlobalCopyStore,\n  useEvent,\n  useTransactionStore,\n  ANALYTICS_EVENTS,\n} from '../../../../../common'\nimport type { Transaction } from '../../../../../core'\n\nimport { useTransactionsUiStore } from '../../../../context/hooks'\nimport { ON_CLICK_EVENTS } from '../../../../constants/OnClickEvents'\n\nimport { SplitManager } from '../../../splitmanager'\n\nimport TransactionAmountHeader from '../TransactionAmountHeader'\nimport { useAriaLive } from '../../../../../common/hooks/useAriaLive'\nimport { buildDynamicCopy } from '../../../../../core/utils/Localization'\n\ninterface SplitActionProps {\n  transaction: Transaction\n}\n\nconst SplitAction: React.FC<SplitActionProps> = ({ transaction }) => {\n  const { onEvent } = useEvent()\n  const { announce, ariaLive } = useAriaLive()\n  const { splitTransaction, unSplitTransaction, transactionSplitting } = useTransactionStore()\n  const { common: commonCopy, transactions: copy } = useGlobalCopyStore()\n  const { setShouldDisableDrawerScroll } = useTransactionsUiStore()\n  const { categories } = useCategoryStore()\n  const theme = useTheme()\n  const INITIAL_SPLIT = {\n    ...transaction,\n    amount: transaction.amount - 1,\n    guid: '',\n    has_been_split: false,\n    parent_guid: transaction.guid,\n  }\n\n  const EMPTY_SPLIT = {\n    ...transaction,\n    amount: 1,\n    category_guid: undefined,\n    category: copy.split_transaction_select_category_btn,\n    guid: '',\n    has_been_split: false,\n    parent_guid: transaction.guid,\n    top_level_category_guid: undefined,\n  }\n\n  const [isSplitDrawerOpen, setIsSplitDrawerOpen] = React.useState(false)\n  const [isDeleteSplitOpen, setIsDeleteSplitOpen] = React.useState(false)\n  const [splits, setSplits] = React.useState<Transaction[]>([])\n\n  const handleAddSplit = () => {\n    const updatedSplits = [...splits]\n\n    updatedSplits.push({ ...EMPTY_SPLIT })\n    updatedSplits[0].amount -= 1\n    setSplits(updatedSplits)\n\n    announce(\n      buildDynamicCopy(\n        copy.split_transaction_add_split_announcement,\n        updatedSplits.length,\n      ) as string,\n    )\n  }\n\n  const handleDeleteSplit = (index: number) => {\n    if (index > 0) {\n      const row = splits[index]\n      const updatedSplits = [...splits]\n\n      updatedSplits.splice(index, 1)\n      updatedSplits[0].amount += row.amount\n      setSplits(updatedSplits)\n\n      announce(\n        buildDynamicCopy(copy.split_transaction_delete_split_announcement, index + 1) as string,\n      )\n    }\n  }\n\n  const handleUpdateAmount = (index: number, amount: number) => {\n    const updatedSplits = [...splits]\n\n    updatedSplits[index].amount = amount\n    updatedSplits[0].amount =\n      transaction.amount -\n      updatedSplits.reduce(\n        (sum: number, split: Transaction, index) => sum + (index !== 0 ? split.amount : 0),\n        0,\n      )\n    setSplits(updatedSplits)\n  }\n\n  const handleCategoryChanged = (index: number, categoryGuid: string) => {\n    const updatedSplits = [...splits]\n    const category = categories.find((item) => item.guid === categoryGuid)\n    if (category) {\n      updatedSplits[index] = {\n        ...updatedSplits[index],\n        category_guid: categoryGuid,\n        category: category.name,\n        top_level_category_guid: category.parent_guid || categoryGuid,\n      }\n      setSplits(updatedSplits)\n      announce(\n        buildDynamicCopy(\n          copy.split_transaction_select_category_announcement,\n          category.name,\n          index + 1,\n        ) as string,\n      )\n    }\n  }\n\n  const handleClick = () => {\n    if (transaction.parent_guid || transaction.has_been_split) {\n      setIsDeleteSplitOpen(true)\n      return\n    }\n\n    setSplits([{ ...INITIAL_SPLIT }, { ...EMPTY_SPLIT }])\n\n    onEvent(ANALYTICS_EVENTS.TRANSACTION_DETAILS_CLICK_SPLIT, {\n      transaction_guid: transaction.guid,\n    })\n    setIsSplitDrawerOpen(true)\n  }\n\n  const handleSave = async () => {\n    onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_SPLIT_SAVE_CLICK)\n    await splitTransaction({ ...transaction, has_been_split: true }, splits)\n    setIsSplitDrawerOpen(false)\n  }\n\n  const handleCancel = async () => {\n    if (transactionSplitting) return\n\n    onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_SPLIT_CANCEL_CLICK)\n    setSplits([{ ...INITIAL_SPLIT }, { ...EMPTY_SPLIT }])\n    setIsSplitDrawerOpen(false)\n  }\n\n  const handleUnSplit = async () => {\n    onEvent(ANALYTICS_EVENTS.TRANSACTION_DETAILS_CLICK_UNSPLIT, {\n      transaction_guid: transaction.guid,\n    })\n    const guid = transaction.parent_guid ?? transaction.guid\n    await unSplitTransaction(guid)\n  }\n\n  const hasError = React.useMemo(() => {\n    const hasCategoryError = splits.some((split) => !split.category_guid)\n    const hasAmountError = splits.some((split) => split.amount <= 0)\n\n    return hasCategoryError || hasAmountError\n  }, [splits])\n\n  const bgColor = theme.palette.mode === 'dark' ? 'grey.800' : 'grey.100'\n\n  return (\n    <React.Fragment>\n      {transaction && (\n        <ListItem disableGutters={true} disablePadding={true}>\n          <ListItemButton onClick={handleClick}>\n            <ListItemAvatar>\n              <Avatar sx={{ bgcolor: bgColor }} variant=\"rounded\">\n                <Icon name=\"call_split\" sx={{ color: 'text.primary' }} />\n              </Avatar>\n            </ListItemAvatar>\n            <ListItemText\n              primary={\n                transaction.has_been_split || transaction.parent_guid\n                  ? copy.split_transaction_unsplit_title\n                  : copy.split_transaction_title\n              }\n              secondary={\n                transaction.has_been_split || transaction.parent_guid\n                  ? copy.split_transaction_unsplit_subtitle\n                  : copy.split_transaction_desc\n              }\n            />\n            <ListItemIcon>\n              {transaction.has_been_split || transaction.parent_guid ? (\n                <Icon name=\"delete\" />\n              ) : (\n                <Icon name=\"chevron_right\" sx={{ color: 'text.primary' }} />\n              )}\n            </ListItemIcon>\n          </ListItemButton>\n\n          <Drawer\n            ariaLabelClose={commonCopy.close_aria}\n            isOpen={isSplitDrawerOpen}\n            isPrimaryDisabled={hasError || transactionSplitting}\n            onClose={handleCancel}\n            onPrimaryAction={handleSave}\n            primaryText={commonCopy.save_button}\n            secondaryText={commonCopy.cancel_button}\n            title={copy.split_transaction_title}\n          >\n            {ariaLive}\n            <TransactionAmountHeader transaction={transaction} />\n            <SplitManager\n              onAddSplit={handleAddSplit}\n              onCategoryChanged={handleCategoryChanged}\n              onDeleteSplit={handleDeleteSplit}\n              onUpdateAmount={handleUpdateAmount}\n              splits={splits}\n              transaction={transaction}\n            />\n          </Drawer>\n\n          <Dialog\n            copy={{ title: copy.split_transaction_unsplit_title }}\n            isOpen={isDeleteSplitOpen}\n            onClose={() => {\n              setShouldDisableDrawerScroll(false)\n              setIsDeleteSplitOpen(false)\n            }}\n            onPrimaryAction={handleUnSplit}\n            onSecondaryAction={() => {\n              onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_UNSPLIT_CANCEL)\n            }}\n            primaryText={commonCopy.delete_button}\n            secondaryText={commonCopy.cancel_button}\n          >\n            <P variant=\"subtitle1\">\n              {\n                buildDynamicCopy(\n                  copy.split_transaction_unsplit_description,\n                  transaction.description,\n                ) as string\n              }\n            </P>\n          </Dialog>\n        </ListItem>\n      )}\n    </React.Fragment>\n  )\n}\n\nexport default observer(SplitAction)\n"],"mappings":"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"}

package/dist/transactions/components/shared/transactiondetails/actions/TagsAction.es.js

@@ -0,0 +1,94 @@
+import { useEvent as A, useGlobalCopyStore as v, useTransactionStore as L } from "../../../../../common/context/hooks.es.js";
+import b from "../../../../../common/components/drawer/Drawer.es.js";
+import { ANALYTICS_EVENTS as N } from "../../../../../common/constants/Analytics.es.js";
+import { useTransactionsUiStore as E } from "../../../../context/hooks.es.js";
+import { ON_CLICK_EVENTS as O } from "../../../../constants/OnClickEvents.es.js";
+import k from "../../../tagmanager/TagManager.es.js";
+import m from "react";
+import { observer as G } from "mobx-react-lite";
+import { Text as $ } from "@mxenabled/mxui";
+import { Icon as g } from "@mxenabled/mx-icons";
+import { jsx as t, jsxs as u } from "react/jsx-runtime";
+import { useTheme as w } from "@mui/material/styles";
+import K from "@mui/material/ListItem";
+import M from "@mui/material/ListItemButton";
+import P from "@mui/material/ListItemIcon";
+import R from "@mui/material/ListItemText";
+import j from "@mui/material/Avatar";
+import D from "@mui/material/ListItemAvatar";
+var V = ({ transaction: e }) => {
+  const { onEvent: c } = A(), { tags: p, updateTaggings: T, updateTransaction: _ } = L(), { common: n, transactions: l } = v(), { updateManualTransaction: h } = E(), x = w(), [d, a] = m.useState(!1), [o, f] = m.useState(e.tags);
+  m.useEffect(() => {
+    f(e.tags);
+  }, [d, e]);
+  const y = (s) => {
+    const r = [...o], i = o.indexOf(s);
+    i >= 0 ? r.splice(i, 1) : r.push(s), f(r);
+  }, C = async () => {
+    if (e.is_manual && !e.guid) {
+      h({
+        ...e,
+        tags: o
+      }), a(!1);
+      return;
+    }
+    await T(o, e.guid), await _({
+      ...e,
+      tags: o
+    }), c(N.TRANSACTION_DETAILS_CLICK_TAGS, { transaction_guid: e.guid }), a(!1);
+  }, S = m.useMemo(() => e.tags.map((s, r, i) => `${p.find((I) => I.guid === s)?.name}${r < i.length - 1 ? " / " : ""}`), [p, e]);
+  return /* @__PURE__ */ u(K, {
+    disableGutters: !0,
+    disablePadding: !0,
+    children: [/* @__PURE__ */ u(M, {
+      onClick: () => {
+        c(O.ON_TRANSACTION_TAGS_CLICK), a(!0);
+      },
+      children: [
+        /* @__PURE__ */ t(D, { children: /* @__PURE__ */ t(j, {
+          sx: { bgcolor: x.palette.mode === "dark" ? "grey.800" : "grey.100" },
+          variant: "rounded",
+          children: /* @__PURE__ */ t(g, {
+            name: "local_offer",
+            sx: { color: "text.primary" }
+          })
+        }) }),
+        /* @__PURE__ */ t(R, {
+          primary: l.tags_title,
+          secondary: /* @__PURE__ */ t($, {
+            bold: !0,
+            sx: { color: "text.primary" },
+            variant: "body1",
+            children: e.tags?.length > 0 ? S : l.tags_desc
+          }),
+          slotProps: { primary: {
+            variant: "caption",
+            fontSize: 11,
+            fontWeight: "normal"
+          } }
+        }),
+        /* @__PURE__ */ t(P, { children: /* @__PURE__ */ t(g, {
+          name: "chevron_right",
+          sx: { color: "text.primary" }
+        }) })
+      ]
+    }), /* @__PURE__ */ t(b, {
+      ariaLabelClose: n.close_aria,
+      isOpen: d,
+      onClose: () => a(!1),
+      onPrimaryAction: C,
+      primaryText: n.save_button,
+      secondaryText: n.cancel_button,
+      title: l.tags_title,
+      children: /* @__PURE__ */ t(k, {
+        onTagChecked: y,
+        selectedTags: o
+      })
+    })]
+  });
+}, ie = G(V);
+export {
+  ie as default
+};
+
+//# sourceMappingURL=TagsAction.es.js.map

package/dist/transactions/components/shared/transactiondetails/actions/TagsAction.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagsAction.es.js","names":[],"sources":["../../../../../../src/transactions/components/shared/transactiondetails/actions/TagsAction.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Avatar from '@mui/material/Avatar'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemAvatar from '@mui/material/ListItemAvatar'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemIcon from '@mui/material/ListItemIcon'\nimport ListItemText from '@mui/material/ListItemText'\nimport { useTheme } from '@mui/material/styles'\n\nimport { Text } from '@mxenabled/mxui'\nimport { Icon } from '@mxenabled/mx-icons'\n\nimport { ANALYTICS_EVENTS, Drawer, useGlobalCopyStore } from '../../../../../common'\n\nimport type { Transaction } from '../../../../../core'\n\nimport { TagManager } from '../../../tagmanager'\nimport { useTransactionsUiStore } from '../../../../context/hooks'\nimport { useEvent, useTransactionStore } from '../../../../../common'\nimport { ON_CLICK_EVENTS } from '../../../../constants/OnClickEvents'\n\ninterface TagsActionProps {\n  transaction: Transaction\n}\n\nconst TagsAction: React.FC<TagsActionProps> = ({ transaction }) => {\n  const { onEvent } = useEvent()\n  const { tags, updateTaggings, updateTransaction } = useTransactionStore()\n  const { common: commonCopy, transactions: copy } = useGlobalCopyStore()\n  const { updateManualTransaction } = useTransactionsUiStore()\n\n  const theme = useTheme()\n\n  const [open, setOpen] = React.useState(false)\n  const [selectedTags, setSelectedTags] = React.useState<string[]>(transaction.tags)\n\n  React.useEffect(() => {\n    setSelectedTags(transaction.tags)\n  }, [open, transaction])\n\n  const handleTagChecked = (guid: string) => {\n    const tags = [...selectedTags]\n\n    const index = selectedTags.indexOf(guid)\n    if (index >= 0) {\n      tags.splice(index, 1)\n    } else {\n      tags.push(guid)\n    }\n    setSelectedTags(tags)\n  }\n\n  const handleSave = async () => {\n    if (transaction.is_manual && !transaction.guid) {\n      updateManualTransaction({ ...transaction, tags: selectedTags })\n      setOpen(false)\n      return\n    }\n\n    await updateTaggings(selectedTags, transaction.guid)\n    await updateTransaction({ ...transaction, tags: selectedTags })\n    onEvent(ANALYTICS_EVENTS.TRANSACTION_DETAILS_CLICK_TAGS, { transaction_guid: transaction.guid })\n    setOpen(false)\n  }\n\n  const tagNames = React.useMemo(\n    () =>\n      transaction.tags.map(\n        (tagGuid, index, selectedTags) =>\n          `${tags.find((item) => item.guid === tagGuid)?.name}${\n            index < selectedTags.length - 1 ? ' / ' : ''\n          }`,\n      ),\n    [tags, transaction],\n  )\n\n  const bgColor = theme.palette.mode === 'dark' ? 'grey.800' : 'grey.100'\n\n  return (\n    <ListItem disableGutters={true} disablePadding={true}>\n      <ListItemButton\n        onClick={() => {\n          onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_TAGS_CLICK)\n          setOpen(true)\n        }}\n      >\n        <ListItemAvatar>\n          <Avatar sx={{ bgcolor: bgColor }} variant=\"rounded\">\n            <Icon name=\"local_offer\" sx={{ color: 'text.primary' }} />\n          </Avatar>\n        </ListItemAvatar>\n        <ListItemText\n          primary={copy.tags_title}\n          secondary={\n            <Text bold={true} sx={{ color: 'text.primary' }} variant=\"body1\">\n              {transaction.tags?.length > 0 ? tagNames : copy.tags_desc}\n            </Text>\n          }\n          slotProps={{ primary: { variant: 'caption', fontSize: 11, fontWeight: 'normal' } }}\n        />\n        <ListItemIcon>\n          <Icon name=\"chevron_right\" sx={{ color: 'text.primary' }} />\n        </ListItemIcon>\n      </ListItemButton>\n\n      <Drawer\n        ariaLabelClose={commonCopy.close_aria}\n        isOpen={open}\n        onClose={() => setOpen(false)}\n        onPrimaryAction={handleSave}\n        primaryText={commonCopy.save_button}\n        secondaryText={commonCopy.cancel_button}\n        title={copy.tags_title}\n      >\n        <TagManager onTagChecked={handleTagChecked} selectedTags={selectedTags} />\n      </Drawer>\n    </ListItem>\n  )\n}\n\nexport default observer(TagsAction)\n"],"mappings":"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"}

package/dist/transactions/components/shared/transactionlist/TransactionRow.es.js

@@ -0,0 +1,92 @@
+import { useGlobalCopyStore as x, useTransactionStore as C } from "../../../../common/context/hooks.es.js";
+import { TransactionType as I } from "../../../../core/types/Transaction.es.js";
+import { formatCurrency as S } from "../../../../core/utils/NumberFormatting.es.js";
+import { ListItemWrapper as w } from "../../../../common/components/ListItemWrapper.es.js";
+import { useTransactionsUiStore as f } from "../../../context/hooks.es.js";
+import { ON_CLICK_EVENTS as k } from "../../../constants/OnClickEvents.es.js";
+import { postInsightOnTransaction as L } from "../../../../common/utils/PostMessage.es.js";
+import _ from "react";
+import { observer as N } from "mobx-react-lite";
+import d from "@mui/material/Stack";
+import { Icon as c, MerchantLogo as E, Text as n } from "@mxenabled/mxui";
+import { jsx as t, jsxs as i } from "react/jsx-runtime";
+import { useTheme as R } from "@mui/material/styles";
+import j from "@mui/material/ListItemText";
+import M from "@mui/material/ListItemAvatar";
+var O = ({ transaction: e, onClick: p, component: l }) => {
+  const g = R().palette.mode === "dark", { associatedBeats: m } = C(), { expandedSplits: h } = f(), { transactions: y } = x(), { showInsights: T } = f(), u = e.transaction_type === I.CREDIT, a = _.useMemo(() => m.find((r) => r.associated_transaction_guid === e.guid), [m, e]), b = (r, o) => {
+    const s = [];
+    return r.is_flagged && s.push(/* @__PURE__ */ t(c, {
+      fill: !0,
+      name: "flag",
+      size: 16,
+      sx: { color: o ? "primary.main" : "warning.dark" }
+    }, "flag")), r.is_hidden && s.push(/* @__PURE__ */ t(c, {
+      name: "visibility_off",
+      size: 16
+    }, "hidden")), r.has_been_split && s.push(/* @__PURE__ */ t(c, {
+      name: "call_split",
+      size: 16
+    }, "split")), s;
+  }, v = (r, o) => r.is_hidden ? o.is_excluded : r.has_been_split ? o.split_transaction_category_label : r.category || "";
+  return /* @__PURE__ */ i(w, {
+    clickEventName: k.ON_TRANSACTION_LIST_ITEM_CLICK,
+    ...l && { component: l },
+    onClick: p ? () => p(e.guid) : void 0,
+    sx: e.is_hidden ? {
+      backgroundColor: "grey.50",
+      color: "text.secondary"
+    } : void 0,
+    children: [/* @__PURE__ */ t(M, { children: e.parent_guid && h.includes(e.parent_guid) ? /* @__PURE__ */ t(_.Fragment, {}) : /* @__PURE__ */ t(E, {
+      categoryGuid: e.top_level_category_guid || "",
+      merchantGuid: e.merchant_guid || ""
+    }) }), /* @__PURE__ */ t(j, {
+      disableTypography: !0,
+      secondary: /* @__PURE__ */ i(d, {
+        direction: "row",
+        justifyContent: "space-between",
+        children: [/* @__PURE__ */ i(d, {
+          alignItems: "center",
+          direction: "row",
+          gap: 4,
+          children: [b(e, g), /* @__PURE__ */ t(n, {
+            truncate: !0,
+            variant: "caption",
+            children: v(e, y)
+          })]
+        }), a && T && /* @__PURE__ */ t(n, {
+          bold: !0,
+          color: "action.active",
+          onClick: (r) => {
+            r.stopPropagation(), r.preventDefault(), L(a.guid);
+          },
+          truncate: !0,
+          variant: "caption",
+          children: a.short_title
+        })]
+      }),
+      children: /* @__PURE__ */ i(d, {
+        direction: "row",
+        justifyContent: "space-between",
+        sx: { gap: 8 },
+        children: [/* @__PURE__ */ t(n, {
+          bold: !0,
+          truncate: !0,
+          variant: "body1",
+          children: e.payee || e.description || e.feed_description
+        }), /* @__PURE__ */ i(n, {
+          bold: !0,
+          color: u ? "success.main" : "text.primary",
+          sx: { flexShrink: 0 },
+          variant: "body1",
+          children: [u ? "+" : "", S(e.amount, "0,0.00")]
+        })]
+      })
+    })]
+  });
+}, X = N(O);
+export {
+  X as default
+};
+
+//# sourceMappingURL=TransactionRow.es.js.map

package/dist/transactions/components/shared/transactionlist/TransactionRow.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransactionRow.es.js","names":[],"sources":["../../../../../src/transactions/components/shared/transactionlist/TransactionRow.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport ListItemAvatar from '@mui/material/ListItemAvatar'\nimport ListItemText from '@mui/material/ListItemText'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { Icon, MerchantLogo, Text } from '@mxenabled/mxui'\n\nimport { ListItemWrapper, useGlobalCopyStore, useTransactionStore } from '../../../../common'\nimport { Transaction, TransactionType } from '../../../../core'\n\nimport { postInsightOnTransaction } from '../../../../common/utils/PostMessage'\n\nimport { ON_CLICK_EVENTS } from '../../../constants/OnClickEvents'\nimport { useTransactionsUiStore } from '../../../context/hooks'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\n\ninterface TransactionRowProps {\n  component?: React.ElementType\n  onClick?: (guid: string) => void\n  transaction: Transaction\n}\n\nconst TransactionRow: React.FC<TransactionRowProps> = ({ transaction, onClick, component }) => {\n  const theme = useTheme()\n  const isDarkMode = theme.palette.mode === 'dark'\n\n  const { associatedBeats } = useTransactionStore()\n  const { expandedSplits } = useTransactionsUiStore()\n  const { transactions: copy } = useGlobalCopyStore()\n  const { showInsights } = useTransactionsUiStore()\n\n  const isCredit = transaction.transaction_type === TransactionType.CREDIT\n\n  const beat = React.useMemo(() => {\n    return associatedBeats.find((beat) => beat.associated_transaction_guid === transaction.guid)\n  }, [associatedBeats, transaction])\n\n  const getTransactionStatusIcons = (\n    transaction: Transaction,\n    isDarkMode: boolean,\n  ): React.ReactNode[] => {\n    const icons: React.ReactNode[] = []\n\n    if (transaction.is_flagged) {\n      icons.push(\n        <Icon\n          fill={true}\n          key=\"flag\"\n          name=\"flag\"\n          size={16}\n          sx={{ color: isDarkMode ? 'primary.main' : 'warning.dark' }}\n        />,\n      )\n    }\n\n    if (transaction.is_hidden) {\n      icons.push(<Icon key=\"hidden\" name=\"visibility_off\" size={16} />)\n    }\n\n    if (transaction.has_been_split) {\n      icons.push(<Icon key=\"split\" name=\"call_split\" size={16} />)\n    }\n\n    return icons\n  }\n\n  const getTransactionCategoryText = (transaction: Transaction, copy: any): string => {\n    if (transaction.is_hidden) {\n      return copy.is_excluded\n    }\n\n    if (transaction.has_been_split) {\n      return copy.split_transaction_category_label\n    }\n\n    return transaction.category || ''\n  }\n\n  return (\n    //TODO: implement common/components/ListItemRow.tsx\n    <ListItemWrapper\n      clickEventName={ON_CLICK_EVENTS.ON_TRANSACTION_LIST_ITEM_CLICK}\n      {...(component && { component })}\n      onClick={onClick ? () => onClick(transaction.guid) : undefined}\n      sx={\n        transaction.is_hidden ? { backgroundColor: 'grey.50', color: 'text.secondary' } : undefined\n      }\n    >\n      <ListItemAvatar>\n        {transaction.parent_guid && expandedSplits.includes(transaction.parent_guid) ? (\n          <React.Fragment />\n        ) : (\n          <MerchantLogo\n            categoryGuid={transaction.top_level_category_guid || ''}\n            merchantGuid={transaction.merchant_guid || ''}\n          />\n        )}\n      </ListItemAvatar>\n      <ListItemText\n        disableTypography={true}\n        secondary={\n          <Stack direction=\"row\" justifyContent=\"space-between\">\n            <Stack alignItems=\"center\" direction=\"row\" gap={4}>\n              {getTransactionStatusIcons(transaction, isDarkMode)}\n              <Text truncate={true} variant=\"caption\">\n                {getTransactionCategoryText(transaction, copy)}\n              </Text>\n            </Stack>\n            {beat && showInsights && (\n              <Text\n                bold={true}\n                color=\"action.active\"\n                onClick={(e) => {\n                  e.stopPropagation()\n                  e.preventDefault()\n\n                  postInsightOnTransaction(beat.guid)\n                }}\n                truncate={true}\n                variant=\"caption\"\n              >\n                {beat.short_title}\n              </Text>\n            )}\n          </Stack>\n        }\n      >\n        <Stack direction=\"row\" justifyContent=\"space-between\" sx={{ gap: 8 }}>\n          <Text bold={true} truncate={true} variant=\"body1\">\n            {transaction.payee || transaction.description || transaction.feed_description}\n          </Text>\n          <Text\n            bold={true}\n            color={isCredit ? 'success.main' : 'text.primary'}\n            sx={{ flexShrink: 0 }}\n            variant=\"body1\"\n          >\n            {isCredit ? '+' : ''}\n            {formatCurrency(transaction.amount, '0,0.00')}\n          </Text>\n        </Stack>\n      </ListItemText>\n    </ListItemWrapper>\n  )\n}\n\nexport default observer(TransactionRow)\n"],"mappings":"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"}