@mx-cartographer/experiences 7.0.23-alpha.al15 → 7.0.23-alpha.al2
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,7 +1,7 @@
|
|
|
1
1
|
import { jsx as e, jsxs as f, Fragment as Pe } from "react/jsx-runtime";
|
|
2
|
-
import
|
|
2
|
+
import r from "react";
|
|
3
3
|
import { observer as M } from "mobx-react-lite";
|
|
4
|
-
import { Icon as
|
|
4
|
+
import { Icon as ae, Text as X, CategoryIcon as Te, P as Y, H3 as De, ChevronRightIcon as Ke } 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";
|
|
@@ -12,11 +12,11 @@ import { T as to } from "../TrendsStore-WrHxzdbQ.mjs";
|
|
|
12
12
|
import { i as Xe, c as Ze, d as Qe, e as qe, f as Je, h as et, b as Le, g as xe, j as _e } from "../SpendingData-D5vsfYKo.mjs";
|
|
13
13
|
import tt from "@mui/material/ToggleButton";
|
|
14
14
|
import nt from "@mui/material/ToggleButtonGroup";
|
|
15
|
-
import { u as R, k as F, e as H, a as P, f as
|
|
15
|
+
import { u as R, k as F, e as H, a as P, f as re, c as ie, v as q, l as ve, p as ot, m as st } 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 at } from "@mui/x-data-grid-pro";
|
|
19
|
+
import { C as rt } from "../CurrencyText-YUhH2caW.mjs";
|
|
20
20
|
import { c as Me } from "../Category-CevNQ03n.mjs";
|
|
21
21
|
import { b as it } from "../Localization-2MODESHW.mjs";
|
|
22
22
|
import { H as be } from "../HeaderCell-DjuifqHJ.mjs";
|
|
@@ -29,7 +29,7 @@ import { useTheme as He } from "@mui/material/styles";
|
|
|
29
29
|
import { L as ye } from "../LineChart-BWWmmJxV.mjs";
|
|
30
30
|
import { M as lt } from "../MiniWidgetContainer-CTyjmE1h.mjs";
|
|
31
31
|
import { subMonths as dt } from "date-fns";
|
|
32
|
-
import { TrendingUp as ht, TrendingDown as ut, MultilineChart as
|
|
32
|
+
import { TrendingUp as ht, TrendingDown as ut, MultilineChart as gt, ExpandLess as mt, ExpandMore as pt } from "@mxenabled/mx-icons";
|
|
33
33
|
import { a as Ct, f as U } from "../NumberFormatting-CtWHhyBX.mjs";
|
|
34
34
|
import { M as ft } from "../MicroWidgetContainer-Dxz8uBN9.mjs";
|
|
35
35
|
import Tt from "@mui/material/Collapse";
|
|
@@ -52,18 +52,18 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
52
52
|
onChange: o,
|
|
53
53
|
orientation: "horizontal",
|
|
54
54
|
value: n,
|
|
55
|
-
children: ["Chart", "Table"].map((t) => /* @__PURE__ */ e(tt, { color: "primary", sx: { width: 56 }, value: t, children: t === "Chart" ? /* @__PURE__ */ e(
|
|
55
|
+
children: ["Chart", "Table"].map((t) => /* @__PURE__ */ e(tt, { color: "primary", sx: { width: 56 }, value: t, children: t === "Chart" ? /* @__PURE__ */ e(ae, { name: "table_chart_view" }) : /* @__PURE__ */ e(ae, { name: "format_list_bulleted" }) }, t))
|
|
56
56
|
}
|
|
57
57
|
), Oe = ({ selectedDateRange: n, selectedCategoryGuid: o }) => {
|
|
58
|
-
const { trends: t } = R(), { isMobile: s, isDesktop:
|
|
59
|
-
const
|
|
58
|
+
const { trends: t } = R(), { isMobile: s, isDesktop: i } = K(), { getCategoryName: h } = F(), d = r.useMemo(() => {
|
|
59
|
+
const l = Z(
|
|
60
60
|
n.start,
|
|
61
61
|
s ? B.MONTH_SHORT_YEAR : B.MONTH_YEAR
|
|
62
|
-
),
|
|
62
|
+
), c = Z(
|
|
63
63
|
n.end,
|
|
64
64
|
s ? B.MONTH_SHORT_YEAR : B.MONTH_YEAR
|
|
65
65
|
);
|
|
66
|
-
return `${
|
|
66
|
+
return `${l} - ${c}`;
|
|
67
67
|
}, [n, s]);
|
|
68
68
|
return /* @__PURE__ */ f(O, { sx: { mr: 10, minWidth: "60%" }, children: [
|
|
69
69
|
/* @__PURE__ */ e(
|
|
@@ -76,15 +76,15 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
76
76
|
overflow: "visible",
|
|
77
77
|
textOverflow: "unset"
|
|
78
78
|
},
|
|
79
|
-
variant:
|
|
79
|
+
variant: i ? "H3" : "Body",
|
|
80
80
|
children: h(o) || t.sub_title
|
|
81
81
|
}
|
|
82
82
|
),
|
|
83
|
-
/* @__PURE__ */ e(X, { variant:
|
|
83
|
+
/* @__PURE__ */ e(X, { variant: i ? "Body" : "Small", children: d })
|
|
84
84
|
] });
|
|
85
85
|
}, At = (n) => {
|
|
86
86
|
const o = n.row[n.field];
|
|
87
|
-
return /* @__PURE__ */ e(_, { alignItems: "flex-end", tabIndex: n.tabIndex, children: /* @__PURE__ */ e(
|
|
87
|
+
return /* @__PURE__ */ e(_, { alignItems: "flex-end", tabIndex: n.tabIndex, children: /* @__PURE__ */ e(rt, { amount: o, variant: "Small" }) });
|
|
88
88
|
}, Rt = ({ 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: [
|
|
@@ -107,8 +107,8 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
107
107
|
) }), Ht = (n, o) => {
|
|
108
108
|
const t = [], s = new Date(n);
|
|
109
109
|
for (; s <= o; ) {
|
|
110
|
-
const
|
|
111
|
-
t.push(
|
|
110
|
+
const i = Z(s, B.MONTH);
|
|
111
|
+
t.push(i), s.setMonth(s.getMonth() + 1);
|
|
112
112
|
}
|
|
113
113
|
return t;
|
|
114
114
|
}, Ve = ({
|
|
@@ -116,12 +116,12 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
116
116
|
selectedDateRange: o,
|
|
117
117
|
selectedCategory: t,
|
|
118
118
|
onClickRow: s,
|
|
119
|
-
height:
|
|
119
|
+
height: i = "100dvh",
|
|
120
120
|
sx: h = {}
|
|
121
121
|
}) => {
|
|
122
|
-
const { onEvent:
|
|
123
|
-
{ field:
|
|
124
|
-
]), C =
|
|
122
|
+
const { onEvent: d } = H(), l = Z(/* @__PURE__ */ new Date(), B.MONTH_SHORT), [c, g] = r.useState([
|
|
123
|
+
{ field: l, sort: "desc" }
|
|
124
|
+
]), C = r.useMemo(() => Ht(o.start, o.end), [o]), u = [
|
|
125
125
|
{
|
|
126
126
|
field: "category",
|
|
127
127
|
flex: 1,
|
|
@@ -133,10 +133,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
133
133
|
type: "string"
|
|
134
134
|
},
|
|
135
135
|
...C.map(
|
|
136
|
-
(
|
|
137
|
-
field:
|
|
136
|
+
(a) => ({
|
|
137
|
+
field: a,
|
|
138
138
|
flex: 1,
|
|
139
|
-
headerName:
|
|
139
|
+
headerName: a,
|
|
140
140
|
minWidth: 100,
|
|
141
141
|
renderHeader: be,
|
|
142
142
|
renderCell: At,
|
|
@@ -148,12 +148,12 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
148
148
|
sortComparator: $e
|
|
149
149
|
})
|
|
150
150
|
)
|
|
151
|
-
], b =
|
|
152
|
-
const
|
|
151
|
+
], b = r.useMemo(() => {
|
|
152
|
+
const a = n.filter(
|
|
153
153
|
(p) => !Xe(p) && !Ze(p)
|
|
154
|
-
), T = (t ?
|
|
154
|
+
), T = (t ? a.filter(
|
|
155
155
|
(p) => p.category_guid === t || p.top_level_category_guid === t
|
|
156
|
-
) :
|
|
156
|
+
) : a).reduce(
|
|
157
157
|
(p, E) => {
|
|
158
158
|
const { category_guid: w, top_level_category_guid: I, month: k, total: D, year: N } = E, L = t ? w : I;
|
|
159
159
|
p[L] || (p[L] = {
|
|
@@ -169,26 +169,26 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
169
169
|
);
|
|
170
170
|
return Object.values(T);
|
|
171
171
|
}, [n, t]);
|
|
172
|
-
return /* @__PURE__ */ e(O, { sx: { height:
|
|
173
|
-
|
|
172
|
+
return /* @__PURE__ */ e(O, { sx: { height: i, width: "100%", overflowX: "auto", boxShadow: "none", ...h }, children: /* @__PURE__ */ e(
|
|
173
|
+
at,
|
|
174
174
|
{
|
|
175
175
|
columns: u,
|
|
176
176
|
disableColumnFilter: !0,
|
|
177
177
|
disableColumnMenu: !0,
|
|
178
178
|
hideFooter: !0,
|
|
179
|
-
initialState: { sorting: { sortModel:
|
|
180
|
-
onRowClick: (
|
|
181
|
-
s?.(
|
|
179
|
+
initialState: { sorting: { sortModel: c } },
|
|
180
|
+
onRowClick: (a) => {
|
|
181
|
+
s?.(a.row.category), d(y.TRENDS_CLICK_LIST_ITEM, {
|
|
182
182
|
...A,
|
|
183
|
-
listItem: Me[
|
|
183
|
+
listItem: Me[a.row.category]
|
|
184
184
|
});
|
|
185
185
|
},
|
|
186
|
-
onSortModelChange: (
|
|
187
|
-
|
|
186
|
+
onSortModelChange: (a) => {
|
|
187
|
+
g(a), 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: c,
|
|
192
192
|
sortingOrder: ["asc", "desc"]
|
|
193
193
|
}
|
|
194
194
|
) });
|
|
@@ -200,25 +200,25 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
200
200
|
isOpen: t,
|
|
201
201
|
onClose: s
|
|
202
202
|
}) => {
|
|
203
|
-
const { onEvent:
|
|
204
|
-
() =>
|
|
205
|
-
[
|
|
203
|
+
const { onEvent: i } = H(), { selectedAccountGuids: h } = P(), { common: d } = R(), { setFilter: l, sortedTransactions: c } = re(), [g, C] = r.useState(""), u = r.useMemo(
|
|
204
|
+
() => c.find((a) => a.guid === g),
|
|
205
|
+
[g, c]
|
|
206
206
|
);
|
|
207
|
-
|
|
208
|
-
|
|
207
|
+
r.useEffect(() => {
|
|
208
|
+
l({
|
|
209
209
|
accounts: h,
|
|
210
210
|
dateRange: o,
|
|
211
|
-
custom: (
|
|
211
|
+
custom: (a) => n === "" || n === a.category_guid || n === a.top_level_category_guid,
|
|
212
212
|
showSplits: !!n
|
|
213
213
|
});
|
|
214
|
-
}, [h, n, o]),
|
|
214
|
+
}, [h, n, o]), r.useEffect(() => i(y.TRENDS_VIEW_TRANSACTIONS), []);
|
|
215
215
|
const b = () => {
|
|
216
216
|
C(""), s();
|
|
217
217
|
};
|
|
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
224
|
title: Nt.title,
|
|
@@ -229,25 +229,25 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
229
229
|
}
|
|
230
230
|
);
|
|
231
231
|
}, Ot = M(Wt), Vt = ({ onBackClick: n, sx: o }) => {
|
|
232
|
-
const { onEvent: t } = H(), { isDesktop: s, isTablet:
|
|
233
|
-
|
|
232
|
+
const { onEvent: t } = H(), { isDesktop: s, isTablet: i, isMobile: h } = K(), { visibleAccounts: d } = ie(), { loadMonthlyCategoryTotals: l, monthlyCategoryTotals: c, getCategoryName: g } = F(), { sortedTransactions: C } = re(), { selectedDateRange: u, setSelectedDateRange: b } = q(), { isCopyLoaded: a, isInitialized: m, selectedAccounts: T, setSelectedAccounts: p } = P(), { trends: E } = R(), [w, I] = r.useState(!1), [k, D] = r.useState(!1), [N, L] = r.useState("Chart"), [x, $] = r.useState(""), [z, ce] = r.useState(window.innerHeight), ee = z - (h ? 315 : 345);
|
|
233
|
+
r.useEffect(() => {
|
|
234
234
|
const S = () => ce(window.innerHeight);
|
|
235
235
|
return window.addEventListener("resize", S), () => window.removeEventListener("resize", S);
|
|
236
|
-
}, []),
|
|
237
|
-
p(
|
|
238
|
-
}, [
|
|
239
|
-
|
|
236
|
+
}, []), r.useEffect(() => {
|
|
237
|
+
p(d);
|
|
238
|
+
}, [d]), r.useEffect(() => {
|
|
239
|
+
m && l(
|
|
240
240
|
T,
|
|
241
241
|
u.start,
|
|
242
242
|
u.end
|
|
243
243
|
).finally(() => {
|
|
244
244
|
I(!0);
|
|
245
245
|
});
|
|
246
|
-
}, [
|
|
247
|
-
const te =
|
|
246
|
+
}, [m, T, u]);
|
|
247
|
+
const te = r.useMemo(() => {
|
|
248
248
|
if (!w) return { stackedDatasets: [], unstackedDatasets: [] };
|
|
249
249
|
const S = je(
|
|
250
|
-
|
|
250
|
+
c,
|
|
251
251
|
u.start,
|
|
252
252
|
u.end
|
|
253
253
|
), W = x.length ? S.filter(
|
|
@@ -257,34 +257,34 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
257
257
|
stackedDatasets: W.filter(qe),
|
|
258
258
|
unstackedDatasets: W.filter(Je)
|
|
259
259
|
};
|
|
260
|
-
}, [
|
|
260
|
+
}, [c, x, u]), ne = (S, W) => {
|
|
261
261
|
L(W ?? N), t(y.TRENDS_CLICK_TOGGLE_VIEW);
|
|
262
|
-
},
|
|
263
|
-
const W = Ie(S?.[0], 1), G = S?.[1],
|
|
262
|
+
}, oe = (S) => {
|
|
263
|
+
const W = Ie(S?.[0], 1), G = S?.[1], me = Ce(G, W);
|
|
264
264
|
b({ start: W, end: G }), t(y.TRENDS_CLICK_TIME_WINDOW, {
|
|
265
|
-
time_period:
|
|
265
|
+
time_period: me + "M"
|
|
266
266
|
});
|
|
267
|
-
},
|
|
267
|
+
}, le = () => {
|
|
268
268
|
t(y.TRENDS_CLICK_FILTER);
|
|
269
|
-
},
|
|
269
|
+
}, se = (S) => {
|
|
270
270
|
$(S);
|
|
271
|
+
}, de = (S) => {
|
|
272
|
+
$(S), t(y.TRENDS_CLICK_LEGEND, { category: g(S) });
|
|
271
273
|
}, he = (S) => {
|
|
272
|
-
|
|
273
|
-
}, se = (S) => {
|
|
274
|
-
t(y.TRENDS_HOVER_LEGEND, { category: m(S) });
|
|
274
|
+
t(y.TRENDS_HOVER_LEGEND, { category: g(S) });
|
|
275
275
|
}, ue = (S) => {
|
|
276
276
|
t(y.TRENDS_HOVER_AREA, { category: S });
|
|
277
|
-
},
|
|
277
|
+
}, ge = (S) => {
|
|
278
278
|
t(y.TRENDS_HOVER_POINT, { category: S });
|
|
279
279
|
};
|
|
280
|
-
return !
|
|
280
|
+
return !a || !m || !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,
|
|
@@ -294,7 +294,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
294
294
|
{
|
|
295
295
|
sx: {
|
|
296
296
|
// eslint-disable-next-line no-nested-ternary
|
|
297
|
-
px: s ? 48 :
|
|
297
|
+
px: s ? 48 : i ? 24 : 12
|
|
298
298
|
},
|
|
299
299
|
children: [
|
|
300
300
|
/* @__PURE__ */ f(
|
|
@@ -317,7 +317,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
317
317
|
),
|
|
318
318
|
/* @__PURE__ */ f(_, { alignItems: "center", flexDirection: "row", width: "100%", children: [
|
|
319
319
|
/* @__PURE__ */ e(O, { flexGrow: 1, children: x && /* @__PURE__ */ f(pe, { onClick: () => $(""), sx: { p: 0, pr: 5 }, children: [
|
|
320
|
-
/* @__PURE__ */ e(
|
|
320
|
+
/* @__PURE__ */ e(ae, { name: "arrow_back" }),
|
|
321
321
|
E.all_categories
|
|
322
322
|
] }) }),
|
|
323
323
|
/* @__PURE__ */ e(pe, { onClick: () => D(!0), sx: { px: 5 }, children: `${E.view_transactions} (${C.length})` })
|
|
@@ -327,10 +327,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
327
327
|
Ye,
|
|
328
328
|
{
|
|
329
329
|
availableHeight: ee,
|
|
330
|
-
onClickLegend:
|
|
330
|
+
onClickLegend: de,
|
|
331
331
|
onHoverArea: ue,
|
|
332
|
-
onHoverLegend:
|
|
333
|
-
onHoverPoint:
|
|
332
|
+
onHoverLegend: he,
|
|
333
|
+
onHoverPoint: ge,
|
|
334
334
|
stackedDatasets: te.stackedDatasets,
|
|
335
335
|
unstackedDatasets: te.unstackedDatasets
|
|
336
336
|
}
|
|
@@ -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: c,
|
|
342
|
+
onClickRow: se,
|
|
343
343
|
selectedCategory: x,
|
|
344
344
|
selectedDateRange: u
|
|
345
345
|
}
|
|
@@ -379,20 +379,20 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
379
379
|
}
|
|
380
380
|
);
|
|
381
381
|
}, Bt = M(Gt), zt = ({ onPrimaryCtaClick: n, sx: o }) => {
|
|
382
|
-
const { visibleAccounts: t } = ie(), { loadMonthlyCategoryTotals: s, monthlyTotalsLoaded:
|
|
383
|
-
return
|
|
384
|
-
|
|
385
|
-
}, [t]),
|
|
386
|
-
h && s(
|
|
387
|
-
}, [h,
|
|
382
|
+
const { visibleAccounts: t } = ie(), { loadMonthlyCategoryTotals: s, monthlyTotalsLoaded: i } = F(), { isInitialized: h } = ve(), { trends: d } = R(), { isCopyLoaded: l, selectedAccounts: c, setSelectedAccounts: g } = P();
|
|
383
|
+
return r.useEffect(() => {
|
|
384
|
+
g(t);
|
|
385
|
+
}, [t]), r.useEffect(() => {
|
|
386
|
+
h && s(c).finally();
|
|
387
|
+
}, [h, c]), !l || !h ? /* @__PURE__ */ e(Q, {}) : /* @__PURE__ */ e(
|
|
388
388
|
lt,
|
|
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:
|
|
394
|
+
title: d.mini_title,
|
|
395
|
+
children: i ? /* @__PURE__ */ e(Bt, {}) : /* @__PURE__ */ e(Q, {})
|
|
396
396
|
}
|
|
397
397
|
);
|
|
398
398
|
}, Zn = M(zt), Ft = 70, Se = ({
|
|
@@ -400,13 +400,13 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
400
400
|
totalAmount: o,
|
|
401
401
|
transactionType: t,
|
|
402
402
|
percentage: s,
|
|
403
|
-
secondaryLabel:
|
|
403
|
+
secondaryLabel: i,
|
|
404
404
|
shouldDisplayPercentage: h
|
|
405
405
|
}) => {
|
|
406
|
-
const { availableWidth:
|
|
406
|
+
const { availableWidth: d } = ot(), l = r.useRef(null), c = r.useRef(null), g = Ct(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", a = t === "spending" ? "success.main" : "text.secondary", m = l?.current, T = c?.current, p = m && T ? m.scrollWidth > T.clientWidth - Ft : !1;
|
|
410
410
|
return /* @__PURE__ */ f(
|
|
411
411
|
_,
|
|
412
412
|
{
|
|
@@ -431,16 +431,16 @@ 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(ht, { size: 20, sx: { color: b } }) : /* @__PURE__ */ e(ut, { size: 20, sx: { color:
|
|
434
|
+
u ? /* @__PURE__ */ e(ht, { size: 20, sx: { color: b } }) : /* @__PURE__ */ e(ut, { size: 20, sx: { color: a } }),
|
|
435
435
|
/* @__PURE__ */ e(
|
|
436
436
|
Y,
|
|
437
437
|
{
|
|
438
438
|
sx: {
|
|
439
|
-
color: u ? b :
|
|
439
|
+
color: u ? b : a,
|
|
440
440
|
fontWeight: 600
|
|
441
441
|
},
|
|
442
442
|
variant: "body2",
|
|
443
|
-
children:
|
|
443
|
+
children: g
|
|
444
444
|
}
|
|
445
445
|
)
|
|
446
446
|
] })
|
|
@@ -450,7 +450,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
450
450
|
/* @__PURE__ */ f(
|
|
451
451
|
_,
|
|
452
452
|
{
|
|
453
|
-
ref:
|
|
453
|
+
ref: c,
|
|
454
454
|
sx: {
|
|
455
455
|
alignItems: "center",
|
|
456
456
|
flexDirection: "row",
|
|
@@ -460,17 +460,17 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
460
460
|
/* @__PURE__ */ e(
|
|
461
461
|
O,
|
|
462
462
|
{
|
|
463
|
-
ref:
|
|
463
|
+
ref: l,
|
|
464
464
|
sx: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
|
|
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
|
-
color: u ? b :
|
|
471
|
+
color: u ? b : a,
|
|
472
472
|
variant: "caption",
|
|
473
|
-
children:
|
|
473
|
+
children: i
|
|
474
474
|
}
|
|
475
475
|
)
|
|
476
476
|
]
|
|
@@ -482,33 +482,33 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
482
482
|
}, Pt = 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(gt, { 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
491
|
}), Qn = M(({ onCtaClick: n }) => {
|
|
492
|
-
const { visibleAccounts: o } = ie(), { onEvent: t } = H(), { monthlyCategoryTotals: s, loadMonthlyCategoryTotals:
|
|
492
|
+
const { visibleAccounts: o } = ie(), { onEvent: t } = H(), { monthlyCategoryTotals: s, loadMonthlyCategoryTotals: i, monthlyTotalsLoaded: h } = F(), d = {
|
|
493
493
|
start: dt(/* @__PURE__ */ new Date(), 1),
|
|
494
494
|
end: /* @__PURE__ */ new Date()
|
|
495
|
-
}, { trends:
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
}, [o]),
|
|
499
|
-
C &&
|
|
495
|
+
}, { trends: l } = R(), { selectedAccounts: c, setSelectedAccounts: g, isInitialized: C } = P();
|
|
496
|
+
r.useEffect(() => {
|
|
497
|
+
g(o);
|
|
498
|
+
}, [o]), r.useEffect(() => {
|
|
499
|
+
C && i(c, d.start).then(() => {
|
|
500
500
|
t(y.TRENDS_LOAD_WIDGET, {
|
|
501
501
|
state: o?.length ? "default" : "zeroState"
|
|
502
502
|
});
|
|
503
503
|
});
|
|
504
|
-
}, [C,
|
|
505
|
-
const { spendingData: u, incomeData: b } =
|
|
504
|
+
}, [C, c]);
|
|
505
|
+
const { spendingData: u, incomeData: b } = r.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,
|
|
511
|
-
), [
|
|
510
|
+
[s, d]
|
|
511
|
+
), [a, m] = u, [T, p] = b, E = _e(m.y, a.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();
|
|
@@ -517,10 +517,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
517
517
|
ft,
|
|
518
518
|
{
|
|
519
519
|
className: "mx-trends-microwidget",
|
|
520
|
-
ctaLabel:
|
|
520
|
+
ctaLabel: l.micro_primary_cta_label,
|
|
521
521
|
onCTAClick: k,
|
|
522
|
-
subHeader: I ? void 0 :
|
|
523
|
-
title:
|
|
522
|
+
subHeader: I ? void 0 : l.micro_subheader,
|
|
523
|
+
title: l.title,
|
|
524
524
|
children: I ? /* @__PURE__ */ e(Pt, {}) : /* @__PURE__ */ f(
|
|
525
525
|
_,
|
|
526
526
|
{
|
|
@@ -534,10 +534,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
534
534
|
Se,
|
|
535
535
|
{
|
|
536
536
|
percentage: E,
|
|
537
|
-
secondaryLabel:
|
|
538
|
-
shouldDisplayPercentage:
|
|
539
|
-
title:
|
|
540
|
-
totalAmount:
|
|
537
|
+
secondaryLabel: l.micro_secondary_label,
|
|
538
|
+
shouldDisplayPercentage: m.y !== 0 && a.y !== 0,
|
|
539
|
+
title: l.spending_label,
|
|
540
|
+
totalAmount: m.y,
|
|
541
541
|
transactionType: "spending"
|
|
542
542
|
}
|
|
543
543
|
),
|
|
@@ -545,9 +545,9 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
545
545
|
Se,
|
|
546
546
|
{
|
|
547
547
|
percentage: w,
|
|
548
|
-
secondaryLabel:
|
|
548
|
+
secondaryLabel: l.micro_secondary_label,
|
|
549
549
|
shouldDisplayPercentage: p.y !== 0 && T.y !== 0,
|
|
550
|
-
title:
|
|
550
|
+
title: l.income_label,
|
|
551
551
|
totalAmount: p.y,
|
|
552
552
|
transactionType: "income"
|
|
553
553
|
}
|
|
@@ -566,7 +566,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
566
566
|
sx: { color: t.palette.primary.main, flexDirection: "row", alignItems: "center" },
|
|
567
567
|
children: [
|
|
568
568
|
/* @__PURE__ */ e(wt, { children: /* @__PURE__ */ e(X, { bold: !0, variant: "body2", children: n ? "View less" : "View more" }) }),
|
|
569
|
-
/* @__PURE__ */ e(St, { sx: { color: t.palette.primary.main }, children: n ? /* @__PURE__ */ e(
|
|
569
|
+
/* @__PURE__ */ e(St, { sx: { color: t.palette.primary.main }, children: n ? /* @__PURE__ */ e(mt, {}) : /* @__PURE__ */ e(
|
|
570
570
|
pt,
|
|
571
571
|
{
|
|
572
572
|
sx: {
|
|
@@ -585,76 +585,76 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
585
585
|
guid: o,
|
|
586
586
|
name: t,
|
|
587
587
|
transactions: s,
|
|
588
|
-
onClick:
|
|
588
|
+
onClick: i,
|
|
589
589
|
isLastItem: h = !1,
|
|
590
|
-
showDivider:
|
|
590
|
+
showDivider: d = !0
|
|
591
591
|
}) => {
|
|
592
|
-
const { trends:
|
|
593
|
-
|
|
592
|
+
const { trends: l } = R(), { onEvent: c } = H(), g = `${s.length} ${s.length === 1 ? l.transaction : l.transactions}`, C = () => {
|
|
593
|
+
i?.(), c(y.TRENDS_CLICK_LIST_ITEM, {
|
|
594
594
|
...A,
|
|
595
595
|
listItem: t
|
|
596
596
|
});
|
|
597
597
|
};
|
|
598
|
-
return /* @__PURE__ */ f(
|
|
598
|
+
return /* @__PURE__ */ f(r.Fragment, { children: [
|
|
599
599
|
/* @__PURE__ */ e(
|
|
600
600
|
Ee,
|
|
601
601
|
{
|
|
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:
|
|
606
|
-
subtitle:
|
|
605
|
+
rightIcon: i ? /* @__PURE__ */ e(Ke, {}) : void 0,
|
|
606
|
+
subtitle: g,
|
|
607
607
|
title: t
|
|
608
608
|
}
|
|
609
609
|
),
|
|
610
|
-
|
|
610
|
+
d && /* @__PURE__ */ e(Dt, { sx: { ml: h ? 24 : 68 } })
|
|
611
611
|
] }, o);
|
|
612
612
|
}
|
|
613
613
|
), $t = M(
|
|
614
614
|
({ availableHeight: n = 0, onCategoryClick: o }) => {
|
|
615
|
-
const { collapsedCategories: t, visibleCategories: s, setVisibleListLength:
|
|
616
|
-
|
|
617
|
-
const
|
|
618
|
-
|
|
615
|
+
const { collapsedCategories: t, visibleCategories: s, setVisibleListLength: i } = q(), { isLargeDesktop: h, isDesktop: d } = K(), { trends: l } = R(), { onEvent: c } = H(), [g, C] = r.useState(!1), u = d || h;
|
|
616
|
+
r.useEffect(() => {
|
|
617
|
+
const m = Math.floor(n / 64) - 1, T = s.length + t.length;
|
|
618
|
+
m !== s.length && (i(u ? Math.max(m, 5) : 5), C(m >= T));
|
|
619
619
|
}, [n]);
|
|
620
620
|
const b = () => {
|
|
621
|
-
C(!
|
|
621
|
+
C(!g), c(y.TRENDS_CLICK_VIEW_MORE, {
|
|
622
622
|
...A
|
|
623
623
|
});
|
|
624
|
-
},
|
|
624
|
+
}, a = s.length + (g ? t.length : 0);
|
|
625
625
|
return /* @__PURE__ */ e(_, { sx: { bgColor: "background.paper", width: "100%" }, children: /* @__PURE__ */ f(yt, { children: [
|
|
626
|
-
/* @__PURE__ */ e(_, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(De, { children:
|
|
627
|
-
s.map((
|
|
626
|
+
/* @__PURE__ */ e(_, { sx: { pb: 4, pt: 16, px: 16 }, children: /* @__PURE__ */ e(De, { children: l.categories }) }),
|
|
627
|
+
s.map((m, T) => /* @__PURE__ */ e(
|
|
628
628
|
we,
|
|
629
629
|
{
|
|
630
|
-
...
|
|
631
|
-
isLastItem: T ===
|
|
632
|
-
onClick:
|
|
630
|
+
...m,
|
|
631
|
+
isLastItem: T === a - 1,
|
|
632
|
+
onClick: m.transactions.length > 0 ? () => o(m) : void 0,
|
|
633
633
|
showDivider: !0
|
|
634
634
|
},
|
|
635
|
-
|
|
635
|
+
m.guid
|
|
636
636
|
)),
|
|
637
637
|
/* @__PURE__ */ e(
|
|
638
638
|
Tt,
|
|
639
639
|
{
|
|
640
|
-
in:
|
|
640
|
+
in: g,
|
|
641
641
|
sx: { "&.MuiCollapse-root .MuiListItemButton-root": { paddingLeft: 24 } },
|
|
642
|
-
children: t.map((
|
|
642
|
+
children: t.map((m, T) => {
|
|
643
643
|
const p = s.length + T;
|
|
644
644
|
return /* @__PURE__ */ e(
|
|
645
645
|
we,
|
|
646
646
|
{
|
|
647
|
-
...
|
|
648
|
-
isLastItem: p ===
|
|
649
|
-
onClick:
|
|
647
|
+
...m,
|
|
648
|
+
isLastItem: p === a - 1,
|
|
649
|
+
onClick: m.transactions.length > 0 ? () => o(m) : void 0,
|
|
650
650
|
showDivider: !0
|
|
651
651
|
},
|
|
652
|
-
|
|
652
|
+
m.guid
|
|
653
653
|
);
|
|
654
654
|
})
|
|
655
655
|
}
|
|
656
656
|
),
|
|
657
|
-
t.length > 0 && /* @__PURE__ */ e(Kt, { isExpanded:
|
|
657
|
+
t.length > 0 && /* @__PURE__ */ e(Kt, { isExpanded: g, onClick: b })
|
|
658
658
|
] }) });
|
|
659
659
|
}
|
|
660
660
|
), jt = [
|
|
@@ -692,37 +692,37 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
692
692
|
"WeeklyNoSpendDays",
|
|
693
693
|
"WeeklySmallPurchasesSummary"
|
|
694
694
|
], Yt = ({ onInsightCardClick: n }) => {
|
|
695
|
-
const o = It(), { onEvent: t } = H(), { isMobile: s, isDesktop:
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
}, [
|
|
699
|
-
const T =
|
|
695
|
+
const o = It(), { onEvent: t } = H(), { isMobile: s, isDesktop: i, isLargeDesktop: h } = K(), { beatStore: d, endpoint: l, sessionToken: c } = ve(), { isInitialized: g } = P(), [C, u] = r.useState(!1), b = o.palette.mode === "dark", a = i || h, m = a || s ? 1 : 2;
|
|
696
|
+
r.useEffect(() => {
|
|
697
|
+
g && d.loadBeats().finally(() => u(!0));
|
|
698
|
+
}, [g]);
|
|
699
|
+
const T = r.useMemo(() => C ? d.getFilteredBeats({ templates: jt }) : [], [C]), p = () => null, E = (D) => {
|
|
700
700
|
n?.(D), t(y.TRENDS_CLICK_INSIGHT, A);
|
|
701
|
-
}, w =
|
|
701
|
+
}, w = a ? 200 : 170, I = a ? 170 : 124, k = T.length > 0 ? w : I;
|
|
702
702
|
return /* @__PURE__ */ e(Et, { sx: { height: k }, children: /* @__PURE__ */ e(
|
|
703
703
|
ct,
|
|
704
704
|
{
|
|
705
|
-
areBeatsLoading:
|
|
705
|
+
areBeatsLoading: d.isLoading,
|
|
706
706
|
beats: T,
|
|
707
|
-
endpoint:
|
|
707
|
+
endpoint: l,
|
|
708
708
|
logOutUser: p,
|
|
709
709
|
onCardClick: E,
|
|
710
710
|
showBorder: !0,
|
|
711
711
|
showCTAColocatedWithText: !1,
|
|
712
712
|
showCarouselControls: !0,
|
|
713
|
-
showHeader:
|
|
713
|
+
showHeader: a,
|
|
714
714
|
showIcon: !0,
|
|
715
715
|
showWithMargin: !1,
|
|
716
|
-
token:
|
|
716
|
+
token: c,
|
|
717
717
|
useDarkMode: b,
|
|
718
718
|
userHasFullInsightFeedBeats: !1,
|
|
719
719
|
variant: "outlined",
|
|
720
|
-
visibleCardsCount:
|
|
720
|
+
visibleCardsCount: m
|
|
721
721
|
}
|
|
722
722
|
) });
|
|
723
723
|
}, Ut = M(Yt), Xt = M(({ chartLabel: n, chartColor: o }) => {
|
|
724
724
|
const { onEvent: t } = H(), {
|
|
725
|
-
categoryDetailsChartData: { monthlyAmounts: s, tooltipLabels:
|
|
725
|
+
categoryDetailsChartData: { monthlyAmounts: s, tooltipLabels: i }
|
|
726
726
|
} = q();
|
|
727
727
|
return /* @__PURE__ */ e(_, { sx: { pt: 12, width: "100%" }, children: /* @__PURE__ */ e(
|
|
728
728
|
ye,
|
|
@@ -730,7 +730,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
730
730
|
baseline: "min",
|
|
731
731
|
colors: [o],
|
|
732
732
|
curveType: "bump",
|
|
733
|
-
customTooltipLabels:
|
|
733
|
+
customTooltipLabels: i,
|
|
734
734
|
datasets: [s],
|
|
735
735
|
height: 265,
|
|
736
736
|
labels: [n],
|
|
@@ -754,23 +754,23 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
754
754
|
}
|
|
755
755
|
) });
|
|
756
756
|
}), Zt = M(({ onClose: n }) => {
|
|
757
|
-
const o = Ne(), { onEvent: t } = H(), { common: s, trends:
|
|
757
|
+
const o = Ne(), { onEvent: t } = H(), { common: s, trends: i } = R(), { selectedCategoryData: h, selectedDateRangeMonthRange: d } = q(), { sortedTransactions: l } = re(), [c, g] = r.useState(null);
|
|
758
758
|
if (!h)
|
|
759
759
|
return null;
|
|
760
|
-
const { guid: C, name: u, is_income: b, totalAmount:
|
|
761
|
-
() =>
|
|
762
|
-
[
|
|
760
|
+
const { guid: C, name: u, is_income: b, totalAmount: a } = h, m = b ? i.category_income : i.category_spending, T = xt(C, o), p = b ? i.income_label : i.spending_label, E = ` ${h.transactions.length === 1 ? i.transaction : i.transactions} (${h.transactions.length})`, w = r.useMemo(
|
|
761
|
+
() => l.find((D) => D.guid === c),
|
|
762
|
+
[c, l]
|
|
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
|
};
|
|
766
766
|
return /* @__PURE__ */ f(
|
|
767
767
|
fe,
|
|
768
768
|
{
|
|
769
|
-
ariaLabelClose:
|
|
769
|
+
ariaLabelClose: i.close_category_details,
|
|
770
770
|
isOpen: !0,
|
|
771
771
|
onClose: k,
|
|
772
772
|
shouldShowHeaderShadow: !0,
|
|
773
|
-
title:
|
|
773
|
+
title: m,
|
|
774
774
|
children: [
|
|
775
775
|
/* @__PURE__ */ f(_, { sx: { alignItems: "center", height: "100%" }, children: [
|
|
776
776
|
/* @__PURE__ */ f(Lt, { sx: { borderRadius: 0, pb: 4, pt: 16, width: "100%" }, children: [
|
|
@@ -778,8 +778,8 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
778
778
|
Ee,
|
|
779
779
|
{
|
|
780
780
|
leftIcon: /* @__PURE__ */ e(Te, { categoryGuid: C }),
|
|
781
|
-
rightContent: U(Math.abs(
|
|
782
|
-
subtitle:
|
|
781
|
+
rightContent: U(Math.abs(a), "0,0.00"),
|
|
782
|
+
subtitle: d,
|
|
783
783
|
title: u
|
|
784
784
|
}
|
|
785
785
|
),
|
|
@@ -795,7 +795,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
795
795
|
bgcolor: "transparent",
|
|
796
796
|
filter: I,
|
|
797
797
|
height: "calc(100vh - 475px)",
|
|
798
|
-
onClick:
|
|
798
|
+
onClick: g
|
|
799
799
|
}
|
|
800
800
|
)
|
|
801
801
|
] }),
|
|
@@ -804,8 +804,8 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
804
804
|
{
|
|
805
805
|
ariaLabelClose: s.close_aria,
|
|
806
806
|
isOpen: !!w,
|
|
807
|
-
onClose: () =>
|
|
808
|
-
title:
|
|
807
|
+
onClose: () => g(""),
|
|
808
|
+
title: i.transaction,
|
|
809
809
|
children: w && /* @__PURE__ */ e(Re, { transaction: w })
|
|
810
810
|
}
|
|
811
811
|
)
|
|
@@ -814,26 +814,26 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
814
814
|
);
|
|
815
815
|
}), Qt = (n, o) => {
|
|
816
816
|
const t = xe(n, o), s = Le(n, o);
|
|
817
|
-
return [t, s].filter((
|
|
817
|
+
return [t, s].filter((i) => i.length > 0);
|
|
818
818
|
}, qt = (n, o) => {
|
|
819
|
-
const [t, s] = n,
|
|
820
|
-
if (
|
|
821
|
-
const
|
|
822
|
-
|
|
819
|
+
const [t, s] = n, i = t, h = s ?? t, d = [];
|
|
820
|
+
if (i) {
|
|
821
|
+
const l = i.reduce((c, g) => c + g.y, 0);
|
|
822
|
+
d.push({ label: o.income_label, amount: l });
|
|
823
823
|
}
|
|
824
824
|
if (h) {
|
|
825
|
-
const
|
|
826
|
-
|
|
825
|
+
const l = h.reduce((c, g) => c + g.y, 0);
|
|
826
|
+
d.push({ label: o.spending_label, amount: l });
|
|
827
827
|
}
|
|
828
|
-
return
|
|
828
|
+
return d;
|
|
829
829
|
}, Jt = ({
|
|
830
830
|
availableHeight: n = 0,
|
|
831
831
|
minHeight: o = 500,
|
|
832
832
|
selectedDateRange: t,
|
|
833
833
|
totals: s
|
|
834
834
|
}) => {
|
|
835
|
-
const
|
|
836
|
-
return
|
|
835
|
+
const i = He(), { onEvent: h } = H(), { trends: d } = R(), { isSmallMobile: l, isMobile: c, isSmallTablet: g, isTablet: C } = K(), u = [i.palette.chart?.chart1, i.palette.chart?.chart2], b = Qt(s, t), a = qt(b, d), [m, T] = r.useState(0), p = 458, E = 195, w = 56, I = c || l ? E : g || C ? p : m;
|
|
836
|
+
return r.useEffect(() => {
|
|
837
837
|
const D = Math.max(n - w, o);
|
|
838
838
|
T(D);
|
|
839
839
|
}, [n]), /* @__PURE__ */ e(
|
|
@@ -844,7 +844,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
844
844
|
curveType: "bump",
|
|
845
845
|
datasets: b,
|
|
846
846
|
height: I,
|
|
847
|
-
labels:
|
|
847
|
+
labels: a,
|
|
848
848
|
onItemClick: () => {
|
|
849
849
|
h(y.TRENDS_CLICK_CHART, A);
|
|
850
850
|
},
|
|
@@ -860,36 +860,38 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
860
860
|
}
|
|
861
861
|
);
|
|
862
862
|
}, en = M(Jt), tn = ({ onBackClick: n, onInsightCardClick: o, sx: t }) => {
|
|
863
|
-
const { onEvent: s } = H(), { config:
|
|
863
|
+
const { onEvent: s } = H(), { config: i } = st(), { isLargeDesktop: h, isDesktop: d, isMobile: l } = K(), { visibleAccounts: c } = ie(), { loadDateRangeCategoryTotals: g, loadMonthlyCategoryTotals: C, monthlyCategoryTotals: u } = F(), { setFilter: b } = re(), { selectedDateRange: a, setSelectedCategoryData: m, 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 = Ue(), L =
|
|
870
|
-
|
|
871
|
-
const v = () =>
|
|
869
|
+
} = P(), { trends: D } = R(), N = Ue(), L = d || h, [x, $] = r.useState(!1), [z, ce] = r.useState("Chart"), [J, ee] = r.useState(""), [te, ne] = r.useState(!1), [oe, le] = r.useState(window.innerHeight), se = oe - 208, de = oe - (N ? 494 : 266), [he, ue] = r.useState(!1);
|
|
870
|
+
r.useEffect(() => {
|
|
871
|
+
const v = () => le(window.innerHeight);
|
|
872
872
|
return window.addEventListener("resize", v), () => window.removeEventListener("resize", v);
|
|
873
|
-
}, []),
|
|
874
|
-
|
|
875
|
-
}, [
|
|
876
|
-
|
|
873
|
+
}, []), r.useEffect(() => {
|
|
874
|
+
console.log("accounts changed: ", c.length), k(c);
|
|
875
|
+
}, [c]), r.useEffect(() => {
|
|
876
|
+
console.log("first load: ", c.length), c || ue(!0);
|
|
877
|
+
}, []), r.useEffect(() => {
|
|
878
|
+
E && g(w, a.start, a.end).then(() => {
|
|
877
879
|
C(
|
|
878
880
|
w,
|
|
879
|
-
|
|
880
|
-
|
|
881
|
+
a.start,
|
|
882
|
+
a.end
|
|
881
883
|
);
|
|
882
884
|
}).finally(() => {
|
|
883
885
|
$(!0), s(y.TRENDS_LOAD_WIDGET, {
|
|
884
886
|
...A,
|
|
885
|
-
time_period: `${Ce(
|
|
887
|
+
time_period: `${Ce(a.end, a.start)}M`
|
|
886
888
|
});
|
|
887
889
|
});
|
|
888
|
-
}, [E, w,
|
|
890
|
+
}, [E, w, a]), r.useEffect(() => {
|
|
889
891
|
if (u.length !== 0) {
|
|
890
892
|
const v = {
|
|
891
893
|
accounts: I,
|
|
892
|
-
dateRange: { start:
|
|
894
|
+
dateRange: { start: a.start, end: a.end }
|
|
893
895
|
};
|
|
894
896
|
b({
|
|
895
897
|
...v,
|
|
@@ -899,10 +901,10 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
899
901
|
});
|
|
900
902
|
}
|
|
901
903
|
}, [u]);
|
|
902
|
-
const
|
|
903
|
-
|
|
904
|
+
const ge = (v) => {
|
|
905
|
+
m(v), ne(!0);
|
|
904
906
|
}, S = () => {
|
|
905
|
-
|
|
907
|
+
m(null), ne(!1);
|
|
906
908
|
}, W = (v, V) => {
|
|
907
909
|
ce(V ?? z), s(y.TRENDS_CLICK_TOGGLE_VIEW, {
|
|
908
910
|
...A,
|
|
@@ -914,7 +916,7 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
914
916
|
...A,
|
|
915
917
|
time_period: Fe + "M"
|
|
916
918
|
});
|
|
917
|
-
},
|
|
919
|
+
}, me = (v) => {
|
|
918
920
|
s(y.TRENDS_CLICK_FILTER, {
|
|
919
921
|
...A,
|
|
920
922
|
filterValue: v
|
|
@@ -923,96 +925,99 @@ const We = ({ selectedTab: n, onTabChange: o }) => /* @__PURE__ */ e(
|
|
|
923
925
|
ee(v);
|
|
924
926
|
}, Be = () => {
|
|
925
927
|
ee(""), s(y.TRENDS_CLICK_ALL_CATEGORIES, A);
|
|
926
|
-
}, ze =
|
|
927
|
-
return
|
|
928
|
+
}, ze = i.show_connections_widget_in_master ? "buttons" : "no-buttons";
|
|
929
|
+
return /* @__PURE__ */ f(
|
|
928
930
|
Ae,
|
|
929
931
|
{
|
|
930
|
-
accountOptions:
|
|
932
|
+
accountOptions: c,
|
|
931
933
|
calendarActions: { onRangeChanged: G },
|
|
932
|
-
dateRange:
|
|
933
|
-
dateRangeVariant:
|
|
934
|
-
onAccountsFilterClick:
|
|
934
|
+
dateRange: a,
|
|
935
|
+
dateRangeVariant: l ? "timeframetabs" : "timeframebuttons",
|
|
936
|
+
onAccountsFilterClick: me,
|
|
935
937
|
onBackClick: n,
|
|
936
938
|
sx: t,
|
|
937
939
|
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
|
-
|
|
940
|
+
children: [
|
|
941
|
+
!p || !x && /* @__PURE__ */ e(Q, {}),
|
|
942
|
+
he ? /* @__PURE__ */ e(
|
|
943
|
+
Mt,
|
|
944
|
+
{
|
|
945
|
+
header: D.zero_state_content_header,
|
|
946
|
+
icon: "",
|
|
947
|
+
onClick: () => {
|
|
948
|
+
},
|
|
949
|
+
primaryButton: D.empty_state_primary,
|
|
950
|
+
subText: D.empty_state_sub_text,
|
|
951
|
+
sx: { height: se },
|
|
952
|
+
variant: ze
|
|
953
|
+
}
|
|
954
|
+
) : /* @__PURE__ */ f(
|
|
955
|
+
_,
|
|
956
|
+
{
|
|
957
|
+
sx: {
|
|
958
|
+
px: l ? 0 : 48
|
|
959
|
+
},
|
|
960
|
+
children: [
|
|
961
|
+
/* @__PURE__ */ f(
|
|
962
|
+
_,
|
|
963
|
+
{
|
|
964
|
+
flexDirection: "row",
|
|
965
|
+
justifyContent: "space-between",
|
|
966
|
+
sx: { pb: l ? 12 : 24, pt: l ? 24 : 48 },
|
|
967
|
+
children: [
|
|
968
|
+
/* @__PURE__ */ e(
|
|
969
|
+
Oe,
|
|
970
|
+
{
|
|
971
|
+
selectedCategoryGuid: J,
|
|
972
|
+
selectedDateRange: a
|
|
973
|
+
}
|
|
974
|
+
),
|
|
975
|
+
/* @__PURE__ */ e(We, { onTabChange: W, selectedTab: z })
|
|
976
|
+
]
|
|
977
|
+
}
|
|
978
|
+
),
|
|
979
|
+
/* @__PURE__ */ e(_, { alignItems: "center", flexDirection: "row", width: "100%", children: /* @__PURE__ */ e(O, { flexGrow: 1, children: J && /* @__PURE__ */ f(pe, { onClick: Be, sx: { p: 0, pr: 5 }, children: [
|
|
980
|
+
/* @__PURE__ */ e(ae, { name: "arrow_back" }),
|
|
981
|
+
D.all_categories
|
|
982
|
+
] }) }) }),
|
|
983
|
+
/* @__PURE__ */ f(_, { flexDirection: L ? "row" : "column", gap: L ? 48 : 16, children: [
|
|
984
|
+
z === "Chart" && /* @__PURE__ */ f(Pe, { children: [
|
|
985
|
+
/* @__PURE__ */ e(O, { sx: { width: L ? "68%" : "100%" }, children: /* @__PURE__ */ e(
|
|
986
|
+
en,
|
|
966
987
|
{
|
|
967
|
-
|
|
968
|
-
|
|
988
|
+
availableHeight: se,
|
|
989
|
+
minHeight: 450,
|
|
990
|
+
selectedDateRange: a,
|
|
991
|
+
totals: u
|
|
969
992
|
}
|
|
970
|
-
),
|
|
971
|
-
/* @__PURE__ */
|
|
972
|
-
|
|
973
|
-
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
993
|
+
) }),
|
|
994
|
+
/* @__PURE__ */ f(_, { gap: 16, sx: { width: L ? "32%" : "100%" }, children: [
|
|
995
|
+
N && /* @__PURE__ */ e(Ut, { onInsightCardClick: o }),
|
|
996
|
+
/* @__PURE__ */ e(
|
|
997
|
+
$t,
|
|
998
|
+
{
|
|
999
|
+
availableHeight: de,
|
|
1000
|
+
onCategoryClick: ge
|
|
1001
|
+
}
|
|
1002
|
+
)
|
|
1003
|
+
] })
|
|
1004
|
+
] }),
|
|
1005
|
+
z === "Table" && /* @__PURE__ */ e(O, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
|
|
1006
|
+
Ve,
|
|
983
1007
|
{
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
1008
|
+
height: "unset",
|
|
1009
|
+
monthlyCategoryTotals: u,
|
|
1010
|
+
onClickRow: Ge,
|
|
1011
|
+
selectedCategory: J,
|
|
1012
|
+
selectedDateRange: a
|
|
988
1013
|
}
|
|
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
|
-
] })
|
|
1014
|
+
) })
|
|
1000
1015
|
] }),
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
1004
|
-
|
|
1005
|
-
|
|
1006
|
-
onClickRow: Ge,
|
|
1007
|
-
selectedCategory: J,
|
|
1008
|
-
selectedDateRange: r
|
|
1009
|
-
}
|
|
1010
|
-
) })
|
|
1011
|
-
] }),
|
|
1012
|
-
te && /* @__PURE__ */ e(Zt, { onClose: S })
|
|
1013
|
-
]
|
|
1014
|
-
}
|
|
1015
|
-
)
|
|
1016
|
+
te && /* @__PURE__ */ e(Zt, { onClose: S })
|
|
1017
|
+
]
|
|
1018
|
+
}
|
|
1019
|
+
)
|
|
1020
|
+
]
|
|
1016
1021
|
}
|
|
1017
1022
|
);
|
|
1018
1023
|
}, qn = M(tn);
|