Add View transactions shortcut under Current balance

src/pages/workspace/expensifyCard/WorkspaceCardsListLabel.tsx

@@ -10,6 +10,7 @@ import Icon from '@components/Icon';
 import Popover from '@components/Popover';
 import {PressableWithFeedback} from '@components/Pressable';
 import Text from '@components/Text';
+import TextLink from '@components/TextLink';
 import useCurrencyForExpensifyCard from '@hooks/useCurrencyForExpensifyCard';
 import {useCurrencyListActions} from '@hooks/useCurrencyList';
 import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails';
@@ -21,16 +22,20 @@ import useResponsiveLayout from '@hooks/useResponsiveLayout';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
+import {createCardFeedKey} from '@libs/CardFeedUtils';
 import {getCardSettings} from '@libs/CardUtils';
 import getClickedTargetLocation from '@libs/getClickedTargetLocation';
 import type {PlatformStackRouteProp} from '@libs/Navigation/PlatformStackNavigation/types';
+import {buildQueryStringFromFilterFormValues} from '@libs/SearchQueryUtils';
+import Navigation from '@navigation/Navigation';
 import type {WorkspaceSplitNavigatorParamList} from '@navigation/types';
 import variables from '@styles/variables';
 import {queueExpensifyCardForBilling} from '@userActions/Card';
 import {requestExpensifyCardLimitIncrease} from '@userActions/Policy/Policy';
 import {navigateToConciergeChat} from '@userActions/Report';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
 
 type WorkspaceCardsListLabelProps = {
@@ -113,6 +118,18 @@ function WorkspaceCardsListLabel({type, value, style}: WorkspaceCardsListLabelPr
         queueExpensifyCardForBilling(CONST.COUNTRY.US, defaultFundID);
     };
 
+    const handleViewTransactionsPress = () => {
+        const fundIDForFeedKey = defaultFundID === CONST.DEFAULT_NUMBER_ID ? undefined : String(defaultFundID);
+        const feedKey = createCardFeedKey(fundIDForFeedKey, CONST.EXPENSIFY_CARD.BANK, undefined);
+        const query = buildQueryStringFromFilterFormValues({
+            type: CONST.SEARCH.DATA_TYPES.EXPENSE,
+            feed: [feedKey],
+            withdrawnOn: CONST.SEARCH.DATE_PRESETS.NEVER,
+            withdrawalStatus: [CONST.SEARCH.SETTLEMENT_STATUS.PENDING],
+        });
+        Navigation.navigate(ROUTES.SEARCH_ROOT.getRoute({query}));
+    };
+
     return (
         <View style={styles.flex1}>
             <View style={styles.flex1}>
@@ -148,6 +165,14 @@ function WorkspaceCardsListLabel({type, value, style}: WorkspaceCardsListLabelPr
                         </View>
                     )}
                 </View>
+                {isCurrentBalanceType && (
+                    <TextLink
+                        onPress={handleViewTransactionsPress}
+                        style={styles.mt1}
+                    >
+                        {translate('workspace.common.viewTransactions')}
+                    </TextLink>
+                )}
             </View>
             {isSettleDateTextDisplayed && <Text style={[styles.mutedNormalTextLabel, styles.mt1]}>{translate('workspace.expensifyCard.balanceWillBeSettledOn', settlementDate)}</Text>}
             <Popover

tests/unit/Search/SearchQueryUtilsTest.ts

@@ -447,6 +447,39 @@ describe('SearchQueryUtils', () => {
             expect(result).toEqual('type:expense withdrawn:last-month');
         });
 
+        test('with Expensify Card current balance view transactions filters', () => {
+            const feedKey = '21557189_Expensify Card';
+            const filterValues: Partial<SearchAdvancedFiltersForm> = {
+                type: CONST.SEARCH.DATA_TYPES.EXPENSE,
+                feed: [feedKey],
+                withdrawnOn: CONST.SEARCH.DATE_PRESETS.NEVER,
+                withdrawalStatus: [CONST.SEARCH.SETTLEMENT_STATUS.PENDING],
+            };
+
+            const result = buildQueryStringFromFilterFormValues(filterValues);
+
+            expect(result).toEqual('type:expense feed:"21557189_Expensify Card" withdrawalStatus:pending withdrawn:never');
+
+            const queryJSON = buildSearchQueryJSON(result);
+            expect(queryJSON?.type).toBe(CONST.SEARCH.DATA_TYPES.EXPENSE);
+            expect(queryJSON?.flatFilters).toEqual(
+                expect.arrayContaining([
+                    expect.objectContaining({
+                        key: CONST.SEARCH.SYNTAX_FILTER_KEYS.FEED,
+                        filters: [{operator: CONST.SEARCH.SYNTAX_OPERATORS.EQUAL_TO, value: feedKey}],
+                    }),
+                    expect.objectContaining({
+                        key: CONST.SEARCH.SYNTAX_FILTER_KEYS.WITHDRAWAL_STATUS,
+                        filters: [{operator: CONST.SEARCH.SYNTAX_OPERATORS.EQUAL_TO, value: CONST.SEARCH.SETTLEMENT_STATUS.PENDING}],
+                    }),
+                    expect.objectContaining({
+                        key: CONST.SEARCH.SYNTAX_FILTER_KEYS.WITHDRAWN,
+                        filters: [{operator: CONST.SEARCH.SYNTAX_OPERATORS.EQUAL_TO, value: CONST.SEARCH.DATE_PRESETS.NEVER}],
+                    }),
+                ]),
+            );
+        });
+
         describe('limit option', () => {
             test('includes limit in query string when provided in form values', () => {
                 const filterValues: Partial<SearchAdvancedFiltersForm> = {