From bdaf5f8173928f5adfb3384efa7edf85a16f08a8 Mon Sep 17 00:00:00 2001
From: "abdulrahuman5196 (via MelvinBot)" <infra+melvinbot@expensify.com>
Date: Tue, 5 May 2026 18:19:17 +0000
Subject: [PATCH] Wrap large-screen transaction rows in PressableWithFeedback
 to fix click handling

On large screens in the Top Spenders (and other non-expense-report grouped) views,
individual transaction rows were not wrapped in a PressableWithFeedback. Clicks on
rows would bubble up to the outer group pressable and toggle collapse instead of
opening the expense details. This wraps all transaction rows in a PressableWithFeedback
regardless of screen size, using stopPropagation on large screens to prevent the
event from reaching the outer group pressable.

Co-authored-by: abdulrahuman5196 <abdulrahuman5196@users.noreply.github.com>
---
 .../ListItem/TransactionGroupListExpanded.tsx | 37 ++++++++++---------
 1 file changed, 19 insertions(+), 18 deletions(-)

diff --git a/src/components/Search/SearchList/ListItem/TransactionGroupListExpanded.tsx b/src/components/Search/SearchList/ListItem/TransactionGroupListExpanded.tsx
index 774a707f6edf..40b3ffb68c0d 100644
--- a/src/components/Search/SearchList/ListItem/TransactionGroupListExpanded.tsx
+++ b/src/components/Search/SearchList/ListItem/TransactionGroupListExpanded.tsx
@@ -265,24 +265,25 @@ function TransactionGroupListExpanded<TItem extends ListItem>({
                         pendingAction={transaction.pendingAction}
                         key={transaction.transactionID}
                     >
-                        {!isLargeScreenWidth ? (
-                            <PressableWithFeedback
-                                onPress={() => handleOnPress(transaction)}
-                                onLongPress={() => onLongPress?.(transaction)}
-                                accessibilityRole={CONST.ROLE.BUTTON}
-                                accessibilityLabel={transaction.text ?? ''}
-                                isNested
-                                onMouseDown={(e) => e.preventDefault()}
-                                hoverStyle={[!transaction.isDisabled && styles.hoveredComponentBG]}
-                                dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true, [CONST.INNER_BOX_SHADOW_ELEMENT]: false}}
-                                id={transaction.transactionID}
-                                sentryLabel={CONST.SENTRY_LABEL.SEARCH.EXPANDED_TRANSACTION_ROW}
-                            >
-                                {transactionRow}
-                            </PressableWithFeedback>
-                        ) : (
-                            transactionRow
-                        )}
+                        <PressableWithFeedback
+                            onPress={(e) => {
+                                if (isLargeScreenWidth) {
+                                    e?.stopPropagation();
+                                }
+                                handleOnPress(transaction);
+                            }}
+                            onLongPress={() => onLongPress?.(transaction)}
+                            accessibilityRole={CONST.ROLE.BUTTON}
+                            accessibilityLabel={transaction.text ?? ''}
+                            isNested
+                            onMouseDown={(e) => e.preventDefault()}
+                            hoverStyle={[!transaction.isDisabled && styles.hoveredComponentBG]}
+                            dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true, [CONST.INNER_BOX_SHADOW_ELEMENT]: false}}
+                            id={transaction.transactionID}
+                            sentryLabel={CONST.SENTRY_LABEL.SEARCH.EXPANDED_TRANSACTION_ROW}
+                        >
+                            {transactionRow}
+                        </PressableWithFeedback>
                     </OfflineWithFeedback>
                 );
             })}