diff --git a/packages/desktop-client/src/hooks/useAccounts.ts b/packages/desktop-client/src/hooks/useAccounts.ts index 98d32a37cef..bc74fb60932 100644 --- a/packages/desktop-client/src/hooks/useAccounts.ts +++ b/packages/desktop-client/src/hooks/useAccounts.ts @@ -1,3 +1,4 @@ +import { useEffect } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { getAccounts } from 'loot-core/client/actions'; @@ -6,9 +7,11 @@ export function useAccounts() { const dispatch = useDispatch(); const accountLoaded = useSelector(state => state.queries.accountsLoaded); - if (!accountLoaded) { - dispatch(getAccounts()); - } + useEffect(() => { + if (!accountLoaded) { + dispatch(getAccounts()); + } + }, []); return useSelector(state => state.queries.accounts); } diff --git a/packages/desktop-client/src/hooks/useCategories.ts b/packages/desktop-client/src/hooks/useCategories.ts index 8ac1d9ff344..ecfd013464c 100644 --- a/packages/desktop-client/src/hooks/useCategories.ts +++ b/packages/desktop-client/src/hooks/useCategories.ts @@ -1,3 +1,4 @@ +import { useEffect } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { getCategories } from 'loot-core/client/actions'; @@ -6,9 +7,11 @@ export function useCategories() { const dispatch = useDispatch(); const categoriesLoaded = useSelector(state => state.queries.categoriesLoaded); - if (!categoriesLoaded) { - dispatch(getCategories()); - } + useEffect(() => { + if (!categoriesLoaded) { + dispatch(getCategories()); + } + }, []); return useSelector( state => state.queries.categories, diff --git a/packages/desktop-client/src/hooks/usePayees.ts b/packages/desktop-client/src/hooks/usePayees.ts index b68665cc9bd..7892269866b 100644 --- a/packages/desktop-client/src/hooks/usePayees.ts +++ b/packages/desktop-client/src/hooks/usePayees.ts @@ -1,3 +1,4 @@ +import { useEffect } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { getPayees } from 'loot-core/client/actions'; @@ -6,9 +7,11 @@ export function usePayees() { const dispatch = useDispatch(); const payeesLoaded = useSelector(state => state.queries.payeesLoaded); - if (!payeesLoaded) { - dispatch(getPayees()); - } + useEffect(() => { + if (!payeesLoaded) { + dispatch(getPayees()); + } + }, []); return useSelector(state => state.queries.payees); }