Fix error

packages/api/index.ts

@@ -8,7 +8,7 @@ import type {
 import type { InitConfig } from 'loot-core/server/main';
 
 // @ts-ignore: bundle not available until we build it
-// eslint-disable-next-line import/extensions
+// eslint-disable-next-line import/extensions, import/no-unresolved
 import * as bundle from './app/bundle.api.js';
 import * as injected from './injected';
 import { validateNodeVersion } from './validateNodeVersion';

packages/desktop-client/src/auth/AuthProvider.tsx

@@ -1,7 +1,7 @@
 import React, { createContext, useContext, type ReactNode } from 'react';
 
 import { useServerURL } from '../components/ServerContext';
-import { useSelector } from '../redux';
+import { useAppSelector } from '../redux';
 
 import { type Permissions } from './types';
 
@@ -16,7 +16,7 @@ type AuthProviderProps = {
 };
 
 export const AuthProvider = ({ children }: AuthProviderProps) => {
-  const userData = useSelector(state => state.user.data);
+  const userData = useAppSelector(state => state.user.data);
   const serverUrl = useServerURL();
 
   const hasPermission = (permission?: Permissions) => {

packages/desktop-client/src/auth/ProtectedRoute.tsx

@@ -4,7 +4,7 @@ import { type RemoteFile, type SyncedLocalFile } from 'loot-core/types/file';
 
 import { View } from '../components/common/View';
 import { useMetadataPref } from '../hooks/useMetadataPref';
-import { useSelector } from '../redux';
+import { useAppSelector } from '../redux';
 
 import { useAuth } from './AuthProvider';
 import { type Permissions } from './types';
@@ -23,13 +23,13 @@ export const ProtectedRoute = ({
   const { hasPermission } = useAuth();
   const [permissionGranted, setPermissionGranted] = useState(false);
   const [cloudFileId] = useMetadataPref('cloudFileId');
-  const allFiles = useSelector(state => state.budgets.allFiles || []);
+  const allFiles = useAppSelector(state => state.budgets.allFiles || []);
   const remoteFiles = allFiles.filter(
     (f): f is SyncedLocalFile | RemoteFile =>
       f.state === 'remote' || f.state === 'synced' || f.state === 'detached',
   );
   const currentFile = remoteFiles.find(f => f.cloudFileId === cloudFileId);
-  const userData = useSelector(state => state.user.data);
+  const userData = useAppSelector(state => state.user.data);
 
   useEffect(() => {
     const hasRequiredPermission = hasPermission(permission);

packages/desktop-client/src/components/App.tsx

@@ -28,7 +28,7 @@ import {
 
 import { useMetadataPref } from '../hooks/useMetadataPref';
 import { installPolyfills } from '../polyfills';
-import { useDispatch, useSelector } from '../redux';
+import { useAppDispatch, useAppSelector } from '../redux';
 import { styles, hasHiddenScrollbars, ThemeStyle, useTheme } from '../style';
 import { ExposeNavigate } from '../util/router-tools';
 
@@ -49,8 +49,8 @@ function AppInner() {
   const [cloudFileId] = useMetadataPref('cloudFileId');
   const { t } = useTranslation();
   const { showBoundary: showErrorBoundary } = useErrorBoundary();
-  const dispatch = useDispatch();
-  const userData = useSelector(state => state.user.data);
+  const dispatch = useAppDispatch();
+  const userData = useAppSelector(state => state.user.data);
 
   useEffect(() => {
     const maybeUpdate = async <T,>(cb?: () => T): Promise<T> => {
@@ -163,7 +163,7 @@ export function App() {
   const [hiddenScrollbars, setHiddenScrollbars] = useState(
     hasHiddenScrollbars(),
   );
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   useEffect(() => {
     function checkScrollbars() {

packages/desktop-client/src/components/AppBackground.tsx

@@ -4,7 +4,7 @@ import { useTransition, animated } from 'react-spring';
 import { css } from '@emotion/css';
 
 import { AnimatedLoading } from '../icons/AnimatedLoading';
-import { useSelector } from '../redux';
+import { useAppSelector } from '../redux';
 import { theme } from '../style';
 
 import { Background } from './Background';
@@ -16,7 +16,7 @@ type AppBackgroundProps = {
 };
 
 export function AppBackground({ isLoading }: AppBackgroundProps) {
-  const loadingText = useSelector(state => state.app.loadingText);
+  const loadingText = useAppSelector(state => state.app.loadingText);
   const showLoading = isLoading || loadingText !== null;
   const transitions = useTransition(loadingText, {
     from: { opacity: 0, transform: 'translateY(-100px)' },

packages/desktop-client/src/components/BankSyncStatus.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { Trans } from 'react-i18next';
 import { useTransition, animated } from 'react-spring';
 
-import { useSelector } from '../redux';
+import { useAppSelector } from '../redux';
 import { theme, styles } from '../style';
 
 import { AnimatedRefresh } from './AnimatedRefresh';
@@ -10,7 +10,9 @@ import { Text } from './common/Text';
 import { View } from './common/View';
 
 export function BankSyncStatus() {
-  const accountsSyncing = useSelector(state => state.account.accountsSyncing);
+  const accountsSyncing = useAppSelector(
+    state => state.account.accountsSyncing,
+  );
   const accountsSyncingCount = accountsSyncing.length;
   const count = accountsSyncingCount;
 

packages/desktop-client/src/components/FinancesApp.tsx

@@ -19,7 +19,7 @@ import { useAccounts } from '../hooks/useAccounts';
 import { useLocalPref } from '../hooks/useLocalPref';
 import { useMetaThemeColor } from '../hooks/useMetaThemeColor';
 import { useNavigate } from '../hooks/useNavigate';
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 import { theme } from '../style';
 import { getIsOutdated, getLatestVersion } from '../util/versions';
 
@@ -86,11 +86,11 @@ export function FinancesApp() {
   const { isNarrowWidth } = useResponsive();
   useMetaThemeColor(isNarrowWidth ? theme.mobileViewTheme : null);
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const { t } = useTranslation();
 
   const accounts = useAccounts();
-  const accountsLoaded = useSelector(state => state.queries.accountsLoaded);
+  const accountsLoaded = useAppSelector(state => state.queries.accountsLoaded);
 
   const [lastUsedVersion, setLastUsedVersion] = useLocalPref(
     'flags.updateNotificationShownForVersion',

packages/desktop-client/src/components/HelpMenu.tsx

@@ -9,7 +9,7 @@ import { pushModal } from 'loot-core/client/actions/modals';
 
 import { useFeatureFlag } from '../hooks/useFeatureFlag';
 import { SvgHelp } from '../icons/v2/Help';
-import { useDispatch } from '../redux';
+import { useAppDispatch } from '../redux';
 
 import { Button } from './common/Button2';
 import { Menu } from './common/Menu';
@@ -75,7 +75,7 @@ export const HelpMenu = () => {
   const [isMenuOpen, toggleMenuOpen, setMenuOpen] = useToggle();
   const menuButtonRef = useRef(null);
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const page = useLocation().pathname;
 
   const handleItemSelect = (item: HelpMenuItem) => {

packages/desktop-client/src/components/LoggedInUser.tsx

@@ -10,7 +10,7 @@ import { useAuth } from '../auth/AuthProvider';
 import { Permissions } from '../auth/types';
 import { useMetadataPref } from '../hooks/useMetadataPref';
 import { useNavigate } from '../hooks/useNavigate';
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 import { theme, styles } from '../style';
 
 import { Button } from './common/Button2';
@@ -33,9 +33,9 @@ export function LoggedInUser({
   color,
 }: LoggedInUserProps) {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const navigate = useNavigate();
-  const userData = useSelector(state => state.user.data);
+  const userData = useAppSelector(state => state.user.data);
   const [loading, setLoading] = useState(true);
   const [menuOpen, setMenuOpen] = useState(false);
   const serverUrl = useServerURL();
@@ -45,12 +45,12 @@ export function LoggedInUser({
   const location = useLocation();
   const { hasPermission } = useAuth();
   const multiuserEnabled = useMultiuserEnabled();
-  const allFiles = useSelector(state => state.budgets.allFiles || []);
+  const allFiles = useAppSelector(state => state.budgets.allFiles || []);
   const remoteFiles = allFiles.filter(
     f => f.state === 'remote' || f.state === 'synced' || f.state === 'detached',
   ) as (SyncedLocalFile | RemoteFile)[];
   const currentFile = remoteFiles.find(f => f.cloudFileId === cloudFileId);
-  const hasSyncedPrefs = useSelector(state => state.prefs.synced);
+  const hasSyncedPrefs = useAppSelector(state => state.prefs.synced);
 
   useEffect(() => {
     async function init() {

packages/desktop-client/src/components/ManageRules.tsx

@@ -24,7 +24,7 @@ import { useAccounts } from '../hooks/useAccounts';
 import { useCategories } from '../hooks/useCategories';
 import { usePayees } from '../hooks/usePayees';
 import { useSelected, SelectedProvider } from '../hooks/useSelected';
-import { useDispatch } from '../redux';
+import { useAppDispatch } from '../redux';
 import { theme } from '../style';
 
 import { Button } from './common/Button2';
@@ -113,7 +113,7 @@ export function ManageRules({
   const [allRules, setAllRules] = useState([]);
   const [page, setPage] = useState(0);
   const [filter, setFilter] = useState('');
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const { schedules = [] } = useSchedules({
     query: useMemo(() => q('schedules').select('*'), []),

packages/desktop-client/src/components/Modals.tsx

@@ -9,7 +9,7 @@ import * as monthUtils from 'loot-core/src/shared/months';
 
 import { useMetadataPref } from '../hooks/useMetadataPref';
 import { useModalState } from '../hooks/useModalState';
-import { useDispatch } from '../redux';
+import { useAppDispatch } from '../redux';
 
 import { ModalTitle, ModalHeader } from './common/Modal';
 import { AccountAutocompleteModal } from './modals/AccountAutocompleteModal';
@@ -79,7 +79,7 @@ import { NamespaceContext } from './spreadsheet/NamespaceContext';
 
 export function Modals() {
   const location = useLocation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const { modalStack } = useModalState();
   const [budgetId] = useMetadataPref('id');
 

packages/desktop-client/src/components/Notifications.tsx

@@ -15,7 +15,7 @@ import type { NotificationWithId } from 'loot-core/src/client/state-types/notifi
 
 import { AnimatedLoading } from '../icons/AnimatedLoading';
 import { SvgDelete } from '../icons/v0';
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 import { styles, theme } from '../style';
 
 import { Button, ButtonWithLoading } from './common/Button2';
@@ -262,10 +262,12 @@ function Notification({
 }
 
 export function Notifications({ style }: { style?: CSSProperties }) {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const { isNarrowWidth } = useResponsive();
-  const notifications = useSelector(state => state.notifications.notifications);
-  const notificationInset = useSelector(state => state.notifications.inset);
+  const notifications = useAppSelector(
+    state => state.notifications.notifications,
+  );
+  const notificationInset = useAppSelector(state => state.notifications.inset);
   return (
     <View
       style={{

packages/desktop-client/src/components/Titlebar.tsx

@@ -25,7 +25,7 @@ import {
   SvgViewHide,
   SvgViewShow,
 } from '../icons/v2';
-import { useDispatch } from '../redux';
+import { useAppDispatch } from '../redux';
 import { theme, styles, type CSSProperties } from '../style';
 
 import { AccountSyncCheck } from './accounts/AccountSyncCheck';
@@ -110,7 +110,7 @@ type SyncButtonProps = {
 function SyncButton({ style, isMobile = false }: SyncButtonProps) {
   const { t } = useTranslation();
   const [cloudFileId] = useMetadataPref('cloudFileId');
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [syncing, setSyncing] = useState(false);
   const [syncState, setSyncState] = useState<
     null | 'offline' | 'local' | 'disabled' | 'error'

packages/desktop-client/src/components/UpdateNotification.tsx

@@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next';
 import { setAppState, updateApp } from 'loot-core/client/app/appSlice';
 
 import { SvgClose } from '../icons/v1';
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 import { theme } from '../style';
 
 import { Button } from './common/Button2';
@@ -14,12 +14,12 @@ import { View } from './common/View';
 
 export function UpdateNotification() {
   const { t } = useTranslation();
-  const updateInfo = useSelector(state => state.app.updateInfo);
-  const showUpdateNotification = useSelector(
+  const updateInfo = useAppSelector(state => state.app.updateInfo);
+  const showUpdateNotification = useAppSelector(
     state => state.app.showUpdateNotification,
   );
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const onRestart = () => {
     dispatch(updateApp());
   };

packages/desktop-client/src/components/accounts/Account.tsx

@@ -82,7 +82,7 @@ import {
 } from '../../hooks/useSplitsExpanded';
 import { useSyncedPref } from '../../hooks/useSyncedPref';
 import { useTransactionBatchActions } from '../../hooks/useTransactionBatchActions';
-import { useSelector, useDispatch } from '../../redux';
+import { useAppSelector, useAppDispatch } from '../../redux';
 import { styles, theme } from '../../style';
 import { Button } from '../common/Button2';
 import { Text } from '../common/Text';
@@ -1908,7 +1908,7 @@ type AccountHackProps = Omit<
 
 function AccountHack(props: AccountHackProps) {
   const { dispatch: splitsExpandedDispatch } = useSplitsExpanded();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const {
     onBatchEdit,
     onBatchDuplicate,
@@ -1936,8 +1936,10 @@ export function Account() {
   const location = useLocation();
 
   const { grouped: categoryGroups } = useCategories();
-  const newTransactions = useSelector(state => state.queries.newTransactions);
-  const matchedTransactions = useSelector(
+  const newTransactions = useAppSelector(
+    state => state.queries.newTransactions,
+  );
+  const matchedTransactions = useAppSelector(
     state => state.queries.matchedTransactions,
   );
   const accounts = useAccounts();
@@ -1958,8 +1960,12 @@ export function Account() {
   const [showExtraBalances, setShowExtraBalances] = useSyncedPref(
     `show-extra-balances-${params.id || 'all-accounts'}`,
   );
-  const modalShowing = useSelector(state => state.modals.modalStack.length > 0);
-  const accountsSyncing = useSelector(state => state.account.accountsSyncing);
+  const modalShowing = useAppSelector(
+    state => state.modals.modalStack.length > 0,
+  );
+  const accountsSyncing = useAppSelector(
+    state => state.account.accountsSyncing,
+  );
   const filterConditions = location?.state?.filterConditions || [];
 
   const savedFiters = useFilters();

packages/desktop-client/src/components/accounts/AccountSyncCheck.tsx

@@ -9,7 +9,7 @@ import { authorizeBank } from '../../gocardless';
 import { useAccounts } from '../../hooks/useAccounts';
 import { useFailedAccounts } from '../../hooks/useFailedAccounts';
 import { SvgExclamationOutline } from '../../icons/v1';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Button } from '../common/Button2';
 import { Link } from '../common/Link';
@@ -84,7 +84,7 @@ function useErrorMessage() {
 export function AccountSyncCheck() {
   const accounts = useAccounts();
   const failedAccounts = useFailedAccounts();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const { id } = useParams();
   const [open, setOpen] = useState(false);
   const triggerRef = useRef(null);

packages/desktop-client/src/components/admin/UserAccess/UserAccess.tsx

@@ -20,7 +20,7 @@ import { type UserAccessEntity } from 'loot-core/types/models/userAccess';
 import { useMetadataPref } from '../../../hooks/useMetadataPref';
 import { SvgLockOpen } from '../../../icons/v1';
 import { SvgLockClosed } from '../../../icons/v2';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme } from '../../../style';
 import { Button } from '../../common/Button2';
 import { Link } from '../../common/Link';
@@ -269,7 +269,7 @@ type LockToggleProps = {
 
 function LockToggle({ style, onToggleSave }: LockToggleProps) {
   const [hover, setHover] = useState(false);
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   return (
     <Button

packages/desktop-client/src/components/admin/UserAccess/UserAccessRow.tsx

@@ -8,7 +8,7 @@ import { getUserAccessErrors } from 'loot-core/shared/errors';
 import { type UserAvailable } from 'loot-core/types/models';
 
 import { useMetadataPref } from '../../../hooks/useMetadataPref';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme } from '../../../style';
 import { View } from '../../common/View';
 import { Checkbox } from '../../forms';
@@ -23,7 +23,7 @@ type UserAccessProps = {
 export const UserAccessRow = memo(
   ({ access, hovered, onHover }: UserAccessProps) => {
     const { t } = useTranslation();
-    const dispatch = useDispatch();
+    const dispatch = useAppDispatch();
 
     const backgroundFocus = hovered;
     const [marked, setMarked] = useState(

packages/desktop-client/src/components/admin/UserDirectory/UserDirectory.tsx

@@ -20,7 +20,7 @@ import {
 } from 'loot-core/types/models/user';
 
 import { SelectedProvider, useSelected } from '../../../hooks/useSelected';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme } from '../../../style';
 import { Button } from '../../common/Button2';
 import { Link } from '../../common/Link';
@@ -85,7 +85,7 @@ function UserDirectoryContent({
   const [allUsers, setAllUsers] = useState([]);
   const [page, setPage] = useState(0);
   const [filter, setFilter] = useState('');
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const { getUserDirectoryErrors } = useGetUserDirectoryErrors();
 

packages/desktop-client/src/components/autocomplete/PayeeAutocomplete.tsx

@@ -28,7 +28,7 @@ import {
 import { useAccounts } from '../../hooks/useAccounts';
 import { useCommonPayees, usePayees } from '../../hooks/usePayees';
 import { SvgAdd, SvgBookmark } from '../../icons/v1';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme, styles } from '../../style';
 import { Button } from '../common/Button';
 import { TextOneLine } from '../common/TextOneLine';
@@ -322,7 +322,7 @@ export function PayeeAutocomplete({
     return [{ id: 'new', favorite: 0, name: '' }, ...filteredSuggestions];
   }, [commonPayees, payees, focusTransferPayees, accounts, hasPayeeInput]);
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   async function handleSelect(idOrIds, rawInputValue) {
     if (!clearOnBlur) {

packages/desktop-client/src/components/budget/index.tsx

@@ -24,7 +24,7 @@ import { useGlobalPref } from '../../hooks/useGlobalPref';
 import { useLocalPref } from '../../hooks/useLocalPref';
 import { useNavigate } from '../../hooks/useNavigate';
 import { useSyncedPref } from '../../hooks/useSyncedPref';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles } from '../../style';
 import { View } from '../common/View';
 import { NamespaceContext } from '../spreadsheet/NamespaceContext';
@@ -66,7 +66,7 @@ function BudgetInner(props: BudgetInnerProps) {
   const { t } = useTranslation();
   const currentMonth = monthUtils.currentMonth();
   const spreadsheet = useSpreadsheet();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const navigate = useNavigate();
   const [summaryCollapsed, setSummaryCollapsedPref] = useLocalPref(
     'budget.summaryCollapsed',

packages/desktop-client/src/components/manager/BudgetList.tsx

@@ -42,7 +42,7 @@ import {
   SvgUserGroup,
 } from '../../icons/v1';
 import { SvgCloudUnknown, SvgKey, SvgRefreshArrow } from '../../icons/v2';
-import { useSelector, useDispatch } from '../../redux';
+import { useAppSelector, useAppDispatch } from '../../redux';
 import { styles, theme } from '../../style';
 import { tokens } from '../../tokens';
 import { Button } from '../common/Button2';
@@ -498,12 +498,12 @@ function BudgetListHeader({
 }
 
 export function BudgetList({ showHeader = true, quickSwitchMode = false }) {
-  const dispatch = useDispatch();
-  const allFiles = useSelector(state => state.budgets.allFiles || []);
+  const dispatch = useAppDispatch();
+  const allFiles = useAppSelector(state => state.budgets.allFiles || []);
   const multiuserEnabled = useMultiuserEnabled();
   const [id] = useMetadataPref('id');
   const [currentUserId, setCurrentUserId] = useState('');
-  const userData = useSelector(state => state.user.data);
+  const userData = useAppSelector(state => state.user.data);
 
   const fetchUsers = useCallback(async () => {
     try {
@@ -670,7 +670,7 @@ type UserAccessForFileProps = {
 };
 
 function UserAccessForFile({ fileId, currentUserId }: UserAccessForFileProps) {
-  const allFiles = useSelector(state => state.budgets.allFiles || []);
+  const allFiles = useAppSelector(state => state.budgets.allFiles || []);
   const remoteFiles = allFiles.filter(
     f => f.state === 'remote' || f.state === 'synced' || f.state === 'detached',
   ) as (SyncedLocalFile | RemoteFile)[];

packages/desktop-client/src/components/manager/ConfigServer.tsx

@@ -10,7 +10,7 @@ import {
 
 import { useGlobalPref } from '../../hooks/useGlobalPref';
 import { useNavigate } from '../../hooks/useNavigate';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Button, ButtonWithLoading } from '../common/Button2';
 import { BigInput } from '../common/Input';
@@ -23,7 +23,7 @@ import { Title } from './subscribe/common';
 
 export function ConfigServer() {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const navigate = useNavigate();
   const [url, setUrl] = useState('');
   const currentUrl = useServerURL();

packages/desktop-client/src/components/manager/ManagementApp.tsx

@@ -7,7 +7,7 @@ import { setAppState } from 'loot-core/client/app/appSlice';
 import { ProtectedRoute } from '../../auth/ProtectedRoute';
 import { Permissions } from '../../auth/types';
 import { useMetaThemeColor } from '../../hooks/useMetaThemeColor';
-import { useSelector, useDispatch } from '../../redux';
+import { useAppSelector, useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { tokens } from '../../tokens';
 import {
@@ -63,16 +63,16 @@ export function ManagementApp() {
     isNarrowWidth ? theme.mobileConfigServerViewTheme : undefined,
   );
 
-  const files = useSelector(state => state.budgets.allFiles);
-  const isLoading = useSelector(state => state.app.loadingText !== null);
-  const userData = useSelector(state => state.user.data);
+  const files = useAppSelector(state => state.budgets.allFiles);
+  const isLoading = useAppSelector(state => state.app.loadingText !== null);
+  const userData = useAppSelector(state => state.user.data);
   const multiuserEnabled = useMultiuserEnabled();
 
-  const managerHasInitialized = useSelector(
+  const managerHasInitialized = useAppSelector(
     state => state.app.managerHasInitialized,
   );
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   // runs on mount only
   useEffect(() => {

packages/desktop-client/src/components/manager/WelcomeScreen.tsx

@@ -3,7 +3,7 @@ import { Trans, useTranslation } from 'react-i18next';
 
 import { createBudget, pushModal } from 'loot-core/client/actions';
 
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles, theme } from '../../style';
 import { Button } from '../common/Button2';
 import { Link } from '../common/Link';
@@ -13,7 +13,7 @@ import { View } from '../common/View';
 
 export function WelcomeScreen() {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   return (
     <View

packages/desktop-client/src/components/manager/subscribe/Bootstrap.tsx

@@ -6,7 +6,7 @@ import { createBudget } from 'loot-core/src/client/actions/budgets';
 import { send } from 'loot-core/src/platform/client/fetch';
 
 import { useNavigate } from '../../../hooks/useNavigate';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme } from '../../../style';
 import { Button } from '../../common/Button2';
 import { Link } from '../../common/Link';
@@ -20,7 +20,7 @@ import { ConfirmPasswordForm } from './ConfirmPasswordForm';
 
 export function Bootstrap() {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [error, setError] = useState(null);
   const refreshLoginMethods = useRefreshLoginMethods();
 

packages/desktop-client/src/components/manager/subscribe/Login.tsx

@@ -10,7 +10,7 @@ import { type OpenIdConfig } from 'loot-core/types/models/openid';
 
 import { useNavigate } from '../../../hooks/useNavigate';
 import { AnimatedLoading } from '../../../icons/AnimatedLoading';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { styles, theme } from '../../../style';
 import { Button, ButtonWithLoading } from '../../common/Button2';
 import { BigInput } from '../../common/Input';
@@ -202,7 +202,7 @@ function HeaderLogin({ error }) {
 export function Login() {
   const { t } = useTranslation();
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const defaultLoginMethod = useLoginMethod();
   const [method, setMethod] = useState(defaultLoginMethod);
   const [searchParams, _setSearchParams] = useSearchParams();

packages/desktop-client/src/components/manager/subscribe/OpenIdCallback.ts

@@ -3,10 +3,10 @@ import { useEffect } from 'react';
 import { loggedIn } from 'loot-core/src/client/actions/user';
 import { send } from 'loot-core/src/platform/client/fetch';
 
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 
 export function OpenIdCallback() {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   useEffect(() => {
     const token = new URLSearchParams(window.location.search).get('token');
     send('subscribe-set-token', { token: token as string }).then(() => {

packages/desktop-client/src/components/mobile/accounts/AccountTransactions.tsx

@@ -39,7 +39,7 @@ import { useAccountPreviewTransactions } from '../../../hooks/useAccountPreviewT
 import { useDateFormat } from '../../../hooks/useDateFormat';
 import { useFailedAccounts } from '../../../hooks/useFailedAccounts';
 import { useNavigate } from '../../../hooks/useNavigate';
-import { useSelector, useDispatch } from '../../../redux';
+import { useAppSelector, useAppDispatch } from '../../../redux';
 import { styles, theme } from '../../../style';
 import { Button } from '../../common/Button2';
 import { Text } from '../../common/Text';
@@ -99,7 +99,9 @@ export function AccountTransactions({
 
 function AccountHeader({ account }: { readonly account: AccountEntity }) {
   const failedAccounts = useFailedAccounts();
-  const syncingAccountIds = useSelector(state => state.account.accountsSyncing);
+  const syncingAccountIds = useAppSelector(
+    state => state.account.accountsSyncing,
+  );
   const pending = useMemo(
     () => syncingAccountIds.includes(account.id),
     [syncingAccountIds, account.id],
@@ -109,7 +111,7 @@ function AccountHeader({ account }: { readonly account: AccountEntity }) {
     [failedAccounts, account.id],
   );
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const onSave = useCallback(
     (account: AccountEntity) => {
@@ -253,7 +255,7 @@ function TransactionListWithPreviews({
   });
 
   const dateFormat = useDateFormat() || 'MM/dd/yyyy';
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const navigate = useNavigate();
 
   const onRefresh = useCallback(() => {

packages/desktop-client/src/components/mobile/accounts/Accounts.tsx

@@ -13,7 +13,7 @@ import { useFailedAccounts } from '../../../hooks/useFailedAccounts';
 import { useNavigate } from '../../../hooks/useNavigate';
 import { useSyncedPref } from '../../../hooks/useSyncedPref';
 import { SvgAdd, SvgCheveronRight } from '../../../icons/v1';
-import { useDispatch, useSelector } from '../../../redux';
+import { useAppDispatch, useAppSelector } from '../../../redux';
 import { theme, styles } from '../../../style';
 import { makeAmountFullStyle } from '../../budget/util';
 import { Button } from '../../common/Button2';
@@ -227,7 +227,9 @@ function AccountList({
 }: AccountListProps) {
   const { t } = useTranslation();
   const failedAccounts = useFailedAccounts();
-  const syncingAccountIds = useSelector(state => state.account.accountsSyncing);
+  const syncingAccountIds = useAppSelector(
+    state => state.account.accountsSyncing,
+  );
   const onBudgetAccounts = accounts.filter(account => account.offbudget === 0);
   const offBudgetAccounts = accounts.filter(account => account.offbudget === 1);
 
@@ -303,9 +305,11 @@ function AccountList({
 }
 
 export function Accounts() {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const accounts = useAccounts();
-  const updatedAccounts = useSelector(state => state.queries.updatedAccounts);
+  const updatedAccounts = useAppSelector(
+    state => state.queries.updatedAccounts,
+  );
   const [_numberFormat] = useSyncedPref('numberFormat');
   const numberFormat = _numberFormat || 'comma-dot';
   const [hideFraction] = useSyncedPref('hideFraction');

packages/desktop-client/src/components/mobile/budget/BudgetTable.jsx

@@ -30,7 +30,7 @@ import {
   SvgCheveronRight,
 } from '../../../icons/v1';
 import { SvgViewShow } from '../../../icons/v2';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme, styles } from '../../../style';
 import { BalanceWithCarryover } from '../../budget/BalanceWithCarryover';
 import { makeAmountGrey, makeBalanceAmountStyle } from '../../budget/util';
@@ -230,7 +230,7 @@ function BudgetCell({
 }) {
   const { t } = useTranslation();
   const columnWidth = getColumnWidth();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const format = useFormat();
   const { showUndoNotification } = useUndo();
   const [budgetType = 'rollover'] = useSyncedPref('budgetType');
@@ -411,7 +411,7 @@ const ExpenseCategory = memo(function ExpenseCategory({
 
   const [budgetType = 'rollover'] = useSyncedPref('budgetType');
   const modalBudgetType = budgetType === 'rollover' ? 'envelope' : 'tracking';
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const { showUndoNotification } = useUndo();
   const { list: categories } = useCategories();
   const categoriesById = groupById(categories);

packages/desktop-client/src/components/mobile/budget/CategoryTransactions.tsx

@@ -17,7 +17,7 @@ import {
 
 import { useDateFormat } from '../../../hooks/useDateFormat';
 import { useNavigate } from '../../../hooks/useNavigate';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { TextOneLine } from '../../common/TextOneLine';
 import { View } from '../../common/View';
 import { MobilePageHeader, Page } from '../../Page';
@@ -34,7 +34,7 @@ export function CategoryTransactions({
   category,
   month,
 }: CategoryTransactionsProps) {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const navigate = useNavigate();
 
   const baseTransactionsQuery = useCallback(

packages/desktop-client/src/components/mobile/budget/index.tsx

@@ -23,7 +23,7 @@ import { useCategories } from '../../../hooks/useCategories';
 import { useLocalPref } from '../../../hooks/useLocalPref';
 import { useSyncedPref } from '../../../hooks/useSyncedPref';
 import { AnimatedLoading } from '../../../icons/AnimatedLoading';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme } from '../../../style';
 import { prewarmMonth } from '../../budget/util';
 import { View } from '../../common/View';
@@ -54,7 +54,7 @@ export function Budget() {
   const [_numberFormat] = useSyncedPref('numberFormat');
   const numberFormat = _numberFormat || 'comma-dot';
   const [hideFraction] = useSyncedPref('hideFraction');
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   useEffect(() => {
     async function init() {

packages/desktop-client/src/components/mobile/transactions/TransactionEdit.jsx

@@ -56,7 +56,7 @@ import {
 import { SvgSplit } from '../../../icons/v0';
 import { SvgAdd, SvgPiggyBank, SvgTrash } from '../../../icons/v1';
 import { SvgPencilWriteAlternate } from '../../../icons/v2';
-import { useSelector, useDispatch } from '../../../redux';
+import { useAppSelector, useAppDispatch } from '../../../redux';
 import { styles, theme } from '../../../style';
 import { Button } from '../../common/Button';
 import { Text } from '../../common/Text';
@@ -456,7 +456,7 @@ const TransactionEditInner = memo(function TransactionEditInner({
 }) {
   const { t } = useTranslation();
   const navigate = useNavigate();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const transactions = useMemo(
     () =>
       unserializedTransactions.map(t => serializeTransaction(t, dateFormat)) ||
@@ -1031,7 +1031,7 @@ function TransactionEditUnconnected({
   const { transactionId } = useParams();
   const { state: locationState } = useLocation();
   const navigate = useNavigate();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [transactions, setTransactions] = useState([]);
   const [fetchedTransactions, setFetchedTransactions] = useState([]);
   const isAdding = useRef(false);
@@ -1255,7 +1255,9 @@ function TransactionEditUnconnected({
 export const TransactionEdit = props => {
   const { list: categories } = useCategories();
   const payees = usePayees();
-  const lastTransaction = useSelector(state => state.queries.lastTransaction);
+  const lastTransaction = useAppSelector(
+    state => state.queries.lastTransaction,
+  );
   const accounts = useAccounts();
   const dateFormat = useDateFormat() || 'MM/dd/yyyy';
 

packages/desktop-client/src/components/mobile/transactions/TransactionList.tsx

@@ -28,7 +28,7 @@ import { useUndo } from '../../../hooks/useUndo';
 import { AnimatedLoading } from '../../../icons/AnimatedLoading';
 import { SvgDelete } from '../../../icons/v0';
 import { SvgDotsHorizontalTriple } from '../../../icons/v1';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { styles, theme } from '../../../style';
 import { Button } from '../../common/Button2';
 import { Menu, type MenuItemObject } from '../../common/Menu';
@@ -276,7 +276,7 @@ function SelectedTransactionsFloatingActionBar({
   const { list: categories } = useCategories();
   const categoriesById = useMemo(() => groupById(categories), [categories]);
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   useEffect(() => {
     dispatch(setNotificationInset({ bottom: NOTIFICATION_BOTTOM_INSET }));
     return () => {

packages/desktop-client/src/components/mobile/transactions/TransactionListItem.tsx

@@ -24,7 +24,7 @@ import {
   SvgCheckCircle1,
   SvgLockClosed,
 } from '../../../icons/v2';
-import { useSelector } from '../../../redux';
+import { useAppSelector } from '../../../redux';
 import { styles, theme } from '../../../style';
 import { makeAmountFullStyle } from '../../budget/util';
 import { Button } from '../../common/Button2';
@@ -58,7 +58,9 @@ export function TransactionListItem({
   const transferAccount = useAccount(payee?.transfer_acct || '');
   const isPreview = isPreviewId(transaction?.id || '');
 
-  const newTransactions = useSelector(state => state.queries.newTransactions);
+  const newTransactions = useAppSelector(
+    state => state.queries.newTransactions,
+  );
 
   const { longPressProps } = useLongPress({
     accessibilityDescription: 'Long press to select multiple transactions',

packages/desktop-client/src/components/modals/BudgetListModal.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { useMetadataPref } from '../../hooks/useMetadataPref';
-import { useSelector } from '../../redux';
+import { useAppSelector } from '../../redux';
 import { Modal, ModalHeader, ModalCloseButton } from '../common/Modal';
 import { Text } from '../common/Text';
 import { View } from '../common/View';
@@ -11,7 +11,7 @@ import { BudgetList } from '../manager/BudgetList';
 export function BudgetListModal() {
   const { t } = useTranslation();
   const [id] = useMetadataPref('id');
-  const currentFile = useSelector(state =>
+  const currentFile = useAppSelector(state =>
     state.budgets.allFiles?.find(f => 'id' in f && f.id === id),
   );
 

packages/desktop-client/src/components/modals/CloseAccountModal.tsx

@@ -11,7 +11,7 @@ import { type TransObjectLiteral } from 'loot-core/types/util';
 
 import { useAccounts } from '../../hooks/useAccounts';
 import { useCategories } from '../../hooks/useCategories';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles, theme } from '../../style';
 import { AccountAutocomplete } from '../autocomplete/AccountAutocomplete';
 import { CategoryAutocomplete } from '../autocomplete/CategoryAutocomplete';
@@ -59,7 +59,7 @@ export function CloseAccountModal({
 
   const [transferError, setTransferError] = useState(false);
   const [categoryError, setCategoryError] = useState(false);
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const { isNarrowWidth } = useResponsive();
 
   const onSelectAccount = accId => {

packages/desktop-client/src/components/modals/CoverModal.tsx

@@ -5,7 +5,7 @@ import { pushModal } from 'loot-core/client/actions';
 import { type CategoryEntity } from 'loot-core/src/types/models';
 
 import { useCategories } from '../../hooks/useCategories';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles } from '../../style';
 import {
   addToBeBudgetedGroup,
@@ -49,7 +49,7 @@ export function CoverModal({
   }, [categoryId, originalCategoryGroups, showToBeBudgeted]);
 
   const [fromCategoryId, setFromCategoryId] = useState<string | null>(null);
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const onCategoryClick = useCallback(() => {
     dispatch(

packages/desktop-client/src/components/modals/CreateAccountModal.tsx

@@ -12,7 +12,7 @@ import { useGoCardlessStatus } from '../../hooks/useGoCardlessStatus';
 import { useSimpleFinStatus } from '../../hooks/useSimpleFinStatus';
 import { useSyncServerStatus } from '../../hooks/useSyncServerStatus';
 import { SvgDotsHorizontalTriple } from '../../icons/v1';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Warning } from '../alerts';
 import { Button, ButtonWithLoading } from '../common/Button2';
@@ -34,7 +34,7 @@ export function CreateAccountModal({ upgradingAccountId }: CreateAccountProps) {
   const { t } = useTranslation();
 
   const syncServerStatus = useSyncServerStatus();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [isGoCardlessSetupComplete, setIsGoCardlessSetupComplete] = useState<
     boolean | null
   >(null);

packages/desktop-client/src/components/modals/CreateEncryptionKeyModal.tsx

@@ -10,7 +10,7 @@ import { sync } from 'loot-core/client/app/appSlice';
 import { send } from 'loot-core/src/platform/client/fetch';
 import { getCreateKeyError } from 'loot-core/src/shared/errors';
 
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles, theme } from '../../style';
 import { ButtonWithLoading } from '../common/Button2';
 import { InitialFocus } from '../common/InitialFocus';
@@ -42,7 +42,7 @@ export function CreateEncryptionKeyModal({
   const [error, setError] = useState('');
   const [showPassword, setShowPassword] = useState(false);
   const { isNarrowWidth } = useResponsive();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const isRecreating = options.recreate;
 

packages/desktop-client/src/components/modals/CreateLocalAccountModal.tsx

@@ -9,7 +9,7 @@ import { toRelaxedNumber } from 'loot-core/src/shared/util';
 
 import * as useAccounts from '../../hooks/useAccounts';
 import { useNavigate } from '../../hooks/useNavigate';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Button } from '../common/Button2';
 import { FormError } from '../common/FormError';
@@ -32,7 +32,7 @@ import { validateAccountName } from '../util/accountValidation';
 export function CreateLocalAccountModal() {
   const { t } = useTranslation();
   const navigate = useNavigate();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const accounts = useAccounts.useAccounts();
   const [name, setName] = useState('');
   const [offbudget, setOffbudget] = useState(false);

packages/desktop-client/src/components/modals/EditAccess.tsx

@@ -7,7 +7,7 @@ import { getUserAccessErrors } from 'loot-core/shared/errors';
 import { type Handlers } from 'loot-core/types/handlers';
 import { type UserAccessEntity } from 'loot-core/types/models/userAccess';
 
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles, theme } from '../../style';
 import { Button } from '../common/Button2';
 import { Modal, ModalCloseButton, ModalHeader } from '../common/Modal';
@@ -27,7 +27,7 @@ export function EditUserAccess({
   onSave: originalOnSave,
 }: EditUserAccessProps) {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const [userId, setUserId] = useState(defaultUserAccess.userId ?? '');
   const [error, setSetError] = useState('');

packages/desktop-client/src/components/modals/EditRuleModal.jsx

@@ -34,7 +34,7 @@ import { useFeatureFlag } from '../../hooks/useFeatureFlag';
 import { useSelected, SelectedProvider } from '../../hooks/useSelected';
 import { SvgDelete, SvgAdd, SvgSubtract } from '../../icons/v0';
 import { SvgAlignLeft, SvgCode, SvgInformationOutline } from '../../icons/v1';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles, theme } from '../../style';
 import { Button } from '../common/Button2';
 import { Menu } from '../common/Menu';
@@ -782,7 +782,7 @@ export function EditRuleModal({ defaultRule, onSave: originalOnSave }) {
   const [stage, setStage] = useState(defaultRule.stage);
   const [conditionsOp, setConditionsOp] = useState(defaultRule.conditionsOp);
   const [transactions, setTransactions] = useState([]);
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const scrollableEl = useRef();
 
   const isSchedule = getActions(actionSplits).some(

packages/desktop-client/src/components/modals/EditUser.tsx

@@ -8,7 +8,7 @@ import {
   type UserEntity,
 } from 'loot-core/src/types/models/user';
 
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles, theme } from '../../style';
 import { Button } from '../common/Button2';
 import { Input } from '../common/Input';
@@ -75,7 +75,7 @@ function useGetUserDirectoryErrors() {
 
 function useSaveUser() {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const { getUserDirectoryErrors } = useGetUserDirectoryErrors();
 
   async function saveUser(
@@ -157,7 +157,7 @@ export function EditUserFinanceApp({
 
 function EditUser({ defaultUser, onSave: originalOnSave }: EditUserProps) {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const [userName, setUserName] = useState<string>(defaultUser.userName ?? '');
   const [displayName, setDisplayName] = useState<string>(

packages/desktop-client/src/components/modals/EnvelopeBudgetSummaryModal.tsx

@@ -8,7 +8,7 @@ import { format, sheetForMonth, prevMonth } from 'loot-core/src/shared/months';
 
 import { useCategories } from '../../hooks/useCategories';
 import { useUndo } from '../../hooks/useUndo';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles } from '../../style';
 import { ToBudgetAmount } from '../budget/envelope/budgetsummary/ToBudgetAmount';
 import { TotalsList } from '../budget/envelope/budgetsummary/TotalsList';
@@ -25,7 +25,7 @@ export function EnvelopeBudgetSummaryModal({
   month,
   onBudgetAction,
 }: EnvelopeBudgetSummaryModalProps) {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const prevMonthName = format(prevMonth(month), 'MMM');
   const sheetValue =
     useEnvelopeSheetValue({

packages/desktop-client/src/components/modals/GoCardlessExternalMsgModal.tsx

@@ -11,7 +11,7 @@ import {
 
 import { useGoCardlessStatus } from '../../hooks/useGoCardlessStatus';
 import { AnimatedLoading } from '../../icons/AnimatedLoading';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Error, Warning } from '../alerts';
 import { Autocomplete } from '../autocomplete/Autocomplete';
@@ -87,7 +87,7 @@ export function GoCardlessExternalMsgModal({
 }: GoCardlessExternalMsgProps) {
   const { t } = useTranslation();
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const [waiting, setWaiting] = useState<string | null>(null);
   const [success, setSuccess] = useState<boolean>(false);

packages/desktop-client/src/components/modals/ImportTransactionsModal/ImportTransactionsModal.jsx

@@ -14,7 +14,7 @@ import { amountToInteger } from 'loot-core/src/shared/util';
 import { useCategories } from '../../../hooks/useCategories';
 import { useDateFormat } from '../../../hooks/useDateFormat';
 import { useSyncedPrefs } from '../../../hooks/useSyncedPrefs';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme } from '../../../style';
 import { Button, ButtonWithLoading } from '../../common/Button2';
 import { Input } from '../../common/Input';
@@ -145,7 +145,7 @@ export function ImportTransactionsModal({ options }) {
   const { t } = useTranslation();
   const dateFormat = useDateFormat() || 'MM/dd/yyyy';
   const [prefs, savePrefs] = useSyncedPrefs();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const categories = useCategories();
 
   const [multiplierAmount, setMultiplierAmount] = useState('');

packages/desktop-client/src/components/modals/LoadBackupModal.tsx

@@ -6,7 +6,7 @@ import { type Backup } from 'loot-core/server/backups';
 import { send, listen, unlisten } from 'loot-core/src/platform/client/fetch';
 
 import { useMetadataPref } from '../../hooks/useMetadataPref';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Block } from '../common/Block';
 import { Button } from '../common/Button2';
@@ -52,7 +52,7 @@ export function LoadBackupModal({
   watchUpdates,
   backupDisabled,
 }: LoadBackupModalProps) {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [backups, setBackups] = useState<Backup[]>([]);
   const [prefsBudgetId] = useMetadataPref('id');
   const budgetIdToLoad = budgetId ?? prefsBudgetId;

packages/desktop-client/src/components/modals/MergeUnusedPayeesModal.tsx

@@ -6,7 +6,7 @@ import { send } from 'loot-core/src/platform/client/fetch';
 import { type PayeeEntity } from 'loot-core/types/models';
 
 import { usePayees } from '../../hooks/usePayees';
-import { useSelector, useDispatch } from '../../redux';
+import { useAppSelector, useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Information } from '../alerts';
 import { Button } from '../common/Button2';
@@ -28,9 +28,9 @@ export function MergeUnusedPayeesModal({
 }: MergeUnusedPayeesModalProps) {
   const { t } = useTranslation();
   const allPayees = usePayees();
-  const modalStack = useSelector(state => state.modals.modalStack);
+  const modalStack = useAppSelector(state => state.modals.modalStack);
   const isEditingRule = !!modalStack.find(m => m.name === 'edit-rule');
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [shouldCreateRule, setShouldCreateRule] = useState(true);
   const flashRef = useRef<HTMLUListElement | null>(null);
 

packages/desktop-client/src/components/modals/OpenIDEnableModal.tsx

@@ -7,7 +7,7 @@ import * as asyncStorage from 'loot-core/platform/server/asyncStorage';
 import { getOpenIdErrors } from 'loot-core/shared/errors';
 import { type OpenIdConfig } from 'loot-core/types/models/openid';
 
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme, styles } from '../../style';
 import { Error } from '../alerts';
 import { Button } from '../common/Button2';
@@ -25,7 +25,7 @@ export function OpenIDEnableModal({
   onSave: originalOnSave,
 }: OpenIDEnableModalProps) {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const [error, setError] = useState('');
   const refreshLoginMethods = useRefreshLoginMethods();

packages/desktop-client/src/components/modals/OutOfSyncMigrationsModal.tsx

@@ -3,7 +3,7 @@ import { Trans, useTranslation } from 'react-i18next';
 
 import { closeBudget } from 'loot-core/client/actions';
 
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { Button } from '../common/Button2';
 import { Link } from '../common/Link';
 import { Modal, ModalHeader, ModalTitle } from '../common/Modal';
@@ -12,7 +12,7 @@ import { Text } from '../common/Text';
 import { View } from '../common/View';
 
 export function OutOfSyncMigrationsModal() {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const { t } = useTranslation();
 

packages/desktop-client/src/components/modals/PasswordEnableModal.tsx

@@ -5,7 +5,7 @@ import { closeBudget, popModal } from 'loot-core/client/actions';
 import { send } from 'loot-core/platform/client/fetch';
 import * as asyncStorage from 'loot-core/src/platform/server/asyncStorage';
 
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme, styles } from '../../style';
 import { Error as ErrorAlert } from '../alerts';
 import { Button } from '../common/Button2';
@@ -31,7 +31,7 @@ export function PasswordEnableModal({
   onSave: originalOnSave,
 }: PasswordEnableModalProps) {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const [error, setError] = useState<string | null>(null);
   const multiuserEnabled = useMultiuserEnabled();

packages/desktop-client/src/components/modals/SelectLinkedAccountsModal.jsx

@@ -9,7 +9,7 @@ import {
 import { closeModal } from 'loot-core/client/actions';
 
 import { useAccounts } from '../../hooks/useAccounts';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Autocomplete } from '../autocomplete/Autocomplete';
 import { Button } from '../common/Button2';
@@ -41,7 +41,7 @@ export function SelectLinkedAccountsModal({
 }) {
   externalAccounts.sort((a, b) => a.name.localeCompare(b.name));
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const localAccounts = useAccounts().filter(a => a.closed === 0);
   const [chosenAccounts, setChosenAccounts] = useState(() => {
     return Object.fromEntries(

packages/desktop-client/src/components/modals/TransferModal.tsx

@@ -5,7 +5,7 @@ import { pushModal } from 'loot-core/client/actions';
 import { type CategoryEntity } from 'loot-core/types/models';
 
 import { useCategories } from '../../hooks/useCategories';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles } from '../../style';
 import {
   addToBeBudgetedGroup,
@@ -55,7 +55,7 @@ export function TransferModal({
 
   const [amount, setAmount] = useState<number>(0);
   const [toCategoryId, setToCategoryId] = useState<string | null>(null);
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const openCategoryModal = () => {
     dispatch(

packages/desktop-client/src/components/modals/TransferOwnership.tsx

@@ -13,7 +13,7 @@ import { type RemoteFile, type SyncedLocalFile } from 'loot-core/types/file';
 import { type Handlers } from 'loot-core/types/handlers';
 
 import { useMetadataPref } from '../../hooks/useMetadataPref';
-import { useDispatch, useSelector } from '../../redux';
+import { useAppDispatch, useAppSelector } from '../../redux';
 import { styles, theme } from '../../style';
 import { Button } from '../common/Button2';
 import { Modal, ModalCloseButton, ModalHeader } from '../common/Modal';
@@ -32,17 +32,17 @@ export function TransferOwnership({
 }: TransferOwnershipProps) {
   const { t } = useTranslation();
 
-  const userData = useSelector(state => state.user.data);
+  const userData = useAppSelector(state => state.user.data);
   const [userId, setUserId] = useState('');
   const [error, setError] = useState<string | null>(null);
   const [availableUsers, setAvailableUsers] = useState<[string, string][]>([]);
   const [cloudFileId] = useMetadataPref('cloudFileId');
-  const allFiles = useSelector(state => state.budgets.allFiles || []);
+  const allFiles = useAppSelector(state => state.budgets.allFiles || []);
   const remoteFiles = allFiles.filter(
     f => f.state === 'remote' || f.state === 'synced' || f.state === 'detached',
   ) as (SyncedLocalFile | RemoteFile)[];
   const currentFile = remoteFiles.find(f => f.cloudFileId === cloudFileId);
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [isTransferring, setIsTransferring] = useState(false);
 
   useEffect(() => {

packages/desktop-client/src/components/modals/manager/ConfirmChangeDocumentDir.tsx

@@ -4,7 +4,7 @@ import { Trans, useTranslation } from 'react-i18next';
 import { addNotification } from 'loot-core/client/actions';
 
 import { useGlobalPref } from '../../../hooks/useGlobalPref';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme, styles } from '../../../style';
 import { Information } from '../../alerts';
 import { Button, ButtonWithLoading } from '../../common/Button2';
@@ -48,7 +48,7 @@ export function ConfirmChangeDocumentDirModal({
   const [loading, setLoading] = useState(false);
   const [moveFiles, setMoveFiles] = useState(false);
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const restartElectronServer = useCallback(() => {
     globalThis.window.Actual.restartElectronServer();

packages/desktop-client/src/components/modals/manager/DeleteFileModal.tsx

@@ -4,7 +4,7 @@ import { Trans, useTranslation } from 'react-i18next';
 import { deleteBudget } from 'loot-core/client/actions';
 import { type File } from 'loot-core/src/types/file';
 
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme } from '../../../style';
 import { ButtonWithLoading } from '../../common/Button2';
 import { Modal, ModalCloseButton, ModalHeader } from '../../common/Modal';
@@ -22,7 +22,7 @@ export function DeleteFileModal({ file }: DeleteFileProps) {
   // user. The current user should be able to delete the local file,
   // but not the remote one
   const isCloudFile = 'cloudFileId' in file && file.state !== 'broken';
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const [loadingState, setLoadingState] = useState<'cloud' | 'local' | null>(
     null,

packages/desktop-client/src/components/modals/manager/DuplicateFileModal.tsx

@@ -9,7 +9,7 @@ import {
 } from 'loot-core/client/actions';
 import { type File } from 'loot-core/src/types/file';
 
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme } from '../../../style';
 import { Button, ButtonWithLoading } from '../../common/Button2';
 import { FormError } from '../../common/FormError';
@@ -49,7 +49,7 @@ export function DuplicateFileModal({
   // If the state is "broken" that means it was created by another user.
   const isCloudFile = 'cloudFileId' in file && file.state !== 'broken';
   const isLocalFile = 'id' in file;
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const [loadingState, setLoadingState] = useState<'cloud' | 'local' | null>(
     null,

packages/desktop-client/src/components/modals/manager/FilesSettingsModal.tsx

@@ -5,7 +5,7 @@ import { loadAllFiles, pushModal } from 'loot-core/client/actions';
 
 import { useGlobalPref } from '../../../hooks/useGlobalPref';
 import { SvgPencil1 } from '../../../icons/v2';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme, styles } from '../../../style';
 import { Button } from '../../common/Button2';
 import { Modal, ModalCloseButton, ModalHeader } from '../../common/Modal';
@@ -16,7 +16,7 @@ function FileLocationSettings() {
   const [documentDir, _setDocumentDirPref] = useGlobalPref('documentDir');
   const [_documentDirChanged, setDirChanged] = useState(false);
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   async function onChooseDocumentDir() {
     const chosenDirectory = await window.Actual.openFileDialog({
@@ -142,7 +142,7 @@ function SelfSignedCertLocationSettings() {
 }
 
 export function FilesSettingsModal() {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   function closeModal(close: () => void) {
     dispatch(loadAllFiles());

packages/desktop-client/src/components/modals/manager/ImportActualModal.tsx

@@ -5,7 +5,7 @@ import { Trans, useTranslation } from 'react-i18next';
 import { importBudget } from 'loot-core/src/client/actions/budgets';
 
 import { useNavigate } from '../../../hooks/useNavigate';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { styles, theme } from '../../../style';
 import { Block } from '../../common/Block';
 import { ButtonWithLoading } from '../../common/Button2';
@@ -33,7 +33,7 @@ function getErrorMessage(error: string): string {
 export function ImportActualModal() {
   const { t } = useTranslation();
   const navigate = useNavigate();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [error, setError] = useState<string | null>(null);
   const [importing, setImporting] = useState(false);
 

packages/desktop-client/src/components/modals/manager/ImportModal.tsx

@@ -3,7 +3,7 @@ import { Trans, useTranslation } from 'react-i18next';
 
 import { pushModal } from 'loot-core/client/actions';
 
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { styles, theme } from '../../../style';
 import { Block } from '../../common/Block';
 import { Button } from '../../common/Button2';
@@ -23,7 +23,7 @@ function getErrorMessage(error: 'not-ynab4' | boolean) {
 export function ImportModal() {
   const { t } = useTranslation();
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [error] = useState(false);
 
   function onSelectType(type: 'ynab4' | 'ynab5' | 'actual') {

packages/desktop-client/src/components/modals/manager/ImportYNAB4Modal.tsx

@@ -5,7 +5,7 @@ import { Trans, useTranslation } from 'react-i18next';
 import { importBudget } from 'loot-core/src/client/actions/budgets';
 
 import { useNavigate } from '../../../hooks/useNavigate';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { styles, theme } from '../../../style';
 import { Block } from '../../common/Block';
 import { ButtonWithLoading } from '../../common/Button2';
@@ -25,7 +25,7 @@ function getErrorMessage(error: string): string {
 export function ImportYNAB4Modal() {
   const { t } = useTranslation();
   const navigate = useNavigate();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [error, setError] = useState<string | null>(null);
   const [importing, setImporting] = useState(false);
 

packages/desktop-client/src/components/modals/manager/ImportYNAB5Modal.tsx

@@ -5,7 +5,7 @@ import { Trans, useTranslation } from 'react-i18next';
 import { importBudget } from 'loot-core/src/client/actions/budgets';
 
 import { useNavigate } from '../../../hooks/useNavigate';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { styles, theme } from '../../../style';
 import { Block } from '../../common/Block';
 import { ButtonWithLoading } from '../../common/Button2';
@@ -28,7 +28,7 @@ function getErrorMessage(error: string): string {
 export function ImportYNAB5Modal() {
   const { t } = useTranslation();
   const navigate = useNavigate();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [error, setError] = useState<string | null>(null);
   const [importing, setImporting] = useState(false);
 

packages/desktop-client/src/components/payees/ManagePayeesWithData.tsx

@@ -12,7 +12,7 @@ import { applyChanges, type Diff } from 'loot-core/src/shared/util';
 import { type NewRuleEntity, type PayeeEntity } from 'loot-core/types/models';
 
 import { usePayees } from '../../hooks/usePayees';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 
 import { ManagePayees } from './ManagePayees';
 
@@ -24,7 +24,7 @@ export function ManagePayeesWithData({
   initialSelectedIds,
 }: ManagePayeesWithDataProps) {
   const payees = usePayees();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const [ruleCounts, setRuleCounts] = useState({ value: new Map() });
   const [orphans, setOrphans] = useState<PayeeEntity[]>([]);

packages/desktop-client/src/components/reports/Overview.tsx

@@ -22,7 +22,7 @@ import { useAccounts } from '../../hooks/useAccounts';
 import { useNavigate } from '../../hooks/useNavigate';
 import { useSyncedPref } from '../../hooks/useSyncedPref';
 import { useUndo } from '../../hooks/useUndo';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { breakpoints } from '../../tokens';
 import { Button } from '../common/Button2';
 import { Menu } from '../common/Menu';
@@ -52,7 +52,7 @@ function isCustomReportWidget(widget: Widget): widget is CustomReportWidget {
 
 export function Overview() {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [_firstDayOfWeekIdx] = useSyncedPref('firstDayOfWeekIdx');
   const firstDayOfWeekIdx = _firstDayOfWeekIdx || '0';
 

packages/desktop-client/src/components/reports/reports/Calendar.tsx

@@ -47,7 +47,7 @@ import {
   SvgCheveronDown,
   SvgCheveronUp,
 } from '../../../icons/v1';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { styles, theme } from '../../../style';
 import { Button } from '../../common/Button2';
 import { View } from '../../common/View';
@@ -278,7 +278,7 @@ function CalendarInner({ widget, parameters }: CalendarInnerProps) {
     run();
   }, []);
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const navigate = useNavigate();
   const { isNarrowWidth } = useResponsive();
   const title = widget?.meta?.name || t('Calendar');

packages/desktop-client/src/components/reports/reports/CashFlow.tsx

@@ -18,7 +18,7 @@ import {
 import { useFilters } from '../../../hooks/useFilters';
 import { useNavigate } from '../../../hooks/useNavigate';
 import { useSyncedPref } from '../../../hooks/useSyncedPref';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme } from '../../../style';
 import { AlignedText } from '../../common/AlignedText';
 import { Block } from '../../common/Block';
@@ -64,7 +64,7 @@ type CashFlowInnerProps = {
 };
 
 function CashFlowInner({ widget }: CashFlowInnerProps) {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const { t } = useTranslation();
 
   const {

packages/desktop-client/src/components/reports/reports/CustomReportListCards.tsx

@@ -12,7 +12,7 @@ import { useCategories } from '../../../hooks/useCategories';
 import { usePayees } from '../../../hooks/usePayees';
 import { useSyncedPref } from '../../../hooks/useSyncedPref';
 import { SvgExclamationSolid } from '../../../icons/v1';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { styles } from '../../../style/index';
 import { theme } from '../../../style/theme';
 import { Text } from '../../common/Text';
@@ -64,7 +64,7 @@ function CustomReportListCardsInner({
 }: Omit<CustomReportListCardsProps, 'report'> & {
   report: CustomReportEntity;
 }) {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const [nameMenuOpen, setNameMenuOpen] = useState(false);
   const [earliestTransaction, setEarliestTransaction] = useState('');

packages/desktop-client/src/components/reports/reports/NetWorth.tsx

@@ -15,7 +15,7 @@ import { useAccounts } from '../../../hooks/useAccounts';
 import { useFilters } from '../../../hooks/useFilters';
 import { useNavigate } from '../../../hooks/useNavigate';
 import { useSyncedPref } from '../../../hooks/useSyncedPref';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme, styles } from '../../../style';
 import { Button } from '../../common/Button2';
 import { Paragraph } from '../../common/Paragraph';
@@ -53,7 +53,7 @@ type NetWorthInnerProps = {
 };
 
 function NetWorthInner({ widget }: NetWorthInnerProps) {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const { t } = useTranslation();
 
   const accounts = useAccounts();

packages/desktop-client/src/components/reports/reports/Spending.tsx

@@ -14,7 +14,7 @@ import { type RuleConditionEntity } from 'loot-core/types/models/rule';
 
 import { useFilters } from '../../../hooks/useFilters';
 import { useNavigate } from '../../../hooks/useNavigate';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme, styles } from '../../../style';
 import { AlignedText } from '../../common/AlignedText';
 import { Block } from '../../common/Block';
@@ -60,7 +60,7 @@ type SpendingInternalProps = {
 };
 
 function SpendingInternal({ widget }: SpendingInternalProps) {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const { t } = useTranslation();
 
   const {

packages/desktop-client/src/components/reports/reports/Summary.tsx

@@ -22,7 +22,7 @@ import { SvgEquals } from '../../../icons/v1';
 import { SvgCloseParenthesis } from '../../../icons/v2/CloseParenthesis';
 import { SvgOpenParenthesis } from '../../../icons/v2/OpenParenthesis';
 import { SvgSum } from '../../../icons/v2/Sum';
-import { useDispatch } from '../../../redux';
+import { useAppDispatch } from '../../../redux';
 import { theme } from '../../../style';
 import { Button } from '../../common/Button2';
 import { Text } from '../../common/Text';
@@ -181,7 +181,7 @@ function SummaryInner({ widget }: SummaryInnerProps) {
     run();
   }, []);
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const navigate = useNavigate();
   const { isNarrowWidth } = useResponsive();
   const title = widget?.meta?.name || t('Summary');

packages/desktop-client/src/components/schedules/PostsOfflineNotification.tsx

@@ -7,7 +7,7 @@ import { send } from 'loot-core/src/platform/client/fetch';
 import { type PayeeEntity } from 'loot-core/types/models';
 
 import { useFormatList } from '../../hooks/useFormatList';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Button } from '../common/Button2';
 import { Modal, ModalCloseButton, ModalHeader } from '../common/Modal';
@@ -20,7 +20,7 @@ export function PostsOfflineNotification() {
   const { t, i18n } = useTranslation();
 
   const location = useLocation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const locationState = location.state;
   const payees =

packages/desktop-client/src/components/schedules/ScheduleDetails.tsx

@@ -21,7 +21,7 @@ import {
 import { useDateFormat } from '../../hooks/useDateFormat';
 import { usePayees } from '../../hooks/usePayees';
 import { useSelected, SelectedProvider } from '../../hooks/useSelected';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { AccountAutocomplete } from '../autocomplete/AccountAutocomplete';
 import { PayeeAutocomplete } from '../autocomplete/PayeeAutocomplete';
@@ -111,7 +111,7 @@ export function ScheduleDetails({ id, transaction }: ScheduleDetailsProps) {
   const adding = id == null;
   const fromTrans = transaction != null;
   const payees = getPayeesById(usePayees());
-  const globalDispatch = useDispatch();
+  const globalDispatch = useAppDispatch();
   const dateFormat = useDateFormat() || 'MM/dd/yyyy';
 
   const [state, dispatch] = useReducer(

packages/desktop-client/src/components/schedules/ScheduleLink.tsx

@@ -12,7 +12,7 @@ import {
 } from 'loot-core/src/types/models';
 
 import { SvgAdd } from '../../icons/v0';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { Button } from '../common/Button2';
 import { InitialFocus } from '../common/InitialFocus';
 import { Modal, ModalCloseButton, ModalHeader } from '../common/Modal';
@@ -35,7 +35,7 @@ export function ScheduleLink({
 }) {
   const { t } = useTranslation();
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [filter, setFilter] = useState(accountName || '');
   const schedulesQuery = useMemo(
     () => q('schedules').filter({ completed: false }).select('*'),

packages/desktop-client/src/components/schedules/index.tsx

@@ -8,7 +8,7 @@ import { send } from 'loot-core/src/platform/client/fetch';
 import { type ScheduleEntity } from 'loot-core/src/types/models';
 
 import { useFeatureFlag } from '../../hooks/useFeatureFlag';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Button } from '../common/Button2';
 import { Search } from '../common/Search';
@@ -20,7 +20,7 @@ import { type ScheduleItemAction, SchedulesTable } from './SchedulesTable';
 export function Schedules() {
   const { t } = useTranslation();
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [filter, setFilter] = useState('');
 
   const upcomingLengthEnabled = useFeatureFlag('upcomingLengthAdjustment');

packages/desktop-client/src/components/settings/AuthSettings.tsx

@@ -4,7 +4,7 @@ import { Trans, useTranslation } from 'react-i18next';
 import { pushModal } from 'loot-core/client/actions';
 
 import { useFeatureFlag } from '../../hooks/useFeatureFlag';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Button } from '../common/Button2';
 import { Label } from '../common/Label';
@@ -18,7 +18,7 @@ export function AuthSettings() {
 
   const multiuserEnabled = useMultiuserEnabled();
   const loginMethod = useLoginMethod();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const openidAuthFeatureFlag = useFeatureFlag('openidAuth');
 
   return openidAuthFeatureFlag === true ? (

packages/desktop-client/src/components/settings/Encryption.tsx

@@ -4,7 +4,7 @@ import { Trans } from 'react-i18next';
 import { pushModal } from 'loot-core/client/actions';
 
 import { useMetadataPref } from '../../hooks/useMetadataPref';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Button } from '../common/Button2';
 import { Link } from '../common/Link';
@@ -14,7 +14,7 @@ import { useServerURL } from '../ServerContext';
 import { Setting } from './UI';
 
 export function EncryptionSettings() {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const serverURL = useServerURL();
   const [encryptKeyId] = useMetadataPref('encryptKeyId');
 

packages/desktop-client/src/components/settings/Reset.tsx

@@ -5,7 +5,7 @@ import { resetSync } from 'loot-core/client/app/appSlice';
 import { send } from 'loot-core/src/platform/client/fetch';
 
 import { useMetadataPref } from '../../hooks/useMetadataPref';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { ButtonWithLoading } from '../common/Button2';
 import { Text } from '../common/Text';
 
@@ -44,7 +44,7 @@ export function ResetCache() {
 export function ResetSync() {
   const [groupId] = useMetadataPref('groupId');
   const isEnabled = !!groupId;
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const [resetting, setResetting] = useState(false);
 

packages/desktop-client/src/components/settings/index.tsx

@@ -10,7 +10,7 @@ import { listen } from 'loot-core/src/platform/client/fetch';
 import { useGlobalPref } from '../../hooks/useGlobalPref';
 import { useIsOutdated, useLatestVersion } from '../../hooks/useLatestVersion';
 import { useMetadataPref } from '../../hooks/useMetadataPref';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { tokens } from '../../tokens';
 import { Button } from '../common/Button2';
@@ -144,7 +144,7 @@ export function Settings() {
   const { t } = useTranslation();
   const [floatingSidebar] = useGlobalPref('floatingSidebar');
   const [budgetName] = useMetadataPref('budgetName');
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const onCloseBudget = () => {
     dispatch(closeBudget());

packages/desktop-client/src/components/sidebar/Account.tsx

@@ -13,7 +13,7 @@ import { type AccountEntity } from 'loot-core/src/types/models';
 
 import { useContextMenu } from '../../hooks/useContextMenu';
 import { useNotes } from '../../hooks/useNotes';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles, theme } from '../../style';
 import { AlignedText } from '../common/AlignedText';
 import { InitialFocus } from '../common/InitialFocus';
@@ -102,7 +102,7 @@ export function Account<FieldName extends SheetFields<'account'>>({
     onDrop,
   });
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const [isEditing, setIsEditing] = useState(false);
 

packages/desktop-client/src/components/sidebar/Accounts.tsx

@@ -12,7 +12,7 @@ import { useLocalPref } from '../../hooks/useLocalPref';
 import { useOffBudgetAccounts } from '../../hooks/useOffBudgetAccounts';
 import { useOnBudgetAccounts } from '../../hooks/useOnBudgetAccounts';
 import { useUpdatedAccounts } from '../../hooks/useUpdatedAccounts';
-import { useSelector, useDispatch } from '../../redux';
+import { useAppSelector, useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { View } from '../common/View';
 
@@ -23,7 +23,7 @@ const fontWeight = 600;
 
 export function Accounts() {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [isDragging, setIsDragging] = useState(false);
   const accounts = useAccounts();
   const failedAccounts = useFailedAccounts();
@@ -31,7 +31,9 @@ export function Accounts() {
   const offbudgetAccounts = useOffBudgetAccounts();
   const onBudgetAccounts = useOnBudgetAccounts();
   const closedAccounts = useClosedAccounts();
-  const syncingAccountIds = useSelector(state => state.account.accountsSyncing);
+  const syncingAccountIds = useAppSelector(
+    state => state.account.accountsSyncing,
+  );
 
   const getAccountPath = (account: AccountEntity) => `/accounts/${account.id}`;
 

packages/desktop-client/src/components/sidebar/BudgetName.tsx

@@ -8,7 +8,7 @@ import { useContextMenu } from '../../hooks/useContextMenu';
 import { useMetadataPref } from '../../hooks/useMetadataPref';
 import { useNavigate } from '../../hooks/useNavigate';
 import { SvgExpandArrow } from '../../icons/v0';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 import { Button } from '../common/Button2';
 import { InitialFocus } from '../common/InitialFocus';
@@ -53,7 +53,7 @@ export function BudgetName({ children }: BudgetNameProps) {
 function EditableBudgetName() {
   const { t } = useTranslation();
   const [budgetName, setBudgetNamePref] = useMetadataPref('budgetName');
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const navigate = useNavigate();
   const triggerRef = useRef<HTMLButtonElement>(null);
   const [editing, setEditing] = useState(false);

packages/desktop-client/src/components/sidebar/Sidebar.tsx

@@ -11,7 +11,7 @@ import { useGlobalPref } from '../../hooks/useGlobalPref';
 import { useLocalPref } from '../../hooks/useLocalPref';
 import { useResizeObserver } from '../../hooks/useResizeObserver';
 import { SvgAdd } from '../../icons/v1';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles, theme } from '../../style';
 import { View } from '../common/View';
 import { useResponsive } from '../responsive/ResponsiveProvider';
@@ -27,7 +27,7 @@ export function Sidebar() {
   const hasWindowButtons = !Platform.isBrowser && Platform.OS === 'mac';
 
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const sidebar = useSidebar();
   const { width } = useResponsive();
   const [isFloating = false, setFloatingSidebarPref] =

packages/desktop-client/src/components/transactions/SelectedTransactionsButton.tsx

@@ -8,7 +8,7 @@ import { validForTransfer } from 'loot-core/src/client/transfer';
 import { type TransactionEntity } from 'loot-core/types/models';
 
 import { useSelectedItems } from '../../hooks/useSelected';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { Menu } from '../common/Menu';
 import { SelectedItemsButton } from '../table';
 
@@ -59,7 +59,7 @@ export function SelectedTransactionsButton({
   onMakeAsNonSplitTransactions,
 }: SelectedTransactionsButtonProps) {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const selectedItems = useSelectedItems();
   const selectedIds = useMemo(() => [...selectedItems], [selectedItems]);
 

packages/desktop-client/src/components/transactions/TransactionList.jsx

@@ -12,7 +12,7 @@ import {
 import { getChangedValues, applyChanges } from 'loot-core/src/shared/util';
 
 import { useNavigate } from '../../hooks/useNavigate';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { theme } from '../../style';
 
 import { TransactionTable } from './TransactionsTable';
@@ -97,7 +97,7 @@ export function TransactionList({
   onScheduleAction,
   onMakeAsNonSplitTransactions,
 }) {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const transactionsLatest = useRef();
   const navigate = useNavigate();
 

packages/desktop-client/src/components/transactions/TransactionMenu.tsx

@@ -5,7 +5,7 @@ import { pushModal } from 'loot-core/client/actions';
 import { isPreviewId } from 'loot-core/shared/transactions';
 import { type TransactionEntity } from 'loot-core/types/models';
 
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { Menu } from '../common/Menu';
 
 type BalanceMenuProps = Omit<
@@ -36,7 +36,7 @@ export function TransactionMenu({
   ...props
 }: BalanceMenuProps) {
   const { t } = useTranslation();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const isPreview = isPreviewId(transaction.id);
   const linked = !!transaction.schedule;

packages/desktop-client/src/components/transactions/TransactionsTable.jsx

@@ -59,7 +59,7 @@ import {
   SvgCalendar,
   SvgHyperlink2,
 } from '../../icons/v2';
-import { useDispatch } from '../../redux';
+import { useAppDispatch } from '../../redux';
 import { styles, theme } from '../../style';
 import { AccountAutocomplete } from '../autocomplete/AccountAutocomplete';
 import { CategoryAutocomplete } from '../autocomplete/CategoryAutocomplete';
@@ -561,7 +561,7 @@ function PayeeCell({
 }) {
   const isCreatingPayee = useRef(false);
 
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const parentPayee = useParentPayee(
     payees,
@@ -887,7 +887,7 @@ const Transaction = memo(function Transaction({
   showSelection,
   allowSplitTransaction,
 }) {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const dispatchSelected = useSelectedDispatch();
   const triggerRef = useRef(null);
 
@@ -2106,7 +2106,7 @@ function TransactionTableInner({
 }
 
 export const TransactionTable = forwardRef((props, ref) => {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [newTransactions, setNewTransactions] = useState(null);
   const [prevIsAdding, setPrevIsAdding] = useState(false);
   const splitsExpanded = useSplitsExpanded();

packages/desktop-client/src/components/util/GenericInput.jsx

@@ -6,7 +6,7 @@ import { integerToAmount, amountToInteger } from 'loot-core/src/shared/util';
 
 import { useCategories } from '../../hooks/useCategories';
 import { useDateFormat } from '../../hooks/useDateFormat';
-import { useSelector } from '../../redux';
+import { useAppSelector } from '../../redux';
 import { AccountAutocomplete } from '../autocomplete/AccountAutocomplete';
 import { Autocomplete } from '../autocomplete/Autocomplete';
 import { CategoryAutocomplete } from '../autocomplete/CategoryAutocomplete';
@@ -36,7 +36,7 @@ export function GenericInput({
 }) {
   const { grouped: categoryGroups } = useCategories();
   const { data: savedReports } = useReports();
-  const saved = useSelector(state => state.queries.saved);
+  const saved = useAppSelector(state => state.queries.saved);
   const dateFormat = useDateFormat() || 'MM/dd/yyyy';
 
   const getNumberInputByFormatType = numberFormatType => {

packages/desktop-client/src/hooks/useAccounts.ts

@@ -2,11 +2,11 @@ import { useEffect } from 'react';
 
 import { getAccounts } from 'loot-core/client/queries/queriesSlice';
 
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 
 export function useAccounts() {
-  const dispatch = useDispatch();
-  const accountsLoaded = useSelector(state => state.queries.accountsLoaded);
+  const dispatch = useAppDispatch();
+  const accountsLoaded = useAppSelector(state => state.queries.accountsLoaded);
 
   useEffect(() => {
     if (!accountsLoaded) {
@@ -14,5 +14,5 @@ export function useAccounts() {
     }
   }, []);
 
-  return useSelector(state => state.queries.accounts);
+  return useAppSelector(state => state.queries.accounts);
 }

packages/desktop-client/src/hooks/useCategories.ts

@@ -2,11 +2,13 @@ import { useEffect } from 'react';
 
 import { getCategories } from 'loot-core/client/queries/queriesSlice';
 
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 
 export function useCategories() {
-  const dispatch = useDispatch();
-  const categoriesLoaded = useSelector(state => state.queries.categoriesLoaded);
+  const dispatch = useAppDispatch();
+  const categoriesLoaded = useAppSelector(
+    state => state.queries.categoriesLoaded,
+  );
 
   useEffect(() => {
     if (!categoriesLoaded) {
@@ -14,5 +16,5 @@ export function useCategories() {
     }
   }, []);
 
-  return useSelector(state => state.queries.categories);
+  return useAppSelector(state => state.queries.categories);
 }

packages/desktop-client/src/hooks/useFailedAccounts.ts

@@ -1,9 +1,9 @@
 import { useMemo } from 'react';
 
-import { useSelector } from '../redux';
+import { useAppSelector } from '../redux';
 
 export function useFailedAccounts() {
-  const failedAccounts = useSelector(state => state.account.failedAccounts);
+  const failedAccounts = useAppSelector(state => state.account.failedAccounts);
   return useMemo(
     () => new Map(Object.entries(failedAccounts)),
     [failedAccounts],

packages/desktop-client/src/hooks/useGlobalPref.ts

@@ -3,7 +3,7 @@ import { useCallback } from 'react';
 import { saveGlobalPrefs } from 'loot-core/src/client/actions';
 import { type GlobalPrefs } from 'loot-core/src/types/prefs';
 
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 
 type SetGlobalPrefAction<K extends keyof GlobalPrefs> = (
   value: GlobalPrefs[K],
@@ -13,7 +13,7 @@ export function useGlobalPref<K extends keyof GlobalPrefs>(
   prefName: K,
   onSaveGlobalPrefs?: () => void,
 ): [GlobalPrefs[K], SetGlobalPrefAction<K>] {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const setGlobalPref = useCallback<SetGlobalPrefAction<K>>(
     value => {
       dispatch(
@@ -27,7 +27,7 @@ export function useGlobalPref<K extends keyof GlobalPrefs>(
     },
     [prefName, dispatch, onSaveGlobalPrefs],
   );
-  const globalPref = useSelector(
+  const globalPref = useAppSelector(
     state => state.prefs.global?.[prefName] as GlobalPrefs[K],
   );
 

packages/desktop-client/src/hooks/useMetadataPref.ts

@@ -3,7 +3,7 @@ import { useCallback } from 'react';
 import { savePrefs } from 'loot-core/client/actions';
 import { type MetadataPrefs } from 'loot-core/types/prefs';
 
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 
 type SetMetadataPrefAction<K extends keyof MetadataPrefs> = (
   value: MetadataPrefs[K],
@@ -12,14 +12,14 @@ type SetMetadataPrefAction<K extends keyof MetadataPrefs> = (
 export function useMetadataPref<K extends keyof MetadataPrefs>(
   prefName: K,
 ): [MetadataPrefs[K], SetMetadataPrefAction<K>] {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const setLocalPref = useCallback<SetMetadataPrefAction<K>>(
     value => {
       dispatch(savePrefs({ [prefName]: value }));
     },
     [prefName, dispatch],
   );
-  const localPref = useSelector(state => state.prefs.local?.[prefName]);
+  const localPref = useAppSelector(state => state.prefs.local?.[prefName]);
 
   return [localPref, setLocalPref];
 }

packages/desktop-client/src/hooks/useModalState.ts

@@ -3,7 +3,7 @@ import { useCallback } from 'react';
 import { popModal } from 'loot-core/client/actions';
 import { type Modal } from 'loot-core/client/state-types/modals';
 
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 
 type ModalState = {
   onClose: () => void;
@@ -14,9 +14,9 @@ type ModalState = {
 };
 
 export function useModalState(): ModalState {
-  const modalStack = useSelector(state => state.modals.modalStack);
-  const isHidden = useSelector(state => state.modals.isHidden);
-  const dispatch = useDispatch();
+  const modalStack = useAppSelector(state => state.modals.modalStack);
+  const isHidden = useAppSelector(state => state.modals.isHidden);
+  const dispatch = useAppDispatch();
 
   const popModalCallback = useCallback(() => {
     dispatch(popModal());

packages/desktop-client/src/hooks/usePayees.ts

@@ -5,11 +5,11 @@ import {
   getPayees,
 } from 'loot-core/client/queries/queriesSlice';
 
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 
 export function useCommonPayees() {
-  const dispatch = useDispatch();
-  const commonPayeesLoaded = useSelector(
+  const dispatch = useAppDispatch();
+  const commonPayeesLoaded = useAppSelector(
     state => state.queries.commonPayeesLoaded,
   );
 
@@ -19,12 +19,12 @@ export function useCommonPayees() {
     }
   }, []);
 
-  return useSelector(state => state.queries.commonPayees);
+  return useAppSelector(state => state.queries.commonPayees);
 }
 
 export function usePayees() {
-  const dispatch = useDispatch();
-  const payeesLoaded = useSelector(state => state.queries.payeesLoaded);
+  const dispatch = useAppDispatch();
+  const payeesLoaded = useAppSelector(state => state.queries.payeesLoaded);
 
   useEffect(() => {
     if (!payeesLoaded) {
@@ -32,5 +32,5 @@ export function usePayees() {
     }
   }, []);
 
-  return useSelector(state => state.queries.payees);
+  return useAppSelector(state => state.queries.payees);
 }

packages/desktop-client/src/hooks/useSyncServerStatus.ts

@@ -1,11 +1,11 @@
 import { useServerURL } from '../components/ServerContext';
-import { useSelector } from '../redux';
+import { useAppSelector } from '../redux';
 
 type SyncServerStatus = 'offline' | 'no-server' | 'online';
 
 export function useSyncServerStatus(): SyncServerStatus {
   const serverUrl = useServerURL();
-  const userData = useSelector(state => state.user.data);
+  const userData = useAppSelector(state => state.user.data);
 
   if (!serverUrl) {
     return 'no-server';

packages/desktop-client/src/hooks/useSyncedPref.ts

@@ -3,7 +3,7 @@ import { useCallback } from 'react';
 import { saveSyncedPrefs } from 'loot-core/client/actions';
 import { type SyncedPrefs } from 'loot-core/src/types/prefs';
 
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 
 type SetSyncedPrefAction<K extends keyof SyncedPrefs> = (
   value: SyncedPrefs[K],
@@ -12,14 +12,14 @@ type SetSyncedPrefAction<K extends keyof SyncedPrefs> = (
 export function useSyncedPref<K extends keyof SyncedPrefs>(
   prefName: K,
 ): [SyncedPrefs[K], SetSyncedPrefAction<K>] {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const setPref = useCallback<SetSyncedPrefAction<K>>(
     value => {
       dispatch(saveSyncedPrefs({ [prefName]: value }));
     },
     [prefName, dispatch],
   );
-  const pref = useSelector(state => state.prefs.synced[prefName]);
+  const pref = useAppSelector(state => state.prefs.synced[prefName]);
 
   return [pref, setPref];
 }

packages/desktop-client/src/hooks/useSyncedPrefs.ts

@@ -3,20 +3,20 @@ import { useCallback } from 'react';
 import { saveSyncedPrefs } from 'loot-core/client/actions';
 import { type SyncedPrefs } from 'loot-core/src/types/prefs';
 
-import { useSelector, useDispatch } from '../redux';
+import { useAppSelector, useAppDispatch } from '../redux';
 
 type SetSyncedPrefsAction = (value: Partial<SyncedPrefs>) => void;
 
 /** @deprecated: please use `useSyncedPref` (singular) */
 export function useSyncedPrefs(): [SyncedPrefs, SetSyncedPrefsAction] {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const setPrefs = useCallback<SetSyncedPrefsAction>(
     newValue => {
       dispatch(saveSyncedPrefs(newValue));
     },
     [dispatch],
   );
-  const prefs = useSelector(state => state.prefs.synced);
+  const prefs = useAppSelector(state => state.prefs.synced);
 
   return [prefs, setPrefs];
 }

packages/desktop-client/src/hooks/useTransactionBatchActions.ts

@@ -17,7 +17,7 @@ import {
   type TransactionEntity,
 } from 'loot-core/types/models';
 
-import { useDispatch } from '../redux';
+import { useAppDispatch } from '../redux';
 
 type BatchEditProps = {
   name: keyof TransactionEntity;
@@ -55,7 +55,7 @@ type BatchUnlinkScheduleProps = {
 };
 
 export function useTransactionBatchActions() {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const onBatchEdit = async ({ name, ids, onSuccess }: BatchEditProps) => {
     const { data } = await runQuery(