@mx-cartographer/experiences 9.4.1-alpha.al0 → 9.4.2
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.
- package/CHANGELOG.md +8 -2
- package/dist/budgets/BubbleBudgetsWidget.es.js +29 -29
- package/dist/budgets/BubbleBudgetsWidget.es.js.map +1 -1
- package/dist/budgets/components/AddBudgets.es.js +16 -13
- package/dist/budgets/components/AddBudgets.es.js.map +1 -1
- package/dist/budgets/components/BudgetDetailsDrawer.es.js +95 -95
- package/dist/budgets/components/BudgetDetailsDrawer.es.js.map +1 -1
- package/dist/budgets/components/BudgetDetailsDrawerV2.es.js +16 -13
- package/dist/budgets/components/BudgetDetailsDrawerV2.es.js.map +1 -1
- package/dist/budgets/components/addbudget/RecalculateBudgets.es.js +14 -11
- package/dist/budgets/components/addbudget/RecalculateBudgets.es.js.map +1 -1
- package/dist/budgets/components/budgetdetails/AddSubBudget.es.js +63 -61
- package/dist/budgets/components/budgetdetails/AddSubBudget.es.js.map +1 -1
- package/dist/budgets/components/budgetdetails/BudgetDetails.es.js +8 -5
- package/dist/budgets/components/budgetdetails/BudgetDetails.es.js.map +1 -1
- package/dist/budgets/components/budgetdetails/SubBudgetAmounts.d.ts +3 -4
- package/dist/budgets/components/budgetdetails/SubBudgetAmounts.es.js +42 -31
- package/dist/budgets/components/budgetdetails/SubBudgetAmounts.es.js.map +1 -1
- package/dist/budgets/components/budgetdetails/SubBudgetList.es.js +71 -59
- package/dist/budgets/components/budgetdetails/SubBudgetList.es.js.map +1 -1
- package/dist/budgets/components/shared/SubBudgetCategory.d.ts +2 -2
- package/dist/budgets/components/shared/SubBudgetCategory.es.js.map +1 -1
- package/dist/core/stores/BudgetsStore.d.ts +13 -6
- package/dist/core/stores/BudgetsStore.es.js +36 -42
- package/dist/core/stores/BudgetsStore.es.js.map +1 -1
- package/dist/core/types/RepeatingTransaction.d.ts +2 -2
- package/dist/core/types/RepeatingTransaction.es.js.map +1 -1
- package/dist/core/utils/BudgetUtil.d.ts +1 -0
- package/dist/core/utils/BudgetUtil.es.js +55 -57
- package/dist/core/utils/BudgetUtil.es.js.map +1 -1
- package/dist/recurringtransactions/components/RecurrenceRow.es.js +1 -1
- package/dist/recurringtransactions/components/RecurrenceRow.es.js.map +1 -1
- package/dist/recurringtransactions/components/RecurringTransactionDetails.es.js +1 -1
- package/dist/recurringtransactions/components/RecurringTransactionDetails.es.js.map +1 -1
- package/dist/recurringtransactions/components/RecurringTransactionList.es.js +1 -1
- package/dist/recurringtransactions/components/RecurringTransactionList.es.js.map +1 -1
- package/dist/recurringtransactions/components/shared/recurringsettings/RecurringRow.es.js +1 -1
- package/dist/recurringtransactions/components/shared/recurringsettings/RecurringRow.es.js.map +1 -1
- package/dist/recurringtransactions/components/shared/recurringsettings/SelectTransaction.es.js +14 -15
- package/dist/recurringtransactions/components/shared/recurringsettings/SelectTransaction.es.js.map +1 -1
- package/dist/transactions/components/shared/transactiondetails/actions/AddMerchantBudgetAction.es.js +85 -82
- package/dist/transactions/components/shared/transactiondetails/actions/AddMerchantBudgetAction.es.js.map +1 -1
- package/package.json +1 -1
|
@@ -20,9 +20,9 @@ var c = {
|
|
|
20
20
|
END_DELETE: "End - Delete",
|
|
21
21
|
START_DELETE: "Start - Delete"
|
|
22
22
|
}, re = ({ onClose: A, onEvent: s, onViewHistory: L, transactionListProps: x }) => {
|
|
23
|
-
const { alert:
|
|
23
|
+
const { alert: d, dateRange: f, deleteBudget: B, selectedBudget: e, selectedSubBudget: v, setAlert: m, setSelectedBudget: N, updateBudget: w } = z(), { budgets: o, common: p } = M(), { isCopyLoaded: G, selectedAccountGuids: R } = k(), E = ee(), { setFilter: V } = H(), [a, u] = i.useState(""), [t, n] = i.useState(null), [P, C] = i.useState(!1), g = i.useRef(!1);
|
|
24
24
|
if (i.useEffect(() => {
|
|
25
|
-
!e ||
|
|
25
|
+
!e || v || (u(`${e.amount}`), V({
|
|
26
26
|
accounts: R,
|
|
27
27
|
dateRange: f,
|
|
28
28
|
custom: ({ category_guid: l, top_level_category_guid: y }) => {
|
|
@@ -33,18 +33,21 @@ var c = {
|
|
|
33
33
|
}, [e]), !G) return /* @__PURE__ */ r(q, {});
|
|
34
34
|
if (!e) return null;
|
|
35
35
|
const b = () => {
|
|
36
|
-
|
|
37
|
-
|
|
36
|
+
u(""), n(null), C(!1), setTimeout(() => {
|
|
37
|
+
N(void 0), A?.();
|
|
38
38
|
}, 250);
|
|
39
39
|
}, S = () => {
|
|
40
|
-
t === "delete" && s?.(c.CANCEL_DELETE, a),
|
|
40
|
+
t === "delete" && s?.(c.CANCEL_DELETE, a), u(e.amount ? `${e.amount}` : ""), n(null);
|
|
41
41
|
}, F = async () => {
|
|
42
42
|
if (t === "edit") {
|
|
43
43
|
if (g.current) return;
|
|
44
44
|
g.current = !0, await w({
|
|
45
45
|
...e,
|
|
46
46
|
amount: Number(a)
|
|
47
|
-
}), s?.(c.END_SAVE, a), m(
|
|
47
|
+
}), s?.(c.END_SAVE, a), m({
|
|
48
|
+
msg: _(o.alert_budget_updated, e.category.name),
|
|
49
|
+
severity: "success"
|
|
50
|
+
}), n(null), g.current = !1;
|
|
48
51
|
}
|
|
49
52
|
t === "delete" && (await B(e.guid), s?.(c.END_DELETE, a), b());
|
|
50
53
|
}, { remainingAmount: O, spentPercentage: $, iconColor: I } = W(e.transaction_total ?? 0, e.amount ?? 0), j = (l, y) => _(l, /* @__PURE__ */ r("b", { children: y }));
|
|
@@ -85,27 +88,27 @@ var c = {
|
|
|
85
88
|
totalTransaction: e.transaction_total
|
|
86
89
|
}),
|
|
87
90
|
/* @__PURE__ */ r(K, { ...x }),
|
|
88
|
-
|
|
91
|
+
d && /* @__PURE__ */ r(oe, {
|
|
89
92
|
anchorOrigin: {
|
|
90
93
|
horizontal: "right",
|
|
91
94
|
vertical: "bottom"
|
|
92
95
|
},
|
|
93
96
|
autoHideDuration: 3500,
|
|
94
|
-
onClose: () => m(
|
|
95
|
-
open: !!
|
|
97
|
+
onClose: () => m(null),
|
|
98
|
+
open: !!d,
|
|
96
99
|
children: /* @__PURE__ */ r(te, {
|
|
97
100
|
closeText: "",
|
|
98
|
-
onClose: () => m(
|
|
99
|
-
severity: "success",
|
|
101
|
+
onClose: () => m(null),
|
|
102
|
+
severity: d?.severity ?? "success",
|
|
100
103
|
variant: "filled",
|
|
101
|
-
children:
|
|
104
|
+
children: d?.msg
|
|
102
105
|
})
|
|
103
106
|
})
|
|
104
107
|
]
|
|
105
108
|
}), t && /* @__PURE__ */ r(J, {
|
|
106
109
|
closeAriaLabel: p.close_aria,
|
|
107
110
|
content: j(o[t === "edit" ? "edit_budget_content" : "delete_description"], e.category.name),
|
|
108
|
-
handleInputChange: (l) =>
|
|
111
|
+
handleInputChange: (l) => u(l.toString()),
|
|
109
112
|
handleModalClose: S,
|
|
110
113
|
handlePrimaryAction: F,
|
|
111
114
|
handleSecondaryAction: S,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BudgetDetailsDrawerV2.es.js","names":[],"sources":["../../../src/budgets/components/BudgetDetailsDrawerV2.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Alert from '@mui/material/Alert'\n\nimport Snackbar from '@mui/material/Snackbar'\nimport { alpha, useTheme } from '@mui/material/styles'\n\nimport { CategoryIcon } from '@mxenabled/mxui'\n\nimport { getCategoryColor } from '../../core/utils/CategoryUtil'\nimport {\n useBudgetsStore,\n useGlobalCopyStore,\n useGlobalUiStore,\n useTransactionStore,\n} from '../../common'\nimport { type Budget, type Transaction } from '../../core'\nimport { CurrencyDialog, Drawer, Loader } from '../../common/components'\nimport { TransactionList } from '../../transactions'\nimport { type TransactionListProps } from '../../transactions/components/shared/TransactionList'\n\nimport { getRemainingAmountSpentPercentage } from '../../core/utils/BudgetUtil'\n\nimport { BudgetDetailsTopSection } from './shared/BudgetDetailsTopSection'\nimport { buildDynamicCopy } from '../../core/utils/Localization'\n\nenum Action {\n DELETE = 'delete',\n EDIT = 'edit',\n}\n\ninterface BudgetDetailsDrawerV2Props {\n onClose?: () => void\n onEvent?: (event: string, amount: string) => void\n onViewHistory?: () => void\n transactionListProps?: TransactionListProps\n}\n\nconst EVENT_MESSAGES = {\n CANCEL_DELETE: 'Cancel - Delete',\n END_SAVE: 'End - Save',\n END_DELETE: 'End - Delete',\n START_DELETE: 'Start - Delete',\n}\n\n// V2 implementation of Budget Details Drawer.\n// This will replace BudgetDetailsDrawer\n// after the PFM design is finalized\n// and aligned with Insights.\n\nconst BudgetDetailsDrawerV2 = ({\n onClose,\n onEvent,\n onViewHistory,\n transactionListProps,\n}: BudgetDetailsDrawerV2Props) => {\n const {\n alert,\n dateRange,\n deleteBudget,\n selectedBudget,\n selectedSubBudget,\n setAlert,\n setSelectedBudget,\n updateBudget,\n } = useBudgetsStore()\n const { budgets: budgetsCopy, common: commonCopy } = useGlobalCopyStore()\n const { isCopyLoaded, selectedAccountGuids } = useGlobalUiStore()\n const theme = useTheme()\n const { setFilter } = useTransactionStore()\n\n const [amount, setAmount] = React.useState('')\n const [formAction, setFormAction] = React.useState<Action | null>(null)\n const [isOpen, setIsOpen] = React.useState(false)\n\n const inProgress = React.useRef(false)\n\n React.useEffect(() => {\n if (!selectedBudget || selectedSubBudget) return\n\n setAmount(`${selectedBudget.amount}`)\n setFilter({\n accounts: selectedAccountGuids,\n dateRange,\n custom: ({ category_guid, top_level_category_guid }: Transaction) => {\n const { category_guid: budgetCategoryGuid } = selectedBudget\n return (\n category_guid === budgetCategoryGuid || top_level_category_guid === budgetCategoryGuid\n )\n },\n })\n setIsOpen(true)\n }, [selectedBudget])\n\n if (!isCopyLoaded) return <Loader />\n if (!selectedBudget) return null\n\n const handleClose = () => {\n setAmount('')\n setFormAction(null)\n setIsOpen(false)\n\n setTimeout(() => {\n setSelectedBudget(undefined)\n onClose?.()\n }, 250)\n }\n\n const handleFormDialogClose = () => {\n if (formAction === Action.DELETE) onEvent?.(EVENT_MESSAGES.CANCEL_DELETE, amount)\n\n setAmount(selectedBudget.amount ? `${selectedBudget.amount}` : '')\n setFormAction(null)\n }\n\n const handlePrimaryAction = async () => {\n if (formAction === Action.EDIT) {\n if (inProgress.current) return\n inProgress.current = true\n\n await updateBudget({\n ...selectedBudget,\n amount: Number(amount),\n } as Budget)\n onEvent?.(EVENT_MESSAGES.END_SAVE, amount)\n\n setAlert(\n buildDynamicCopy(budgetsCopy.alert_budget_updated, selectedBudget.category.name) as string,\n )\n setFormAction(null)\n\n inProgress.current = false\n }\n\n if (formAction === Action.DELETE) {\n await deleteBudget(selectedBudget.guid)\n onEvent?.(EVENT_MESSAGES.END_DELETE, amount)\n\n handleClose()\n }\n }\n\n const { remainingAmount, spentPercentage, iconColor } = getRemainingAmountSpentPercentage(\n selectedBudget.transaction_total ?? 0,\n selectedBudget.amount ?? 0,\n )\n\n const buildCopyWithBold = (copyKey: string, content: React.ReactNode): string => {\n return buildDynamicCopy(copyKey, <b>{content}</b>) as string\n }\n\n return (\n <React.Fragment>\n <Drawer\n ariaLabelClose={commonCopy.close_aria}\n footerStyles={{\n px: 24,\n py: 16,\n }}\n isOpen={isOpen}\n onClose={handleClose}\n onPrimaryAction={() => setFormAction(Action.EDIT)}\n onSecondaryAction={() => {\n onEvent?.(EVENT_MESSAGES.START_DELETE, amount)\n setFormAction(Action.DELETE)\n }}\n primaryText={budgetsCopy.details_edit_button}\n secondaryColor=\"error\"\n secondaryText={budgetsCopy.details_delete_button}\n sx={{\n '& .list-wrapper': {\n pr: 24,\n },\n }}\n title={\n buildDynamicCopy(budgetsCopy.details_type_title, selectedBudget.category.name) as string\n }\n >\n <BudgetDetailsTopSection\n amount={selectedBudget.amount}\n icon={\n <CategoryIcon\n categoryGuid={selectedBudget.category.guid}\n size={44}\n sx={{\n bgcolor: alpha(getCategoryColor(selectedBudget.category.guid, theme), 0.15),\n border: `1px solid ${getCategoryColor(selectedBudget.category.guid, theme)}`,\n color: 'text.primary',\n }}\n />\n }\n iconColor={iconColor}\n onViewHistory={onViewHistory}\n remainingAmount={remainingAmount}\n spentPercentage={spentPercentage}\n startDate={(dateRange.start.getTime() ?? 0) / 1000}\n totalTransaction={selectedBudget.transaction_total}\n />\n <TransactionList {...transactionListProps} />\n {alert && (\n <Snackbar\n anchorOrigin={{ horizontal: 'right', vertical: 'bottom' }}\n autoHideDuration={3500}\n onClose={() => setAlert('')}\n open={Boolean(alert)}\n >\n <Alert closeText=\"\" onClose={() => setAlert('')} severity=\"success\" variant=\"filled\">\n {alert}\n </Alert>\n </Snackbar>\n )}\n </Drawer>\n {formAction && (\n <CurrencyDialog\n closeAriaLabel={commonCopy.close_aria}\n content={buildCopyWithBold(\n budgetsCopy[formAction === Action.EDIT ? 'edit_budget_content' : 'delete_description'],\n selectedBudget.category.name,\n )}\n handleInputChange={(value) => setAmount(value.toString())}\n handleModalClose={handleFormDialogClose}\n handlePrimaryAction={handlePrimaryAction}\n handleSecondaryAction={handleFormDialogClose}\n inputLabel={formAction === Action.EDIT ? budgetsCopy.details_edit_title : ''}\n inputValue={amount}\n isOpen={true}\n primaryColor={formAction === Action.EDIT ? 'primary' : 'error'}\n primaryText={\n budgetsCopy[formAction === Action.EDIT ? 'add_save_button' : 'details_delete_button']\n }\n secondaryColor={formAction === Action.EDIT ? 'primary' : 'inherit'}\n secondaryText={commonCopy.cancel_button}\n title={budgetsCopy[formAction === Action.EDIT ? 'details_edit_title' : 'delete_title']}\n />\n )}\n </React.Fragment>\n )\n}\n\nexport default observer(BudgetDetailsDrawerV2)\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BudgetDetailsDrawerV2.es.js","names":[],"sources":["../../../src/budgets/components/BudgetDetailsDrawerV2.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Alert from '@mui/material/Alert'\n\nimport Snackbar from '@mui/material/Snackbar'\nimport { alpha, useTheme } from '@mui/material/styles'\n\nimport { CategoryIcon } from '@mxenabled/mxui'\n\nimport { getCategoryColor } from '../../core/utils/CategoryUtil'\nimport {\n useBudgetsStore,\n useGlobalCopyStore,\n useGlobalUiStore,\n useTransactionStore,\n} from '../../common'\nimport { type Budget, type Transaction } from '../../core'\nimport { CurrencyDialog, Drawer, Loader } from '../../common/components'\nimport { TransactionList } from '../../transactions'\nimport { type TransactionListProps } from '../../transactions/components/shared/TransactionList'\n\nimport { getRemainingAmountSpentPercentage } from '../../core/utils/BudgetUtil'\n\nimport { BudgetDetailsTopSection } from './shared/BudgetDetailsTopSection'\nimport { buildDynamicCopy } from '../../core/utils/Localization'\n\nenum Action {\n DELETE = 'delete',\n EDIT = 'edit',\n}\n\ninterface BudgetDetailsDrawerV2Props {\n onClose?: () => void\n onEvent?: (event: string, amount: string) => void\n onViewHistory?: () => void\n transactionListProps?: TransactionListProps\n}\n\nconst EVENT_MESSAGES = {\n CANCEL_DELETE: 'Cancel - Delete',\n END_SAVE: 'End - Save',\n END_DELETE: 'End - Delete',\n START_DELETE: 'Start - Delete',\n}\n\n// V2 implementation of Budget Details Drawer.\n// This will replace BudgetDetailsDrawer\n// after the PFM design is finalized\n// and aligned with Insights.\n\nconst BudgetDetailsDrawerV2 = ({\n onClose,\n onEvent,\n onViewHistory,\n transactionListProps,\n}: BudgetDetailsDrawerV2Props) => {\n const {\n alert,\n dateRange,\n deleteBudget,\n selectedBudget,\n selectedSubBudget,\n setAlert,\n setSelectedBudget,\n updateBudget,\n } = useBudgetsStore()\n const { budgets: budgetsCopy, common: commonCopy } = useGlobalCopyStore()\n const { isCopyLoaded, selectedAccountGuids } = useGlobalUiStore()\n const theme = useTheme()\n const { setFilter } = useTransactionStore()\n\n const [amount, setAmount] = React.useState('')\n const [formAction, setFormAction] = React.useState<Action | null>(null)\n const [isOpen, setIsOpen] = React.useState(false)\n\n const inProgress = React.useRef(false)\n\n React.useEffect(() => {\n if (!selectedBudget || selectedSubBudget) return\n\n setAmount(`${selectedBudget.amount}`)\n setFilter({\n accounts: selectedAccountGuids,\n dateRange,\n custom: ({ category_guid, top_level_category_guid }: Transaction) => {\n const { category_guid: budgetCategoryGuid } = selectedBudget\n return (\n category_guid === budgetCategoryGuid || top_level_category_guid === budgetCategoryGuid\n )\n },\n })\n setIsOpen(true)\n }, [selectedBudget])\n\n if (!isCopyLoaded) return <Loader />\n if (!selectedBudget) return null\n\n const handleClose = () => {\n setAmount('')\n setFormAction(null)\n setIsOpen(false)\n\n setTimeout(() => {\n setSelectedBudget(undefined)\n onClose?.()\n }, 250)\n }\n\n const handleFormDialogClose = () => {\n if (formAction === Action.DELETE) onEvent?.(EVENT_MESSAGES.CANCEL_DELETE, amount)\n\n setAmount(selectedBudget.amount ? `${selectedBudget.amount}` : '')\n setFormAction(null)\n }\n\n const handlePrimaryAction = async () => {\n if (formAction === Action.EDIT) {\n if (inProgress.current) return\n inProgress.current = true\n\n await updateBudget({\n ...selectedBudget,\n amount: Number(amount),\n } as Budget)\n onEvent?.(EVENT_MESSAGES.END_SAVE, amount)\n\n setAlert({\n msg: buildDynamicCopy(\n budgetsCopy.alert_budget_updated,\n selectedBudget.category.name,\n ) as string,\n severity: 'success',\n })\n setFormAction(null)\n\n inProgress.current = false\n }\n\n if (formAction === Action.DELETE) {\n await deleteBudget(selectedBudget.guid)\n onEvent?.(EVENT_MESSAGES.END_DELETE, amount)\n\n handleClose()\n }\n }\n\n const { remainingAmount, spentPercentage, iconColor } = getRemainingAmountSpentPercentage(\n selectedBudget.transaction_total ?? 0,\n selectedBudget.amount ?? 0,\n )\n\n const buildCopyWithBold = (copyKey: string, content: React.ReactNode): string => {\n return buildDynamicCopy(copyKey, <b>{content}</b>) as string\n }\n\n return (\n <React.Fragment>\n <Drawer\n ariaLabelClose={commonCopy.close_aria}\n footerStyles={{\n px: 24,\n py: 16,\n }}\n isOpen={isOpen}\n onClose={handleClose}\n onPrimaryAction={() => setFormAction(Action.EDIT)}\n onSecondaryAction={() => {\n onEvent?.(EVENT_MESSAGES.START_DELETE, amount)\n setFormAction(Action.DELETE)\n }}\n primaryText={budgetsCopy.details_edit_button}\n secondaryColor=\"error\"\n secondaryText={budgetsCopy.details_delete_button}\n sx={{\n '& .list-wrapper': {\n pr: 24,\n },\n }}\n title={\n buildDynamicCopy(budgetsCopy.details_type_title, selectedBudget.category.name) as string\n }\n >\n <BudgetDetailsTopSection\n amount={selectedBudget.amount}\n icon={\n <CategoryIcon\n categoryGuid={selectedBudget.category.guid}\n size={44}\n sx={{\n bgcolor: alpha(getCategoryColor(selectedBudget.category.guid, theme), 0.15),\n border: `1px solid ${getCategoryColor(selectedBudget.category.guid, theme)}`,\n color: 'text.primary',\n }}\n />\n }\n iconColor={iconColor}\n onViewHistory={onViewHistory}\n remainingAmount={remainingAmount}\n spentPercentage={spentPercentage}\n startDate={(dateRange.start.getTime() ?? 0) / 1000}\n totalTransaction={selectedBudget.transaction_total}\n />\n <TransactionList {...transactionListProps} />\n {alert && (\n <Snackbar\n anchorOrigin={{ horizontal: 'right', vertical: 'bottom' }}\n autoHideDuration={3500}\n onClose={() => setAlert(null)}\n open={Boolean(alert)}\n >\n <Alert\n closeText=\"\"\n onClose={() => setAlert(null)}\n severity={alert?.severity ?? 'success'}\n variant=\"filled\"\n >\n {alert?.msg}\n </Alert>\n </Snackbar>\n )}\n </Drawer>\n {formAction && (\n <CurrencyDialog\n closeAriaLabel={commonCopy.close_aria}\n content={buildCopyWithBold(\n budgetsCopy[formAction === Action.EDIT ? 'edit_budget_content' : 'delete_description'],\n selectedBudget.category.name,\n )}\n handleInputChange={(value) => setAmount(value.toString())}\n handleModalClose={handleFormDialogClose}\n handlePrimaryAction={handlePrimaryAction}\n handleSecondaryAction={handleFormDialogClose}\n inputLabel={formAction === Action.EDIT ? budgetsCopy.details_edit_title : ''}\n inputValue={amount}\n isOpen={true}\n primaryColor={formAction === Action.EDIT ? 'primary' : 'error'}\n primaryText={\n budgetsCopy[formAction === Action.EDIT ? 'add_save_button' : 'details_delete_button']\n }\n secondaryColor={formAction === Action.EDIT ? 'primary' : 'inherit'}\n secondaryText={commonCopy.cancel_button}\n title={budgetsCopy[formAction === Action.EDIT ? 'details_edit_title' : 'delete_title']}\n />\n )}\n </React.Fragment>\n )\n}\n\nexport default observer(BudgetDetailsDrawerV2)\n"],"mappings":";;;;;;;;;;;;;;;;AAuCA,IAAM,IAAiB;AAAA,EACrB,eAAe;AAAA,EACf,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,cAAc;AAChB,GAOM,KAAA,CAAyB,EAC7B,SAAA,GACA,SAAA,GACA,eAAA,GACA,sBAAA,EAAA,MACgC;AAChC,QAAM,EACJ,OAAA,GACA,WAAA,GACA,cAAA,GACA,gBAAA,GACA,mBAAA,GACA,UAAA,GACA,mBAAA,GACA,cAAA,EAAA,IACE,EAAgB,GACd,EAAE,SAAS,GAAa,QAAQ,EAAA,IAAe,EAAmB,GAClE,EAAE,cAAA,GAAc,sBAAA,EAAA,IAAyB,EAAiB,GAC1D,IAAQ,GAAS,GACjB,EAAE,WAAA,EAAA,IAAc,EAAoB,GAEpC,CAAC,GAAQ,CAAA,IAAa,EAAM,SAAS,EAAE,GACvC,CAAC,GAAY,CAAA,IAAiB,EAAM,SAAwB,IAAI,GAChE,CAAC,GAAQ,CAAA,IAAa,EAAM,SAAS,EAAK,GAE1C,IAAa,EAAM,OAAO,EAAK;AAmBrC,MAjBA,EAAM,UAAA,MAAgB;AACpB,IAAI,CAAC,KAAkB,MAEvB,EAAU,GAAG,EAAe,MAAA,EAAQ,GACpC,EAAU;AAAA,MACR,UAAU;AAAA,MACV,WAAA;AAAA,MACA,QAAA,CAAS,EAAE,eAAA,GAAe,yBAAA,EAAA,MAA2C;AACnE,cAAM,EAAE,eAAe,EAAA,IAAuB;AAC9C,eACE,MAAkB,KAAsB,MAA4B;AAAA,MAExE;AAAA,IACF,CAAC,GACD,EAAU,EAAI;AAAA,EAChB,GAAG,CAAC,CAAc,CAAC,GAEf,CAAC,EAAc,QAAO,gBAAA,EAAC,GAAD,CAAS,CAAA;AACnC,MAAI,CAAC,EAAgB,QAAO;AAE5B,QAAM,IAAA,MAAoB;AACxB,IAAA,EAAU,EAAE,GACZ,EAAc,IAAI,GAClB,EAAU,EAAK,GAEf,WAAA,MAAiB;AACf,MAAA,EAAkB,MAAS,GAC3B,IAAU;AAAA,IACZ,GAAG,GAAG;AAAA,EACR,GAEM,IAAA,MAA8B;AAClC,IAAI,MAAA,YAA8B,IAAU,EAAe,eAAe,CAAM,GAEhF,EAAU,EAAe,SAAS,GAAG,EAAe,MAAA,KAAW,EAAE,GACjE,EAAc,IAAI;AAAA,EACpB,GAEM,IAAsB,YAAY;AACtC,QAAI,MAAA,QAA4B;AAC9B,UAAI,EAAW,QAAS;AACxB,MAAA,EAAW,UAAU,IAErB,MAAM,EAAa;AAAA,QACjB,GAAG;AAAA,QACH,QAAQ,OAAO,CAAM;AAAA,MACvB,CAAW,GACX,IAAU,EAAe,UAAU,CAAM,GAEzC,EAAS;AAAA,QACP,KAAK,EACH,EAAY,sBACZ,EAAe,SAAS,IAC1B;AAAA,QACA,UAAU;AAAA,MACZ,CAAC,GACD,EAAc,IAAI,GAElB,EAAW,UAAU;AAAA,IACvB;AAEA,IAAI,MAAA,aACF,MAAM,EAAa,EAAe,IAAI,GACtC,IAAU,EAAe,YAAY,CAAM,GAE3C,EAAY;AAAA,EAEhB,GAEM,EAAE,iBAAA,GAAiB,iBAAA,GAAiB,WAAA,EAAA,IAAc,EACtD,EAAe,qBAAqB,GACpC,EAAe,UAAU,CAC3B,GAEM,IAAA,CAAqB,GAAiB,MACnC,EAAiB,GAAS,gBAAA,EAAC,KAAD,EAAA,UAAI,EAAW,CAAA,CAAC;AAGnD,SACE,gBAAA,EAAC,EAAM,UAAP,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,IACE,gBAAgB,EAAW;AAAA,IAC3B,cAAc;AAAA,MACZ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,IACQ,QAAA;AAAA,IACR,SAAS;AAAA,IACT,iBAAA,MAAuB,EAAA,MAAyB;AAAA,IAChD,mBAAA,MAAyB;AACvB,MAAA,IAAU,EAAe,cAAc,CAAM,GAC7C,EAAA,QAA2B;AAAA,IAC7B;AAAA,IACA,aAAa,EAAY;AAAA,IACzB,gBAAe;AAAA,IACf,eAAe,EAAY;AAAA,IAC3B,IAAI,EACF,mBAAmB,EACjB,IAAI,GACN,EACF;AAAA,IACA,OACE,EAAiB,EAAY,oBAAoB,EAAe,SAAS,IAAI;AAAA,IAtBjF,UAAA;AAAA,MAyBE,gBAAA,EAAC,GAAD;AAAA,QACE,QAAQ,EAAe;AAAA,QACvB,MACE,gBAAA,EAAC,GAAD;AAAA,UACE,cAAc,EAAe,SAAS;AAAA,UACtC,MAAM;AAAA,UACN,IAAI;AAAA,YACF,SAAS,EAAM,EAAiB,EAAe,SAAS,MAAM,CAAK,GAAG,IAAI;AAAA,YAC1E,QAAQ,aAAa,EAAiB,EAAe,SAAS,MAAM,CAAK,CAAA;AAAA,YACzE,OAAO;AAAA,UACT;AAAA,QACD,CAAA;AAAA,QAEQ,WAAA;AAAA,QACI,eAAA;AAAA,QACE,iBAAA;AAAA,QACA,iBAAA;AAAA,QACjB,YAAY,EAAU,MAAM,QAAQ,KAAK,KAAK;AAAA,QAC9C,kBAAkB,EAAe;AAAA,MAClC,CAAA;AAAA,MACD,gBAAA,EAAC,GAAD,EAAiB,GAAI,EAAuB,CAAA;AAAA,MAC3C,KACC,gBAAA,EAAC,IAAD;AAAA,QACE,cAAc;AAAA,UAAE,YAAY;AAAA,UAAS,UAAU;AAAA,QAAS;AAAA,QACxD,kBAAkB;AAAA,QAClB,SAAA,MAAe,EAAS,IAAI;AAAA,QAC5B,MAAM,EAAQ;AAAA,QAEd,UAAA,gBAAA,EAAC,IAAD;AAAA,UACE,WAAU;AAAA,UACV,SAAA,MAAe,EAAS,IAAI;AAAA,UAC5B,UAAU,GAAO,YAAY;AAAA,UAC7B,SAAQ;AAAA,UAEP,UAAA,GAAO;AAAA,QACH,CAAA;AAAA,MACC,CAAA;AAAA,IAEN;AAAA,EACP,CAAA,GAAA,KACC,gBAAA,EAAC,GAAD;AAAA,IACE,gBAAgB,EAAW;AAAA,IAC3B,SAAS,EACP,EAAY,MAAA,SAA6B,wBAAwB,oBAAA,GACjE,EAAe,SAAS,IAC1B;AAAA,IACA,mBAAA,CAAoB,MAAU,EAAU,EAAM,SAAS,CAAC;AAAA,IACxD,kBAAkB;AAAA,IACG,qBAAA;AAAA,IACrB,uBAAuB;AAAA,IACvB,YAAY,MAAA,SAA6B,EAAY,qBAAqB;AAAA,IAC1E,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,cAAc,MAAA,SAA6B,YAAY;AAAA,IACvD,aACE,EAAY,MAAA,SAA6B,oBAAoB,uBAAA;AAAA,IAE/D,gBAAgB,MAAA,SAA6B,YAAY;AAAA,IACzD,eAAe,EAAW;AAAA,IAC1B,OAAO,EAAY,MAAA,SAA6B,uBAAuB,cAAA;AAAA,EACxE,CAAA,CAEW,EAAA,CAAA;AAEpB,GAEA,KAAe,EAAS,EAAqB"}
|
|
@@ -1,16 +1,19 @@
|
|
|
1
1
|
import { useBudgetsStore as b, useCategoryStore as h, useGlobalCopyStore as x } from "../../../common/context/hooks.es.js";
|
|
2
|
-
import
|
|
3
|
-
import { RecalculateBudgetRow as
|
|
2
|
+
import y from "../../../common/components/drawer/Drawer.es.js";
|
|
3
|
+
import { RecalculateBudgetRow as _ } from "./RecalculateBudgetRow.es.js";
|
|
4
4
|
import i from "react";
|
|
5
|
-
import
|
|
5
|
+
import s from "@mui/material/Stack";
|
|
6
6
|
import { Text as a } from "@mxenabled/mxui";
|
|
7
7
|
import C from "@mui/material/Button";
|
|
8
8
|
import { jsx as e, jsxs as l } from "react/jsx-runtime";
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
var F = ({ onRecalculateBudgets:
|
|
9
|
+
import v from "@mui/material/Box";
|
|
10
|
+
import B from "@mui/material/List";
|
|
11
|
+
var F = ({ onRecalculateBudgets: n }) => {
|
|
12
12
|
const { budgets: t, common: m } = x(), { spendCategories: u } = h(), { recalculateBudgets: d, setAlert: p } = b(), [g, o] = i.useState(!1), c = u.filter((r) => r.totalAverageAmount > 0), f = async () => {
|
|
13
|
-
await d(c), o(!1), p(
|
|
13
|
+
await d(c), o(!1), p({
|
|
14
|
+
msg: t.alert_recalculated_budgets,
|
|
15
|
+
severity: "success"
|
|
16
|
+
}), n?.();
|
|
14
17
|
};
|
|
15
18
|
return /* @__PURE__ */ l(i.Fragment, { children: [
|
|
16
19
|
/* @__PURE__ */ e(C, {
|
|
@@ -31,13 +34,13 @@ var F = ({ onRecalculateBudgets: s }) => {
|
|
|
31
34
|
variant: "subtitle1",
|
|
32
35
|
children: t.recalculate_help
|
|
33
36
|
}),
|
|
34
|
-
/* @__PURE__ */ e(
|
|
37
|
+
/* @__PURE__ */ e(y, {
|
|
35
38
|
ariaLabelClose: m.close_aria,
|
|
36
39
|
isOpen: g,
|
|
37
40
|
onClose: () => o(!1),
|
|
38
41
|
onPrimaryAction: f,
|
|
39
42
|
title: t.recalculate_title,
|
|
40
|
-
children: /* @__PURE__ */ l(
|
|
43
|
+
children: /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ l(s, {
|
|
41
44
|
mx: 24,
|
|
42
45
|
my: 16,
|
|
43
46
|
children: [/* @__PURE__ */ e(a, {
|
|
@@ -48,9 +51,9 @@ var F = ({ onRecalculateBudgets: s }) => {
|
|
|
48
51
|
variant: "subtitle2",
|
|
49
52
|
children: t.recalculate_description_bottom
|
|
50
53
|
})]
|
|
51
|
-
}), /* @__PURE__ */ e(
|
|
54
|
+
}), /* @__PURE__ */ e(v, {
|
|
52
55
|
bgcolor: "background.paper",
|
|
53
|
-
children: /* @__PURE__ */ e(
|
|
56
|
+
children: /* @__PURE__ */ e(B, { children: c.map((r) => /* @__PURE__ */ e(_, { category: r }, r.guid)) })
|
|
54
57
|
})] })
|
|
55
58
|
})
|
|
56
59
|
] });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RecalculateBudgets.es.js","names":[],"sources":["../../../../src/budgets/components/addbudget/RecalculateBudgets.tsx"],"sourcesContent":["import React from 'react'\n\nimport Button from '@mui/material/Button'\nimport List from '@mui/material/List'\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { Drawer, useBudgetsStore, useCategoryStore, useGlobalCopyStore } from '../../../common'\n\nimport { RecalculateBudgetRow } from './RecalculateBudgetRow'\n\ninterface RecalculateBudgetsProps {\n onRecalculateBudgets?: () => void\n}\n\nexport const RecalculateBudgets = ({ onRecalculateBudgets }: RecalculateBudgetsProps) => {\n const { budgets: copy, common: commonCopy } = useGlobalCopyStore()\n const { spendCategories } = useCategoryStore()\n const { recalculateBudgets, setAlert } = useBudgetsStore()\n\n const [isOpen, setIsOpen] = React.useState(false)\n\n const newBudgetCategories = spendCategories.filter((category) => category.totalAverageAmount > 0)\n\n const handlePrimaryClick = async () => {\n await recalculateBudgets(newBudgetCategories)\n\n setIsOpen(false)\n setAlert(copy.alert_recalculated_budgets)\n onRecalculateBudgets?.()\n }\n\n return (\n <React.Fragment>\n <Button onClick={() => setIsOpen(true)} sx={{ mt: 24, mx: 24 }} variant=\"text\">\n {copy.recalculate_button}\n </Button>\n\n <Text sx={{ mx: 24, my: 16, textAlign: 'center' }} variant=\"subtitle1\">\n {copy.recalculate_help}\n </Text>\n <Drawer\n ariaLabelClose={commonCopy.close_aria}\n isOpen={isOpen}\n onClose={() => setIsOpen(false)}\n onPrimaryAction={handlePrimaryClick}\n title={copy.recalculate_title}\n >\n <Stack>\n <Stack mx={24} my={16}>\n <Text bold={true} variant=\"body1\">\n {copy.recalculate_description_top}\n </Text>\n <Text variant=\"subtitle2\">{copy.recalculate_description_bottom}</Text>\n </Stack>\n <Box bgcolor=\"background.paper\">\n <List>\n {newBudgetCategories.map((category) => (\n <RecalculateBudgetRow category={category} key={category.guid} />\n ))}\n </List>\n </Box>\n </Stack>\n </Drawer>\n </React.Fragment>\n )\n}\n"],"mappings":";;;;;;;;;;AAiBA,IAAa,IAAA,CAAsB,EAAE,sBAAA,EAAA,MAAoD;AACvF,QAAM,EAAE,SAAS,GAAM,QAAQ,EAAA,IAAe,EAAmB,GAC3D,EAAE,iBAAA,EAAA,IAAoB,EAAiB,GACvC,EAAE,oBAAA,GAAoB,UAAA,EAAA,IAAa,EAAgB,GAEnD,CAAC,GAAQ,CAAA,IAAa,EAAM,SAAS,EAAK,GAE1C,IAAsB,EAAgB,OAAA,CAAQ,MAAa,EAAS,qBAAqB,CAAC,GAE1F,IAAqB,YAAY;AACrC,UAAM,EAAmB,CAAmB,GAE5C,EAAU,EAAK,GACf,EAAS,EAAK,
|
|
1
|
+
{"version":3,"file":"RecalculateBudgets.es.js","names":[],"sources":["../../../../src/budgets/components/addbudget/RecalculateBudgets.tsx"],"sourcesContent":["import React from 'react'\n\nimport Button from '@mui/material/Button'\nimport List from '@mui/material/List'\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { Drawer, useBudgetsStore, useCategoryStore, useGlobalCopyStore } from '../../../common'\n\nimport { RecalculateBudgetRow } from './RecalculateBudgetRow'\n\ninterface RecalculateBudgetsProps {\n onRecalculateBudgets?: () => void\n}\n\nexport const RecalculateBudgets = ({ onRecalculateBudgets }: RecalculateBudgetsProps) => {\n const { budgets: copy, common: commonCopy } = useGlobalCopyStore()\n const { spendCategories } = useCategoryStore()\n const { recalculateBudgets, setAlert } = useBudgetsStore()\n\n const [isOpen, setIsOpen] = React.useState(false)\n\n const newBudgetCategories = spendCategories.filter((category) => category.totalAverageAmount > 0)\n\n const handlePrimaryClick = async () => {\n await recalculateBudgets(newBudgetCategories)\n\n setIsOpen(false)\n setAlert({ msg: copy.alert_recalculated_budgets, severity: 'success' })\n onRecalculateBudgets?.()\n }\n\n return (\n <React.Fragment>\n <Button onClick={() => setIsOpen(true)} sx={{ mt: 24, mx: 24 }} variant=\"text\">\n {copy.recalculate_button}\n </Button>\n\n <Text sx={{ mx: 24, my: 16, textAlign: 'center' }} variant=\"subtitle1\">\n {copy.recalculate_help}\n </Text>\n <Drawer\n ariaLabelClose={commonCopy.close_aria}\n isOpen={isOpen}\n onClose={() => setIsOpen(false)}\n onPrimaryAction={handlePrimaryClick}\n title={copy.recalculate_title}\n >\n <Stack>\n <Stack mx={24} my={16}>\n <Text bold={true} variant=\"body1\">\n {copy.recalculate_description_top}\n </Text>\n <Text variant=\"subtitle2\">{copy.recalculate_description_bottom}</Text>\n </Stack>\n <Box bgcolor=\"background.paper\">\n <List>\n {newBudgetCategories.map((category) => (\n <RecalculateBudgetRow category={category} key={category.guid} />\n ))}\n </List>\n </Box>\n </Stack>\n </Drawer>\n </React.Fragment>\n )\n}\n"],"mappings":";;;;;;;;;;AAiBA,IAAa,IAAA,CAAsB,EAAE,sBAAA,EAAA,MAAoD;AACvF,QAAM,EAAE,SAAS,GAAM,QAAQ,EAAA,IAAe,EAAmB,GAC3D,EAAE,iBAAA,EAAA,IAAoB,EAAiB,GACvC,EAAE,oBAAA,GAAoB,UAAA,EAAA,IAAa,EAAgB,GAEnD,CAAC,GAAQ,CAAA,IAAa,EAAM,SAAS,EAAK,GAE1C,IAAsB,EAAgB,OAAA,CAAQ,MAAa,EAAS,qBAAqB,CAAC,GAE1F,IAAqB,YAAY;AACrC,UAAM,EAAmB,CAAmB,GAE5C,EAAU,EAAK,GACf,EAAS;AAAA,MAAE,KAAK,EAAK;AAAA,MAA4B,UAAU;AAAA,IAAU,CAAC,GACtE,IAAuB;AAAA,EACzB;AAEA,SACE,gBAAA,EAAC,EAAM,UAAP,EAAA,UAAA;AAAA,IACE,gBAAA,EAAC,GAAD;AAAA,MAAQ,SAAA,MAAe,EAAU,EAAI;AAAA,MAAG,IAAI;AAAA,QAAE,IAAI;AAAA,QAAI,IAAI;AAAA,MAAG;AAAA,MAAG,SAAQ;AAAA,MACrE,UAAA,EAAK;AAAA,IACA,CAAA;AAAA,IAER,gBAAA,EAAC,GAAD;AAAA,MAAM,IAAI;AAAA,QAAE,IAAI;AAAA,QAAI,IAAI;AAAA,QAAI,WAAW;AAAA,MAAS;AAAA,MAAG,SAAQ;AAAA,MACxD,UAAA,EAAK;AAAA,IACF,CAAA;AAAA,IACN,gBAAA,EAAC,GAAD;AAAA,MACE,gBAAgB,EAAW;AAAA,MACnB,QAAA;AAAA,MACR,SAAA,MAAe,EAAU,EAAK;AAAA,MAC9B,iBAAiB;AAAA,MACjB,OAAO,EAAK;AAAA,MAEZ,UAAA,gBAAA,EAAC,GAAD,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,QAAO,IAAI;AAAA,QAAI,IAAI;AAAA,QAAnB,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,UAAM,MAAM;AAAA,UAAM,SAAQ;AAAA,UACvB,UAAA,EAAK;AAAA,QACF,CAAA,GACN,gBAAA,EAAC,GAAD;AAAA,UAAM,SAAQ;AAAA,UAAa,UAAA,EAAK;AAAA,QAAqC,CAAA,CAChE;AAAA,MACP,CAAA,GAAA,gBAAA,EAAC,GAAD;AAAA,QAAK,SAAQ;AAAA,QACX,UAAA,gBAAA,EAAC,GAAD,EAAA,UACG,EAAoB,IAAA,CAAK,MACxB,gBAAA,EAAC,GAAD,EAAgC,UAAA,EAA+B,GAAhB,EAAS,IAAO,CAChE,EACG,CAAA;AAAA,MACH,CAAA,CACA,EAAA,CAAA;AAAA,IACD,CAAA;AAAA,EACM,EAAA,CAAA;AAEpB"}
|
|
@@ -1,61 +1,63 @@
|
|
|
1
|
-
import { useBudgetsStore as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import { findDetailedCategory as
|
|
5
|
-
import { useCategoryUiStore as
|
|
6
|
-
import
|
|
7
|
-
import { BudgetAmount as
|
|
8
|
-
import
|
|
9
|
-
import { observer as
|
|
10
|
-
import
|
|
11
|
-
import { Icon as
|
|
12
|
-
import { jsx as e, jsxs as
|
|
13
|
-
import
|
|
14
|
-
import
|
|
15
|
-
import
|
|
16
|
-
import
|
|
17
|
-
import
|
|
18
|
-
import
|
|
19
|
-
var
|
|
20
|
-
const { budgets:
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
1
|
+
import { useBudgetsStore as L, useCategoryStore as N, useGlobalCopyStore as R } from "../../../common/context/hooks.es.js";
|
|
2
|
+
import j from "../../../common/components/dialog/Dialog.es.js";
|
|
3
|
+
import k from "../../../common/components/drawer/Drawer.es.js";
|
|
4
|
+
import { findDetailedCategory as C, findDetailedSubCategory as G } from "../../../core/utils/CategoryUtil.es.js";
|
|
5
|
+
import { useCategoryUiStore as P } from "../../../categories/context/hooks.es.js";
|
|
6
|
+
import T from "../../../categories/components/CategoryRow.es.js";
|
|
7
|
+
import { BudgetAmount as z } from "../shared/BudgetAmount.es.js";
|
|
8
|
+
import t from "react";
|
|
9
|
+
import { observer as E } from "mobx-react-lite";
|
|
10
|
+
import h from "@mui/material/Stack";
|
|
11
|
+
import { Icon as _, Text as $ } from "@mxenabled/mxui";
|
|
12
|
+
import { jsx as e, jsxs as c } from "react/jsx-runtime";
|
|
13
|
+
import U from "@mui/material/Box";
|
|
14
|
+
import q from "@mui/material/Divider";
|
|
15
|
+
import F from "@mui/material/List";
|
|
16
|
+
import H from "@mui/material/ListItem";
|
|
17
|
+
import J from "@mui/material/ListItemButton";
|
|
18
|
+
import K from "@mui/material/ListItemText";
|
|
19
|
+
var ce = E(({ category: o, parentBudget: S }) => {
|
|
20
|
+
const { budgets: r, common: l } = R(), { setExpandedGuid: x, setOnSelect: A } = P(), { addBudget: B } = L(), { detailedCategories: n } = N(), [v, a] = t.useState(!1), [I, d] = t.useState(!1), [i, p] = t.useState(""), [m, f] = t.useState(void 0), g = t.useRef(n);
|
|
21
|
+
g.current = n;
|
|
22
|
+
const u = C(n, o.guid) || o;
|
|
23
|
+
t.useEffect(() => {
|
|
24
|
+
A((b) => {
|
|
25
|
+
const y = g.current, s = C(y, o.guid)?.subCategories.find((D) => D.guid === b) || G(y, b);
|
|
26
|
+
s && (f(s), p(`${s.currentAmount === 0 ? "" : s.currentAmount}`), d(!0));
|
|
25
27
|
});
|
|
26
|
-
}, [
|
|
27
|
-
const
|
|
28
|
-
|
|
29
|
-
},
|
|
30
|
-
|
|
28
|
+
}, [o.guid]);
|
|
29
|
+
const O = () => {
|
|
30
|
+
x(u.guid), a(!0);
|
|
31
|
+
}, w = async () => {
|
|
32
|
+
m && Number(i) > 0 && (await B(m, Number(i), S.guid), d(!1), a(!1), f(void 0));
|
|
31
33
|
};
|
|
32
|
-
return /* @__PURE__ */
|
|
33
|
-
/* @__PURE__ */ e(
|
|
34
|
+
return /* @__PURE__ */ c(U, { children: [
|
|
35
|
+
/* @__PURE__ */ e(H, {
|
|
34
36
|
disableGutters: !0,
|
|
35
37
|
disablePadding: !0,
|
|
36
38
|
sx: { bgcolor: "background.paper" },
|
|
37
|
-
children: /* @__PURE__ */ e(
|
|
38
|
-
onClick:
|
|
39
|
-
children: /* @__PURE__ */ e(
|
|
39
|
+
children: /* @__PURE__ */ e(J, {
|
|
40
|
+
onClick: O,
|
|
41
|
+
children: /* @__PURE__ */ e(K, { children: /* @__PURE__ */ c(h, {
|
|
40
42
|
alignItems: "center",
|
|
41
43
|
direction: "row",
|
|
42
44
|
justifyContent: "space-between",
|
|
43
|
-
children: [/* @__PURE__ */
|
|
45
|
+
children: [/* @__PURE__ */ c(h, {
|
|
44
46
|
alignItems: "center",
|
|
45
47
|
direction: "row",
|
|
46
48
|
gap: 8,
|
|
47
|
-
children: [/* @__PURE__ */ e(
|
|
49
|
+
children: [/* @__PURE__ */ e(_, {
|
|
48
50
|
fill: !0,
|
|
49
51
|
name: "add_box",
|
|
50
52
|
size: 24,
|
|
51
53
|
sx: { color: "primary.main" }
|
|
52
|
-
}), /* @__PURE__ */ e(
|
|
54
|
+
}), /* @__PURE__ */ e($, {
|
|
53
55
|
bold: !0,
|
|
54
56
|
sx: { color: "primary.main" },
|
|
55
57
|
variant: "body1",
|
|
56
|
-
children:
|
|
58
|
+
children: r.add_sub_budget_button
|
|
57
59
|
})]
|
|
58
|
-
}), /* @__PURE__ */ e(
|
|
60
|
+
}), /* @__PURE__ */ e(_, {
|
|
59
61
|
name: "chevron_right",
|
|
60
62
|
size: 24,
|
|
61
63
|
sx: { color: "primary.main" }
|
|
@@ -63,37 +65,37 @@ var ue = z(({ category: n, parentBudget: C }) => {
|
|
|
63
65
|
}) })
|
|
64
66
|
})
|
|
65
67
|
}),
|
|
66
|
-
/* @__PURE__ */ e(
|
|
67
|
-
/* @__PURE__ */ e(
|
|
68
|
-
ariaLabelClose:
|
|
69
|
-
isOpen:
|
|
70
|
-
onClose: () =>
|
|
71
|
-
title:
|
|
72
|
-
children: /* @__PURE__ */ e(
|
|
73
|
-
category:
|
|
74
|
-
subCategories:
|
|
68
|
+
/* @__PURE__ */ e(q, {}),
|
|
69
|
+
/* @__PURE__ */ e(k, {
|
|
70
|
+
ariaLabelClose: l.close_aria,
|
|
71
|
+
isOpen: v,
|
|
72
|
+
onClose: () => a(!1),
|
|
73
|
+
title: r.add_sub_budget_title,
|
|
74
|
+
children: /* @__PURE__ */ e(F, { children: /* @__PURE__ */ e(T, {
|
|
75
|
+
category: u,
|
|
76
|
+
subCategories: u.subCategories
|
|
75
77
|
}) })
|
|
76
78
|
}),
|
|
77
|
-
/* @__PURE__ */ e(
|
|
79
|
+
/* @__PURE__ */ e(j, {
|
|
78
80
|
copy: {
|
|
79
|
-
close_aria:
|
|
80
|
-
title:
|
|
81
|
+
close_aria: l.close_aria,
|
|
82
|
+
title: r.add_title
|
|
81
83
|
},
|
|
82
|
-
disablePrimaryButton: Number(
|
|
83
|
-
isOpen:
|
|
84
|
-
onClose: () =>
|
|
85
|
-
onPrimaryAction:
|
|
86
|
-
primaryText:
|
|
87
|
-
children: /* @__PURE__ */ e(
|
|
88
|
-
amount:
|
|
89
|
-
categoryName:
|
|
90
|
-
onAmountChanged:
|
|
84
|
+
disablePrimaryButton: Number(i) <= 0,
|
|
85
|
+
isOpen: I,
|
|
86
|
+
onClose: () => d(!1),
|
|
87
|
+
onPrimaryAction: w,
|
|
88
|
+
primaryText: r.add_save_button,
|
|
89
|
+
children: /* @__PURE__ */ e(z, {
|
|
90
|
+
amount: i,
|
|
91
|
+
categoryName: m?.name || "",
|
|
92
|
+
onAmountChanged: p
|
|
91
93
|
})
|
|
92
94
|
})
|
|
93
95
|
] });
|
|
94
96
|
});
|
|
95
97
|
export {
|
|
96
|
-
|
|
98
|
+
ce as AddSubBudget
|
|
97
99
|
};
|
|
98
100
|
|
|
99
101
|
//# sourceMappingURL=AddSubBudget.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AddSubBudget.es.js","names":[],"sources":["../../../../src/budgets/components/budgetdetails/AddSubBudget.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemText from '@mui/material/ListItemText'\nimport Stack from '@mui/material/Stack'\n\nimport { Icon, Text } from '@mxenabled/mxui'\n\nimport {\n Dialog,\n Drawer,\n useBudgetsStore,\n useCategoryStore,\n useGlobalCopyStore,\n} from '../../../common'\nimport { type DetailedBudget, type DetailedCategory } from '../../../core'\nimport { CategoryRow, useCategoryUiStore } from '../../../categories'\nimport { BudgetAmount } from '../shared/BudgetAmount'\nimport { findDetailedCategory, findDetailedSubCategory } from '../../../core/utils/CategoryUtil'\n\ninterface AddSubBudgetProps {\n category: DetailedCategory\n parentBudget: DetailedBudget\n}\n\nexport const AddSubBudget: React.FC<AddSubBudgetProps> = observer(({ category, parentBudget }) => {\n const { budgets: copy, common: commonCopy } = useGlobalCopyStore()\n const { setExpandedGuid, setOnSelect } = useCategoryUiStore()\n const { addBudget } = useBudgetsStore()\n const { detailedCategories } = useCategoryStore()\n\n const [isOpen, setIsOpen] = React.useState(false)\n const [isAddBudgetOpen, setIsAddBudgetOpen] = React.useState(false)\n const [amount, setAmount] = React.useState('')\n const [subCategory, setSubCategory] = React.useState<DetailedCategory | undefined>(undefined)\n\n const
|
|
1
|
+
{"version":3,"file":"AddSubBudget.es.js","names":[],"sources":["../../../../src/budgets/components/budgetdetails/AddSubBudget.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemText from '@mui/material/ListItemText'\nimport Stack from '@mui/material/Stack'\n\nimport { Icon, Text } from '@mxenabled/mxui'\n\nimport {\n Dialog,\n Drawer,\n useBudgetsStore,\n useCategoryStore,\n useGlobalCopyStore,\n} from '../../../common'\nimport { type DetailedBudget, type DetailedCategory } from '../../../core'\nimport { CategoryRow, useCategoryUiStore } from '../../../categories'\nimport { BudgetAmount } from '../shared/BudgetAmount'\nimport { findDetailedCategory, findDetailedSubCategory } from '../../../core/utils/CategoryUtil'\n\ninterface AddSubBudgetProps {\n category: DetailedCategory\n parentBudget: DetailedBudget\n}\n\nexport const AddSubBudget: React.FC<AddSubBudgetProps> = observer(({ category, parentBudget }) => {\n const { budgets: copy, common: commonCopy } = useGlobalCopyStore()\n const { setExpandedGuid, setOnSelect } = useCategoryUiStore()\n const { addBudget } = useBudgetsStore()\n const { detailedCategories } = useCategoryStore()\n\n const [isOpen, setIsOpen] = React.useState(false)\n const [isAddBudgetOpen, setIsAddBudgetOpen] = React.useState(false)\n const [amount, setAmount] = React.useState('')\n const [subCategory, setSubCategory] = React.useState<DetailedCategory | undefined>(undefined)\n\n const catsRef = React.useRef(detailedCategories)\n catsRef.current = detailedCategories\n\n const currentCategory = findDetailedCategory(detailedCategories, category.guid) || category\n\n React.useEffect(() => {\n setOnSelect((guid: string) => {\n const cats = catsRef.current\n const selected =\n findDetailedCategory(cats, category.guid)?.subCategories.find((sc) => sc.guid === guid) ||\n findDetailedSubCategory(cats, guid)\n if (selected) {\n setSubCategory(selected)\n setAmount(`${selected.currentAmount === 0 ? '' : selected.currentAmount}`)\n setIsAddBudgetOpen(true)\n }\n })\n }, [category.guid])\n\n const handleOpen = () => {\n setExpandedGuid(currentCategory.guid)\n setIsOpen(true)\n }\n\n const handleAddSubBudget = async () => {\n if (subCategory && Number(amount) > 0) {\n await addBudget(subCategory, Number(amount), parentBudget.guid)\n setIsAddBudgetOpen(false)\n setIsOpen(false)\n setSubCategory(undefined)\n }\n }\n\n return (\n <Box>\n <ListItem disableGutters={true} disablePadding={true} sx={{ bgcolor: 'background.paper' }}>\n <ListItemButton onClick={handleOpen}>\n <ListItemText>\n <Stack alignItems=\"center\" direction=\"row\" justifyContent=\"space-between\">\n <Stack alignItems=\"center\" direction=\"row\" gap={8}>\n <Icon fill={true} name=\"add_box\" size={24} sx={{ color: 'primary.main' }} />\n <Text bold={true} sx={{ color: 'primary.main' }} variant=\"body1\">\n {copy.add_sub_budget_button}\n </Text>\n </Stack>\n <Icon name=\"chevron_right\" size={24} sx={{ color: 'primary.main' }} />\n </Stack>\n </ListItemText>\n </ListItemButton>\n </ListItem>\n <Divider />\n\n <Drawer\n ariaLabelClose={commonCopy.close_aria}\n isOpen={isOpen}\n onClose={() => setIsOpen(false)}\n title={copy.add_sub_budget_title}\n >\n <List>\n <CategoryRow category={currentCategory} subCategories={currentCategory.subCategories} />\n </List>\n </Drawer>\n\n <Dialog\n copy={{ close_aria: commonCopy.close_aria, title: copy.add_title }}\n disablePrimaryButton={Number(amount) <= 0}\n isOpen={isAddBudgetOpen}\n onClose={() => setIsAddBudgetOpen(false)}\n onPrimaryAction={handleAddSubBudget}\n primaryText={copy.add_save_button}\n >\n <BudgetAmount\n amount={amount}\n categoryName={subCategory?.name || ''}\n onAmountChanged={setAmount}\n />\n </Dialog>\n </Box>\n )\n})\n"],"mappings":"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"}
|
|
@@ -15,16 +15,19 @@ import { jsx as t, jsxs as r } from "react/jsx-runtime";
|
|
|
15
15
|
import p from "@mui/material/Tab";
|
|
16
16
|
import V from "@mui/material/Tabs";
|
|
17
17
|
var st = M(({ budget: c }) => {
|
|
18
|
-
const { is_mobile_webview: u } = k(), { setAlert: f } = D(), { budgets: o, common: b, transactions: h } = j(), { isDesktop: _, isSmallTablet: T, isTablet:
|
|
19
|
-
|
|
18
|
+
const { is_mobile_webview: u } = k(), { setAlert: f } = D(), { budgets: o, common: b, transactions: h } = j(), { isDesktop: _, isSmallTablet: T, isTablet: g } = I(), { sortedTransactions: s, sortedTransactionsWithSplits: C, tags: S } = G(), [a, v] = i.useState(0), [l, m] = i.useState(""), n = i.useMemo(() => s.find((d) => d.guid === l), [l, s]), x = (d, B) => {
|
|
19
|
+
v(B);
|
|
20
20
|
}, w = () => {
|
|
21
|
-
z(
|
|
22
|
-
|
|
21
|
+
z(C, S), f({
|
|
22
|
+
msg: o.alert_csv_downloaded,
|
|
23
|
+
severity: "success"
|
|
24
|
+
});
|
|
25
|
+
}, y = s.length > 0 && !u && (_ || g && !T);
|
|
23
26
|
return /* @__PURE__ */ r(e, {
|
|
24
27
|
gap: 24,
|
|
25
28
|
children: [/* @__PURE__ */ t(W, { budget: c }), /* @__PURE__ */ r(e, { children: [
|
|
26
29
|
/* @__PURE__ */ r(V, {
|
|
27
|
-
onChange:
|
|
30
|
+
onChange: x,
|
|
28
31
|
sx: { width: "100%" },
|
|
29
32
|
textColor: "primary",
|
|
30
33
|
value: a,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BudgetDetails.es.js","names":[],"sources":["../../../../src/budgets/components/budgetdetails/BudgetDetails.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\nimport Tab from '@mui/material/Tab'\nimport Tabs from '@mui/material/Tabs'\n\nimport { Icon } from '@mxenabled/mxui'\n\nimport {\n Drawer,\n useAppConfig,\n useBudgetsStore,\n useGlobalCopyStore,\n useScreenSize,\n useTransactionStore,\n} from '../../../common'\nimport { type DetailedBudget } from '../../../core'\nimport { exportTransactionsToCSV } from '../../../core/utils/TransactionUtils'\n\nimport { TransactionDetails, TransactionList } from '../../../transactions'\n\nimport { Header } from './Header'\nimport { SubBudgetList } from './SubBudgetList'\n\ninterface BudgetDetailsProps {\n budget: DetailedBudget\n}\n\nexport const BudgetDetails: React.FC<BudgetDetailsProps> = observer(({ budget }) => {\n const { is_mobile_webview } = useAppConfig()\n const { setAlert } = useBudgetsStore()\n const { budgets: copy, common: commonCopy, transactions: transactionCopy } = useGlobalCopyStore()\n const { isDesktop, isSmallTablet, isTablet } = useScreenSize()\n const {\n sortedTransactions: transactions,\n sortedTransactionsWithSplits,\n tags,\n } = useTransactionStore()\n\n const [selectedTab, setSelectedTab] = React.useState(0)\n const [transactionGuid, setTransactionGuid] = React.useState('')\n\n const transaction = React.useMemo(\n () => transactions.find((t) => t.guid === transactionGuid),\n [transactionGuid, transactions],\n )\n\n const handleTabChange = (_event: React.SyntheticEvent, newValue: number) => {\n setSelectedTab(newValue)\n }\n\n const handleExportToCsv = () => {\n exportTransactionsToCSV(sortedTransactionsWithSplits, tags)\n setAlert(copy.alert_csv_downloaded)\n }\n\n const shouldShowExportButton =\n transactions.length > 0 && !is_mobile_webview && (isDesktop || (isTablet && !isSmallTablet))\n\n return (\n <Stack gap={24}>\n <Header budget={budget} />\n\n <Stack>\n <Tabs\n onChange={handleTabChange}\n sx={{ width: '100%' }}\n textColor=\"primary\"\n value={selectedTab}\n variant=\"fullWidth\"\n >\n <Tab label={copy.details_transactions_tab} />\n <Tab label={copy.details_subbudgets_tab} />\n </Tabs>\n {selectedTab === 0 && (\n <Stack>\n {shouldShowExportButton && (\n <Stack direction=\"row\" justifyContent=\"right\" mb={-24} mr={8} mt={8} zIndex={1}>\n <Button\n onClick={handleExportToCsv}\n startIcon={<Icon name=\"ios_share\" />}\n variant=\"text\"\n >\n {transactionCopy.export_csv_btn}\n </Button>\n </Stack>\n )}\n <TransactionList height=\"100%\" onClick={setTransactionGuid} />\n </Stack>\n )}\n {selectedTab === 1 && <SubBudgetList budget={budget} />}\n\n <Drawer\n ariaLabelClose={commonCopy.close_aria}\n isOpen={Boolean(transaction)}\n onClose={() => setTransactionGuid('')}\n title={copy.details_transaction_drawer}\n >\n {transaction && <TransactionDetails transaction={transaction} />}\n </Drawer>\n </Stack>\n </Stack>\n )\n})\n"],"mappings":";;;;;;;;;;;;;;;;AA8BA,IAAa,KAA8C,EAAA,CAAU,EAAE,QAAA,EAAA,MAAa;AAClF,QAAM,EAAE,mBAAA,EAAA,IAAsB,EAAa,GACrC,EAAE,UAAA,EAAA,IAAa,EAAgB,GAC/B,EAAE,SAAS,GAAM,QAAQ,GAAY,cAAc,EAAA,IAAoB,EAAmB,GAC1F,EAAE,WAAA,GAAW,eAAA,GAAe,UAAA,EAAA,IAAa,EAAc,GACvD,EACJ,oBAAoB,GACpB,8BAAA,GACA,MAAA,EAAA,IACE,EAAoB,GAElB,CAAC,GAAa,CAAA,IAAkB,EAAM,SAAS,CAAC,GAChD,CAAC,GAAiB,CAAA,IAAsB,EAAM,SAAS,EAAE,GAEzD,IAAc,EAAM,QAAA,MAClB,EAAa,KAAA,CAAM,MAAM,EAAE,SAAS,CAAe,GACzD,CAAC,GAAiB,CAAY,CAChC,GAEM,IAAA,CAAmB,GAA8B,MAAqB;AAC1E,IAAA,EAAe,CAAQ;AAAA,EACzB,GAEM,IAAA,MAA0B;AAC9B,IAAA,EAAwB,GAA8B,CAAI,GAC1D,EAAS,EAAK,
|
|
1
|
+
{"version":3,"file":"BudgetDetails.es.js","names":[],"sources":["../../../../src/budgets/components/budgetdetails/BudgetDetails.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\nimport Tab from '@mui/material/Tab'\nimport Tabs from '@mui/material/Tabs'\n\nimport { Icon } from '@mxenabled/mxui'\n\nimport {\n Drawer,\n useAppConfig,\n useBudgetsStore,\n useGlobalCopyStore,\n useScreenSize,\n useTransactionStore,\n} from '../../../common'\nimport { type DetailedBudget } from '../../../core'\nimport { exportTransactionsToCSV } from '../../../core/utils/TransactionUtils'\n\nimport { TransactionDetails, TransactionList } from '../../../transactions'\n\nimport { Header } from './Header'\nimport { SubBudgetList } from './SubBudgetList'\n\ninterface BudgetDetailsProps {\n budget: DetailedBudget\n}\n\nexport const BudgetDetails: React.FC<BudgetDetailsProps> = observer(({ budget }) => {\n const { is_mobile_webview } = useAppConfig()\n const { setAlert } = useBudgetsStore()\n const { budgets: copy, common: commonCopy, transactions: transactionCopy } = useGlobalCopyStore()\n const { isDesktop, isSmallTablet, isTablet } = useScreenSize()\n const {\n sortedTransactions: transactions,\n sortedTransactionsWithSplits,\n tags,\n } = useTransactionStore()\n\n const [selectedTab, setSelectedTab] = React.useState(0)\n const [transactionGuid, setTransactionGuid] = React.useState('')\n\n const transaction = React.useMemo(\n () => transactions.find((t) => t.guid === transactionGuid),\n [transactionGuid, transactions],\n )\n\n const handleTabChange = (_event: React.SyntheticEvent, newValue: number) => {\n setSelectedTab(newValue)\n }\n\n const handleExportToCsv = () => {\n exportTransactionsToCSV(sortedTransactionsWithSplits, tags)\n setAlert({ msg: copy.alert_csv_downloaded, severity: 'success' })\n }\n\n const shouldShowExportButton =\n transactions.length > 0 && !is_mobile_webview && (isDesktop || (isTablet && !isSmallTablet))\n\n return (\n <Stack gap={24}>\n <Header budget={budget} />\n\n <Stack>\n <Tabs\n onChange={handleTabChange}\n sx={{ width: '100%' }}\n textColor=\"primary\"\n value={selectedTab}\n variant=\"fullWidth\"\n >\n <Tab label={copy.details_transactions_tab} />\n <Tab label={copy.details_subbudgets_tab} />\n </Tabs>\n {selectedTab === 0 && (\n <Stack>\n {shouldShowExportButton && (\n <Stack direction=\"row\" justifyContent=\"right\" mb={-24} mr={8} mt={8} zIndex={1}>\n <Button\n onClick={handleExportToCsv}\n startIcon={<Icon name=\"ios_share\" />}\n variant=\"text\"\n >\n {transactionCopy.export_csv_btn}\n </Button>\n </Stack>\n )}\n <TransactionList height=\"100%\" onClick={setTransactionGuid} />\n </Stack>\n )}\n {selectedTab === 1 && <SubBudgetList budget={budget} />}\n\n <Drawer\n ariaLabelClose={commonCopy.close_aria}\n isOpen={Boolean(transaction)}\n onClose={() => setTransactionGuid('')}\n title={copy.details_transaction_drawer}\n >\n {transaction && <TransactionDetails transaction={transaction} />}\n </Drawer>\n </Stack>\n </Stack>\n )\n})\n"],"mappings":";;;;;;;;;;;;;;;;AA8BA,IAAa,KAA8C,EAAA,CAAU,EAAE,QAAA,EAAA,MAAa;AAClF,QAAM,EAAE,mBAAA,EAAA,IAAsB,EAAa,GACrC,EAAE,UAAA,EAAA,IAAa,EAAgB,GAC/B,EAAE,SAAS,GAAM,QAAQ,GAAY,cAAc,EAAA,IAAoB,EAAmB,GAC1F,EAAE,WAAA,GAAW,eAAA,GAAe,UAAA,EAAA,IAAa,EAAc,GACvD,EACJ,oBAAoB,GACpB,8BAAA,GACA,MAAA,EAAA,IACE,EAAoB,GAElB,CAAC,GAAa,CAAA,IAAkB,EAAM,SAAS,CAAC,GAChD,CAAC,GAAiB,CAAA,IAAsB,EAAM,SAAS,EAAE,GAEzD,IAAc,EAAM,QAAA,MAClB,EAAa,KAAA,CAAM,MAAM,EAAE,SAAS,CAAe,GACzD,CAAC,GAAiB,CAAY,CAChC,GAEM,IAAA,CAAmB,GAA8B,MAAqB;AAC1E,IAAA,EAAe,CAAQ;AAAA,EACzB,GAEM,IAAA,MAA0B;AAC9B,IAAA,EAAwB,GAA8B,CAAI,GAC1D,EAAS;AAAA,MAAE,KAAK,EAAK;AAAA,MAAsB,UAAU;AAAA,IAAU,CAAC;AAAA,EAClE,GAEM,IACJ,EAAa,SAAS,KAAK,CAAC,MAAsB,KAAc,KAAY,CAAC;AAE/E,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,KAAK;AAAA,IAAZ,UAAA,CACE,gBAAA,EAAC,GAAD,EAAgB,QAAA,EAAS,CAAA,GAEzB,gBAAA,EAAC,GAAD,EAAA,UAAA;AAAA,MACE,gBAAA,EAAC,GAAD;AAAA,QACE,UAAU;AAAA,QACV,IAAI,EAAE,OAAO,OAAO;AAAA,QACpB,WAAU;AAAA,QACV,OAAO;AAAA,QACP,SAAQ;AAAA,QALV,UAAA,CAOE,gBAAA,EAAC,GAAD,EAAK,OAAO,EAAK,yBAA2B,CAAA,GAC5C,gBAAA,EAAC,GAAD,EAAK,OAAO,EAAK,uBAAyB,CAAA,CACtC;AAAA;MACL,MAAgB,KACf,gBAAA,EAAC,GAAD,EAAA,UAAA,CACG,KACC,gBAAA,EAAC,GAAD;AAAA,QAAO,WAAU;AAAA,QAAM,gBAAe;AAAA,QAAQ,IAAI;AAAA,QAAK,IAAI;AAAA,QAAG,IAAI;AAAA,QAAG,QAAQ;AAAA,QAC3E,UAAA,gBAAA,EAAC,GAAD;AAAA,UACE,SAAS;AAAA,UACT,WAAW,gBAAA,EAAC,GAAD,EAAM,MAAK,YAAa,CAAA;AAAA,UACnC,SAAQ;AAAA,UAEP,UAAA,EAAgB;AAAA,QACX,CAAA;AAAA,MACH,CAAA,GAET,gBAAA,EAAC,GAAD;AAAA,QAAiB,QAAO;AAAA,QAAO,SAAS;AAAA,MAAqB,CAAA,CACxD,EAAA,CAAA;AAAA,MAER,MAAgB,KAAK,gBAAA,EAAC,GAAD,EAAuB,QAAA,EAAS,CAAA;AAAA,MAEtD,gBAAA,EAAC,GAAD;AAAA,QACE,gBAAgB,EAAW;AAAA,QAC3B,QAAQ,EAAQ;AAAA,QAChB,SAAA,MAAe,EAAmB,EAAE;AAAA,QACpC,OAAO,EAAK;AAAA,QAEX,UAAA,KAAe,gBAAA,EAAC,GAAD,EAAiC,aAAA,EAAc,CAAA;AAAA,MACzD,CAAA;AAAA,IACH,EAAA,CAAA,CACF;AAAA;AAEX,CAAC"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
import { DetailedBudget } from '../../../core';
|
|
3
3
|
export interface SubBudgetAmountsProps {
|
|
4
|
-
amount: string;
|
|
5
4
|
categoryName: string;
|
|
6
|
-
subBudgets
|
|
7
|
-
subBudgetAmounts
|
|
8
|
-
onSubBudgetAmountChanged
|
|
5
|
+
subBudgets: DetailedBudget[];
|
|
6
|
+
subBudgetAmounts: Record<string, string>;
|
|
7
|
+
onSubBudgetAmountChanged: (guid: string, amount: string) => void;
|
|
9
8
|
}
|
|
10
9
|
export declare const SubBudgetAmounts: React.FC<SubBudgetAmountsProps>;
|
|
@@ -1,58 +1,69 @@
|
|
|
1
|
-
import { buildDynamicCopy as
|
|
2
|
-
import { useGlobalCopyStore as
|
|
1
|
+
import { buildDynamicCopy as h } from "../../../core/utils/Localization.es.js";
|
|
2
|
+
import { useGlobalCopyStore as f } from "../../../common/context/hooks.es.js";
|
|
3
3
|
import { formatCurrency as y } from "../../../core/utils/NumberFormatting.es.js";
|
|
4
|
+
import { isInvalidAmount as g } from "../../../core/utils/BudgetUtil.es.js";
|
|
4
5
|
import x from "../../../common/components/CurrencyInput.es.js";
|
|
5
|
-
import { SubBudgetCategory as
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import { Text as
|
|
9
|
-
import { jsx as
|
|
10
|
-
import { Divider as
|
|
6
|
+
import { SubBudgetCategory as v } from "../shared/SubBudgetCategory.es.js";
|
|
7
|
+
import d from "react";
|
|
8
|
+
import c from "@mui/material/Stack";
|
|
9
|
+
import { Text as e } from "@mxenabled/mxui";
|
|
10
|
+
import { jsx as t, jsxs as o } from "react/jsx-runtime";
|
|
11
|
+
import { Divider as _ } from "@mui/material";
|
|
11
12
|
import C from "@mui/material/List";
|
|
12
13
|
import S from "@mui/material/ListItem";
|
|
13
|
-
var
|
|
14
|
-
const { budgets:
|
|
15
|
-
return /* @__PURE__ */ o(
|
|
14
|
+
var R = ({ categoryName: p, subBudgets: m, subBudgetAmounts: n, onSubBudgetAmountChanged: u }) => {
|
|
15
|
+
const { budgets: i } = f(), b = m.reduce((r, a) => r + (Number(n[a.guid]) || 0), 0);
|
|
16
|
+
return /* @__PURE__ */ o(d.Fragment, { children: [/* @__PURE__ */ o(c, { children: [/* @__PURE__ */ t(e, {
|
|
17
|
+
"aria-live": "polite",
|
|
16
18
|
sx: { pb: 12 },
|
|
17
|
-
children:
|
|
19
|
+
children: h(i.your_budget_summary, p, /* @__PURE__ */ t(e, {
|
|
18
20
|
bold: !0,
|
|
19
21
|
component: "span",
|
|
20
|
-
children: y(
|
|
22
|
+
children: y(b, "0,0")
|
|
21
23
|
}))
|
|
22
|
-
}), /* @__PURE__ */ o(
|
|
24
|
+
}), /* @__PURE__ */ o(c, {
|
|
23
25
|
sx: {
|
|
24
26
|
flexDirection: "row",
|
|
25
27
|
mt: 12
|
|
26
28
|
},
|
|
27
|
-
children: [/* @__PURE__ */
|
|
29
|
+
children: [/* @__PURE__ */ t(e, {
|
|
28
30
|
bold: !0,
|
|
31
|
+
id: "sub-budget-col-name",
|
|
29
32
|
sx: { width: "50%" },
|
|
30
33
|
variant: "caption",
|
|
31
|
-
children:
|
|
32
|
-
}), /* @__PURE__ */
|
|
34
|
+
children: i.details_subbudgets_tab
|
|
35
|
+
}), /* @__PURE__ */ t(e, {
|
|
33
36
|
bold: !0,
|
|
37
|
+
id: "sub-budget-col-total",
|
|
34
38
|
sx: {
|
|
35
39
|
textAlign: "right",
|
|
36
40
|
width: "50%"
|
|
37
41
|
},
|
|
38
42
|
variant: "caption",
|
|
39
|
-
children:
|
|
43
|
+
children: i.monthly_total
|
|
40
44
|
})]
|
|
41
|
-
})] }), /* @__PURE__ */
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
45
|
+
})] }), /* @__PURE__ */ t(C, {
|
|
46
|
+
"aria-label": i.details_subbudgets_tab,
|
|
47
|
+
children: m.map((r, a) => {
|
|
48
|
+
const l = n[r.guid] ?? `${r.amount}`;
|
|
49
|
+
return /* @__PURE__ */ o(d.Fragment, { children: [/* @__PURE__ */ o(S, { children: [/* @__PURE__ */ t(v, { budget: r }), /* @__PURE__ */ t(x, {
|
|
50
|
+
amount: l,
|
|
51
|
+
"aria-describedby": "sub-budget-col-total",
|
|
52
|
+
"aria-invalid": g(l),
|
|
53
|
+
label: r.category.name,
|
|
54
|
+
minAmount: 0,
|
|
55
|
+
setAmount: (s) => u(r.guid, s),
|
|
56
|
+
sx: {
|
|
57
|
+
".MuiTypography-body1": { p: 0 },
|
|
58
|
+
width: "25%",
|
|
59
|
+
flexShrink: 0
|
|
60
|
+
}
|
|
61
|
+
})] }), /* @__PURE__ */ t(_, { sx: { ml: a === m.length - 1 ? 0 : 48 } })] }, r.guid);
|
|
62
|
+
})
|
|
63
|
+
})] });
|
|
53
64
|
};
|
|
54
65
|
export {
|
|
55
|
-
|
|
66
|
+
R as SubBudgetAmounts
|
|
56
67
|
};
|
|
57
68
|
|
|
58
69
|
//# sourceMappingURL=SubBudgetAmounts.es.js.map
|