diff --git a/src/components/MoneyRequestReportView/MoneyRequestReportTransactionItem.tsx b/src/components/MoneyRequestReportView/MoneyRequestReportTransactionItem.tsx index 04c00b51e9b6..f6bc2174070b 100644 --- a/src/components/MoneyRequestReportView/MoneyRequestReportTransactionItem.tsx +++ b/src/components/MoneyRequestReportView/MoneyRequestReportTransactionItem.tsx @@ -16,6 +16,7 @@ import useThemeStyles from '@hooks/useThemeStyles'; import useTransactionViolations from '@hooks/useTransactionViolations'; import ControlSelection from '@libs/ControlSelection'; import canUseTouchScreen from '@libs/DeviceCapabilities/canUseTouchScreen'; +import {hasFlexColumn} from '@libs/SearchUIUtils'; import {getTransactionPendingAction, isTransactionPendingDelete} from '@libs/TransactionUtils'; import variables from '@styles/variables'; import CONST from '@src/CONST'; @@ -180,7 +181,7 @@ function MoneyRequestReportTransactionItem({ onArrowRightPress={() => onArrowRightPress?.(transaction.transactionID)} isHover={hovered} nonPersonalAndWorkspaceCards={nonPersonalAndWorkspaceCards} - shouldRemoveTotalColumnFlex + shouldRemoveTotalColumnFlex={hasFlexColumn(columns)} /> )} diff --git a/src/components/MoneyRequestReportView/MoneyRequestReportTransactionList.tsx b/src/components/MoneyRequestReportView/MoneyRequestReportTransactionList.tsx index 95d11ce604ef..f7c6ae1626f3 100644 --- a/src/components/MoneyRequestReportView/MoneyRequestReportTransactionList.tsx +++ b/src/components/MoneyRequestReportView/MoneyRequestReportTransactionList.tsx @@ -60,7 +60,7 @@ import { isSortableColumnName, } from '@libs/ReportUtils'; import type {SortableColumnName} from '@libs/ReportUtils'; -import {compareValues, getColumnsToShow, getTableMinWidth, isTransactionAmountTooLong, isTransactionTaxAmountTooLong} from '@libs/SearchUIUtils'; +import {compareValues, getColumnsToShow, getTableMinWidth, hasFlexColumn, isTransactionAmountTooLong, isTransactionTaxAmountTooLong} from '@libs/SearchUIUtils'; import {getPendingSubmitFollowUpAction} from '@libs/telemetry/submitFollowUpAction'; import {compareByRBR} from '@libs/TransactionPreviewUtils'; import {getTransactionPendingAction, isTransactionPendingDelete, shouldShowExpenseBreakdown} from '@libs/TransactionUtils'; @@ -714,7 +714,7 @@ function MoneyRequestReportTransactionList({ shouldShowSorting sortBy={sortBy} sortOrder={sortOrder} - shouldRemoveTotalColumnFlex + shouldRemoveTotalColumnFlex={hasFlexColumn(columnsToShow)} columns={columnsToShow} dateColumnSize={dateColumnSize} amountColumnSize={amountColumnSize} diff --git a/src/libs/SearchUIUtils.ts b/src/libs/SearchUIUtils.ts index 5174346993e1..d98e89f42b6b 100644 --- a/src/libs/SearchUIUtils.ts +++ b/src/libs/SearchUIUtils.ts @@ -5801,6 +5801,24 @@ function applySelectionToItem( return {originalItem: item, itemWithSelection: {...item, isSelected, transactions}, isSelected}; } +const FLEX_COLUMNS = new Set([ + CONST.SEARCH.TABLE_COLUMNS.MERCHANT, + CONST.SEARCH.TABLE_COLUMNS.DESCRIPTION, + CONST.SEARCH.TABLE_COLUMNS.CATEGORY, + CONST.SEARCH.TABLE_COLUMNS.TAG, + CONST.SEARCH.TABLE_COLUMNS.TAX_RATE, + CONST.SEARCH.TABLE_COLUMNS.CARD, + CONST.SEARCH.TABLE_COLUMNS.EXCHANGE_RATE, +]); + +/** + * Returns true when another flex column exists that can fill the remaining space, + * making it safe to remove flex from total columns. + */ +function hasFlexColumn(columns?: SearchColumnType[]): boolean { + return !!columns?.some((col) => FLEX_COLUMNS.has(col)); +} + export { getSearchBulkEditPolicyID, getSuggestedSearches, @@ -5880,6 +5898,7 @@ export { FILTER_LABEL_MAP, doesSearchItemMatchSort, isPolicyEligibleForSpendOverTime, + hasFlexColumn, }; export type { SavedSearchMenuItem,