Revert "Mobile running balance (#4809)" (#5205)

This reverts commit 2c87c44168.
2026-04-29 10:09:21 -05:00 · 2025-06-20 20:37:24 -07:00
parent 0fb9c252ca
commit 6c61cf6a8d
10 changed files with 40 additions and 138 deletions
--- a/packages/desktop-client/src/components/mobile/accounts/AccountTransactions.tsx
+++ b/packages/desktop-client/src/components/mobile/accounts/AccountTransactions.tsx
@@ -16,7 +16,6 @@ import { View } from '@actual-app/components/view';
 import { listen, send } from 'loot-core/platform/client/fetch';
 import { type Query } from 'loot-core/shared/query';
 import { isPreviewId } from 'loot-core/shared/transactions';
-import { type IntegerAmount } from 'loot-core/shared/util';
 import {
  type AccountEntity,
  type TransactionEntity,
@@ -32,9 +31,8 @@ import { SchedulesProvider } from '@desktop-client/hooks/useCachedSchedules';
 import { useDateFormat } from '@desktop-client/hooks/useDateFormat';
 import { useFailedAccounts } from '@desktop-client/hooks/useFailedAccounts';
 import { useNavigate } from '@desktop-client/hooks/useNavigate';
-import { useTransactions } from '@desktop-client/hooks/usePreviewTransactions';
 import { accountSchedulesQuery } from '@desktop-client/hooks/useSchedules';
-import { useSyncedPref } from '@desktop-client/hooks/useSyncedPref';
+import { useTransactions } from '@desktop-client/hooks/useTransactions';
 import { useTransactionsSearch } from '@desktop-client/hooks/useTransactionsSearch';
 import {
  collapseModals,
@@ -150,19 +148,6 @@ function AccountHeader({ account }: { readonly account: AccountEntity }) {
    dispatch(reopenAccount({ id: account.id }));
  }, [account.id, dispatch]);

-  const [showBalances, setBalances] = useSyncedPref(
-    `show-balances-${account.id}`,
-  );
-  const onToggleRunningBalance = useCallback(() => {
-    const newVal = showBalances === 'true' ? 'false' : 'true';
-    setBalances(newVal);
-    dispatch(
-      collapseModals({
-        rootModalName: 'account-menu',
-      }),
-    );
-  }, [showBalances, setBalances, dispatch]);
-
  const onClick = useCallback(() => {
    dispatch(
      pushModal({
@@ -174,7 +159,6 @@ function AccountHeader({ account }: { readonly account: AccountEntity }) {
            onEditNotes,
            onCloseAccount,
            onReopenAccount,
-            onToggleRunningBalance,
          },
        },
      }),
@@ -186,7 +170,6 @@ function AccountHeader({ account }: { readonly account: AccountEntity }) {
    onEditNotes,
    onReopenAccount,
    onSave,
-    onToggleRunningBalance,
  ]);

  return (
@@ -258,6 +241,30 @@ function TransactionListWithPreviews({
  readonly accountName: AccountEntity['name'] | string;
 }) {
  const { t } = useTranslation();
+  const baseTransactionsQuery = useCallback(
+    () =>
+      queries.transactions(accountId).options({ splits: 'all' }).select('*'),
+    [accountId],
+  );
+
+  const [transactionsQuery, setTransactionsQuery] = useState<Query>(
+    baseTransactionsQuery(),
+  );
+  const {
+    transactions,
+    isLoading: isTransactionsLoading,
+    reload: reloadTransactions,
+    isLoadingMore,
+    loadMore: loadMoreTransactions,
+  } = useTransactions({
+    query: transactionsQuery,
+  });
+
+  const { previewTransactions, isLoading: isPreviewTransactionsLoading } =
+    useAccountPreviewTransactions({
+      accountId: account?.id,
+    });
+
  const dateFormat = useDateFormat() || 'MM/dd/yyyy';
  const dispatch = useDispatch();
  const navigate = useNavigate();
@@ -268,59 +275,6 @@ function TransactionListWithPreviews({
    }
  }, [accountId, dispatch]);

-  const baseTransactionsQuery = useCallback(
-    () =>
-      queries.transactions(accountId).options({ splits: 'all' }).select('*'),
-    [accountId],
-  );
-
-  const [showBalances] = useSyncedPref(`show-balances-${accountId}`);
-  const [transactionsQuery, setTransactionsQuery] = useState<Query>(
-    baseTransactionsQuery(),
-  );
-  const {
-    transactions,
-    runningBalances,
-    isLoading: isTransactionsLoading,
-    reload: reloadTransactions,
-    isLoadingMore,
-    loadMore: loadMoreTransactions,
-  } = useTransactions({
-    query: transactionsQuery,
-    options: {
-      calculateRunningBalances: true,
-    },
-  });
-
-  const { isSearching, search: onSearch } = useTransactionsSearch({
-    updateQuery: setTransactionsQuery,
-    resetQuery: () => setTransactionsQuery(baseTransactionsQuery()),
-    dateFormat,
-  });
-
-  const {
-    previewTransactions,
-    runningBalances: previewRunningBalances,
-    isLoading: isPreviewTransactionsLoading,
-  } = useAccountPreviewTransactions({
-    accountId: account?.id,
-    getRunningBalances: showBalances === 'true',
-  });
-
-  useEffect(() => {
-    reloadTransactions();
-  }, [showBalances, reloadTransactions]);
-
-  const allBalances =
-    showBalances === 'true'
-      ? isSearching
-        ? undefined
-        : new Map<TransactionEntity['id'], IntegerAmount>([
-            ...runningBalances,
-            ...previewRunningBalances,
-          ])
-      : undefined;
-
  useEffect(() => {
    if (accountId) {
      dispatch(markAccountRead({ id: accountId }));
@@ -342,6 +296,12 @@ function TransactionListWithPreviews({
    });
  }, [dispatch, reloadTransactions]);

+  const { isSearching, search: onSearch } = useTransactionsSearch({
+    updateQuery: setTransactionsQuery,
+    resetQuery: () => setTransactionsQuery(baseTransactionsQuery()),
+    dateFormat,
+  });
+
  const onOpenTransaction = useCallback(
    (transaction: TransactionEntity) => {
      if (!isPreviewId(transaction.id)) {
@@ -410,7 +370,6 @@ function TransactionListWithPreviews({
      balance={balanceQueries.balance}
      balanceCleared={balanceQueries.cleared}
      balanceUncleared={balanceQueries.uncleared}
-      runningBalances={allBalances}
      isLoadingMore={isLoadingMore}
      onLoadMore={loadMoreTransactions}
      searchPlaceholder={t('Search {{accountName}}', { accountName })}
--- a/packages/desktop-client/src/components/mobile/budget/CategoryTransactions.tsx
+++ b/packages/desktop-client/src/components/mobile/budget/CategoryTransactions.tsx
@@ -154,7 +154,6 @@ function TransactionListWithPreviews({
      balance={balance}
      balanceCleared={balanceCleared}
      balanceUncleared={balanceUncleared}
-      runningBalances={undefined}
      searchPlaceholder={`Search ${category.name}`}
      onSearch={onSearch}
      isLoadingMore={isLoadingMore}
--- a/packages/desktop-client/src/components/mobile/transactions/TransactionList.tsx
+++ b/packages/desktop-client/src/components/mobile/transactions/TransactionList.tsx
@@ -32,11 +32,7 @@ import { View } from '@actual-app/components/view';
 import * as monthUtils from 'loot-core/shared/months';
 import { isPreviewId } from 'loot-core/shared/transactions';
 import { validForTransfer } from 'loot-core/shared/transfer';
-import {
-  groupById,
-  type IntegerAmount,
-  integerToCurrency,
-} from 'loot-core/shared/util';
+import { groupById, integerToCurrency } from 'loot-core/shared/util';
 import {
  type AccountEntity,
  type TransactionEntity,
@@ -87,7 +83,6 @@ function Loading({ style, 'aria-label': ariaLabel }: LoadingProps) {
 type TransactionListProps = {
  isLoading: boolean;
  transactions: readonly TransactionEntity[];
-  runningBalances: Map<TransactionEntity['id'], IntegerAmount> | undefined;
  onOpenTransaction?: (transaction: TransactionEntity) => void;
  isLoadingMore: boolean;
  onLoadMore: () => void;
@@ -97,7 +92,6 @@ type TransactionListProps = {
 export function TransactionList({
  isLoading,
  transactions,
-  runningBalances,
  onOpenTransaction,
  isLoadingMore,
  onLoadMore,
@@ -207,7 +201,6 @@ export function TransactionList({
              {transaction => (
                <TransactionListItem
                  key={transaction.id}
-                  balance={runningBalances?.get(transaction.id) || null}
                  value={transaction}
                  onPress={trans => onTransactionPress(trans)}
                  onLongPress={trans => onTransactionPress(trans, true)}
--- a/packages/desktop-client/src/components/mobile/transactions/TransactionListItem.tsx
+++ b/packages/desktop-client/src/components/mobile/transactions/TransactionListItem.tsx
@@ -30,7 +30,7 @@ import {
 } from '@react-aria/interactions';

 import { isPreviewId } from 'loot-core/shared/transactions';
-import { type IntegerAmount, integerToCurrency } from 'loot-core/shared/util';
+import { integerToCurrency } from 'loot-core/shared/util';
 import {
  type AccountEntity,
  type TransactionEntity,
@@ -38,10 +38,7 @@ import {

 import { lookupName, Status } from './TransactionEdit';

-import {
-  makeAmountFullStyle,
-  makeBalanceAmountStyle,
-} from '@desktop-client/components/budget/util';
+import { makeAmountFullStyle } from '@desktop-client/components/budget/util';
 import { useAccount } from '@desktop-client/hooks/useAccount';
 import { useCachedSchedules } from '@desktop-client/hooks/useCachedSchedules';
 import { useCategories } from '@desktop-client/hooks/useCategories';
@@ -76,13 +73,11 @@ const getScheduleIconStyle = ({ isPreview }: { isPreview: boolean }) => ({
 type TransactionListItemProps = ComponentPropsWithoutRef<
  typeof ListBoxItem<TransactionEntity>
 > & {
-  balance: IntegerAmount | null;
  onPress: (transaction: TransactionEntity) => void;
  onLongPress: (transaction: TransactionEntity) => void;
 };

 export function TransactionListItem({
-  balance,
  onPress,
  onLongPress,
  ...props
@@ -287,7 +282,7 @@ export function TransactionListItem({
                  </TextOneLine>
                )}
              </View>
-              <View style={{ textAlign: 'right' }}>
+              <View style={{ justifyContent: 'center' }}>
                <Text
                  style={{
                    ...textStyle,
@@ -296,17 +291,6 @@ export function TransactionListItem({
                >
                  {integerToCurrency(amount)}
                </Text>
-                {balance != null && (
-                  <Text
-                    style={{
-                      fontSize: 11,
-                      fontWeight: '400',
-                      ...makeBalanceAmountStyle(balance || 0),
-                    }}
-                  >
-                    {integerToCurrency(balance)}
-                  </Text>
-                )}
              </View>
            </View>
          </Button>
--- a/packages/desktop-client/src/components/mobile/transactions/TransactionListWithBalances.tsx
+++ b/packages/desktop-client/src/components/mobile/transactions/TransactionListWithBalances.tsx
@@ -86,7 +86,6 @@ type TransactionListWithBalancesProps = {
  balanceUncleared?:
    | Binding<'category', 'balanceUncleared'>
    | Binding<'account', 'balanceUncleared'>;
-  runningBalances: Map<TransactionEntity['id'], number> | undefined;
  searchPlaceholder: string;
  onSearch: (searchText: string) => void;
  isLoadingMore: boolean;
@@ -102,7 +101,6 @@ export function TransactionListWithBalances({
  balance,
  balanceCleared,
  balanceUncleared,
-  runningBalances,
  searchPlaceholder = 'Search...',
  onSearch,
  isLoadingMore,
@@ -150,7 +148,6 @@ export function TransactionListWithBalances({
          <TransactionList
            isLoading={isLoading}
            transactions={transactions}
-            runningBalances={runningBalances}
            isLoadingMore={isLoadingMore}
            onLoadMore={onLoadMore}
            onOpenTransaction={onOpenTransaction}
--- a/packages/desktop-client/src/components/modals/AccountMenuModal.tsx
+++ b/packages/desktop-client/src/components/modals/AccountMenuModal.tsx
@@ -33,7 +33,6 @@ import { validateAccountName } from '@desktop-client/components/util/accountVali
 import { useAccount } from '@desktop-client/hooks/useAccount';
 import { useAccounts } from '@desktop-client/hooks/useAccounts';
 import { useNotes } from '@desktop-client/hooks/useNotes';
-import { useSyncedPref } from '@desktop-client/hooks/useSyncedPref';
 import { type Modal as ModalType } from '@desktop-client/modals/modalsSlice';

 type AccountMenuModalProps = Extract<
@@ -48,7 +47,6 @@ export function AccountMenuModal({
  onReopenAccount,
  onEditNotes,
  onClose,
-  onToggleRunningBalance,
 }: AccountMenuModalProps) {
  const { t } = useTranslation();
  const account = useAccount(accountId);
@@ -126,7 +124,6 @@ export function AccountMenuModal({
                account={account}
                onClose={onCloseAccount}
                onReopen={onReopenAccount}
-                onToggleRunningBalance={onToggleRunningBalance}
              />
            }
            title={
@@ -161,7 +158,7 @@ export function AccountMenuModal({
                notes={
                  originalNotes && originalNotes.length > 0
                    ? originalNotes
-                    : t('No notes')
+                    : 'No notes'
                }
                editable={false}
                focused={false}
@@ -204,16 +201,13 @@ type AdditionalAccountMenuProps = {
  account: AccountEntity;
  onClose?: (accountId: string) => void;
  onReopen?: (accountId: string) => void;
-  onToggleRunningBalance?: () => void;
 };

 function AdditionalAccountMenu({
  account,
  onClose,
  onReopen,
-  onToggleRunningBalance,
 }: AdditionalAccountMenuProps) {
-  const { t } = useTranslation();
  const triggerRef = useRef(null);
  const [menuOpen, setMenuOpen] = useState(false);
  const itemStyle: CSSProperties = {
@@ -225,7 +219,6 @@ function AdditionalAccountMenu({
    ...itemStyle,
    ...(item.name === 'close' && { color: theme.errorTextMenu }),
  });
-  const [showBalances] = useSyncedPref(`show-balances-${account.id}`);

  return (
    <View>
@@ -251,23 +244,16 @@ function AdditionalAccountMenu({
          <Menu
            getItemStyle={getItemStyle}
            items={[
-              {
-                name: 'balance',
-                text:
-                  showBalances === 'true'
-                    ? t('Hide running balance')
-                    : t('Show running balance'),
-              },
              account.closed
                ? {
                    name: 'reopen',
-                    text: t('Reopen account'),
+                    text: 'Reopen account',
                    icon: SvgLockOpen,
                    iconSize: 15,
                  }
                : {
                    name: 'close',
-                    text: t('Close account'),
+                    text: 'Close account',
                    icon: SvgClose,
                    iconSize: 15,
                  },
@@ -281,9 +267,6 @@ function AdditionalAccountMenu({
                case 'reopen':
                  onReopen?.(account.id);
                  break;
-                case 'balance':
-                  onToggleRunningBalance?.();
-                  break;
                default:
                  throw new Error(`Unrecognized menu option: ${name}`);
              }
--- a/packages/desktop-client/src/components/reports/reports/Calendar.tsx
+++ b/packages/desktop-client/src/components/reports/reports/Calendar.tsx
@@ -709,7 +709,6 @@ function CalendarInner({ widget, parameters }: CalendarInnerProps) {
                      onOpenTransaction={onOpenTransaction}
                      isLoadingMore={false}
                      account={undefined}
-                      runningBalances={undefined}
                    />
                  </View>
                </animated.div>
--- a/packages/desktop-client/src/hooks/useAccountPreviewTransactions.ts
+++ b/packages/desktop-client/src/hooks/useAccountPreviewTransactions.ts
@@ -1,6 +1,6 @@
 import { useCallback, useMemo } from 'react';

-import { groupById, type IntegerAmount } from 'loot-core/shared/util';
+import { groupById } from 'loot-core/shared/util';
 import {
  type ScheduleEntity,
  type AccountEntity,
@@ -17,7 +17,6 @@ import { accountBalance } from '@desktop-client/spreadsheet/bindings';

 type UseAccountPreviewTransactionsProps = {
  accountId?: AccountEntity['id'] | undefined;
-  getRunningBalances?: boolean;
 };

 type UseAccountPreviewTransactionsResult = ReturnType<
@@ -30,7 +29,6 @@ type UseAccountPreviewTransactionsResult = ReturnType<
 */
 export function useAccountPreviewTransactions({
  accountId,
-  getRunningBalances,
 }: UseAccountPreviewTransactionsProps): UseAccountPreviewTransactionsResult {
  const accounts = useAccounts();
  const accountsById = useMemo(() => groupById(accounts), [accounts]);
@@ -110,14 +108,11 @@ export function useAccountPreviewTransactions({
    return {
      isLoading,
      previewTransactions,
-      runningBalances: getRunningBalances
-        ? runningBalances
-        : new Map<AccountEntity['id'], IntegerAmount>(),
+      runningBalances,
      error,
    };
  }, [
    accountId,
-    getRunningBalances,
    allPreviewTransactions,
    allRunningBalances,
    error,
--- a/packages/desktop-client/src/modals/modalsSlice.ts
+++ b/packages/desktop-client/src/modals/modalsSlice.ts
@@ -282,7 +282,6 @@ export type Modal =
        onReopenAccount: (accountId: AccountEntity['id']) => void;
        onEditNotes: (id: NoteEntity['id']) => void;
        onClose?: () => void;
-        onToggleRunningBalance?: () => void;
      };
    }
  | {
--- a/upcoming-release-notes/4809.md
+++ b/upcoming-release-notes/4809.md
@@ -1,6 +0,0 @@
---
-category: Enhancements
-authors: [youngcw]
---
-
-Add running balance to mobile