feat: Pending bank transactions

packages/webapp/src/containers/CashFlow/AccountTransactions/AccountTransactionsFilterTabs.tsx

@@ -20,7 +20,8 @@ export function AccountTransactionsFilterTabs() {
   const hasUncategorizedTransx = useMemo(
     () =>
       bankAccountMetaSummary?.totalUncategorizedTransactions > 0 ||
-      bankAccountMetaSummary?.totalExcludedTransactions > 0,
+      bankAccountMetaSummary?.totalExcludedTransactions > 0 ||
+      bankAccountMetaSummary?.totalPendingTransactions > 0,
     [bankAccountMetaSummary],
   );
 

packages/webapp/src/containers/CashFlow/AccountTransactions/AccountTransactionsUncategorizeFilter.tsx

@@ -1,4 +1,6 @@
 // @ts-nocheck
+import * as R from 'ramda';
+import { useMemo } from 'react';
 import { useAppQueryString } from '@/hooks';
 import { Group } from '@/components';
 import { useAccountTransactionsContext } from './AccountTransactionsProvider';
@@ -12,31 +14,49 @@ export function AccountTransactionsUncategorizeFilter() {
     bankAccountMetaSummary?.totalUncategorizedTransactions;
   const totalRecognized = bankAccountMetaSummary?.totalRecognizedTransactions;
 
+  const totalPending = bankAccountMetaSummary?.totalPendingTransactions;
+
   const handleTabsChange = (value) => {
     setLocationQuery({ uncategorizedFilter: value });
   };
 
+  const options = useMemo(
+    () =>
+      R.when(
+        () => totalPending > 0,
+        R.append({
+          value: 'pending',
+          label: (
+            <>
+              Pending <strong>({totalPending})</strong>
+            </>
+          ),
+        }),
+      )([
+        {
+          value: 'all',
+          label: (
+            <>
+              All <strong>({totalUncategorized})</strong>
+            </>
+          ),
+        },
+        {
+          value: 'recognized',
+          label: (
+            <>
+              Recognized <strong>({totalRecognized})</strong>
+            </>
+          ),
+        },
+      ]),
+    [totalPending, totalRecognized, totalUncategorized],
+  );
+
   return (
     <Group position={'apart'}>
       <TagsControl
-        options={[
-          {
-            value: 'all',
-            label: (
-              <>
-                All <strong>({totalUncategorized})</strong>
-              </>
-            ),
-          },
-          {
-            value: 'recognized',
-            label: (
-              <>
-                Recognized <strong>({totalRecognized})</strong>
-              </>
-            ),
-          },
-        ]}
+        options={options}
         value={locationQuery?.uncategorizedFilter || 'all'}
         onValueChange={handleTabsChange}
       />

packages/webapp/src/containers/CashFlow/AccountTransactions/AllTransactionsUncategorized.tsx

@@ -70,6 +70,8 @@ function AccountTransactionsSwitcher() {
     case 'all':
     default:
       return <AccountUncategorizedTransactions />;
+    case 'pending':
+      return null;
   }
 }