🍒 Cherry pick PR #68017 to staging 🍒

android/app/build.gradle

@@ -114,8 +114,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1009018919
-        versionName "9.1.89-19"
+        versionCode 1009018920
+        versionName "9.1.89-20"
         // Supported language variants must be declared here to avoid from being removed during the compilation.
         // This also helps us to not include unnecessary language variants in the APK.
         resConfigs "en", "es"

ios/NewExpensify/Info.plist

@@ -44,7 +44,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>9.1.89.19</string>
+	<string>9.1.89.20</string>
 	<key>FullStory</key>
 	<dict>
 		<key>OrgId</key>

ios/NotificationServiceExtension/Info.plist

@@ -13,7 +13,7 @@
 	<key>CFBundleShortVersionString</key>
 	<string>9.1.89</string>
 	<key>CFBundleVersion</key>
-	<string>9.1.89.19</string>
+	<string>9.1.89.20</string>
 	<key>NSExtension</key>
 	<dict>
 		<key>NSExtensionPointIdentifier</key>

ios/ShareViewController/Info.plist

@@ -13,7 +13,7 @@
 	<key>CFBundleShortVersionString</key>
 	<string>9.1.89</string>
 	<key>CFBundleVersion</key>
-	<string>9.1.89.19</string>
+	<string>9.1.89.20</string>
 	<key>NSExtension</key>
 	<dict>
 		<key>NSExtensionAttributes</key>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "9.1.89-19",
+  "version": "9.1.89-20",
   "author": "Expensify, Inc.",
   "homepage": "https://new.expensify.com",
   "description": "New Expensify is the next generation of Expensify: a reimagination of payments based atop a foundation of chat.",

src/CONST/index.ts

@@ -1289,7 +1289,6 @@ const CONST = {
                 RECEIPT: 'receipt',
                 DATE: 'date',
                 MERCHANT: 'merchant',
-                DESCRIPTION: 'description',
                 FROM: 'from',
                 TO: 'to',
                 CATEGORY: 'category',
@@ -6471,9 +6470,6 @@ const CONST = {
             UNAPPROVED_CASH: 'unapprovedCash',
             UNAPPROVED_CARD: 'unapprovedCard',
         },
-        ANIMATION: {
-            FADE_DURATION: 200,
-        },
     },
 
     EXPENSE: {

src/components/MoneyRequestReportView/MoneyRequestReportTableHeader.tsx

@@ -13,6 +13,25 @@ type ColumnConfig = {
     isColumnSortable?: boolean;
 };
 
+const shouldShowColumnConfig: Record<SortableColumnName, (isIOUReport: boolean) => boolean> = {
+    [CONST.SEARCH.TABLE_COLUMNS.RECEIPT]: () => true,
+    [CONST.SEARCH.TABLE_COLUMNS.TYPE]: () => true,
+    [CONST.SEARCH.TABLE_COLUMNS.DATE]: () => true,
+    [CONST.SEARCH.TABLE_COLUMNS.MERCHANT]: () => true,
+    [CONST.SEARCH.TABLE_COLUMNS.CATEGORY]: (isIOUReport) => !isIOUReport,
+    [CONST.SEARCH.TABLE_COLUMNS.TAG]: (isIOUReport) => !isIOUReport,
+    [CONST.REPORT.TRANSACTION_LIST.COLUMNS.COMMENTS]: () => true,
+    [CONST.SEARCH.TABLE_COLUMNS.TOTAL_AMOUNT]: () => true,
+    [CONST.SEARCH.TABLE_COLUMNS.IN]: () => false,
+    [CONST.SEARCH.TABLE_COLUMNS.FROM]: () => false,
+    [CONST.SEARCH.TABLE_COLUMNS.TO]: () => false,
+    [CONST.SEARCH.TABLE_COLUMNS.DESCRIPTION]: () => false,
+    [CONST.SEARCH.TABLE_COLUMNS.TAX_AMOUNT]: () => false,
+    [CONST.SEARCH.TABLE_COLUMNS.ACTION]: () => false,
+    [CONST.SEARCH.TABLE_COLUMNS.TITLE]: () => false,
+    [CONST.SEARCH.TABLE_COLUMNS.ASSIGNEE]: () => false,
+};
+
 const columnConfig: ColumnConfig[] = [
     {
         columnName: CONST.SEARCH.TABLE_COLUMNS.RECEIPT,
@@ -32,10 +51,6 @@ const columnConfig: ColumnConfig[] = [
         columnName: CONST.SEARCH.TABLE_COLUMNS.MERCHANT,
         translationKey: 'common.merchant',
     },
-    {
-        columnName: CONST.SEARCH.TABLE_COLUMNS.DESCRIPTION,
-        translationKey: 'common.description',
-    },
     {
         columnName: CONST.SEARCH.TABLE_COLUMNS.CATEGORY,
         translationKey: 'common.category',
@@ -63,19 +78,22 @@ type SearchTableHeaderProps = {
     amountColumnSize: TableColumnSize;
     taxAmountColumnSize: TableColumnSize;
     shouldShowSorting: boolean;
-    columns: SortableColumnName[];
+    isIOUReport: boolean;
 };
 
-function MoneyRequestReportTableHeader({sortBy, sortOrder, onSortPress, dateColumnSize, shouldShowSorting, amountColumnSize, taxAmountColumnSize, columns}: SearchTableHeaderProps) {
+function MoneyRequestReportTableHeader({sortBy, sortOrder, onSortPress, dateColumnSize, shouldShowSorting, isIOUReport, amountColumnSize, taxAmountColumnSize}: SearchTableHeaderProps) {
     const styles = useThemeStyles();
 
     const shouldShowColumn = useCallback(
         (columnName: SortableColumnName) => {
-            return columns.includes(columnName);
+            const shouldShowFun = shouldShowColumnConfig[columnName];
+            if (!shouldShowFun) {
+                return false;
+            }
+            return shouldShowFun(isIOUReport);
         },
-        [columns],
+        [isIOUReport],
     );
-
     return (
         <View style={[styles.dFlex, styles.flex5]}>
             <SortableTableHeader

src/components/MoneyRequestReportView/MoneyRequestReportTransactionItem.tsx

@@ -1,11 +1,9 @@
 import React, {useEffect, useRef} from 'react';
 import type {View} from 'react-native';
-import type {ValueOf} from 'type-fest';
 import {getButtonRole} from '@components/Button/utils';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import {PressableWithFeedback} from '@components/Pressable';
 import type {TableColumnSize} from '@components/Search/types';
-import type {SortableColumnName} from '@components/SelectionList/types';
 import TransactionItemRow from '@components/TransactionItemRow';
 import useAnimatedHighlightStyle from '@hooks/useAnimatedHighlightStyle';
 import useLocalize from '@hooks/useLocalize';
@@ -20,6 +18,17 @@ import CONST from '@src/CONST';
 import type {Report} from '@src/types/onyx';
 import type {TransactionWithOptionalHighlight} from './MoneyRequestReportTransactionList';
 
+const allReportColumns = [
+    CONST.REPORT.TRANSACTION_LIST.COLUMNS.RECEIPT,
+    CONST.REPORT.TRANSACTION_LIST.COLUMNS.TYPE,
+    CONST.REPORT.TRANSACTION_LIST.COLUMNS.DATE,
+    CONST.REPORT.TRANSACTION_LIST.COLUMNS.MERCHANT,
+    CONST.REPORT.TRANSACTION_LIST.COLUMNS.CATEGORY,
+    CONST.REPORT.TRANSACTION_LIST.COLUMNS.TAG,
+    CONST.REPORT.TRANSACTION_LIST.COLUMNS.COMMENTS,
+    CONST.REPORT.TRANSACTION_LIST.COLUMNS.TOTAL_AMOUNT,
+];
+
 type MoneyRequestReportTransactionItemProps = {
     /** The transaction that is being displayed */
     transaction: TransactionWithOptionalHighlight;
@@ -51,16 +60,12 @@ type MoneyRequestReportTransactionItemProps = {
     /** The size of the tax amount column */
     taxAmountColumnSize: TableColumnSize;
 
-    /** Columns to show */
-    columns: SortableColumnName[];
-
     /** Callback function that scrolls to this transaction in case it is newly added */
     scrollToNewTransaction?: (offset: number) => void;
 };
 
 function MoneyRequestReportTransactionItem({
     transaction,
-    columns,
     report,
     isSelectionModeEnabled,
     toggleTransaction,
@@ -133,7 +138,7 @@ function MoneyRequestReportTransactionItem({
                     shouldUseNarrowLayout={shouldUseNarrowLayout || isMediumScreenWidth}
                     shouldShowCheckbox={!!isSelectionModeEnabled || !isSmallScreenWidth}
                     onCheckboxPress={toggleTransaction}
-                    columns={columns as Array<ValueOf<typeof CONST.REPORT.TRANSACTION_LIST.COLUMNS>>}
+                    columns={allReportColumns}
                     isDisabled={isPendingDelete}
                 />
             </PressableWithFeedback>

src/components/MoneyRequestReportView/MoneyRequestReportTransactionList.tsx

@@ -22,8 +22,8 @@ import {convertToDisplayString} from '@libs/CurrencyUtils';
 import {getThreadReportIDsForTransactions} from '@libs/MoneyRequestReportUtils';
 import {navigationRef} from '@libs/Navigation/Navigation';
 import {getIOUActionForTransactionID} from '@libs/ReportActionsUtils';
-import {getMoneyRequestSpendBreakdown} from '@libs/ReportUtils';
-import {compareValues, getColumnsToShow, isTransactionAmountTooLong, isTransactionTaxAmountTooLong} from '@libs/SearchUIUtils';
+import {getMoneyRequestSpendBreakdown, isIOUReport} from '@libs/ReportUtils';
+import {compareValues, isTransactionAmountTooLong, isTransactionTaxAmountTooLong} from '@libs/SearchUIUtils';
 import {getTransactionPendingAction, isTransactionPendingDelete} from '@libs/TransactionUtils';
 import shouldShowTransactionYear from '@libs/TransactionUtils/shouldShowTransactionYear';
 import Navigation from '@navigation/Navigation';
@@ -160,11 +160,6 @@ function MoneyRequestReportTransactionList({
             }));
     }, [newTransactions, sortBy, sortOrder, transactions, localeCompare]);
 
-    const columnsToShow = useMemo(() => {
-        const columns = getColumnsToShow(transactions, true);
-        return (Object.keys(columns) as SortableColumnName[]).filter((column) => columns[column]);
-    }, [transactions]);
-
     const navigateToTransaction = useCallback(
         (activeTransactionID: string) => {
             const iouAction = getIOUActionForTransactionID(reportActions, activeTransactionID);
@@ -267,7 +262,6 @@ function MoneyRequestReportTransactionList({
                             shouldShowSorting
                             sortBy={sortBy}
                             sortOrder={sortOrder}
-                            columns={columnsToShow}
                             dateColumnSize={dateColumnSize}
                             amountColumnSize={amountColumnSize}
                             taxAmountColumnSize={taxAmountColumnSize}
@@ -278,6 +272,7 @@ function MoneyRequestReportTransactionList({
 
                                 setSortConfig((prevState) => ({...prevState, sortBy: selectedSortBy, sortOrder: selectedSortOrder}));
                             }}
+                            isIOUReport={isIOUReport(report)}
                         />
                     )}
                 </View>
@@ -288,7 +283,6 @@ function MoneyRequestReportTransactionList({
                         <MoneyRequestReportTransactionItem
                             key={transaction.transactionID}
                             transaction={transaction}
-                            columns={columnsToShow}
                             report={report}
                             isSelectionModeEnabled={isMobileSelectionModeEnabled}
                             toggleTransaction={toggleTransaction}

src/components/Search/SearchList.tsx

@@ -16,14 +16,7 @@ import type ChatListItem from '@components/SelectionList/ChatListItem';
 import type TaskListItem from '@components/SelectionList/Search/TaskListItem';
 import type TransactionGroupListItem from '@components/SelectionList/Search/TransactionGroupListItem';
 import type TransactionListItem from '@components/SelectionList/Search/TransactionListItem';
-import type {
-    ExtendedTargetedEvent,
-    ReportActionListItemType,
-    SortableColumnName,
-    TaskListItemType,
-    TransactionGroupListItemType,
-    TransactionListItemType,
-} from '@components/SelectionList/types';
+import type {ExtendedTargetedEvent, ReportActionListItemType, TaskListItemType, TransactionGroupListItemType, TransactionListItemType} from '@components/SelectionList/types';
 import Text from '@components/Text';
 import useArrowKeyFocusManager from '@hooks/useArrowKeyFocusManager';
 import useInitialWindowDimensions from '@hooks/useInitialWindowDimensions';
@@ -87,9 +80,6 @@ type SearchListProps = Pick<FlashListProps<SearchListItem>, 'onScroll' | 'conten
     /** The search query */
     queryJSON: SearchQueryJSON;
 
-    /** Columns to show */
-    columns: SortableColumnName[];
-
     /** Called when the viewability of rows changes, as defined by the viewabilityConfig prop. */
     onViewableItemsChanged?: (info: {changed: ViewToken[]; viewableItems: ViewToken[]}) => void;
 
@@ -134,7 +124,6 @@ function SearchList(
         shouldPreventDefaultFocusOnSelectRow,
         shouldPreventLongPressRow,
         queryJSON,
-        columns,
         onViewableItemsChanged,
         onLayout,
         estimatedItemSize = ITEM_HEIGHTS.NARROW_WITHOUT_DRAWER.STANDARD,
@@ -350,7 +339,6 @@ function SearchList(
                     }}
                     shouldPreventDefaultFocusOnSelectRow={shouldPreventDefaultFocusOnSelectRow}
                     queryJSONHash={hash}
-                    columns={columns}
                     policies={policies}
                     isDisabled={isDisabled}
                     allReports={allReports}
@@ -371,7 +359,6 @@ function SearchList(
             onCheckboxPress,
             onSelectRow,
             policies,
-            columns,
             hash,
             groupBy,
             setFocusedIndex,
@@ -473,7 +460,7 @@ function SearchList(
                 onScroll={onScroll}
                 showsVerticalScrollIndicator={false}
                 ref={listRef}
-                extraData={[focusedIndex, isFocused, columns]}
+                extraData={[focusedIndex, isFocused]}
                 onEndReached={onEndReached}
                 onEndReachedThreshold={onEndReachedThreshold}
                 ListFooterComponent={ListFooterComponent}