diff --git a/src/components/MoneyReportHeader.tsx b/src/components/MoneyReportHeader.tsx index 9ca142aae1b0..899fed9cd57e 100644 --- a/src/components/MoneyReportHeader.tsx +++ b/src/components/MoneyReportHeader.tsx @@ -111,6 +111,7 @@ function MoneyReportHeader({policy, report: moneyRequestReport, transactionThrea const isDraft = ReportUtils.isOpenExpenseReport(moneyRequestReport); const connectedIntegration = PolicyUtils.getConnectedIntegration(policy); const navigateBackToAfterDelete = useRef(); + const hasHeldExpenses = ReportUtils.hasHeldExpenses(moneyRequestReport?.reportID); const hasScanningReceipt = ReportUtils.getTransactionsWithReceipts(moneyRequestReport?.reportID).some((t) => TransactionUtils.isReceiptBeingScanned(t)); const hasOnlyPendingTransactions = allTransactions.length > 0 && allTransactions.every((t) => TransactionUtils.isExpensifyCardTransaction(t) && TransactionUtils.isPending(t)); const transactionIDs = allTransactions.map((t) => t.transactionID); @@ -361,6 +362,7 @@ function MoneyReportHeader({policy, report: moneyRequestReport, transactionThrea {shouldShowSettlementButton && !shouldUseNarrowLayout && ( (); - const [paymentType, setPaymentType] = useState(); const getCanIOUBePaid = useCallback( @@ -140,6 +139,7 @@ function ReportPreview({ const {nonHeldAmount, fullAmount, hasValidNonHeldAmount} = ReportUtils.getNonHeldAndFullAmount(iouReport, shouldShowPayButton); const hasOnlyHeldExpenses = ReportUtils.hasOnlyHeldExpenses(iouReport?.reportID ?? ''); + const hasHeldExpenses = ReportUtils.hasHeldExpenses(iouReport?.reportID ?? ''); const managerID = iouReport?.managerID ?? action.childManagerAccountID ?? 0; const {totalDisplaySpend, reimbursableSpend} = ReportUtils.getMoneyRequestSpendBreakdown(iouReport); @@ -534,6 +534,7 @@ function ReportPreview({ {shouldShowSettlementButton && ( = type ActionCellProps = { action?: SearchTransactionAction; + shouldUseSuccessStyle?: boolean; isLargeScreenWidth?: boolean; isSelected?: boolean; goToItem: () => void; @@ -35,6 +36,7 @@ type ActionCellProps = { function ActionCell({ action = CONST.SEARCH.ACTION_TYPES.VIEW, + shouldUseSuccessStyle = true, isLargeScreenWidth = true, isSelected = false, goToItem, @@ -99,7 +101,7 @@ function ActionCell({ style={[styles.w100]} innerStyles={buttonInnerStyles} isLoading={isLoading} - success + success={shouldUseSuccessStyle} isDisabled={isOffline} /> ); diff --git a/src/components/SelectionList/Search/ExpenseItemHeaderNarrow.tsx b/src/components/SelectionList/Search/ExpenseItemHeaderNarrow.tsx index 384262a78b15..096429cc41d5 100644 --- a/src/components/SelectionList/Search/ExpenseItemHeaderNarrow.tsx +++ b/src/components/SelectionList/Search/ExpenseItemHeaderNarrow.tsx @@ -24,6 +24,7 @@ type ExpenseItemHeaderNarrowProps = { containerStyle?: StyleProp; onButtonPress: () => void; canSelectMultiple?: boolean; + shouldUseSuccessStyle?: boolean; isSelected?: boolean; isDisabled?: boolean | null; isDisabledCheckbox?: boolean; @@ -41,6 +42,7 @@ function ExpenseItemHeaderNarrow({ canSelectMultiple, containerStyle, isDisabledCheckbox, + shouldUseSuccessStyle = true, isSelected, isDisabled, handleCheckboxPress, @@ -101,6 +103,7 @@ function ExpenseItemHeaderNarrow({ ({ return null; } + const hasHeldExpenses = ReportUtils.hasHeldExpenses('', reportItem.transactions); + const participantFrom = reportItem.from; const participantTo = reportItem.to; @@ -202,6 +205,7 @@ function ReportListItem({ TransactionUtils.isOnHold(item), [item]); + if (!isLargeScreenWidth) { return ( @@ -278,6 +280,7 @@ function TransactionListItemRow({ onButtonPress={onButtonPress} canSelectMultiple={canSelectMultiple} action={item.action} + shouldUseSuccessStyle={!isOnHold} isSelected={item.isSelected} isDisabled={item.isDisabled} isDisabledCheckbox={item.isDisabledCheckbox} @@ -444,6 +447,7 @@ function TransactionListItemRow({ {(triggerKYCFlow, buttonRef) => ( + success={shouldUseSuccessStyle} onOptionsMenuShow={onPaymentOptionsShow} onOptionsMenuHide={onPaymentOptionsHide} buttonRef={buttonRef} diff --git a/src/components/SettlementButton/types.ts b/src/components/SettlementButton/types.ts index df8fdedc512e..c9fd548c87bf 100644 --- a/src/components/SettlementButton/types.ts +++ b/src/components/SettlementButton/types.ts @@ -34,6 +34,9 @@ type SettlementButtonProps = { /** The IOU/Expense report we are paying */ iouReport?: OnyxEntry; + /** Whether to use the success style or not */ + shouldUseSuccessStyle?: boolean; + /** Should we show the payment options? */ shouldHidePaymentOptions?: boolean;