diff --git a/packages/api/index.ts b/packages/api/index.ts index be3f92d8bff..dfdadf2728d 100644 --- a/packages/api/index.ts +++ b/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'; diff --git a/packages/desktop-client/src/auth/AuthProvider.tsx b/packages/desktop-client/src/auth/AuthProvider.tsx index 987184f6b20..95ddcccbedf 100644 --- a/packages/desktop-client/src/auth/AuthProvider.tsx +++ b/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) => { diff --git a/packages/desktop-client/src/auth/ProtectedRoute.tsx b/packages/desktop-client/src/auth/ProtectedRoute.tsx index 0dad71a1c38..8704fadacb3 100644 --- a/packages/desktop-client/src/auth/ProtectedRoute.tsx +++ b/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); diff --git a/packages/desktop-client/src/components/App.tsx b/packages/desktop-client/src/components/App.tsx index 1051fce30e0..bfb356b2724 100644 --- a/packages/desktop-client/src/components/App.tsx +++ b/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 (cb?: () => T): Promise => { @@ -163,7 +163,7 @@ export function App() { const [hiddenScrollbars, setHiddenScrollbars] = useState( hasHiddenScrollbars(), ); - const dispatch = useDispatch(); + const dispatch = useAppDispatch(); useEffect(() => { function checkScrollbars() { diff --git a/packages/desktop-client/src/components/AppBackground.tsx b/packages/desktop-client/src/components/AppBackground.tsx index 423412e31e4..e3e5ef3c3b4 100644 --- a/packages/desktop-client/src/components/AppBackground.tsx +++ b/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)' }, diff --git a/packages/desktop-client/src/components/BankSyncStatus.tsx b/packages/desktop-client/src/components/BankSyncStatus.tsx index 843b62d3e3f..657b99a03ad 100644 --- a/packages/desktop-client/src/components/BankSyncStatus.tsx +++ b/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; diff --git a/packages/desktop-client/src/components/FinancesApp.tsx b/packages/desktop-client/src/components/FinancesApp.tsx index 8941874c1d6..5d122d976a9 100644 --- a/packages/desktop-client/src/components/FinancesApp.tsx +++ b/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', diff --git a/packages/desktop-client/src/components/HelpMenu.tsx b/packages/desktop-client/src/components/HelpMenu.tsx index 40a4208ed41..c06522eb93a 100644 --- a/packages/desktop-client/src/components/HelpMenu.tsx +++ b/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) => { diff --git a/packages/desktop-client/src/components/LoggedInUser.tsx b/packages/desktop-client/src/components/LoggedInUser.tsx index 0e715c5a107..6bc78bcbd22 100644 --- a/packages/desktop-client/src/components/LoggedInUser.tsx +++ b/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() { diff --git a/packages/desktop-client/src/components/ManageRules.tsx b/packages/desktop-client/src/components/ManageRules.tsx index 4afc38895ec..39178bf3be3 100644 --- a/packages/desktop-client/src/components/ManageRules.tsx +++ b/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('*'), []), diff --git a/packages/desktop-client/src/components/Modals.tsx b/packages/desktop-client/src/components/Modals.tsx index 4c1ac33c48b..6276725d91b 100644 --- a/packages/desktop-client/src/components/Modals.tsx +++ b/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'); diff --git a/packages/desktop-client/src/components/Notifications.tsx b/packages/desktop-client/src/components/Notifications.tsx index dde728d7d9d..bcfe12cb64e 100644 --- a/packages/desktop-client/src/components/Notifications.tsx +++ b/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 ( 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()); }; diff --git a/packages/desktop-client/src/components/accounts/Account.tsx b/packages/desktop-client/src/components/accounts/Account.tsx index 643a11286bb..3c5ca393b95 100644 --- a/packages/desktop-client/src/components/accounts/Account.tsx +++ b/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(); diff --git a/packages/desktop-client/src/components/accounts/AccountSyncCheck.tsx b/packages/desktop-client/src/components/accounts/AccountSyncCheck.tsx index f91425bbaec..22157be8f79 100644 --- a/packages/desktop-client/src/components/accounts/AccountSyncCheck.tsx +++ b/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); diff --git a/packages/desktop-client/src/components/admin/UserAccess/UserAccess.tsx b/packages/desktop-client/src/components/admin/UserAccess/UserAccess.tsx index 4d4aba87896..cd9d52e2622 100644 --- a/packages/desktop-client/src/components/admin/UserAccess/UserAccess.tsx +++ b/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 (