Use useNavigate instead of accessing window.__navigate

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

@@ -6,6 +6,7 @@ import { useSelector } from 'react-redux';
 import { type State } from 'loot-core/src/client/state-types';
 
 import { useActions } from '../hooks/useActions';
+import { useNavigate } from '../hooks/useNavigate';
 import { theme, styles } from '../style';
 
 import { Button } from './common/Button2';
@@ -38,9 +39,11 @@ export function LoggedInUser({
     getUserData().then(() => setLoading(false));
   }, []);
 
+  const navigate = useNavigate();
+
   async function onChangePassword() {
     await closeBudget();
-    window.__navigate('/change-password');
+    navigate('/change-password');
   }
 
   async function onMenuSelect(type) {
@@ -52,14 +55,14 @@ export function LoggedInUser({
         break;
       case 'sign-in':
         await closeBudget();
-        window.__navigate('/login');
+        navigate('/login');
         break;
       case 'sign-out':
         signOut();
         break;
       case 'config-server':
         await closeBudget();
-        window.__navigate('/config-server');
+        navigate('/config-server');
         break;
       default:
     }

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

@@ -111,7 +111,6 @@ export function ConfigServer() {
   async function onCreateTestFile() {
     await setServerUrl(null);
     await createBudget({ testMode: true });
-    window.__navigate('/');
   }
 
   return (
@@ -250,7 +249,10 @@ export function ConfigServer() {
               <Button
                 variant="primary"
                 style={{ marginLeft: 15 }}
-                onPress={onCreateTestFile}
+                onPress={async () => {
+                  await onCreateTestFile();
+                  navigate('/');
+                }}
               >
                 {t('Create test file')}
               </Button>

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

@@ -5,6 +5,7 @@ import { useDispatch } from 'react-redux';
 
 import { importBudget } from 'loot-core/src/client/actions/budgets';
 
+import { useNavigate } from '../../../hooks/useNavigate';
 import { styles, theme } from '../../../style';
 import { Block } from '../../common/Block';
 import { ButtonWithLoading } from '../../common/Button2';
@@ -31,7 +32,7 @@ function getErrorMessage(error: string): string {
 
 export function ImportActualModal() {
   const { t } = useTranslation();
-
+  const navigate = useNavigate();
   const dispatch = useDispatch();
   const [error, setError] = useState<string | null>(null);
   const [importing, setImporting] = useState(false);
@@ -46,6 +47,7 @@ export function ImportActualModal() {
       setError(null);
       try {
         await dispatch(importBudget(res[0], 'actual'));
+        navigate('/budget');
       } catch (err) {
         setError(err.message);
       } finally {

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

@@ -5,6 +5,7 @@ import { useDispatch } from 'react-redux';
 
 import { importBudget } from 'loot-core/src/client/actions/budgets';
 
+import { useNavigate } from '../../../hooks/useNavigate';
 import { styles, theme } from '../../../style';
 import { Block } from '../../common/Block';
 import { ButtonWithLoading } from '../../common/Button2';
@@ -23,7 +24,7 @@ function getErrorMessage(error: string): string {
 
 export function ImportYNAB4Modal() {
   const { t } = useTranslation();
-
+  const navigate = useNavigate();
   const dispatch = useDispatch();
   const [error, setError] = useState<string | null>(null);
   const [importing, setImporting] = useState(false);
@@ -38,6 +39,7 @@ export function ImportYNAB4Modal() {
       setError(null);
       try {
         await dispatch(importBudget(res[0], 'ynab4'));
+        navigate('/budget');
       } catch (err) {
         setError(err.message);
       } finally {

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

@@ -5,6 +5,7 @@ import { useDispatch } from 'react-redux';
 
 import { importBudget } from 'loot-core/src/client/actions/budgets';
 
+import { useNavigate } from '../../../hooks/useNavigate';
 import { styles, theme } from '../../../style';
 import { Block } from '../../common/Block';
 import { ButtonWithLoading } from '../../common/Button2';
@@ -26,7 +27,7 @@ function getErrorMessage(error: string): string {
 
 export function ImportYNAB5Modal() {
   const { t } = useTranslation();
-
+  const navigate = useNavigate();
   const dispatch = useDispatch();
   const [error, setError] = useState<string | null>(null);
   const [importing, setImporting] = useState(false);
@@ -41,6 +42,7 @@ export function ImportYNAB5Modal() {
       setError(null);
       try {
         await dispatch(importBudget(res[0], 'ynab5'));
+        navigate('/budget');
       } catch (err) {
         setError(err.message);
       } finally {

packages/loot-core/src/client/actions/budgets.ts

@@ -161,7 +161,6 @@ export function importBudget(
     dispatch(closeModal());
 
     await dispatch(loadPrefs());
-    window.__navigate('/budget');
   };
 }
 

upcoming-release-notes/3904.md

@@ -0,0 +1,6 @@
+---
+category: Maintenance
+authors: [joel-jeremy]
+---
+
+Use useNavigate instead of accessing window.__navigate