App slice

packages/desktop-client/playwright.config.js

@@ -26,7 +26,7 @@ expect.extend({
         : locator.locator('[data-theme]');
 
     // Check lightmode
-    await locator.evaluate(() => window.Actual.setTheme('auto'));
+    await locator.evaluate(() => global.Actual.setTheme('auto'));
     await expect(dataThemeLocator).toHaveAttribute('data-theme', 'auto');
     const lightmode = await expect(locator).toHaveScreenshot(config);
 
@@ -35,7 +35,7 @@ expect.extend({
     }
 
     // Switch to darkmode and check
-    await locator.evaluate(() => window.Actual.setTheme('dark'));
+    await locator.evaluate(() => global.Actual.setTheme('dark'));
     await expect(dataThemeLocator).toHaveAttribute('data-theme', 'dark');
     const darkmode = await expect(locator).toHaveScreenshot(config);
 
@@ -45,7 +45,7 @@ expect.extend({
     }
 
     // Switch to midnight theme and check
-    await locator.evaluate(() => window.Actual.setTheme('midnight'));
+    await locator.evaluate(() => global.Actual.setTheme('midnight'));
     await expect(dataThemeLocator).toHaveAttribute('data-theme', 'midnight');
     const midnightMode = await expect(locator).toHaveScreenshot(config);
 
@@ -55,7 +55,7 @@ expect.extend({
     }
 
     // Switch back to lightmode
-    await locator.evaluate(() => window.Actual.setTheme('auto'));
+    await locator.evaluate(() => global.Actual.setTheme('auto'));
     return {
       message: () => 'pass',
       pass: true,

packages/desktop-client/src/browser-preload.browser.js

@@ -1,6 +1,7 @@
 import { initBackend as initSQLBackend } from 'absurd-sql/dist/indexeddb-main-thread';
 import { registerSW } from 'virtual:pwa-register';
 
+import { send } from 'loot-core/platform/client/fetch';
 import * as Platform from 'loot-core/src/client/platform';
 
 import packageJson from '../package.json';
@@ -118,10 +119,10 @@ global.Actual = {
           reader.readAsArrayBuffer(file);
           reader.onload = async function (ev) {
             const filepath = `/uploads/${filename}`;
-
-            window.__actionsForMenu
-              .uploadFile(filename, ev.target.result)
-              .then(() => resolve([filepath]));
+            send('upload-file-web', {
+              filename,
+              contents: ev.target.result,
+            }).then(() => resolve([filepath]));
           };
           reader.onerror = function () {
             alert('Error reading file');

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

@@ -15,9 +15,9 @@ import {
   closeBudget,
   loadBudget,
   loadGlobalPrefs,
-  setAppState,
   sync,
 } from 'loot-core/client/actions';
+import { setAppState } from 'loot-core/client/app/appSlice';
 import { SpreadsheetProvider } from 'loot-core/client/SpreadsheetProvider';
 import * as Platform from 'loot-core/src/client/platform';
 import {

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

@@ -217,7 +217,7 @@ export function FatalError({ error }: FatalErrorProps) {
         )}
 
         <Paragraph>
-          <Button onPress={() => window.Actual?.relaunch()}>
+          <Button onPress={() => global.Actual.relaunch()}>
             <Trans>Restart app</Trans>
           </Button>
         </Paragraph>

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

@@ -5,7 +5,6 @@ import { useLocation } from 'react-router-dom';
 
 import { useToggle } from 'usehooks-ts';
 
-import { openDocsForCurrentPage } from 'loot-core/client/actions';
 import { pushModal } from 'loot-core/client/actions/modals';
 
 import { useFeatureFlag } from '../hooks/useFeatureFlag';
@@ -17,6 +16,30 @@ import { Menu } from './common/Menu';
 import { Popover } from './common/Popover';
 import { SpaceBetween } from './common/SpaceBetween';
 
+const getPageDocs = (page: string) => {
+  switch (page) {
+    case '/budget':
+      return 'https://actualbudget.org/docs/getting-started/envelope-budgeting';
+    case '/reports':
+      return 'https://actualbudget.org/docs/reports/';
+    case '/schedules':
+      return 'https://actualbudget.org/docs/schedules';
+    case '/payees':
+      return 'https://actualbudget.org/docs/transactions/payees';
+    case '/rules':
+      return 'https://actualbudget.org/docs/budgeting/rules';
+    case '/settings':
+      return 'https://actualbudget.org/docs/settings';
+    default:
+      // All pages under /accounts, plus any missing pages
+      return 'https://actualbudget.org/docs';
+  }
+};
+
+function openDocsForCurrentPage() {
+  global.Actual.openURLInBrowser(getPageDocs(window.location.pathname));
+}
+
 type HelpMenuItem = 'docs' | 'keyboard-shortcuts' | 'goal-templates';
 
 type HelpButtonProps = {
@@ -58,7 +81,7 @@ export const HelpMenu = () => {
   const handleItemSelect = (item: HelpMenuItem) => {
     switch (item) {
       case 'docs':
-        dispatch(openDocsForCurrentPage());
+        openDocsForCurrentPage();
         break;
       case 'keyboard-shortcuts':
         dispatch(pushModal('keyboard-shortcuts'));

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 
-import { setAppState, updateApp } from 'loot-core/client/actions';
+import { setAppState, updateApp } from 'loot-core/client/app/appSlice';
 
 import { SvgClose } from '../icons/v1';
 import { useAppSelector, useAppDispatch } from '../redux';
@@ -69,7 +69,7 @@ export function UpdateNotification() {
                   textDecoration: 'underline',
                 }}
                 onClick={() =>
-                  window.Actual?.openURLInBrowser(
+                  global.Actual.openURLInBrowser(
                     'https://actualbudget.org/docs/releases',
                   )
                 }

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

@@ -634,7 +634,7 @@ class AccountInternal extends PureComponent<
     const account = this.props.accounts.find(acct => acct.id === accountId);
 
     if (account) {
-      const res = await window.Actual?.openFileDialog({
+      const res = await global.Actual.openFileDialog({
         filters: [
           {
             name: t('Financial Files'),
@@ -667,7 +667,7 @@ class AccountInternal extends PureComponent<
       accountName && accountName.replace(/[()]/g, '').replace(/\s+/g, '-');
     const filename = `${normalizedName || 'transactions'}.csv`;
 
-    window.Actual?.saveFile(
+    global.Actual.saveFile(
       exportedTransactions,
       filename,
       t('Export Transactions'),

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

@@ -35,7 +35,7 @@ export function ConfigServer() {
   const [error, setError] = useState<string | null>(null);
 
   const restartElectronServer = useCallback(() => {
-    globalThis.window.Actual.restartElectronServer();
+    global.Actual.restartElectronServer();
     setError(null);
   }, []);
 
@@ -88,7 +88,7 @@ export function ConfigServer() {
   }
 
   async function onSelectSelfSignedCertificate() {
-    const selfSignedCertificateLocation = await window.Actual?.openFileDialog({
+    const selfSignedCertificateLocation = await global.Actual.openFileDialog({
       properties: ['openFile'],
       filters: [
         {

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

@@ -1,7 +1,8 @@
 import React, { useEffect } from 'react';
 import { Navigate, Route, Routes } from 'react-router-dom';
 
-import { loggedIn, setAppState } from 'loot-core/client/actions';
+import { loggedIn } from 'loot-core/client/actions';
+import { setAppState } from 'loot-core/client/app/appSlice';
 
 import { useMetaThemeColor } from '../../hooks/useMetaThemeColor';
 import { useAppSelector, useAppDispatch } from '../../redux';
@@ -44,7 +45,7 @@ function Version() {
         },
       }}
     >
-      {`App: v${window.Actual?.ACTUAL_VERSION} | Server: ${version}`}
+      {`App: v${global.Actual.ACTUAL_VERSION} | Server: ${version}`}
     </Text>
   );
 }

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

@@ -466,7 +466,7 @@ export function ImportTransactionsModal({ options }) {
   }
 
   async function onNewFile() {
-    const res = await window.Actual?.openFileDialog({
+    const res = await global.Actual.openFileDialog({
       filters: [
         {
           name: 'Financial Files',

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

@@ -51,7 +51,7 @@ export function ConfirmChangeDocumentDirModal({
   const dispatch = useAppDispatch();
 
   const restartElectronServer = useCallback(() => {
-    globalThis.window.Actual?.restartElectronServer();
+    global.Actual.restartElectronServer();
   }, []);
 
   const [_documentDir, setDocumentDirPref] = useGlobalPref(
@@ -64,7 +64,7 @@ export function ConfirmChangeDocumentDirModal({
     setLoading(true);
     try {
       if (moveFiles) {
-        await globalThis.window.Actual?.moveBudgetDirectory(
+        await global.Actual.moveBudgetDirectory(
           currentBudgetDirectory,
           newDirectory,
         );

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

@@ -19,7 +19,7 @@ function FileLocationSettings() {
   const dispatch = useAppDispatch();
 
   async function onChooseDocumentDir() {
-    const chosenDirectory = await window.Actual?.openFileDialog({
+    const chosenDirectory = await global.Actual.openFileDialog({
       properties: ['openDirectory'],
     });
 

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

@@ -38,7 +38,7 @@ export function ImportActualModal() {
   const [importing, setImporting] = useState(false);
 
   async function onImport() {
-    const res = await window.Actual?.openFileDialog({
+    const res = await global.Actual.openFileDialog({
       properties: ['openFile'],
       filters: [{ name: 'actual', extensions: ['zip', 'blob'] }],
     });

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

@@ -30,7 +30,7 @@ export function ImportYNAB4Modal() {
   const [importing, setImporting] = useState(false);
 
   async function onImport() {
-    const res = await window.Actual?.openFileDialog({
+    const res = await global.Actual.openFileDialog({
       properties: ['openFile'],
       filters: [{ name: 'ynab', extensions: ['zip'] }],
     });

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

@@ -33,7 +33,7 @@ export function ImportYNAB5Modal() {
   const [importing, setImporting] = useState(false);
 
   async function onImport() {
-    const res = await window.Actual?.openFileDialog({
+    const res = await global.Actual.openFileDialog({
       properties: ['openFile'],
       filters: [{ name: 'ynab', extensions: ['json'] }],
     });

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

@@ -211,14 +211,14 @@ export function Overview() {
       }),
     } satisfies ExportImportDashboard;
 
-    window.Actual?.saveFile(
+    global.Actual.saveFile(
       JSON.stringify(data, null, 2),
       'dashboard.json',
       'Export Dashboard',
     );
   };
   const onImport = async () => {
-    const openFileDialog = window.Actual?.openFileDialog;
+    const openFileDialog = global.Actual.openFileDialog;
 
     if (!openFileDialog) {
       dispatch(

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

@@ -33,7 +33,7 @@ export function ExportBudget() {
       return;
     }
 
-    window.Actual?.saveFile(
+    global.Actual.saveFile(
       response.data,
       `${format(new Date(), 'yyyy-MM-dd')}-${budgetName}.zip`,
       t('Export budget'),

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

@@ -63,7 +63,7 @@ function About() {
         })}
         data-vrt-mask
       >
-        <Text>Client version: v{window.Actual?.ACTUAL_VERSION}</Text>
+        <Text>Client version: v{global.Actual.ACTUAL_VERSION}</Text>
         <Text>Server version: {version}</Text>
         {isOutdated ? (
           <Link

packages/desktop-client/src/global-events.ts

@@ -6,10 +6,9 @@ import {
   closeModal,
   loadPrefs,
   pushModal,
-  reloadApp,
   replaceModal,
-  setAppState,
 } from 'loot-core/client/actions';
+import { setAppState } from 'loot-core/client/app/appSlice';
 import {
   getAccounts,
   getCategories,
@@ -162,6 +161,6 @@ export function handleGlobalEvents(store: AppStore) {
   });
 
   listen('api-fetch-redirected', () => {
-    store.dispatch(reloadApp());
+    global.Actual.reload();
   });
 }

packages/desktop-client/src/gocardless.ts

@@ -25,7 +25,7 @@ function _authorize(
 
         if ('error' in resp) return resp;
         const { link, requisitionId } = resp;
-        window.Actual?.openURLInBrowser(link);
+        global.Actual.openURLInBrowser(link);
 
         return send('gocardless-poll-web-token', {
           upgradingAccountId,

packages/desktop-client/src/index.tsx

@@ -15,6 +15,7 @@ import { createRoot } from 'react-dom/client';
 
 import * as accountsSlice from 'loot-core/src/client/accounts/accountsSlice';
 import * as actions from 'loot-core/src/client/actions';
+import * as appSlice from 'loot-core/src/client/app/appSlice';
 import * as queriesSlice from 'loot-core/src/client/queries/queriesSlice';
 import { runQuery } from 'loot-core/src/client/query-helpers';
 import { store } from 'loot-core/src/client/store';
@@ -34,6 +35,7 @@ const boundActions = bindActionCreators(
   {
     ...actions,
     ...accountsSlice.actions,
+    ...appSlice.actions,
     ...queriesSlice.actions,
   },
   store.dispatch,
@@ -42,19 +44,8 @@ const boundActions = bindActionCreators(
 // Listen for global events from the server or main process
 handleGlobalEvents(store);
 
-declare global {
-  // eslint-disable-next-line @typescript-eslint/consistent-type-definitions
-  interface Window {
-    __actionsForMenu: typeof boundActions & {
-      undo: typeof undo;
-      redo: typeof redo;
-      inputFocused: typeof inputFocused;
-    };
-
-    $send: typeof send;
-    $query: typeof runQuery;
-    $q: typeof q;
-  }
+async function appFocused() {
+  await send('app-focused');
 }
 
 function inputFocused() {
@@ -66,7 +57,13 @@ function inputFocused() {
 }
 
 // Expose this to the main process to menu items can access it
-window.__actionsForMenu = { ...boundActions, undo, redo, inputFocused };
+window.__actionsForMenu = {
+  ...boundActions,
+  undo,
+  redo,
+  appFocused,
+  inputFocused,
+};
 
 // Expose send for fun!
 window.$send = send;
@@ -82,3 +79,19 @@ root.render(
     </ServerProvider>
   </Provider>,
 );
+
+declare global {
+  // eslint-disable-next-line @typescript-eslint/consistent-type-definitions
+  interface Window {
+    __actionsForMenu: typeof boundActions & {
+      undo: typeof undo;
+      redo: typeof redo;
+      appFocused: typeof appFocused;
+      inputFocused: typeof inputFocused;
+    };
+
+    $send: typeof send;
+    $query: typeof runQuery;
+    $q: typeof q;
+  }
+}