@mx-cartographer/experiences 7.0.23-alpha.al15 → 7.0.23-alpha.al3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -42,7 +42,7 @@ class N {
|
|
|
42
42
|
accounts: t,
|
|
43
43
|
institutions: e
|
|
44
44
|
} = {}) => {
|
|
45
|
-
|
|
45
|
+
await Promise.all([this.loadAccounts(t), this.loadInstitutions(e)]);
|
|
46
46
|
};
|
|
47
47
|
get cashAccounts() {
|
|
48
48
|
return this.accounts.filter(
|
|
@@ -118,22 +118,22 @@ class N {
|
|
|
118
118
|
n,
|
|
119
119
|
"MD_EXCLUDE_EXTERNAL_ACCOUNTS"
|
|
120
120
|
);
|
|
121
|
-
for (const
|
|
122
|
-
if (c &&
|
|
123
|
-
const
|
|
124
|
-
if (!
|
|
121
|
+
for (const r of t) {
|
|
122
|
+
if (c && r.member_is_managed_by_user) continue;
|
|
123
|
+
const o = this.members.find((m) => m.guid === r.member_guid);
|
|
124
|
+
if (!o) continue;
|
|
125
125
|
let u = h.Connected;
|
|
126
|
-
p.includes(
|
|
126
|
+
p.includes(o.connection_status) ? u = h.Error : y.includes(o.connection_status) ? u = h.Processing : I.includes(o.connection_status) && (u = h.RequiresMfa);
|
|
127
127
|
const A = [
|
|
128
|
-
|
|
129
|
-
|
|
128
|
+
r.user_name || r.feed_name || "",
|
|
129
|
+
r.account_number ? `*${r.account_number}` : ""
|
|
130
130
|
].join(" ").trim();
|
|
131
131
|
e.push({
|
|
132
|
-
...
|
|
132
|
+
...r,
|
|
133
133
|
connectionStatus: u,
|
|
134
134
|
institutionName: A,
|
|
135
|
-
memberName:
|
|
136
|
-
}),
|
|
135
|
+
memberName: o.name
|
|
136
|
+
}), o.connectionStatus = u;
|
|
137
137
|
}
|
|
138
138
|
return e;
|
|
139
139
|
};
|
|
@@ -172,10 +172,10 @@ class N {
|
|
|
172
172
|
try {
|
|
173
173
|
const e = await this.api.mergeAccounts(t), n = e[Object.keys(e)[0]];
|
|
174
174
|
a(() => {
|
|
175
|
-
const c = this.accounts.findIndex((
|
|
175
|
+
const c = this.accounts.findIndex((o) => o.guid === t[1]);
|
|
176
176
|
this.accounts.splice(c, 1);
|
|
177
|
-
const
|
|
178
|
-
this.accounts.splice(
|
|
177
|
+
const r = this.accounts.findIndex((o) => o.guid === t[0]);
|
|
178
|
+
this.accounts.splice(r, 1, n);
|
|
179
179
|
});
|
|
180
180
|
} catch (e) {
|
|
181
181
|
console.error(`Error occurred while merging accounts: ${e}`);
|
|
@@ -217,13 +217,13 @@ class N {
|
|
|
217
217
|
};
|
|
218
218
|
updateAccountFiltering = async (t, e) => {
|
|
219
219
|
for (const n of t) {
|
|
220
|
-
const c = this.accounts.find((
|
|
220
|
+
const c = this.accounts.find((r) => r.guid === n);
|
|
221
221
|
if (c) {
|
|
222
222
|
c.is_excluded_from_accounts = e, c.is_excluded_from_budgets = e, c.is_excluded_from_cash_flow = e, c.is_excluded_from_debts = e, c.is_excluded_from_goals = e, c.is_excluded_from_investments = e, c.is_excluded_from_net_worth = e, c.is_excluded_from_spending = e, c.is_excluded_from_transactions = e, c.is_excluded_from_trends = e;
|
|
223
223
|
try {
|
|
224
224
|
this.updateAccount(c);
|
|
225
|
-
} catch (
|
|
226
|
-
console.error(`Failed to update account ${n} (added):`,
|
|
225
|
+
} catch (r) {
|
|
226
|
+
console.error(`Failed to update account ${n} (added):`, r);
|
|
227
227
|
}
|
|
228
228
|
}
|
|
229
229
|
}
|
|
@@ -24,7 +24,7 @@ import X from "@mui/material/ListItem";
|
|
|
24
24
|
import { M as U } from "../MiniWidgetContainer-CTyjmE1h.mjs";
|
|
25
25
|
import e1 from "@mui/material/Stack";
|
|
26
26
|
import { g as U1, a as j1 } from "../AccountFields-CIz-r3gP.mjs";
|
|
27
|
-
import { A as G1, a as K1 } from "../AccountStore-
|
|
27
|
+
import { A as G1, a as K1 } from "../AccountStore-BaMynkQT.mjs";
|
|
28
28
|
const t1 = () => {
|
|
29
29
|
const [c, L] = d.useState(""), { accounts: o } = g(), { selectedAccounts: l } = y(), { setSelectedAccount: u, setSelectedMember: r } = K(), { members: s } = O(), { onEvent: p } = N(), a = [...new Set(l.map((t) => t.account_type))], H = l.find((t) => c === t.guid), h = d.useMemo(
|
|
30
30
|
() => l.filter((t) => t.is_hidden),
|
package/dist/common/index.es.js
CHANGED
|
@@ -53,7 +53,7 @@ import { S as hr, T as gr } from "../RecurringTransactionsStore-D62XJtdL.mjs";
|
|
|
53
53
|
import { G as mr, A as _r, B as yr, W as fr, c as Sr, m as br, g as wr, t as xr, k as Cr, x as Dr, e as vr, w as Ar, u as Er, l as Tr, a as Br, j as Ir, y as Nr, s as Fr, b as Mr, q as $r, n as Rr, z as Ur, h as kr, r as Lr, f as Or, v as Gr, o as Hr, p as Pr } from "../hooks-DkUqN6JE.mjs";
|
|
54
54
|
import { u as Wr } from "../useScreenSize-B6JyS_Lj.mjs";
|
|
55
55
|
import { makeAutoObservable as m, runInAction as p, reaction as _t } from "mobx";
|
|
56
|
-
import { a as yt } from "../AccountStore-
|
|
56
|
+
import { a as yt } from "../AccountStore-BaMynkQT.mjs";
|
|
57
57
|
import ft from "posthog-js";
|
|
58
58
|
import { B as St } from "../BeatStore-By4aGoRM.mjs";
|
|
59
59
|
import { endOfMonth as Z } from "date-fns/endOfMonth";
|
|
@@ -1240,12 +1240,12 @@ class Ve {
|
|
|
1240
1240
|
transactions: i,
|
|
1241
1241
|
userFeatures: n
|
|
1242
1242
|
} = {}) => {
|
|
1243
|
-
|
|
1243
|
+
await Promise.all([
|
|
1244
1244
|
// Load copy, config and quser data
|
|
1245
1245
|
this.copyStore.loadCopy(),
|
|
1246
1246
|
this.appDataStore.loadAppData(e),
|
|
1247
1247
|
this.userStore.loadUserFeatures(n)
|
|
1248
|
-
]),
|
|
1248
|
+
]), await Promise.all([
|
|
1249
1249
|
this.accountStore.loadAccountData({ accounts: t, institutions: o }),
|
|
1250
1250
|
this.categoryStore.loadCategories(r),
|
|
1251
1251
|
this.transactionStore.loadTransactionData({
|
|
@@ -1253,7 +1253,7 @@ class Ve {
|
|
|
1253
1253
|
transactionRules: d,
|
|
1254
1254
|
transactions: i
|
|
1255
1255
|
})
|
|
1256
|
-
]),
|
|
1256
|
+
]), this.globalUiStore.setInitialized(!0);
|
|
1257
1257
|
};
|
|
1258
1258
|
}
|
|
1259
1259
|
export {
|
package/dist/trends/index.es.js
CHANGED
|
@@ -1,69 +1,69 @@
|
|
|
1
|
-
import { jsx as e, jsxs as f, Fragment as
|
|
1
|
+
import { jsx as e, jsxs as f, Fragment as ze } from "react/jsx-runtime";
|
|
2
2
|
import i from "react";
|
|
3
3
|
import { observer as M } from "mobx-react-lite";
|
|
4
|
-
import { Icon as re, Text as X, CategoryIcon as Te, P as Y, H3 as De, ChevronRightIcon as
|
|
4
|
+
import { Icon as re, Text as X, CategoryIcon as Te, P as Y, H3 as De, ChevronRightIcon as Fe } from "@mxenabled/mxui";
|
|
5
5
|
import O from "@mui/material/Box";
|
|
6
6
|
import _ from "@mui/material/Stack";
|
|
7
7
|
import pe from "@mui/material/Button";
|
|
8
8
|
import { addSeconds as Ie } from "date-fns/addSeconds";
|
|
9
9
|
import { differenceInCalendarMonths as Ce } from "date-fns/differenceInCalendarMonths";
|
|
10
|
-
import { a as
|
|
11
|
-
import { T as
|
|
12
|
-
import { i as
|
|
13
|
-
import
|
|
14
|
-
import
|
|
15
|
-
import { u as R, k as F, e as H, a as P, f as ae, c as ie, v as q, l as ve, p as
|
|
10
|
+
import { a as Pe, g as Ke, S as $e, L as Ee, u as je } from "../TrendsStore-WrHxzdbQ.mjs";
|
|
11
|
+
import { T as Jn } from "../TrendsStore-WrHxzdbQ.mjs";
|
|
12
|
+
import { i as Ye, c as Ue, d as Xe, e as Ze, f as Qe, h as qe, b as Le, g as xe, j as _e } from "../SpendingData-D5vsfYKo.mjs";
|
|
13
|
+
import Je from "@mui/material/ToggleButton";
|
|
14
|
+
import et from "@mui/material/ToggleButtonGroup";
|
|
15
|
+
import { u as R, k as F, e as H, a as P, f as ae, c as ie, v as q, l as ve, p as tt, m as nt } from "../hooks-DkUqN6JE.mjs";
|
|
16
16
|
import { u as K } from "../useScreenSize-B6JyS_Lj.mjs";
|
|
17
17
|
import { f as Z, D as B } from "../Dialog-CWW597AF.mjs";
|
|
18
|
-
import { DataGridPro as
|
|
19
|
-
import { C as
|
|
18
|
+
import { DataGridPro as ot } from "@mui/x-data-grid-pro";
|
|
19
|
+
import { C as st } from "../CurrencyText-YUhH2caW.mjs";
|
|
20
20
|
import { c as Me } from "../Category-CevNQ03n.mjs";
|
|
21
|
-
import { b as
|
|
21
|
+
import { b as rt } from "../Localization-2MODESHW.mjs";
|
|
22
22
|
import { H as be } from "../HeaderCell-DjuifqHJ.mjs";
|
|
23
|
-
import { T as A, b as
|
|
23
|
+
import { T as A, b as at } from "../ViewMoreMicroCard-DFAY0tA8.mjs";
|
|
24
24
|
import { A as y, W as Ae } from "../WidgetContainer-CdBs9WOZ.mjs";
|
|
25
25
|
import { a as Re, T as ke } from "../TransactionDetails-C-z3HGTT.mjs";
|
|
26
26
|
import { D as fe } from "../Drawer-kEE73B87.mjs";
|
|
27
27
|
import { L as Q } from "../Loader-DUaFpDGv.mjs";
|
|
28
28
|
import { useTheme as He } from "@mui/material/styles";
|
|
29
29
|
import { L as ye } from "../LineChart-BWWmmJxV.mjs";
|
|
30
|
-
import { M as
|
|
31
|
-
import { subMonths as
|
|
32
|
-
import { TrendingUp as
|
|
33
|
-
import { a as
|
|
34
|
-
import { M as
|
|
35
|
-
import
|
|
36
|
-
import
|
|
37
|
-
import
|
|
38
|
-
import
|
|
39
|
-
import
|
|
40
|
-
import
|
|
30
|
+
import { M as it } from "../MiniWidgetContainer-CTyjmE1h.mjs";
|
|
31
|
+
import { subMonths as ct } from "date-fns";
|
|
32
|
+
import { TrendingUp as lt, TrendingDown as dt, MultilineChart as ht, ExpandLess as ut, ExpandMore as mt } from "@mxenabled/mx-icons";
|
|
33
|
+
import { a as gt, f as U } from "../NumberFormatting-CtWHhyBX.mjs";
|
|
34
|
+
import { M as pt } from "../MicroWidgetContainer-Dxz8uBN9.mjs";
|
|
35
|
+
import Ct from "@mui/material/Collapse";
|
|
36
|
+
import ft from "@mui/material/List";
|
|
37
|
+
import Tt from "@mui/material/ListItem";
|
|
38
|
+
import yt from "@mui/material/ListItemButton";
|
|
39
|
+
import _t from "@mui/material/ListItemIcon";
|
|
40
|
+
import bt from "@mui/material/ListItemText";
|
|
41
41
|
import Ne from "@mui/material/styles/useTheme";
|
|
42
|
-
import
|
|
43
|
-
import { useTheme as
|
|
44
|
-
import
|
|
45
|
-
import { b as
|
|
46
|
-
import { E as
|
|
47
|
-
import { E as
|
|
42
|
+
import St from "@mui/material/Divider";
|
|
43
|
+
import { useTheme as wt, Stack as Dt } from "@mui/material";
|
|
44
|
+
import It from "@mui/material/Paper";
|
|
45
|
+
import { b as Et } from "../CategoryUtil-BR3H5i6n.mjs";
|
|
46
|
+
import { E as Lt } from "../ExportCsvAction-CbMfQ2Wa.mjs";
|
|
47
|
+
import { E as xt } from "../EmptyState-C0lr9E5T.mjs";
|
|
48
48
|
const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
49
|
-
|
|
49
|
+
et,
|
|
50
50
|
{
|
|
51
51
|
exclusive: !0,
|
|
52
52
|
onChange: o,
|
|
53
53
|
orientation: "horizontal",
|
|
54
54
|
value: n,
|
|
55
|
-
children: ["Chart", "Table"].map((t) => /* @__PURE__ */ e(
|
|
55
|
+
children: ["Chart", "Table"].map((t) => /* @__PURE__ */ e(Je, { color: "primary", sx: { width: 56 }, value: t, children: t === "Chart" ? /* @__PURE__ */ e(re, { name: "table_chart_view" }) : /* @__PURE__ */ e(re, { name: "format_list_bulleted" }) }, t))
|
|
56
56
|
}
|
|
57
57
|
), Oe = ({ selectedDateRange: n, selectedCategoryGuid: o }) => {
|
|
58
|
-
const { trends: t } = R(), { isMobile: s, isDesktop: a } = K(), { getCategoryName: h } = F(),
|
|
58
|
+
const { trends: t } = R(), { isMobile: s, isDesktop: a } = K(), { getCategoryName: h } = F(), d = i.useMemo(() => {
|
|
59
59
|
const c = Z(
|
|
60
60
|
n.start,
|
|
61
61
|
s ? B.MONTH_SHORT_YEAR : B.MONTH_YEAR
|
|
62
|
-
),
|
|
62
|
+
), l = Z(
|
|
63
63
|
n.end,
|
|
64
64
|
s ? B.MONTH_SHORT_YEAR : B.MONTH_YEAR
|
|
65
65
|
);
|
|
66
|
-
return `${c} - ${
|
|
66
|
+
return `${c} - ${l}`;
|
|
67
67
|
}, [n, s]);
|
|
68
68
|
return /* @__PURE__ */ f(O, { sx: { mr: 10, minWidth: "60%" }, children: [
|
|
69
69
|
/* @__PURE__ */ e(
|
|
@@ -80,31 +80,31 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
80
80
|
children: h(o) || t.sub_title
|
|
81
81
|
}
|
|
82
82
|
),
|
|
83
|
-
/* @__PURE__ */ e(X, { variant: a ? "Body" : "Small", children:
|
|
83
|
+
/* @__PURE__ */ e(X, { variant: a ? "Body" : "Small", children: d })
|
|
84
84
|
] });
|
|
85
|
-
},
|
|
85
|
+
}, vt = (n) => {
|
|
86
86
|
const o = n.row[n.field];
|
|
87
|
-
return /* @__PURE__ */ e(_, { alignItems: "flex-end", tabIndex: n.tabIndex, children: /* @__PURE__ */ e(
|
|
88
|
-
},
|
|
87
|
+
return /* @__PURE__ */ e(_, { alignItems: "flex-end", tabIndex: n.tabIndex, children: /* @__PURE__ */ e(st, { amount: o, variant: "Small" }) });
|
|
88
|
+
}, Mt = ({ categoryGuid: n, topLevelCategoryGuid: o }) => {
|
|
89
89
|
const { categories: t } = R(), s = t.default_categories[n]?.replace(/&/g, "&") ?? Me[n];
|
|
90
90
|
return /* @__PURE__ */ f(_, { alignItems: "center", direction: "row", justifyContent: "center", children: [
|
|
91
91
|
/* @__PURE__ */ e(
|
|
92
92
|
O,
|
|
93
93
|
{
|
|
94
|
-
"aria-label":
|
|
94
|
+
"aria-label": rt(t.category_icon_label_aria, s),
|
|
95
95
|
role: "img",
|
|
96
96
|
children: /* @__PURE__ */ e(Te, { categoryGuid: o })
|
|
97
97
|
}
|
|
98
98
|
),
|
|
99
99
|
/* @__PURE__ */ e(X, { sx: { ml: 12, pb: 6 }, variant: "Small", children: s })
|
|
100
100
|
] });
|
|
101
|
-
},
|
|
102
|
-
|
|
101
|
+
}, At = (n) => /* @__PURE__ */ e(_, { alignItems: "center", direction: "row", height: "100%", width: "100%", children: /* @__PURE__ */ e(
|
|
102
|
+
Mt,
|
|
103
103
|
{
|
|
104
104
|
categoryGuid: n.row.category,
|
|
105
105
|
topLevelCategoryGuid: n.row.top_level_category_guid
|
|
106
106
|
}
|
|
107
|
-
) }),
|
|
107
|
+
) }), Rt = (n, o) => {
|
|
108
108
|
const t = [], s = new Date(n);
|
|
109
109
|
for (; s <= o; ) {
|
|
110
110
|
const a = Z(s, B.MONTH);
|
|
@@ -119,16 +119,16 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
119
119
|
height: a = "100dvh",
|
|
120
120
|
sx: h = {}
|
|
121
121
|
}) => {
|
|
122
|
-
const { onEvent:
|
|
122
|
+
const { onEvent: d } = H(), c = Z(/* @__PURE__ */ new Date(), B.MONTH_SHORT), [l, m] = i.useState([
|
|
123
123
|
{ field: c, sort: "desc" }
|
|
124
|
-
]), C = i.useMemo(() =>
|
|
124
|
+
]), C = i.useMemo(() => Rt(o.start, o.end), [o]), u = [
|
|
125
125
|
{
|
|
126
126
|
field: "category",
|
|
127
127
|
flex: 1,
|
|
128
128
|
headerName: "Category",
|
|
129
129
|
minWidth: 175,
|
|
130
130
|
renderHeader: be,
|
|
131
|
-
renderCell:
|
|
131
|
+
renderCell: At,
|
|
132
132
|
sortable: !0,
|
|
133
133
|
type: "string"
|
|
134
134
|
},
|
|
@@ -139,18 +139,18 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
139
139
|
headerName: r,
|
|
140
140
|
minWidth: 100,
|
|
141
141
|
renderHeader: be,
|
|
142
|
-
renderCell:
|
|
142
|
+
renderCell: vt,
|
|
143
143
|
align: "right",
|
|
144
144
|
headerAlign: "right",
|
|
145
145
|
sortable: !0,
|
|
146
146
|
hideSortIcons: !1,
|
|
147
147
|
type: "number",
|
|
148
|
-
sortComparator:
|
|
148
|
+
sortComparator: Pe
|
|
149
149
|
})
|
|
150
150
|
)
|
|
151
151
|
], b = i.useMemo(() => {
|
|
152
152
|
const r = n.filter(
|
|
153
|
-
(p) => !
|
|
153
|
+
(p) => !Ye(p) && !Ue(p)
|
|
154
154
|
), T = (t ? r.filter(
|
|
155
155
|
(p) => p.category_guid === t || p.top_level_category_guid === t
|
|
156
156
|
) : r).reduce(
|
|
@@ -170,39 +170,39 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
170
170
|
return Object.values(T);
|
|
171
171
|
}, [n, t]);
|
|
172
172
|
return /* @__PURE__ */ e(O, { sx: { height: a, width: "100%", overflowX: "auto", boxShadow: "none", ...h }, children: /* @__PURE__ */ e(
|
|
173
|
-
|
|
173
|
+
ot,
|
|
174
174
|
{
|
|
175
175
|
columns: u,
|
|
176
176
|
disableColumnFilter: !0,
|
|
177
177
|
disableColumnMenu: !0,
|
|
178
178
|
hideFooter: !0,
|
|
179
|
-
initialState: { sorting: { sortModel:
|
|
179
|
+
initialState: { sorting: { sortModel: l } },
|
|
180
180
|
onRowClick: (r) => {
|
|
181
|
-
s?.(r.row.category),
|
|
181
|
+
s?.(r.row.category), d(y.TRENDS_CLICK_LIST_ITEM, {
|
|
182
182
|
...A,
|
|
183
183
|
listItem: Me[r.row.category]
|
|
184
184
|
});
|
|
185
185
|
},
|
|
186
186
|
onSortModelChange: (r) => {
|
|
187
|
-
m(r),
|
|
187
|
+
m(r), d(y.TRENDS_CLICK_TABLE_SORT, A);
|
|
188
188
|
},
|
|
189
189
|
rows: b,
|
|
190
190
|
slotProps: { baseIconButton: { color: "secondary", sx: { ml: 8 } } },
|
|
191
|
-
sortModel:
|
|
191
|
+
sortModel: l,
|
|
192
192
|
sortingOrder: ["asc", "desc"]
|
|
193
193
|
}
|
|
194
194
|
) });
|
|
195
|
-
},
|
|
195
|
+
}, kt = {
|
|
196
196
|
title: "Transaction List"
|
|
197
|
-
},
|
|
197
|
+
}, Ht = ({
|
|
198
198
|
categoryGuid: n,
|
|
199
199
|
dateRange: o,
|
|
200
200
|
isOpen: t,
|
|
201
201
|
onClose: s
|
|
202
202
|
}) => {
|
|
203
|
-
const { onEvent: a } = H(), { selectedAccountGuids: h } = P(), { common:
|
|
204
|
-
() =>
|
|
205
|
-
[m,
|
|
203
|
+
const { onEvent: a } = H(), { selectedAccountGuids: h } = P(), { common: d } = R(), { setFilter: c, sortedTransactions: l } = ae(), [m, C] = i.useState(""), u = i.useMemo(
|
|
204
|
+
() => l.find((r) => r.guid === m),
|
|
205
|
+
[m, l]
|
|
206
206
|
);
|
|
207
207
|
i.useEffect(() => {
|
|
208
208
|
c({
|
|
@@ -218,24 +218,24 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
218
218
|
return /* @__PURE__ */ f(
|
|
219
219
|
fe,
|
|
220
220
|
{
|
|
221
|
-
ariaLabelClose:
|
|
221
|
+
ariaLabelClose: d.close_aria,
|
|
222
222
|
isOpen: t,
|
|
223
223
|
onClose: b,
|
|
224
|
-
title:
|
|
224
|
+
title: kt.title,
|
|
225
225
|
children: [
|
|
226
226
|
u && /* @__PURE__ */ e(Re, { transaction: u }),
|
|
227
227
|
!u && /* @__PURE__ */ e(ke, { onClick: C })
|
|
228
228
|
]
|
|
229
229
|
}
|
|
230
230
|
);
|
|
231
|
-
},
|
|
232
|
-
const { onEvent: t } = H(), { isDesktop: s, isTablet: a, isMobile: h } = K(), { visibleAccounts:
|
|
231
|
+
}, Nt = M(Ht), Wt = ({ onBackClick: n, sx: o }) => {
|
|
232
|
+
const { onEvent: t } = H(), { isDesktop: s, isTablet: a, isMobile: h } = K(), { visibleAccounts: d } = ie(), { loadMonthlyCategoryTotals: c, monthlyCategoryTotals: l, getCategoryName: m } = F(), { sortedTransactions: C } = ae(), { selectedDateRange: u, setSelectedDateRange: b } = q(), { isCopyLoaded: r, isInitialized: g, selectedAccounts: T, setSelectedAccounts: p } = P(), { trends: E } = R(), [w, I] = i.useState(!1), [k, D] = i.useState(!1), [N, L] = i.useState("Chart"), [x, $] = i.useState(""), [z, ce] = i.useState(window.innerHeight), ee = z - (h ? 315 : 345);
|
|
233
233
|
i.useEffect(() => {
|
|
234
234
|
const S = () => ce(window.innerHeight);
|
|
235
235
|
return window.addEventListener("resize", S), () => window.removeEventListener("resize", S);
|
|
236
236
|
}, []), i.useEffect(() => {
|
|
237
|
-
p(
|
|
238
|
-
}, [
|
|
237
|
+
p(d);
|
|
238
|
+
}, [d]), i.useEffect(() => {
|
|
239
239
|
g && c(
|
|
240
240
|
T,
|
|
241
241
|
u.start,
|
|
@@ -246,31 +246,31 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
246
246
|
}, [g, T, u]);
|
|
247
247
|
const te = i.useMemo(() => {
|
|
248
248
|
if (!w) return { stackedDatasets: [], unstackedDatasets: [] };
|
|
249
|
-
const S =
|
|
250
|
-
|
|
249
|
+
const S = Ke(
|
|
250
|
+
l,
|
|
251
251
|
u.start,
|
|
252
252
|
u.end
|
|
253
253
|
), W = x.length ? S.filter(
|
|
254
254
|
(G) => G.top_level_category_guid === x || G.category_guid === x
|
|
255
|
-
) :
|
|
255
|
+
) : Xe(S);
|
|
256
256
|
return {
|
|
257
|
-
stackedDatasets: W.filter(
|
|
258
|
-
unstackedDatasets: W.filter(
|
|
257
|
+
stackedDatasets: W.filter(Ze),
|
|
258
|
+
unstackedDatasets: W.filter(Qe)
|
|
259
259
|
};
|
|
260
|
-
}, [
|
|
260
|
+
}, [l, x, u]), ne = (S, W) => {
|
|
261
261
|
L(W ?? N), t(y.TRENDS_CLICK_TOGGLE_VIEW);
|
|
262
|
-
},
|
|
262
|
+
}, oe = (S) => {
|
|
263
263
|
const W = Ie(S?.[0], 1), G = S?.[1], ge = Ce(G, W);
|
|
264
264
|
b({ start: W, end: G }), t(y.TRENDS_CLICK_TIME_WINDOW, {
|
|
265
265
|
time_period: ge + "M"
|
|
266
266
|
});
|
|
267
|
-
},
|
|
267
|
+
}, le = () => {
|
|
268
268
|
t(y.TRENDS_CLICK_FILTER);
|
|
269
|
-
},
|
|
269
|
+
}, se = (S) => {
|
|
270
270
|
$(S);
|
|
271
|
-
},
|
|
271
|
+
}, de = (S) => {
|
|
272
272
|
$(S), t(y.TRENDS_CLICK_LEGEND, { category: m(S) });
|
|
273
|
-
},
|
|
273
|
+
}, he = (S) => {
|
|
274
274
|
t(y.TRENDS_HOVER_LEGEND, { category: m(S) });
|
|
275
275
|
}, ue = (S) => {
|
|
276
276
|
t(y.TRENDS_HOVER_AREA, { category: S });
|
|
@@ -280,11 +280,11 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
280
280
|
return !r || !g || !w ? /* @__PURE__ */ e(Q, {}) : /* @__PURE__ */ f(
|
|
281
281
|
Ae,
|
|
282
282
|
{
|
|
283
|
-
accountOptions:
|
|
284
|
-
calendarActions: { onRangeChanged:
|
|
283
|
+
accountOptions: d,
|
|
284
|
+
calendarActions: { onRangeChanged: oe },
|
|
285
285
|
dateRange: u,
|
|
286
286
|
dateRangeVariant: "timeframebuttons",
|
|
287
|
-
onAccountsFilterClick:
|
|
287
|
+
onAccountsFilterClick: le,
|
|
288
288
|
onBackClick: n,
|
|
289
289
|
sx: o,
|
|
290
290
|
title: E.title,
|
|
@@ -324,12 +324,12 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
324
324
|
] }),
|
|
325
325
|
/* @__PURE__ */ f(O, { children: [
|
|
326
326
|
N === "Chart" && /* @__PURE__ */ e(
|
|
327
|
-
|
|
327
|
+
$e,
|
|
328
328
|
{
|
|
329
329
|
availableHeight: ee,
|
|
330
|
-
onClickLegend:
|
|
330
|
+
onClickLegend: de,
|
|
331
331
|
onHoverArea: ue,
|
|
332
|
-
onHoverLegend:
|
|
332
|
+
onHoverLegend: he,
|
|
333
333
|
onHoverPoint: me,
|
|
334
334
|
stackedDatasets: te.stackedDatasets,
|
|
335
335
|
unstackedDatasets: te.unstackedDatasets
|
|
@@ -338,8 +338,8 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
338
338
|
N === "Table" && /* @__PURE__ */ e(
|
|
339
339
|
Ve,
|
|
340
340
|
{
|
|
341
|
-
monthlyCategoryTotals:
|
|
342
|
-
onClickRow:
|
|
341
|
+
monthlyCategoryTotals: l,
|
|
342
|
+
onClickRow: se,
|
|
343
343
|
selectedCategory: x,
|
|
344
344
|
selectedDateRange: u
|
|
345
345
|
}
|
|
@@ -349,7 +349,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
349
349
|
}
|
|
350
350
|
),
|
|
351
351
|
/* @__PURE__ */ e(
|
|
352
|
-
|
|
352
|
+
Nt,
|
|
353
353
|
{
|
|
354
354
|
categoryGuid: x,
|
|
355
355
|
dateRange: u,
|
|
@@ -360,8 +360,8 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
360
360
|
]
|
|
361
361
|
}
|
|
362
362
|
);
|
|
363
|
-
},
|
|
364
|
-
const n = He(), { monthlyCategoryTotals: o } = F(), { trends: t } = R(), s =
|
|
363
|
+
}, Yn = M(Wt), Ot = () => {
|
|
364
|
+
const n = He(), { monthlyCategoryTotals: o } = F(), { trends: t } = R(), s = qe(o);
|
|
365
365
|
return /* @__PURE__ */ e(
|
|
366
366
|
ye,
|
|
367
367
|
{
|
|
@@ -378,24 +378,24 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
378
378
|
valueFormatterString: "0,0"
|
|
379
379
|
}
|
|
380
380
|
);
|
|
381
|
-
},
|
|
382
|
-
const { visibleAccounts: t } = ie(), { loadMonthlyCategoryTotals: s, monthlyTotalsLoaded: a } = F(), { isInitialized: h } = ve(), { trends:
|
|
381
|
+
}, Vt = M(Ot), Gt = ({ onPrimaryCtaClick: n, sx: o }) => {
|
|
382
|
+
const { visibleAccounts: t } = ie(), { loadMonthlyCategoryTotals: s, monthlyTotalsLoaded: a } = F(), { isInitialized: h } = ve(), { trends: d } = R(), { isCopyLoaded: c, selectedAccounts: l, setSelectedAccounts: m } = P();
|
|
383
383
|
return i.useEffect(() => {
|
|
384
384
|
m(t);
|
|
385
385
|
}, [t]), i.useEffect(() => {
|
|
386
|
-
h && s(
|
|
387
|
-
}, [h,
|
|
388
|
-
|
|
386
|
+
h && s(l).finally();
|
|
387
|
+
}, [h, l]), !c || !h ? /* @__PURE__ */ e(Q, {}) : /* @__PURE__ */ e(
|
|
388
|
+
it,
|
|
389
389
|
{
|
|
390
390
|
onPrimaryCtaClick: n,
|
|
391
|
-
primaryCtaLabel:
|
|
392
|
-
subTitle:
|
|
391
|
+
primaryCtaLabel: d.primary_cta,
|
|
392
|
+
subTitle: d.sub_title,
|
|
393
393
|
sx: o,
|
|
394
|
-
title:
|
|
395
|
-
children: a ? /* @__PURE__ */ e(
|
|
394
|
+
title: d.mini_title,
|
|
395
|
+
children: a ? /* @__PURE__ */ e(Vt, {}) : /* @__PURE__ */ e(Q, {})
|
|
396
396
|
}
|
|
397
397
|
);
|
|
398
|
-
},
|
|
398
|
+
}, Un = M(Gt), Bt = 70, Se = ({
|
|
399
399
|
title: n,
|
|
400
400
|
totalAmount: o,
|
|
401
401
|
transactionType: t,
|
|
@@ -403,10 +403,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
403
403
|
secondaryLabel: a,
|
|
404
404
|
shouldDisplayPercentage: h
|
|
405
405
|
}) => {
|
|
406
|
-
const { availableWidth:
|
|
406
|
+
const { availableWidth: d } = tt(), c = i.useRef(null), l = i.useRef(null), m = gt(Number(Math.abs(s)), {
|
|
407
407
|
style: "percent",
|
|
408
408
|
minimumIntegerDigits: 1
|
|
409
|
-
}), C =
|
|
409
|
+
}), C = d === 288 && U(o, "0,0.00").length > 10 ? U(o, "0,0") : U(o, "0,0.00"), u = t === "spending" ? s > 0 : s >= 0, b = t === "spending" ? "error.main" : "success.main", r = t === "spending" ? "success.main" : "text.secondary", g = c?.current, T = l?.current, p = g && T ? g.scrollWidth > T.clientWidth - Bt : !1;
|
|
410
410
|
return /* @__PURE__ */ f(
|
|
411
411
|
_,
|
|
412
412
|
{
|
|
@@ -431,7 +431,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
431
431
|
children: [
|
|
432
432
|
/* @__PURE__ */ e(Y, { color: "text.secondary", variant: "caption", children: n }),
|
|
433
433
|
h && /* @__PURE__ */ f(_, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
|
|
434
|
-
u ? /* @__PURE__ */ e(
|
|
434
|
+
u ? /* @__PURE__ */ e(lt, { size: 20, sx: { color: b } }) : /* @__PURE__ */ e(dt, { size: 20, sx: { color: r } }),
|
|
435
435
|
/* @__PURE__ */ e(
|
|
436
436
|
Y,
|
|
437
437
|
{
|
|
@@ -450,7 +450,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
450
450
|
/* @__PURE__ */ f(
|
|
451
451
|
_,
|
|
452
452
|
{
|
|
453
|
-
ref:
|
|
453
|
+
ref: l,
|
|
454
454
|
sx: {
|
|
455
455
|
alignItems: "center",
|
|
456
456
|
flexDirection: "row",
|
|
@@ -465,7 +465,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
465
465
|
children: /* @__PURE__ */ e(De, { children: C })
|
|
466
466
|
}
|
|
467
467
|
),
|
|
468
|
-
h &&
|
|
468
|
+
h && d >= 450 && !p && /* @__PURE__ */ e(
|
|
469
469
|
Y,
|
|
470
470
|
{
|
|
471
471
|
color: u ? b : r,
|
|
@@ -479,49 +479,49 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
479
479
|
]
|
|
480
480
|
}
|
|
481
481
|
);
|
|
482
|
-
},
|
|
482
|
+
}, zt = M(() => {
|
|
483
483
|
const { trends: n } = R();
|
|
484
484
|
return /* @__PURE__ */ f(_, { sx: { alignItems: "start", flexDirection: "row", gap: 12 }, children: [
|
|
485
|
-
/* @__PURE__ */ e(
|
|
485
|
+
/* @__PURE__ */ e(ht, { size: 32 }),
|
|
486
486
|
/* @__PURE__ */ f(_, { children: [
|
|
487
487
|
/* @__PURE__ */ e(Y, { fontWeight: 600, variant: "body1", children: n.zero_state_content_header }),
|
|
488
488
|
/* @__PURE__ */ e(Y, { color: "text.secondary", variant: "subtitle2", children: n.zero_state_content_description })
|
|
489
489
|
] })
|
|
490
490
|
] });
|
|
491
|
-
}),
|
|
492
|
-
const { visibleAccounts: o } = ie(), { onEvent: t } = H(), { monthlyCategoryTotals: s, loadMonthlyCategoryTotals: a, monthlyTotalsLoaded: h } = F(),
|
|
493
|
-
start:
|
|
491
|
+
}), Xn = M(({ onCtaClick: n }) => {
|
|
492
|
+
const { visibleAccounts: o } = ie(), { onEvent: t } = H(), { monthlyCategoryTotals: s, loadMonthlyCategoryTotals: a, monthlyTotalsLoaded: h } = F(), d = {
|
|
493
|
+
start: ct(/* @__PURE__ */ new Date(), 1),
|
|
494
494
|
end: /* @__PURE__ */ new Date()
|
|
495
|
-
}, { trends: c } = R(), { selectedAccounts:
|
|
495
|
+
}, { trends: c } = R(), { selectedAccounts: l, setSelectedAccounts: m, isInitialized: C } = P();
|
|
496
496
|
i.useEffect(() => {
|
|
497
497
|
m(o);
|
|
498
498
|
}, [o]), i.useEffect(() => {
|
|
499
|
-
C && a(
|
|
499
|
+
C && a(l, d.start).then(() => {
|
|
500
500
|
t(y.TRENDS_LOAD_WIDGET, {
|
|
501
501
|
state: o?.length ? "default" : "zeroState"
|
|
502
502
|
});
|
|
503
503
|
});
|
|
504
|
-
}, [C,
|
|
504
|
+
}, [C, l]);
|
|
505
505
|
const { spendingData: u, incomeData: b } = i.useMemo(
|
|
506
506
|
() => ({
|
|
507
|
-
spendingData: Le(s,
|
|
508
|
-
incomeData: xe(s,
|
|
507
|
+
spendingData: Le(s, d),
|
|
508
|
+
incomeData: xe(s, d)
|
|
509
509
|
}),
|
|
510
|
-
[s,
|
|
510
|
+
[s, d]
|
|
511
511
|
), [r, g] = u, [T, p] = b, E = _e(g.y, r.y), w = _e(p.y, T.y), I = C && !o?.length, k = () => {
|
|
512
512
|
t(
|
|
513
513
|
I ? y.TRENDS_CLICK_GET_STARTED : y.TRENDS_CLICK_VIEW_MORE
|
|
514
514
|
), n();
|
|
515
515
|
};
|
|
516
516
|
return !h || !C ? /* @__PURE__ */ e(Q, {}) : /* @__PURE__ */ e(
|
|
517
|
-
|
|
517
|
+
pt,
|
|
518
518
|
{
|
|
519
519
|
className: "mx-trends-microwidget",
|
|
520
520
|
ctaLabel: c.micro_primary_cta_label,
|
|
521
521
|
onCTAClick: k,
|
|
522
522
|
subHeader: I ? void 0 : c.micro_subheader,
|
|
523
523
|
title: c.title,
|
|
524
|
-
children: I ? /* @__PURE__ */ e(
|
|
524
|
+
children: I ? /* @__PURE__ */ e(zt, {}) : /* @__PURE__ */ f(
|
|
525
525
|
_,
|
|
526
526
|
{
|
|
527
527
|
sx: {
|
|
@@ -557,17 +557,17 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
557
557
|
)
|
|
558
558
|
}
|
|
559
559
|
);
|
|
560
|
-
}),
|
|
560
|
+
}), Ft = M(
|
|
561
561
|
({ isExpanded: n, onClick: o }) => {
|
|
562
562
|
const t = Ne();
|
|
563
|
-
return /* @__PURE__ */ e(
|
|
563
|
+
return /* @__PURE__ */ e(Tt, { sx: { bgcolor: "background.paper" }, children: /* @__PURE__ */ e(yt, { onClick: o, sx: { justifyContent: "center" }, children: /* @__PURE__ */ f(
|
|
564
564
|
_,
|
|
565
565
|
{
|
|
566
566
|
sx: { color: t.palette.primary.main, flexDirection: "row", alignItems: "center" },
|
|
567
567
|
children: [
|
|
568
|
-
/* @__PURE__ */ e(
|
|
569
|
-
/* @__PURE__ */ e(
|
|
570
|
-
|
|
568
|
+
/* @__PURE__ */ e(bt, { children: /* @__PURE__ */ e(X, { bold: !0, variant: "body2", children: n ? "View less" : "View more" }) }),
|
|
569
|
+
/* @__PURE__ */ e(_t, { sx: { color: t.palette.primary.main }, children: n ? /* @__PURE__ */ e(ut, {}) : /* @__PURE__ */ e(
|
|
570
|
+
mt,
|
|
571
571
|
{
|
|
572
572
|
sx: {
|
|
573
573
|
transition: "transform 0.3s ease-in-out",
|
|
@@ -587,10 +587,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
587
587
|
transactions: s,
|
|
588
588
|
onClick: a,
|
|
589
589
|
isLastItem: h = !1,
|
|
590
|
-
showDivider:
|
|
590
|
+
showDivider: d = !0
|
|
591
591
|
}) => {
|
|
592
|
-
const { trends: c } = R(), { onEvent:
|
|
593
|
-
a?.(),
|
|
592
|
+
const { trends: c } = R(), { onEvent: l } = H(), m = `${s.length} ${s.length === 1 ? c.transaction : c.transactions}`, C = () => {
|
|
593
|
+
a?.(), l(y.TRENDS_CLICK_LIST_ITEM, {
|
|
594
594
|
...A,
|
|
595
595
|
listItem: t
|
|
596
596
|
});
|
|
@@ -602,27 +602,27 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
602
602
|
leftIcon: o ? /* @__PURE__ */ e(Te, { categoryGuid: o }) : void 0,
|
|
603
603
|
onClick: C,
|
|
604
604
|
rightContent: U(Math.abs(n), "0,0.00"),
|
|
605
|
-
rightIcon: a ? /* @__PURE__ */ e(
|
|
605
|
+
rightIcon: a ? /* @__PURE__ */ e(Fe, {}) : void 0,
|
|
606
606
|
subtitle: m,
|
|
607
607
|
title: t
|
|
608
608
|
}
|
|
609
609
|
),
|
|
610
|
-
|
|
610
|
+
d && /* @__PURE__ */ e(St, { sx: { ml: h ? 24 : 68 } })
|
|
611
611
|
] }, o);
|
|
612
612
|
}
|
|
613
|
-
),
|
|
613
|
+
), Pt = M(
|
|
614
614
|
({ availableHeight: n = 0, onCategoryClick: o }) => {
|
|
615
|
-
const { collapsedCategories: t, visibleCategories: s, setVisibleListLength: a } = q(), { isLargeDesktop: h, isDesktop:
|
|
615
|
+
const { collapsedCategories: t, visibleCategories: s, setVisibleListLength: a } = q(), { isLargeDesktop: h, isDesktop: d } = K(), { trends: c } = R(), { onEvent: l } = H(), [m, C] = i.useState(!1), u = d || h;
|
|
616
616
|
i.useEffect(() => {
|
|
617
617
|
const g = Math.floor(n / 64) - 1, T = s.length + t.length;
|
|
618
618
|
g !== s.length && (a(u ? Math.max(g, 5) : 5), C(g >= T));
|
|
619
619
|
}, [n]);
|
|
620
620
|
const b = () => {
|
|
621
|
-
C(!m),
|
|
621
|
+
C(!m), l(y.TRENDS_CLICK_VIEW_MORE, {
|
|
622
622
|
...A
|
|
623
623
|
});
|
|
624
624
|
}, r = s.length + (m ? t.length : 0);
|
|
625
|
-
return /* @__PURE__ */ e(_, { sx: { bgColor: "background.paper", width: "100%" }, children: /* @__PURE__ */ f(
|
|
625
|
+
return /* @__PURE__ */ e(_, { sx: { bgColor: "background.paper", width: "100%" }, children: /* @__PURE__ */ f(ft, { children: [
|
|
626
626
|
/* @__PURE__ */ e(_, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(De, { children: c.categories }) }),
|
|
627
627
|
s.map((g, T) => /* @__PURE__ */ e(
|
|
628
628
|
we,
|
|
@@ -635,7 +635,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
635
635
|
g.guid
|
|
636
636
|
)),
|
|
637
637
|
/* @__PURE__ */ e(
|
|
638
|
-
|
|
638
|
+
Ct,
|
|
639
639
|
{
|
|
640
640
|
in: m,
|
|
641
641
|
sx: { "&.MuiCollapse-root .MuiListItemButton-root": { paddingLeft: 24 } },
|
|
@@ -654,10 +654,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
654
654
|
})
|
|
655
655
|
}
|
|
656
656
|
),
|
|
657
|
-
t.length > 0 && /* @__PURE__ */ e(
|
|
657
|
+
t.length > 0 && /* @__PURE__ */ e(Ft, { isExpanded: m, onClick: b })
|
|
658
658
|
] }) });
|
|
659
659
|
}
|
|
660
|
-
),
|
|
660
|
+
), Kt = [
|
|
661
661
|
"BillAmountNotStandard",
|
|
662
662
|
"CategorySpendingV2",
|
|
663
663
|
"CostOfLivingToIncome",
|
|
@@ -691,18 +691,18 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
691
691
|
"WeeklyNewMerchantsV2",
|
|
692
692
|
"WeeklyNoSpendDays",
|
|
693
693
|
"WeeklySmallPurchasesSummary"
|
|
694
|
-
],
|
|
695
|
-
const o =
|
|
694
|
+
], $t = ({ onInsightCardClick: n }) => {
|
|
695
|
+
const o = wt(), { onEvent: t } = H(), { isMobile: s, isDesktop: a, isLargeDesktop: h } = K(), { beatStore: d, endpoint: c, sessionToken: l } = ve(), { isInitialized: m } = P(), [C, u] = i.useState(!1), b = o.palette.mode === "dark", r = a || h, g = r || s ? 1 : 2;
|
|
696
696
|
i.useEffect(() => {
|
|
697
|
-
m &&
|
|
697
|
+
m && d.loadBeats().finally(() => u(!0));
|
|
698
698
|
}, [m]);
|
|
699
|
-
const T = i.useMemo(() => C ?
|
|
699
|
+
const T = i.useMemo(() => C ? d.getFilteredBeats({ templates: Kt }) : [], [C]), p = () => null, E = (D) => {
|
|
700
700
|
n?.(D), t(y.TRENDS_CLICK_INSIGHT, A);
|
|
701
701
|
}, w = r ? 200 : 170, I = r ? 170 : 124, k = T.length > 0 ? w : I;
|
|
702
|
-
return /* @__PURE__ */ e(
|
|
703
|
-
|
|
702
|
+
return /* @__PURE__ */ e(Dt, { sx: { height: k }, children: /* @__PURE__ */ e(
|
|
703
|
+
at,
|
|
704
704
|
{
|
|
705
|
-
areBeatsLoading:
|
|
705
|
+
areBeatsLoading: d.isLoading,
|
|
706
706
|
beats: T,
|
|
707
707
|
endpoint: c,
|
|
708
708
|
logOutUser: p,
|
|
@@ -713,14 +713,14 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
713
713
|
showHeader: r,
|
|
714
714
|
showIcon: !0,
|
|
715
715
|
showWithMargin: !1,
|
|
716
|
-
token:
|
|
716
|
+
token: l,
|
|
717
717
|
useDarkMode: b,
|
|
718
718
|
userHasFullInsightFeedBeats: !1,
|
|
719
719
|
variant: "outlined",
|
|
720
720
|
visibleCardsCount: g
|
|
721
721
|
}
|
|
722
722
|
) });
|
|
723
|
-
},
|
|
723
|
+
}, jt = M($t), Yt = M(({ chartLabel: n, chartColor: o }) => {
|
|
724
724
|
const { onEvent: t } = H(), {
|
|
725
725
|
categoryDetailsChartData: { monthlyAmounts: s, tooltipLabels: a }
|
|
726
726
|
} = q();
|
|
@@ -753,13 +753,13 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
753
753
|
valueFormatterString: "0,0"
|
|
754
754
|
}
|
|
755
755
|
) });
|
|
756
|
-
}),
|
|
757
|
-
const o = Ne(), { onEvent: t } = H(), { common: s, trends: a } = R(), { selectedCategoryData: h, selectedDateRangeMonthRange:
|
|
756
|
+
}), Ut = M(({ onClose: n }) => {
|
|
757
|
+
const o = Ne(), { onEvent: t } = H(), { common: s, trends: a } = R(), { selectedCategoryData: h, selectedDateRangeMonthRange: d } = q(), { sortedTransactions: c } = ae(), [l, m] = i.useState(null);
|
|
758
758
|
if (!h)
|
|
759
759
|
return null;
|
|
760
|
-
const { guid: C, name: u, is_income: b, totalAmount: r } = h, g = b ? a.category_income : a.category_spending, T =
|
|
761
|
-
() => c.find((D) => D.guid ===
|
|
762
|
-
[
|
|
760
|
+
const { guid: C, name: u, is_income: b, totalAmount: r } = h, g = b ? a.category_income : a.category_spending, T = Et(C, o), p = b ? a.income_label : a.spending_label, E = ` ${h.transactions.length === 1 ? a.transaction : a.transactions} (${h.transactions.length})`, w = i.useMemo(
|
|
761
|
+
() => c.find((D) => D.guid === l),
|
|
762
|
+
[l, c]
|
|
763
763
|
), I = (D) => D.category_guid === C || D.top_level_category_guid === C, k = () => {
|
|
764
764
|
n?.(), t(y.TRENDS_CLICK_BACK, A);
|
|
765
765
|
};
|
|
@@ -773,20 +773,20 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
773
773
|
title: g,
|
|
774
774
|
children: [
|
|
775
775
|
/* @__PURE__ */ f(_, { sx: { alignItems: "center", height: "100%" }, children: [
|
|
776
|
-
/* @__PURE__ */ f(
|
|
776
|
+
/* @__PURE__ */ f(It, { sx: { borderRadius: 0, pb: 4, pt: 16, width: "100%" }, children: [
|
|
777
777
|
/* @__PURE__ */ e(
|
|
778
778
|
Ee,
|
|
779
779
|
{
|
|
780
780
|
leftIcon: /* @__PURE__ */ e(Te, { categoryGuid: C }),
|
|
781
781
|
rightContent: U(Math.abs(r), "0,0.00"),
|
|
782
|
-
subtitle:
|
|
782
|
+
subtitle: d,
|
|
783
783
|
title: u
|
|
784
784
|
}
|
|
785
785
|
),
|
|
786
|
-
/* @__PURE__ */ e(
|
|
786
|
+
/* @__PURE__ */ e(Yt, { chartColor: T, chartLabel: p }),
|
|
787
787
|
/* @__PURE__ */ f(_, { alignItems: "center", direction: "row", justifyContent: "space-between", sx: { mx: 24 }, children: [
|
|
788
788
|
/* @__PURE__ */ e(X, { bold: !0, variant: "body1", children: E }),
|
|
789
|
-
/* @__PURE__ */ e(
|
|
789
|
+
/* @__PURE__ */ e(Lt, { filter: I })
|
|
790
790
|
] })
|
|
791
791
|
] }),
|
|
792
792
|
/* @__PURE__ */ e(
|
|
@@ -812,27 +812,27 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
812
812
|
]
|
|
813
813
|
}
|
|
814
814
|
);
|
|
815
|
-
}),
|
|
815
|
+
}), Xt = (n, o) => {
|
|
816
816
|
const t = xe(n, o), s = Le(n, o);
|
|
817
817
|
return [t, s].filter((a) => a.length > 0);
|
|
818
|
-
},
|
|
819
|
-
const [t, s] = n, a = t, h = s ?? t,
|
|
818
|
+
}, Zt = (n, o) => {
|
|
819
|
+
const [t, s] = n, a = t, h = s ?? t, d = [];
|
|
820
820
|
if (a) {
|
|
821
|
-
const c = a.reduce((
|
|
822
|
-
|
|
821
|
+
const c = a.reduce((l, m) => l + m.y, 0);
|
|
822
|
+
d.push({ label: o.income_label, amount: c });
|
|
823
823
|
}
|
|
824
824
|
if (h) {
|
|
825
|
-
const c = h.reduce((
|
|
826
|
-
|
|
825
|
+
const c = h.reduce((l, m) => l + m.y, 0);
|
|
826
|
+
d.push({ label: o.spending_label, amount: c });
|
|
827
827
|
}
|
|
828
|
-
return
|
|
829
|
-
},
|
|
828
|
+
return d;
|
|
829
|
+
}, Qt = ({
|
|
830
830
|
availableHeight: n = 0,
|
|
831
831
|
minHeight: o = 500,
|
|
832
832
|
selectedDateRange: t,
|
|
833
833
|
totals: s
|
|
834
834
|
}) => {
|
|
835
|
-
const a = He(), { onEvent: h } = H(), { trends:
|
|
835
|
+
const a = He(), { onEvent: h } = H(), { trends: d } = R(), { isSmallMobile: c, isMobile: l, isSmallTablet: m, isTablet: C } = K(), u = [a.palette.chart?.chart1, a.palette.chart?.chart2], b = Xt(s, t), r = Zt(b, d), [g, T] = i.useState(0), p = 458, E = 195, w = 56, I = l || c ? E : m || C ? p : g;
|
|
836
836
|
return i.useEffect(() => {
|
|
837
837
|
const D = Math.max(n - w, o);
|
|
838
838
|
T(D);
|
|
@@ -859,20 +859,20 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
859
859
|
valueFormatterString: "0,0"
|
|
860
860
|
}
|
|
861
861
|
);
|
|
862
|
-
},
|
|
863
|
-
const { onEvent: s } = H(), { config: a } =
|
|
862
|
+
}, qt = M(Qt), Jt = ({ onBackClick: n, onInsightCardClick: o, sx: t }) => {
|
|
863
|
+
const { onEvent: s } = H(), { config: a } = nt(), { isLargeDesktop: h, isDesktop: d, isMobile: c } = K(), { visibleAccounts: l } = ie(), { loadDateRangeCategoryTotals: m, loadMonthlyCategoryTotals: C, monthlyCategoryTotals: u } = F(), { setFilter: b } = ae(), { selectedDateRange: r, setSelectedCategoryData: g, setSelectedDateRange: T } = q(), {
|
|
864
864
|
isCopyLoaded: p,
|
|
865
865
|
isInitialized: E,
|
|
866
866
|
selectedAccounts: w,
|
|
867
867
|
selectedAccountGuids: I,
|
|
868
868
|
setSelectedAccounts: k
|
|
869
|
-
} = P(), { trends: D } = R(), N =
|
|
869
|
+
} = P(), { trends: D } = R(), N = je(), L = d || h, [x, $] = i.useState(!1), [z, ce] = i.useState("Chart"), [J, ee] = i.useState(""), [te, ne] = i.useState(!1), [oe, le] = i.useState(window.innerHeight), se = oe - 208, de = oe - (N ? 494 : 266);
|
|
870
870
|
i.useEffect(() => {
|
|
871
|
-
const v = () =>
|
|
871
|
+
const v = () => le(window.innerHeight);
|
|
872
872
|
return window.addEventListener("resize", v), () => window.removeEventListener("resize", v);
|
|
873
873
|
}, []), i.useEffect(() => {
|
|
874
|
-
k(
|
|
875
|
-
}, [
|
|
874
|
+
k(l);
|
|
875
|
+
}, [l]), i.useEffect(() => {
|
|
876
876
|
E && m(w, r.start, r.end).then(() => {
|
|
877
877
|
C(
|
|
878
878
|
w,
|
|
@@ -899,127 +899,131 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
899
899
|
});
|
|
900
900
|
}
|
|
901
901
|
}, [u]);
|
|
902
|
-
const
|
|
902
|
+
const he = (v) => {
|
|
903
903
|
g(v), ne(!0);
|
|
904
|
-
},
|
|
904
|
+
}, ue = () => {
|
|
905
905
|
g(null), ne(!1);
|
|
906
|
-
},
|
|
906
|
+
}, me = (v, V) => {
|
|
907
907
|
ce(V ?? z), s(y.TRENDS_CLICK_TOGGLE_VIEW, {
|
|
908
908
|
...A,
|
|
909
909
|
toggleView: V
|
|
910
910
|
});
|
|
911
|
-
},
|
|
912
|
-
const V = Ie(v?.[0], 1), j = v?.[1],
|
|
911
|
+
}, S = (v) => {
|
|
912
|
+
const V = Ie(v?.[0], 1), j = v?.[1], Be = Ce(j, V);
|
|
913
913
|
T({ start: V, end: j }), s(y.TRENDS_CLICK_TIME_WINDOW, {
|
|
914
914
|
...A,
|
|
915
|
-
time_period:
|
|
915
|
+
time_period: Be + "M"
|
|
916
916
|
});
|
|
917
|
-
},
|
|
917
|
+
}, W = (v) => {
|
|
918
918
|
s(y.TRENDS_CLICK_FILTER, {
|
|
919
919
|
...A,
|
|
920
920
|
filterValue: v
|
|
921
921
|
});
|
|
922
|
-
},
|
|
922
|
+
}, G = (v) => {
|
|
923
923
|
ee(v);
|
|
924
|
-
},
|
|
924
|
+
}, ge = () => {
|
|
925
925
|
ee(""), s(y.TRENDS_CLICK_ALL_CATEGORIES, A);
|
|
926
|
-
},
|
|
927
|
-
return
|
|
926
|
+
}, Ge = a.show_connections_widget_in_master ? "buttons" : "no-buttons";
|
|
927
|
+
return /* @__PURE__ */ f(
|
|
928
928
|
Ae,
|
|
929
929
|
{
|
|
930
|
-
accountOptions:
|
|
931
|
-
calendarActions: { onRangeChanged:
|
|
930
|
+
accountOptions: l,
|
|
931
|
+
calendarActions: { onRangeChanged: S },
|
|
932
932
|
dateRange: r,
|
|
933
933
|
dateRangeVariant: c ? "timeframetabs" : "timeframebuttons",
|
|
934
|
-
onAccountsFilterClick:
|
|
934
|
+
onAccountsFilterClick: W,
|
|
935
935
|
onBackClick: n,
|
|
936
936
|
sx: t,
|
|
937
937
|
title: D.title,
|
|
938
|
-
children:
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
|
|
962
|
-
|
|
963
|
-
|
|
964
|
-
|
|
965
|
-
|
|
938
|
+
children: [
|
|
939
|
+
!p || !x && /* @__PURE__ */ e(Q, {}),
|
|
940
|
+
l && /* @__PURE__ */ f(
|
|
941
|
+
_,
|
|
942
|
+
{
|
|
943
|
+
sx: {
|
|
944
|
+
px: c ? 0 : 48
|
|
945
|
+
},
|
|
946
|
+
children: [
|
|
947
|
+
/* @__PURE__ */ f(
|
|
948
|
+
_,
|
|
949
|
+
{
|
|
950
|
+
flexDirection: "row",
|
|
951
|
+
justifyContent: "space-between",
|
|
952
|
+
sx: { pb: c ? 12 : 24, pt: c ? 24 : 48 },
|
|
953
|
+
children: [
|
|
954
|
+
/* @__PURE__ */ e(
|
|
955
|
+
Oe,
|
|
956
|
+
{
|
|
957
|
+
selectedCategoryGuid: J,
|
|
958
|
+
selectedDateRange: r
|
|
959
|
+
}
|
|
960
|
+
),
|
|
961
|
+
/* @__PURE__ */ e(We, { onTabChange: me, selectedTab: z })
|
|
962
|
+
]
|
|
963
|
+
}
|
|
964
|
+
),
|
|
965
|
+
/* @__PURE__ */ e(_, { alignItems: "center", flexDirection: "row", width: "100%", children: /* @__PURE__ */ e(O, { flexGrow: 1, children: J && /* @__PURE__ */ f(pe, { onClick: ge, sx: { p: 0, pr: 5 }, children: [
|
|
966
|
+
/* @__PURE__ */ e(re, { name: "arrow_back" }),
|
|
967
|
+
D.all_categories
|
|
968
|
+
] }) }) }),
|
|
969
|
+
/* @__PURE__ */ f(_, { flexDirection: L ? "row" : "column", gap: L ? 48 : 16, children: [
|
|
970
|
+
z === "Chart" && /* @__PURE__ */ f(ze, { children: [
|
|
971
|
+
/* @__PURE__ */ e(O, { sx: { width: L ? "68%" : "100%" }, children: /* @__PURE__ */ e(
|
|
972
|
+
qt,
|
|
966
973
|
{
|
|
967
|
-
|
|
968
|
-
|
|
974
|
+
availableHeight: se,
|
|
975
|
+
minHeight: 450,
|
|
976
|
+
selectedDateRange: r,
|
|
977
|
+
totals: u
|
|
969
978
|
}
|
|
970
|
-
),
|
|
971
|
-
/* @__PURE__ */
|
|
972
|
-
|
|
973
|
-
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
979
|
+
) }),
|
|
980
|
+
/* @__PURE__ */ f(_, { gap: 16, sx: { width: L ? "32%" : "100%" }, children: [
|
|
981
|
+
N && /* @__PURE__ */ e(jt, { onInsightCardClick: o }),
|
|
982
|
+
/* @__PURE__ */ e(
|
|
983
|
+
Pt,
|
|
984
|
+
{
|
|
985
|
+
availableHeight: de,
|
|
986
|
+
onCategoryClick: he
|
|
987
|
+
}
|
|
988
|
+
)
|
|
989
|
+
] })
|
|
990
|
+
] }),
|
|
991
|
+
z === "Table" && /* @__PURE__ */ e(O, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
|
|
992
|
+
Ve,
|
|
983
993
|
{
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
994
|
+
height: "unset",
|
|
995
|
+
monthlyCategoryTotals: u,
|
|
996
|
+
onClickRow: G,
|
|
997
|
+
selectedCategory: J,
|
|
998
|
+
selectedDateRange: r
|
|
988
999
|
}
|
|
989
|
-
) })
|
|
990
|
-
/* @__PURE__ */ f(_, { gap: 16, sx: { width: L ? "32%" : "100%" }, children: [
|
|
991
|
-
N && /* @__PURE__ */ e(Ut, { onInsightCardClick: o }),
|
|
992
|
-
/* @__PURE__ */ e(
|
|
993
|
-
$t,
|
|
994
|
-
{
|
|
995
|
-
availableHeight: ue,
|
|
996
|
-
onCategoryClick: me
|
|
997
|
-
}
|
|
998
|
-
)
|
|
999
|
-
] })
|
|
1000
|
+
) })
|
|
1000
1001
|
] }),
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
1004
|
-
|
|
1005
|
-
|
|
1006
|
-
|
|
1007
|
-
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
|
|
1013
|
-
|
|
1014
|
-
|
|
1015
|
-
|
|
1002
|
+
te && /* @__PURE__ */ e(Ut, { onClose: ue })
|
|
1003
|
+
]
|
|
1004
|
+
}
|
|
1005
|
+
),
|
|
1006
|
+
!l && /* @__PURE__ */ e(
|
|
1007
|
+
xt,
|
|
1008
|
+
{
|
|
1009
|
+
header: D.zero_state_content_header,
|
|
1010
|
+
icon: "",
|
|
1011
|
+
onClick: () => {
|
|
1012
|
+
},
|
|
1013
|
+
primaryButton: D.empty_state_primary,
|
|
1014
|
+
subText: D.empty_state_sub_text,
|
|
1015
|
+
sx: { height: se },
|
|
1016
|
+
variant: Ge
|
|
1017
|
+
}
|
|
1018
|
+
)
|
|
1019
|
+
]
|
|
1016
1020
|
}
|
|
1017
1021
|
);
|
|
1018
|
-
},
|
|
1022
|
+
}, Zn = M(Jt);
|
|
1019
1023
|
export {
|
|
1020
|
-
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
|
|
1024
|
+
Yn as TrendsFullWidget,
|
|
1025
|
+
Xn as TrendsMicroWidget,
|
|
1026
|
+
Un as TrendsMiniWidget,
|
|
1027
|
+
Jn as TrendsStore,
|
|
1028
|
+
Zn as TrendsWidget
|
|
1025
1029
|
};
|