Merge branch 'master' into enhancement/context_menus/improve

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/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/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"

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/accounts/Header.tsx

@@ -369,7 +369,7 @@ export function AccountHeader({
               onMakeAsNonSplitTransactions={onMakeAsNonSplitTransactions}
             />
           )}
-          <View>
+          <View style={{ flex: '0 0 auto' }}>
             {account && (
               <>
                 <Button
@@ -427,7 +427,7 @@ export function AccountHeader({
             </View>
           </Button>
           {account ? (
-            <View>
+            <View style={{ flex: '0 0 auto' }}>
               <MenuButton
                 aria-label="Account menu"
                 ref={triggerRef}
@@ -456,7 +456,7 @@ export function AccountHeader({
               </Popover>
             </View>
           ) : (
-            <View>
+            <View style={{ flex: '0 0 auto' }}>
               <MenuButton
                 aria-label="Account menu"
                 ref={triggerRef}

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/mobile/accounts/AccountTransactions.tsx

@@ -73,7 +73,9 @@ export function AccountTransactions({
             )
           }
           leftContent={<MobileBackButton />}
-          rightContent={<AddTransactionButton accountId={accountId} />}
+          rightContent={
+            <AddTransactionButton accountId={account ? accountId : undefined} />
+          }
         />
       }
       padding={0}

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

@@ -156,7 +156,7 @@ export function Status({ status, isSplit }) {
 
 function Footer({
   transactions,
-  adding,
+  isAdding,
   onAdd,
   onSave,
   onSplit,
@@ -232,7 +232,7 @@ function Footer({
             Select account
           </Text>
         </Button>
-      ) : adding ? (
+      ) : isAdding ? (
         <Button
           type="primary"
           style={{ height: styles.mobileMinHeight }}
@@ -436,7 +436,7 @@ const ChildTransactionEdit = forwardRef(
 ChildTransactionEdit.displayName = 'ChildTransactionEdit';
 
 const TransactionEditInner = memo(function TransactionEditInner({
-  adding,
+  isAdding,
   accounts,
   categories,
   payees,
@@ -479,10 +479,10 @@ const TransactionEditInner = memo(function TransactionEditInner({
   const isInitialMount = useInitialMount();
 
   useEffect(() => {
-    if (isInitialMount && adding) {
+    if (isInitialMount && isAdding) {
       onTotalAmountEdit();
     }
-  }, [adding, isInitialMount, onTotalAmountEdit]);
+  }, [isAdding, isInitialMount, onTotalAmountEdit]);
 
   const getAccount = useCallback(
     trans => {
@@ -532,24 +532,12 @@ const TransactionEditInner = memo(function TransactionEditInner({
 
     const onConfirmSave = () => {
       let transactionsToSave = unserializedTransactions;
-      if (adding) {
+      if (isAdding) {
         transactionsToSave = realizeTempTransactions(unserializedTransactions);
       }
 
       onSave(transactionsToSave);
-
-      if (adding || hasAccountChanged.current) {
-        const { account: accountId } = unserializedTransaction;
-        const account = accountsById?.[accountId];
-        if (account) {
-          navigate(`/accounts/${account.id}`, { replace: true });
-        } else {
-          // Handle the case where account is undefined
-          navigate(-1);
-        }
-      } else {
-        navigate(-1);
-      }
+      navigate(-1);
     };
 
     if (unserializedTransaction.reconciled) {
@@ -566,14 +554,7 @@ const TransactionEditInner = memo(function TransactionEditInner({
     } else {
       onConfirmSave();
     }
-  }, [
-    accountsById,
-    adding,
-    dispatch,
-    navigate,
-    onSave,
-    unserializedTransactions,
-  ]);
+  }, [isAdding, dispatch, navigate, onSave, unserializedTransactions]);
 
   const onUpdateInner = useCallback(
     async (serializedTransaction, name, value) => {
@@ -757,7 +738,7 @@ const TransactionEditInner = memo(function TransactionEditInner({
         <MobilePageHeader
           title={
             transaction.payee == null
-              ? adding
+              ? isAdding
                 ? 'New Transaction'
                 : 'Transaction'
               : title
@@ -772,7 +753,7 @@ const TransactionEditInner = memo(function TransactionEditInner({
       footer={
         <Footer
           transactions={transactions}
-          adding={adding}
+          isAdding={isAdding}
           onAdd={onSaveInner}
           onSave={onSaveInner}
           onSplit={onSplit}
@@ -976,7 +957,7 @@ const TransactionEditInner = memo(function TransactionEditInner({
           />
         </View>
 
-        {!adding && (
+        {!isAdding && (
           <View style={{ alignItems: 'center' }}>
             <Button
               onClick={() => onDeleteInner(transaction.id)}
@@ -1042,8 +1023,8 @@ function TransactionEditUnconnected({
   const dispatch = useDispatch();
   const [transactions, setTransactions] = useState([]);
   const [fetchedTransactions, setFetchedTransactions] = useState([]);
-  const adding = useRef(false);
-  const deleted = useRef(false);
+  const isAdding = useRef(false);
+  const isDeleted = useRef(false);
 
   useEffect(() => {
     let unmounted = false;
@@ -1074,7 +1055,7 @@ function TransactionEditUnconnected({
     if (transactionId !== 'new') {
       fetchTransaction();
     } else {
-      adding.current = true;
+      isAdding.current = true;
     }
 
     return () => {
@@ -1083,7 +1064,7 @@ function TransactionEditUnconnected({
   }, [transactionId]);
 
   useEffect(() => {
-    if (adding.current) {
+    if (isAdding.current) {
       setTransactions(
         makeTemporaryTransactions(
           locationState?.accountId || lastTransaction?.account || null,
@@ -1152,7 +1133,7 @@ function TransactionEditUnconnected({
 
   const onSave = useCallback(
     async newTransactions => {
-      if (deleted.current) {
+      if (isDeleted.current) {
         return;
       }
 
@@ -1176,7 +1157,7 @@ function TransactionEditUnconnected({
         // }
       }
 
-      if (adding.current) {
+      if (isAdding.current) {
         // The first one is always the "parent" and the only one we care
         // about
         dispatch(setLastTransaction(newTransactions[0]));
@@ -1189,9 +1170,9 @@ function TransactionEditUnconnected({
     async id => {
       const changes = deleteTransaction(transactions, id);
 
-      if (adding.current) {
+      if (isAdding.current) {
         // Adding a new transactions, this disables saving when the component unmounts
-        deleted.current = true;
+        isDeleted.current = true;
       } else {
         const _remoteUpdates = await send('transactions-batch-update', {
           deleted: changes.diff.deleted,
@@ -1244,7 +1225,7 @@ function TransactionEditUnconnected({
     >
       <TransactionEditInner
         transactions={transactions}
-        adding={adding.current}
+        isAdding={isAdding.current}
         categories={categories}
         accounts={accounts}
         payees={payees}