From e51a09b4f389ff9bd67ee098592e4d76d7062e46 Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Mon, 17 Jul 2023 08:37:19 -0700 Subject: [PATCH 01/13] Updates --- .../src/components/accounts/Account.js | 290 ++++++++++-------- .../transactions/TransactionsTable.js | 6 +- 2 files changed, 159 insertions(+), 137 deletions(-) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index e20366d8da2..d74d9eb67fe 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -74,7 +74,13 @@ function EmptyMessage({ onAdd }) { ); } -function AllTransactions({ account = {}, transactions, filtered, children }) { +function AllTransactions({ + account = {}, + transactions, + balances, + filtered, + children, +}) { const { id: accountId } = account; let scheduleData = useCachedSchedules(); @@ -94,7 +100,7 @@ function AllTransactions({ account = {}, transactions, filtered, children }) { let prependTransactions = useMemo(() => { return schedules.map(schedule => ({ - id: 'preview/' + schedule.id, + id: `preview/${schedule.id}`, payee: schedule._payee, account: schedule._account, amount: schedule._amount, @@ -105,6 +111,25 @@ function AllTransactions({ account = {}, transactions, filtered, children }) { })); }, [schedules, accountId]); + let prependBalances = useMemo(() => { + // balances is in descending order so latest order is at the start of the array. + let runningBalance = balances + ? Object.values(balances)[0]?.balance ?? 0 + : 0; + + // Reverse so we can calculate from earliest upcoming schedule. + let scheduledBalances = prependTransactions.map((_, index, ptArray) => { + let scheduledTransaction = ptArray[ptArray.length - 1 - index]; + let amount = + (scheduledTransaction._inverse ? -1 : 1) * scheduledTransaction.amount; + return { + balance: (runningBalance += amount), + id: scheduledTransaction.id, + }; + }); + return groupById(scheduledBalances); + }, [prependTransactions, balances]); + let allTransactions = useMemo(() => { // Don't prepend scheduled transactions if we are filtering if (!filtered && prependTransactions.length > 0) { @@ -113,10 +138,18 @@ function AllTransactions({ account = {}, transactions, filtered, children }) { return transactions; }, [filtered, prependTransactions, transactions]); + let allBalances = useMemo(() => { + // Don't prepend scheduled transactions if we are filtering + if (!filtered && prependBalances) { + return { ...prependBalances, ...balances }; + } + return balances; + }, [filtered, prependBalances, balances]); + if (scheduleData == null) { - return children(null); + return children(transactions, balances); } - return children(allTransactions); + return children(allTransactions, allBalances); } function getField(field) { @@ -1124,143 +1157,136 @@ class AccountInternal extends PureComponent { - {allTransactions => - allTransactions == null ? null : ( - (this.dispatchSelected = dispatch)} - > - - ( + (this.dispatchSelected = dispatch)} + > + + + + + + this.paged && this.paged.fetchNext() + } + accounts={accounts} + category={category} + categoryGroups={categoryGroups} + payees={payees} + balances={ + showBalances && this.canCalculateBalance() + ? allBalances + : null + } showCleared={showCleared} - showEmptyMessage={showEmptyMessage} - balanceQuery={balanceQuery} - canCalculateBalance={this.canCalculateBalance} - isSorted={this.state.sort.length !== 0} - reconcileAmount={reconcileAmount} - search={this.state.search} - filters={this.state.filters} - conditionsOp={this.state.conditionsOp} - savePrefs={this.props.savePrefs} - onSearch={this.onSearch} - onShowTransactions={this.onShowTransactions} - onMenuSelect={this.onMenuSelect} - onAddTransaction={this.onAddTransaction} - onToggleExtraBalances={this.onToggleExtraBalances} - onSaveName={this.onSaveName} - onExposeName={this.onExposeName} - onReconcile={this.onReconcile} - onDoneReconciling={this.onDoneReconciling} - onCreateReconciliationTransaction={ - this.onCreateReconciliationTransaction + showAccount={ + !accountId || + accountId === 'offbudget' || + accountId === 'budgeted' || + accountId === 'uncategorized' + } + isAdding={this.state.isAdding} + isNew={this.isNew} + isMatched={this.isMatched} + isFiltered={ + this.state.search !== '' || this.state.filters.length > 0 + } + dateFormat={dateFormat} + hideFraction={hideFraction} + addNotification={addNotification} + renderEmpty={() => + showEmptyMessage ? ( + replaceModal('add-account')} /> + ) : !loading ? ( + + No transactions + + ) : null + } + onChange={this.onTransactionsChange} + onRefetch={this.refetchTransactions} + onRefetchUpToRow={row => + this.paged.refetchUpToRow(row, { + field: 'date', + order: 'desc', + }) } - onSync={this.onSync} - onImport={this.onImport} - onBatchDelete={this.onBatchDelete} - onBatchDuplicate={this.onBatchDuplicate} - onBatchEdit={this.onBatchEdit} - onBatchUnlink={this.onBatchUnlink} - onCreateRule={this.onCreateRule} - onUpdateFilter={this.onUpdateFilter} - onClearFilters={this.onClearFilters} - onReloadSavedFilter={this.onReloadSavedFilter} - onCondOpChange={this.onCondOpChange} - onDeleteFilter={this.onDeleteFilter} - onApplyFilter={this.onApplyFilter} - onScheduleAction={this.onScheduleAction} + onCloseAddTransaction={() => + this.setState({ isAdding: false }) + } + onCreatePayee={this.onCreatePayee} /> - - - - this.paged && this.paged.fetchNext() - } - accounts={accounts} - category={category} - categoryGroups={categoryGroups} - payees={payees} - balances={ - showBalances && this.canCalculateBalance() - ? balances - : null - } - showCleared={showCleared} - showAccount={ - !accountId || - accountId === 'offbudget' || - accountId === 'budgeted' || - accountId === 'uncategorized' - } - isAdding={this.state.isAdding} - isNew={this.isNew} - isMatched={this.isMatched} - isFiltered={ - this.state.search !== '' || this.state.filters.length > 0 - } - dateFormat={dateFormat} - hideFraction={hideFraction} - addNotification={addNotification} - renderEmpty={() => - showEmptyMessage ? ( - replaceModal('add-account')} - /> - ) : !loading ? ( - - No transactions - - ) : null - } - onSort={this.onSort} - sortField={this.state.sort.field} - ascDesc={this.state.sort.ascDesc} - onChange={this.onTransactionsChange} - onRefetch={this.refetchTransactions} - onRefetchUpToRow={row => - this.paged.refetchUpToRow(row, { - field: 'date', - order: 'desc', - }) - } - onCloseAddTransaction={() => - this.setState({ isAdding: false }) - } - onCreatePayee={this.onCreatePayee} - /> - - - ) - } + + + )} ); } diff --git a/packages/desktop-client/src/components/transactions/TransactionsTable.js b/packages/desktop-client/src/components/transactions/TransactionsTable.js index 7df78b74e1b..604dcbaf130 100644 --- a/packages/desktop-client/src/components/transactions/TransactionsTable.js +++ b/packages/desktop-client/src/components/transactions/TransactionsTable.js @@ -1240,11 +1240,7 @@ const Transaction = memo(function Transaction(props) { {showBalance && ( Date: Mon, 17 Jul 2023 09:39:17 -0700 Subject: [PATCH 02/13] Upcoming release notes --- upcoming-release-notes/1354.md | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 upcoming-release-notes/1354.md diff --git a/upcoming-release-notes/1354.md b/upcoming-release-notes/1354.md new file mode 100644 index 00000000000..555096a6932 --- /dev/null +++ b/upcoming-release-notes/1354.md @@ -0,0 +1,6 @@ +--- +category: Enhancements +authors: [joel-jeremy] +--- + +Scheduled transactions for the month to show up in Account's running balance From bac84f7827028892c2f8c1c479d71bdf11c975d9 Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Mon, 17 Jul 2023 10:12:37 -0700 Subject: [PATCH 03/13] Prevent multiple setState on balances --- .../src/components/accounts/Account.js | 13 ++++++------- 1 file changed, 6 insertions(+), 7 deletions(-) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index d74d9eb67fe..ab3e00eed60 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -185,7 +185,7 @@ class AccountInternal extends PureComponent { transactions: [], transactionsCount: 0, showBalances: props.showBalances, - balances: [], + balances: null, showCleared: props.showCleared, editingName: false, isAdding: false, @@ -373,12 +373,11 @@ class AccountInternal extends PureComponent { transactionsFiltered: isFiltered, loading: false, workingHard: false, + balances: this.state.showBalances + ? await this.calculateBalances() + : null, }, () => { - if (this.state.showBalances) { - this.calculateBalances(); - } - if (firstLoad) { this.table.current?.scrollToTop(); } @@ -517,7 +516,7 @@ class AccountInternal extends PureComponent { async calculateBalances() { if (!this.canCalculateBalance()) { - return; + return null; } let { data } = await runQuery( @@ -527,7 +526,7 @@ class AccountInternal extends PureComponent { .select([{ balance: { $sumOver: '$amount' } }]), ); - this.setState({ balances: groupById(data) }); + return groupById(data); } onAddTransaction = () => { From f3e8b79f15dff5a548e18cb9852b87a8a8c8d5f8 Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Mon, 17 Jul 2023 10:13:51 -0700 Subject: [PATCH 04/13] Calculate on toggle showBalances --- packages/desktop-client/src/components/accounts/Account.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index ab3e00eed60..d7f34da10d3 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -590,6 +590,7 @@ class AccountInternal extends PureComponent { search: '', sort: [], showBalances: true, + balances: await this.calculateBalances(), }); this.fetchTransactions(); this.props.savePrefs({ ['show-balances-' + accountId]: true }); From 5bae244816f124d38e7054e88a5c56205a92fb12 Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Mon, 17 Jul 2023 10:41:03 -0700 Subject: [PATCH 05/13] Do not compute scheduled balances if toggle is off --- .../src/components/accounts/Account.js | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index d7f34da10d3..32427e1ebb8 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -77,6 +77,7 @@ function EmptyMessage({ onAdd }) { function AllTransactions({ account = {}, transactions, + showBalances, balances, filtered, children, @@ -112,6 +113,10 @@ function AllTransactions({ }, [schedules, accountId]); let prependBalances = useMemo(() => { + if (!showBalances) { + return null; + } + // balances is in descending order so latest order is at the start of the array. let runningBalance = balances ? Object.values(balances)[0]?.balance ?? 0 @@ -128,7 +133,7 @@ function AllTransactions({ }; }); return groupById(scheduledBalances); - }, [prependTransactions, balances]); + }, [showBalances, prependTransactions, balances]); let allTransactions = useMemo(() => { // Don't prepend scheduled transactions if we are filtering @@ -140,7 +145,7 @@ function AllTransactions({ let allBalances = useMemo(() => { // Don't prepend scheduled transactions if we are filtering - if (!filtered && prependBalances) { + if (showBalances && !filtered && prependBalances) { return { ...prependBalances, ...balances }; } return balances; @@ -404,7 +409,7 @@ class AccountInternal extends PureComponent { loading: true, search: '', showBalances: nextProps.showBalances, - balances: [], + balances: null, showCleared: nextProps.showCleared, }, () => { @@ -1157,6 +1162,7 @@ class AccountInternal extends PureComponent { @@ -1234,11 +1240,7 @@ class AccountInternal extends PureComponent { category={category} categoryGroups={categoryGroups} payees={payees} - balances={ - showBalances && this.canCalculateBalance() - ? allBalances - : null - } + balances={allBalances} showCleared={showCleared} showAccount={ !accountId || From 18dbc3919f158c078c4ac8753b64d2acac92a4a0 Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Mon, 17 Jul 2023 10:44:14 -0700 Subject: [PATCH 06/13] Optimize runningBalance --- .../src/components/accounts/Account.js | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index 32427e1ebb8..e88b01794ae 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -112,15 +112,19 @@ function AllTransactions({ })); }, [schedules, accountId]); - let prependBalances = useMemo(() => { + let runningBalance = useMemo(() => { if (!showBalances) { - return null; + return 0; } // balances is in descending order so latest order is at the start of the array. - let runningBalance = balances - ? Object.values(balances)[0]?.balance ?? 0 - : 0; + return balances ? Object.values(balances)[0]?.balance ?? 0 : 0; + }, [showBalances, balances]); + + let prependBalances = useMemo(() => { + if (!showBalances) { + return null; + } // Reverse so we can calculate from earliest upcoming schedule. let scheduledBalances = prependTransactions.map((_, index, ptArray) => { @@ -133,7 +137,7 @@ function AllTransactions({ }; }); return groupById(scheduledBalances); - }, [showBalances, prependTransactions, balances]); + }, [showBalances, prependTransactions, runningBalance]); let allTransactions = useMemo(() => { // Don't prepend scheduled transactions if we are filtering From 72d47f26c2ec2fd824cf96d8639c14dc135d803d Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Mon, 17 Jul 2023 10:49:06 -0700 Subject: [PATCH 07/13] Fix running balance column show/hide toggle --- packages/desktop-client/src/components/accounts/Account.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index e88b01794ae..7db69d6b7a2 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -148,8 +148,11 @@ function AllTransactions({ }, [filtered, prependTransactions, transactions]); let allBalances = useMemo(() => { + if (!showBalances) { + return null; + } // Don't prepend scheduled transactions if we are filtering - if (showBalances && !filtered && prependBalances) { + if (!filtered && prependBalances) { return { ...prependBalances, ...balances }; } return balances; From 22be2973583137355ba3adacdf4477e5c2e03ab5 Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Mon, 17 Jul 2023 10:51:55 -0700 Subject: [PATCH 08/13] Fix setState balances --- packages/desktop-client/src/components/accounts/Account.js | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index 7db69d6b7a2..d9f7a8fb850 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -148,11 +148,8 @@ function AllTransactions({ }, [filtered, prependTransactions, transactions]); let allBalances = useMemo(() => { - if (!showBalances) { - return null; - } // Don't prepend scheduled transactions if we are filtering - if (!filtered && prependBalances) { + if (showBalances && !filtered && prependBalances) { return { ...prependBalances, ...balances }; } return balances; @@ -593,7 +590,7 @@ class AccountInternal extends PureComponent { case 'toggle-balance': if (this.state.showBalances) { this.props.savePrefs({ ['show-balances-' + accountId]: false }); - this.setState({ showBalances: false, balances: [] }); + this.setState({ showBalances: false, balances: null }); } else { this.setState({ transactions: [], From e44a7923e53baf9011acde065a4588aa97599bd7 Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Mon, 17 Jul 2023 11:01:16 -0700 Subject: [PATCH 09/13] Remove redundant showBalances check --- packages/desktop-client/src/components/accounts/Account.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index d9f7a8fb850..2e0864c9cff 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -149,7 +149,7 @@ function AllTransactions({ let allBalances = useMemo(() => { // Don't prepend scheduled transactions if we are filtering - if (showBalances && !filtered && prependBalances) { + if (!filtered && prependBalances) { return { ...prependBalances, ...balances }; } return balances; From 0e11acd6afb9904f0388c9d96520e75925687ead Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Mon, 17 Jul 2023 11:10:59 -0700 Subject: [PATCH 10/13] Fix filtered behavior --- packages/desktop-client/src/components/accounts/Account.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index 2e0864c9cff..e7274ec672e 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -149,7 +149,7 @@ function AllTransactions({ let allBalances = useMemo(() => { // Don't prepend scheduled transactions if we are filtering - if (!filtered && prependBalances) { + if (!filtered && prependBalances && balances) { return { ...prependBalances, ...balances }; } return balances; From d0ae35db18c1b57a721e4b00b947452e9b886c2f Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Mon, 17 Jul 2023 12:55:35 -0700 Subject: [PATCH 11/13] use showBalances flag in transactions table --- packages/desktop-client/src/components/accounts/Account.js | 1 + .../src/components/transactions/TransactionList.js | 2 ++ .../src/components/transactions/TransactionsTable.js | 7 ++++--- 3 files changed, 7 insertions(+), 3 deletions(-) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index e7274ec672e..ef1f95ae0b7 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -1244,6 +1244,7 @@ class AccountInternal extends PureComponent { category={category} categoryGroups={categoryGroups} payees={payees} + showBalances={showBalances} balances={allBalances} showCleared={showCleared} showAccount={ diff --git a/packages/desktop-client/src/components/transactions/TransactionList.js b/packages/desktop-client/src/components/transactions/TransactionList.js index 2e9b20b4968..6d9a8789552 100644 --- a/packages/desktop-client/src/components/transactions/TransactionList.js +++ b/packages/desktop-client/src/components/transactions/TransactionList.js @@ -64,6 +64,7 @@ export default function TransactionList({ category, categoryGroups, payees, + showBalances, balances, showCleared, showAccount, @@ -172,6 +173,7 @@ export default function TransactionList({ accounts={accounts} categoryGroups={categoryGroups} payees={payees} + showBalances={showBalances} balances={balances} showCleared={showCleared} showAccount={showAccount} diff --git a/packages/desktop-client/src/components/transactions/TransactionsTable.js b/packages/desktop-client/src/components/transactions/TransactionsTable.js index 604dcbaf130..4bb9151dc39 100644 --- a/packages/desktop-client/src/components/transactions/TransactionsTable.js +++ b/packages/desktop-client/src/components/transactions/TransactionsTable.js @@ -1499,6 +1499,7 @@ function TransactionTableInner({ showCleared, showAccount, showCategory, + showBalances, balances, hideFraction, isNew, @@ -1545,7 +1546,7 @@ function TransactionTableInner({ transaction={trans} showAccount={showAccount} showCategory={showCategory} - showBalance={!!balances} + showBalance={showBalances} showCleared={showCleared} hovered={hovered} selected={selected} @@ -1591,7 +1592,7 @@ function TransactionTableInner({ hasSelected={props.selectedItems.size > 0} showAccount={props.showAccount} showCategory={props.showCategory} - showBalance={!!props.balances} + showBalance={props.showBalances} showCleared={props.showCleared} scrollWidth={scrollWidth} onSort={props.onSort} @@ -1615,7 +1616,7 @@ function TransactionTableInner({ payees={props.payees || []} showAccount={props.showAccount} showCategory={props.showCategory} - showBalance={!!props.balances} + showBalance={props.showBalances} showCleared={props.showCleared} dateFormat={dateFormat} hideFraction={props.hideFraction} From f6c5aa514846a2ccb1f7cb6276e6fe678bbdfd4e Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Tue, 18 Jul 2023 13:24:56 -0700 Subject: [PATCH 12/13] Address code review comments --- .../src/components/accounts/Account.js | 35 +++++++++++-------- .../transactions/TransactionList.js | 2 +- .../transactions/TransactionsTable.js | 12 +++---- 3 files changed, 26 insertions(+), 23 deletions(-) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index ef1f95ae0b7..b0aa3669798 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -77,14 +77,16 @@ function EmptyMessage({ onAdd }) { function AllTransactions({ account = {}, transactions, - showBalances, balances, + showBalances, filtered, children, }) { const { id: accountId } = account; let scheduleData = useCachedSchedules(); + transactions ??= []; + let schedules = useMemo( () => scheduleData @@ -117,9 +119,10 @@ function AllTransactions({ return 0; } - // balances is in descending order so latest order is at the start of the array. - return balances ? Object.values(balances)[0]?.balance ?? 0 : 0; - }, [showBalances, balances]); + return balances && transactions?.length > 0 + ? balances[transactions[0].id]?.balance ?? 0 + : 0; + }, [showBalances, balances, transactions]); let prependBalances = useMemo(() => { if (!showBalances) { @@ -127,15 +130,17 @@ function AllTransactions({ } // Reverse so we can calculate from earliest upcoming schedule. - let scheduledBalances = prependTransactions.map((_, index, ptArray) => { - let scheduledTransaction = ptArray[ptArray.length - 1 - index]; - let amount = - (scheduledTransaction._inverse ? -1 : 1) * scheduledTransaction.amount; - return { - balance: (runningBalance += amount), - id: scheduledTransaction.id, - }; - }); + let scheduledBalances = [...prependTransactions] + .reverse() + .map(scheduledTransaction => { + let amount = + (scheduledTransaction._inverse ? -1 : 1) * + scheduledTransaction.amount; + return { + balance: (runningBalance += amount), + id: scheduledTransaction.id, + }; + }); return groupById(scheduledBalances); }, [showBalances, prependTransactions, runningBalance]); @@ -1166,8 +1171,8 @@ class AccountInternal extends PureComponent { {(allTransactions, allBalances) => ( @@ -1244,8 +1249,8 @@ class AccountInternal extends PureComponent { category={category} categoryGroups={categoryGroups} payees={payees} - showBalances={showBalances} balances={allBalances} + showBalances={showBalances} showCleared={showCleared} showAccount={ !accountId || diff --git a/packages/desktop-client/src/components/transactions/TransactionList.js b/packages/desktop-client/src/components/transactions/TransactionList.js index 6d9a8789552..96c4445b012 100644 --- a/packages/desktop-client/src/components/transactions/TransactionList.js +++ b/packages/desktop-client/src/components/transactions/TransactionList.js @@ -64,8 +64,8 @@ export default function TransactionList({ category, categoryGroups, payees, - showBalances, balances, + showBalances, showCleared, showAccount, headerContent, diff --git a/packages/desktop-client/src/components/transactions/TransactionsTable.js b/packages/desktop-client/src/components/transactions/TransactionsTable.js index 4bb9151dc39..56786f47803 100644 --- a/packages/desktop-client/src/components/transactions/TransactionsTable.js +++ b/packages/desktop-client/src/components/transactions/TransactionsTable.js @@ -1551,19 +1551,17 @@ function TransactionTableInner({ hovered={hovered} selected={selected} highlighted={false} - added={isNew && isNew(trans.id)} - expanded={isExpanded && isExpanded(trans.id)} - matched={isMatched && isMatched(trans.id)} + added={isNew?.(trans.id)} + expanded={isExpanded?.(trans.id)} + matched={isMatched?.(trans.id)} showZeroInDeposit={isChildDeposit} - balance={balances && balances[trans.id] && balances[trans.id].balance} + balance={balances?.[trans.id]?.balance} focusedField={editing && tableNavigator.focusedField} accounts={accounts} categoryGroups={categoryGroups} payees={payees} inheritedFields={ - parent && parent.payee === trans.payee - ? new Set(['payee']) - : new Set() + parent?.payee === trans.payee ? new Set(['payee']) : new Set() } dateFormat={dateFormat} hideFraction={hideFraction} From bbddd099b346e8df70d62eedff2a05af9ad0d369 Mon Sep 17 00:00:00 2001 From: Joel Jeremy Marquez Date: Tue, 18 Jul 2023 15:13:26 -0700 Subject: [PATCH 13/13] setState callbacks --- .../src/components/accounts/Account.js | 70 +++++++++++-------- 1 file changed, 41 insertions(+), 29 deletions(-) diff --git a/packages/desktop-client/src/components/accounts/Account.js b/packages/desktop-client/src/components/accounts/Account.js index b0aa3669798..c2f2de4cabc 100644 --- a/packages/desktop-client/src/components/accounts/Account.js +++ b/packages/desktop-client/src/components/accounts/Account.js @@ -597,31 +597,34 @@ class AccountInternal extends PureComponent { this.props.savePrefs({ ['show-balances-' + accountId]: false }); this.setState({ showBalances: false, balances: null }); } else { - this.setState({ - transactions: [], - transactionCount: 0, - filters: [], - search: '', - sort: [], - showBalances: true, - balances: await this.calculateBalances(), - }); - this.fetchTransactions(); this.props.savePrefs({ ['show-balances-' + accountId]: true }); - this.calculateBalances(); + this.setState( + { + transactions: [], + transactionCount: 0, + filters: [], + search: '', + sort: [], + showBalances: true, + }, + () => { + this.fetchTransactions(); + }, + ); } break; case 'remove-sorting': { - let filters = this.state.filters; - this.setState({ sort: [] }); - if (filters.length > 0) { - this.applyFilters([...filters]); - } else { - this.fetchTransactions(); - } - if (this.state.search !== '') { - this.onSearch(this.state.search); - } + this.setState({ sort: [] }, () => { + let filters = this.state.filters; + if (filters.length > 0) { + this.applyFilters([...filters]); + } else { + this.fetchTransactions(); + } + if (this.state.search !== '') { + this.onSearch(this.state.search); + } + }); break; } case 'toggle-cleared': @@ -1028,16 +1031,25 @@ class AccountInternal extends PureComponent { this.currentQuery = this.rootQuery.filter({ [conditionsOpKey]: [...filters, ...customFilters], }); - this.updateQuery(this.currentQuery, true); - this.setState({ filters: conditions }); + + this.setState({ filters: conditions }, () => { + this.updateQuery(this.currentQuery, true); + }); } else { - this.setState({ transactions: [], transactionCount: 0 }); - this.fetchTransactions(); - this.setState({ filters: conditions }); - } + this.setState( + { + transactions: [], + transactionCount: 0, + filters: conditions, + }, + () => { + this.fetchTransactions(); - if (this.state.sort.length !== 0) { - this.applySort(); + if (this.state.sort.length !== 0) { + this.applySort(); + } + }, + ); } };