Cleanup

actualbudget · Apr 12, 2024 · c0bcdaa · c0bcdaa
1 parent 8f2a195
commit c0bcdaa
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 10 deletions.
diff --git a/packages/desktop-client/src/components/mobile/accounts/AccountTransactions.jsx b/packages/desktop-client/src/components/mobile/accounts/AccountTransactions.jsx
@@ -64,9 +64,7 @@ export function AccountTransactions({ account, pending, failed }) {
         )
       }
       headerLeftContent={<MobileBackButton />}
-      headerRightContent={
-        <AddTransactionButton state={{ accountId: account.id }} />
-      }
+      headerRightContent={<AddTransactionButton accountId={account.id} />}
       padding={0}
       style={{
         flex: 1,

diff --git a/packages/desktop-client/src/components/mobile/budget/CategoryTransactions.jsx b/packages/desktop-client/src/components/mobile/budget/CategoryTransactions.jsx
@@ -127,9 +127,7 @@ export function CategoryTransactions({ category, month }) {
         </View>
       }
       headerLeftContent={<MobileBackButton />}
-      headerRightContent={
-        <AddTransactionButton state={{ categoryId: category.id }} />
-      }
+      headerRightContent={<AddTransactionButton categoryId={category.id} />}
       padding={0}
       style={{
         flex: 1,

diff --git a/packages/desktop-client/src/components/mobile/transactions/AddTransactionButton.tsx b/packages/desktop-client/src/components/mobile/transactions/AddTransactionButton.tsx
@@ -1,24 +1,27 @@
 import React, { type ComponentPropsWithoutRef } from 'react';
 
+import { useNavigate } from '../../../hooks/useNavigate';
 import { SvgAdd } from '../../../icons/v1';
 import { theme } from '../../../style';
 import { ButtonLink } from '../../common/ButtonLink';
 
 type AddTransactionButtonProps = {
   to: ComponentPropsWithoutRef<typeof ButtonLink>['to'];
-  state?: ComponentPropsWithoutRef<typeof ButtonLink>['state'];
+  accountId?: string;
+  categoryId?: string;
 };
 
 export function AddTransactionButton({
   to = '/transactions/new',
-  state,
+  accountId,
+  categoryId,
 }: AddTransactionButtonProps) {
+  const navigate = useNavigate();
   return (
     <ButtonLink
       to={to}
-      state={state}
       type="bare"
-      aria-label="Add Transaction"
+      aria-label="Add transaction"
       style={{
         justifyContent: 'center',
         color: theme.mobileHeaderText,
@@ -29,6 +32,10 @@ export function AddTransactionButton({
         background: theme.mobileHeaderTextHover,
       }}
       activeStyle={{ background: 'transparent' }}
+      onClick={e => {
+        e.preventDefault();
+        navigate(to, { state: { accountId, categoryId } });
+      }}
     >
       <SvgAdd width={20} height={20} />
     </ButtonLink>