Update remaining accounts hooks to return react query states (#7071)

* Update remaining accounts hooks to return react query states

* Add release notes for PR #7071

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
This commit is contained in:
Joel Jeremy Marquez
2026-03-04 15:13:55 -08:00
committed by GitHub
parent 295a565e55
commit b3a86b5392
8 changed files with 16 additions and 17 deletions

View File

@@ -32,6 +32,7 @@ import { accountQueries } from '@desktop-client/accounts';
import { getLatestAppVersion, sync } from '@desktop-client/app/appSlice';
import { ProtectedRoute } from '@desktop-client/auth/ProtectedRoute';
import { Permissions } from '@desktop-client/auth/types';
import { useAccounts } from '@desktop-client/hooks/useAccounts';
import { useGlobalPref } from '@desktop-client/hooks/useGlobalPref';
import { useLocalPref } from '@desktop-client/hooks/useLocalPref';
import { useMetaThemeColor } from '@desktop-client/hooks/useMetaThemeColor';
@@ -91,10 +92,7 @@ export function FinancesApp() {
const dispatch = useDispatch();
const { t } = useTranslation();
// TODO: Replace with `useAccounts` hook once it's updated to return the useQuery results.
const { data: accounts, isFetching: isAccountsFetching } = useQuery(
accountQueries.list(),
);
const { data: accounts, isFetching: isAccountsFetching } = useAccounts();
const versionInfo = useSelector(state => state.app.versionInfo);
const [notifyWhenUpdateIsAvailable] = useGlobalPref(

View File

@@ -49,7 +49,7 @@ function TransactionListWithPreviews() {
} = useTransactions({
query: transactionsQuery,
});
const offBudgetAccounts = useOffBudgetAccounts();
const { data: offBudgetAccounts = [] } = useOffBudgetAccounts();
const offBudgetAccountsFilter = useCallback(
(schedule: ScheduleEntity) =>
offBudgetAccounts.some(a => a.id === schedule._account),

View File

@@ -49,7 +49,7 @@ function TransactionListWithPreviews() {
} = useTransactions({
query: transactionsQuery,
});
const onBudgetAccounts = useOnBudgetAccounts();
const { data: onBudgetAccounts = [] } = useOnBudgetAccounts();
const onBudgetAccountsFilter = useCallback(
(schedule: ScheduleEntity) =>
onBudgetAccounts.some(a => a.id === schedule._account),

View File

@@ -28,9 +28,9 @@ export function Accounts() {
const { data: accounts = [] } = useAccounts();
const failedAccounts = useFailedAccounts();
const updatedAccounts = useUpdatedAccounts();
const offbudgetAccounts = useOffBudgetAccounts();
const onBudgetAccounts = useOnBudgetAccounts();
const closedAccounts = useClosedAccounts();
const { data: offbudgetAccounts = [] } = useOffBudgetAccounts();
const { data: onBudgetAccounts = [] } = useOnBudgetAccounts();
const { data: closedAccounts = [] } = useClosedAccounts();
const syncingAccountIds = useSelector(state => state.account.accountsSyncing);
const getAccountPath = (account: AccountEntity) => `/accounts/${account.id}`;

View File

@@ -3,8 +3,5 @@ import { useQuery } from '@tanstack/react-query';
import { accountQueries } from '@desktop-client/accounts';
export function useClosedAccounts() {
const query = useQuery(accountQueries.listClosed());
// TODO: Update to return query states (e.g. isFetching, isError, etc)
// so clients can handle loading and error states appropriately.
return query.data ?? [];
return useQuery(accountQueries.listClosed());
}

View File

@@ -3,6 +3,5 @@ import { useQuery } from '@tanstack/react-query';
import { accountQueries } from '@desktop-client/accounts';
export function useOffBudgetAccounts() {
const query = useQuery(accountQueries.listOffBudget());
return query.data ?? [];
return useQuery(accountQueries.listOffBudget());
}

View File

@@ -3,6 +3,5 @@ import { useQuery } from '@tanstack/react-query';
import { accountQueries } from '@desktop-client/accounts';
export function useOnBudgetAccounts() {
const query = useQuery(accountQueries.listOnBudget());
return query.data ?? [];
return useQuery(accountQueries.listOnBudget());
}

View File

@@ -0,0 +1,6 @@
---
category: Enhancements
authors: [joel-jeremy]
---
Refactor account hooks to return full React Query states, enhancing data handling and component integration.