Merge branch 'master' into master

.eslintrc.js

@@ -161,7 +161,12 @@ module.exports = {
     ],
     'no-with': 'warn',
     'no-whitespace-before-property': 'warn',
-    'react-hooks/exhaustive-deps': 'warn',
+    'react-hooks/exhaustive-deps': [
+      'warn',
+      {
+        additionalHooks: '(useQuery)',
+      },
+    ],
     'require-yield': 'warn',
     'rest-spread-spacing': ['warn', 'never'],
     strict: ['warn', 'never'],

bin/package-electron

@@ -36,7 +36,7 @@ fi
 
 yarn workspace loot-core build:node
 
-yarn workspace @actual-app/web build --mode=desktop
+yarn workspace @actual-app/web build --mode=desktop # electron specific build
 
 yarn workspace desktop-electron update-client
 

packages/api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@actual-app/api",
-  "version": "24.11.0",
+  "version": "24.12.0",
   "license": "MIT",
   "description": "An API for Actual",
   "engines": {

packages/desktop-client/.gitignore

@@ -10,6 +10,7 @@ playwright-report
 
 # production
 build
+build-electron
 build-stats
 stats.json
 

packages/desktop-client/e2e/accounts.mobile.test.js

@@ -27,6 +27,7 @@ test.describe('Mobile Accounts', () => {
 
   test('opens the accounts page and asserts on balances', async () => {
     const accountsPage = await navigation.goToAccountsPage();
+    await accountsPage.waitFor();
 
     const account = await accountsPage.getNthAccount(1);
 
@@ -37,7 +38,10 @@ test.describe('Mobile Accounts', () => {
 
   test('opens individual account page and checks that filtering is working', async () => {
     const accountsPage = await navigation.goToAccountsPage();
+    await accountsPage.waitFor();
+
     const accountPage = await accountsPage.openNthAccount(0);
+    await accountPage.waitFor();
 
     await expect(accountPage.heading).toHaveText('Bank of America');
     await expect(accountPage.transactionList).toBeVisible();
@@ -50,6 +54,9 @@ test.describe('Mobile Accounts', () => {
     await expect(accountPage.transactions).toHaveCount(0);
     await expect(page).toMatchThemeScreenshots();
 
+    await accountPage.clearSearch();
+    await expect(accountPage.transactions).not.toHaveCount(0);
+
     await accountPage.searchByText('Kroger');
     await expect(accountPage.transactions).not.toHaveCount(0);
     await expect(page).toMatchThemeScreenshots();

packages/desktop-client/e2e/accounts.test.js

@@ -62,6 +62,8 @@ test.describe('Accounts', () => {
 
     test('creates a transfer from two existing transactions', async () => {
       accountPage = await navigation.goToAccountPage('For budget');
+      await accountPage.waitFor();
+
       await expect(accountPage.accountName).toHaveText('Budgeted Accounts');
 
       await accountPage.filterByNote('Test Acc Transfer');
@@ -109,6 +111,7 @@ test.describe('Accounts', () => {
         offBudget: false,
         balance: 0,
       });
+      await accountPage.waitFor();
     });
 
     async function importCsv(screenshot = false) {

packages/desktop-client/e2e/page-models/account-page.js

@@ -30,6 +30,10 @@ export class AccountPage {
     this.selectTooltip = this.page.getByTestId('transactions-select-tooltip');
   }
 
+  async waitFor() {
+    await this.transactionTable.waitFor();
+  }
+
   /**
    * Enter details of a transaction
    */

packages/desktop-client/e2e/page-models/mobile-account-page.js

@@ -15,6 +15,10 @@ export class MobileAccountPage {
     });
   }
 
+  async waitFor() {
+    await this.transactionList.waitFor();
+  }
+
   /**
    * Retrieve the balance of the account as a number
    */
@@ -29,6 +33,10 @@ export class MobileAccountPage {
     await this.searchBox.fill(term);
   }
 
+  async clearSearch() {
+    await this.searchBox.clear();
+  }
+
   /**
    * Go to transaction creation page
    */

packages/desktop-client/e2e/page-models/mobile-accounts-page.js

@@ -4,9 +4,14 @@ export class MobileAccountsPage {
   constructor(page) {
     this.page = page;
 
+    this.accountList = this.page.getByLabel('Account list');
     this.accounts = this.page.getByTestId('account');
   }
 
+  async waitFor() {
+    await this.accountList.waitFor();
+  }
+
   /**
    * Get the name and balance of the nth account
    */

packages/desktop-client/e2e/page-models/mobile-navigation.js

@@ -1,3 +1,4 @@
+import { MobileAccountPage } from './mobile-account-page';
 import { MobileAccountsPage } from './mobile-accounts-page';
 import { MobileBudgetPage } from './mobile-budget-page';
 import { MobileTransactionEntryPage } from './mobile-transaction-entry-page';
@@ -22,6 +23,13 @@ export class MobileNavigation {
     return new MobileAccountsPage(this.page);
   }
 
+  async goToUncategorizedPage() {
+    const button = this.page.getByRole('button', { name: /uncategorized/ });
+    await button.click();
+
+    return new MobileAccountPage(this.page);
+  }
+
   async goToTransactionEntryPage() {
     const link = this.page.getByRole('link', { name: 'Transaction' });
     await link.click();

packages/desktop-client/e2e/page-models/reports-page.js

@@ -22,8 +22,9 @@ export class ReportsPage {
 
   async goToCustomReportPage() {
     await this.pageContent
-      .getByRole('button', { name: 'Create new custom report' })
+      .getByRole('button', { name: 'Add new widget' })
       .click();
+    await this.page.getByRole('button', { name: 'New custom report' }).click();
     return new CustomReportPage(this.page);
   }
 

packages/desktop-client/e2e/page-models/settings-page.js

@@ -8,27 +8,10 @@ export class SettingsPage {
   }
 
   async useBudgetType(budgetType) {
-    await this.enableExperimentalFeature('Budget mode toggle');
-
     const switchBudgetTypeButton = this.page.getByRole('button', {
       name: `Switch to ${budgetType} budgeting`,
     });
 
     await switchBudgetTypeButton.click();
   }
-
-  async enableExperimentalFeature(featureName) {
-    const advancedSettingsButton = this.page.getByTestId('advanced-settings');
-    await advancedSettingsButton.click();
-
-    const experimentalSettingsButton = this.page.getByTestId(
-      'experimental-settings',
-    );
-    await experimentalSettingsButton.click();
-
-    const featureCheckbox = this.page.getByRole('checkbox', {
-      name: featureName,
-    });
-    await featureCheckbox.click();
-  }
 }

packages/desktop-client/e2e/transactions.mobile.test.js

@@ -48,11 +48,8 @@ test.describe('Mobile Transactions', () => {
     );
     await expect(page).toMatchThemeScreenshots();
 
-    const accountPage = await transactionEntryPage.createTransaction();
-
-    await expect(accountPage.transactions.nth(0)).toHaveText(
-      'KrogerClothing-12.34',
-    );
+    await transactionEntryPage.createTransaction();
+    await expect(page.getByLabel('Transaction list')).toHaveCount(0);
     await expect(page).toMatchThemeScreenshots();
   });
 
@@ -82,4 +79,74 @@ test.describe('Mobile Transactions', () => {
       'KrogerClothing-12.34',
     );
   });
+
+  test('creates an uncategorized transaction from `/accounts/uncategorized` page', async () => {
+    // Create uncategorized transaction
+    let transactionEntryPage = await navigation.goToTransactionEntryPage();
+    await transactionEntryPage.amountField.fill('12.35');
+    // Click anywhere to cancel active edit.
+    await transactionEntryPage.header.click();
+    await transactionEntryPage.fillField(
+      page.getByTestId('account-field'),
+      'Ally Savings',
+    );
+    await transactionEntryPage.createTransaction();
+
+    const uncategorizedPage = await navigation.goToUncategorizedPage();
+    transactionEntryPage = await uncategorizedPage.clickCreateTransaction();
+
+    await expect(transactionEntryPage.header).toHaveText('New Transaction');
+
+    await transactionEntryPage.amountField.fill('12.34');
+    // Click anywhere to cancel active edit.
+    await transactionEntryPage.header.click();
+    await transactionEntryPage.fillField(
+      page.getByTestId('payee-field'),
+      'Kroger',
+    );
+
+    await transactionEntryPage.createTransaction();
+
+    await expect(uncategorizedPage.transactions.nth(0)).toHaveText(
+      'KrogerUncategorized-12.34',
+    );
+    await expect(page).toMatchThemeScreenshots();
+  });
+
+  test('creates a categorized transaction from `/accounts/uncategorized` page', async () => {
+    // Create uncategorized transaction
+    let transactionEntryPage = await navigation.goToTransactionEntryPage();
+    await transactionEntryPage.amountField.fill('12.35');
+    // Click anywhere to cancel active edit.
+    await transactionEntryPage.header.click();
+    await transactionEntryPage.fillField(
+      page.getByTestId('account-field'),
+      'Ally Savings',
+    );
+    await transactionEntryPage.createTransaction();
+
+    const uncategorizedPage = await navigation.goToUncategorizedPage();
+    transactionEntryPage = await uncategorizedPage.clickCreateTransaction();
+
+    await expect(transactionEntryPage.header).toHaveText('New Transaction');
+
+    await transactionEntryPage.amountField.fill('12.34');
+    // Click anywhere to cancel active edit.
+    await transactionEntryPage.header.click();
+    await transactionEntryPage.fillField(
+      page.getByTestId('payee-field'),
+      'Kroger',
+    );
+    await transactionEntryPage.fillField(
+      page.getByTestId('category-field'),
+      'Clothing',
+    );
+
+    await transactionEntryPage.createTransaction();
+
+    await expect(uncategorizedPage.transactions.nth(0)).toHaveText(
+      '(No payee)Uncategorized-12.35',
+    );
+    await expect(page).toMatchThemeScreenshots();
+  });
 });

packages/desktop-client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@actual-app/web",
-  "version": "24.11.0",
+  "version": "24.12.0",
   "license": "MIT",
   "files": [
     "build"
@@ -50,8 +50,8 @@
     "promise-retry": "^2.0.1",
     "re-resizable": "^6.9.17",
     "react": "18.2.0",
-    "react-aria": "^3.34.3",
-    "react-aria-components": "^1.3.3",
+    "react-aria": "^3.35.1",
+    "react-aria-components": "^1.4.1",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1",
     "react-dom": "18.2.0",
@@ -65,7 +65,7 @@
     "react-router-dom": "6.21.3",
     "react-simple-pull-to-refresh": "^1.3.3",
     "react-spring": "^9.7.3",
-    "react-stately": "^3.10.9",
+    "react-stately": "^3.33.0",
     "react-virtualized-auto-sizer": "^1.0.21",
     "recharts": "^2.10.4",
     "redux": "^4.2.1",

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

@@ -40,7 +40,6 @@ import { FinancesApp } from './FinancesApp';
 import { ManagementApp } from './manager/ManagementApp';
 import { Modals } from './Modals';
 import { ResponsiveProvider } from './responsive/ResponsiveProvider';
-import { ScrollProvider } from './ScrollProvider';
 import { SidebarProvider } from './sidebar/SidebarProvider';
 import { UpdateNotification } from './UpdateNotification';
 
@@ -180,36 +179,34 @@ export function App() {
             <SidebarProvider>
               <BudgetMonthCountProvider>
                 <DndProvider backend={HTML5Backend}>
-                  <ScrollProvider>
+                  <View
+                    data-theme={theme}
+                    style={{
+                      height: '100%',
+                      display: 'flex',
+                      flexDirection: 'column',
+                    }}
+                  >
                     <View
-                      data-theme={theme}
+                      key={
+                        hiddenScrollbars ? 'hidden-scrollbars' : 'scrollbars'
+                      }
                       style={{
-                        height: '100%',
-                        display: 'flex',
-                        flexDirection: 'column',
+                        flexGrow: 1,
+                        overflow: 'hidden',
+                        ...styles.lightScrollbar,
                       }}
                     >
-                      <View
-                        key={
-                          hiddenScrollbars ? 'hidden-scrollbars' : 'scrollbars'
-                        }
-                        style={{
-                          flexGrow: 1,
-                          overflow: 'hidden',
-                          ...styles.lightScrollbar,
-                        }}
-                      >
-                        <ErrorBoundary FallbackComponent={ErrorFallback}>
-                          {process.env.REACT_APP_REVIEW_ID &&
-                            !Platform.isPlaywright && <DevelopmentTopBar />}
-                          <AppInner />
-                        </ErrorBoundary>
-                        <ThemeStyle />
-                        <Modals />
-                        <UpdateNotification />
-                      </View>
+                      <ErrorBoundary FallbackComponent={ErrorFallback}>
+                        {process.env.REACT_APP_REVIEW_ID &&
+                          !Platform.isPlaywright && <DevelopmentTopBar />}
+                        <AppInner />
+                      </ErrorBoundary>
+                      <ThemeStyle />
+                      <Modals />
+                      <UpdateNotification />
                     </View>
-                  </ScrollProvider>
+                  </View>
                 </DndProvider>
               </BudgetMonthCountProvider>
             </SidebarProvider>