diff --git a/src/pages/inbox/report/ReportActionItemMessage.tsx b/src/pages/inbox/report/ReportActionItemMessage.tsx index 4c90e169a3e0..ac908369af85 100644 --- a/src/pages/inbox/report/ReportActionItemMessage.tsx +++ b/src/pages/inbox/report/ReportActionItemMessage.tsx @@ -1,35 +1,26 @@ -import type {ReactElement} from 'react'; import React from 'react'; import type {StyleProp, TextStyle, ViewStyle} from 'react-native'; import {View} from 'react-native'; import Button from '@components/Button'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; -import useOnyx from '@hooks/useOnyx'; import useThemeStyles from '@hooks/useThemeStyles'; -import getNonEmptyStringOnyxID from '@libs/getNonEmptyStringOnyxID'; import Navigation from '@libs/Navigation/Navigation'; import { - getLinkedTransactionID, getMemberChangeMessageFragment, getOriginalMessage, - getReportActionMessage, - getReportActionMessageFragments, getUpdateRoomDescriptionFragment, - isAddCommentAction, - isApprovedOrSubmittedReportAction as isApprovedOrSubmittedReportActionUtils, isMemberChangeAction, isMoneyRequestAction, isReimbursementDirectionInformationRequiredAction, - isThreadParentMessage, } from '@libs/ReportActionsUtils'; -import {getIOUReportActionDisplayMessage, getReportName, hasMissingInvoiceBankAccount, isSettled} from '@libs/ReportUtils'; +import {getReportName} from '@libs/ReportUtils'; import CONST from '@src/CONST'; -import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type {ReportAction} from '@src/types/onyx'; +import IouReportActionMessage from './actionContents/IouReportActionMessage'; +import ReportActionMessageContent from './actionContents/ReportActionMessageContent'; import TextCommentFragment from './comment/TextCommentFragment'; -import ReportActionItemFragment from './ReportActionItemFragment'; type ReportActionItemMessageProps = { /** The report action */ @@ -51,12 +42,18 @@ type ReportActionItemMessageProps = { function ReportActionItemMessage({action, displayAsGroup, reportID, style, isHidden = false}: ReportActionItemMessageProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); - const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportID}`); - const [transaction] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION}${getNonEmptyStringOnyxID(getLinkedTransactionID(action))}`); - const [bankAccountList] = useOnyx(ONYXKEYS.BANK_ACCOUNT_LIST); - const fragments = getReportActionMessageFragments(translate, action); - const isIOUReport = isMoneyRequestAction(action); + if (isMoneyRequestAction(action)) { + return ( + + ); + } if (isMemberChangeAction(action)) { // This will be fixed: https://github.com/Expensify/App/issues/76852 @@ -98,7 +95,6 @@ function ReportActionItemMessage({action, displayAsGroup, reportID, style, isHid Navigation.navigate(ROUTES.BANK_ACCOUNT_ENTER_SIGNER_INFO.getRoute(policyID, bankAccountID, isCompleted)); }; - if (isReimbursementDirectionInformationRequiredAction(action)) { const {bankAccountLastFour, currency, policyID, bankAccountID, completed} = getOriginalMessage(action) ?? {}; @@ -118,86 +114,14 @@ function ReportActionItemMessage({action, displayAsGroup, reportID, style, isHid ); } - let iouMessage: string | undefined; - if (isIOUReport) { - const originalMessage = action.actionName === CONST.REPORT.ACTIONS.TYPE.IOU ? getOriginalMessage(action) : null; - const iouReportID = originalMessage?.IOUReportID; - if (iouReportID) { - iouMessage = getIOUReportActionDisplayMessage(translate, action, transaction, report, bankAccountList); - } - } - - const isApprovedOrSubmittedReportAction = isApprovedOrSubmittedReportActionUtils(action); - - const isHoldReportAction = [CONST.REPORT.ACTIONS.TYPE.HOLD, CONST.REPORT.ACTIONS.TYPE.UNHOLD].some((type) => type === action.actionName); - - /** - * Get the ReportActionItemFragments - * @param shouldWrapInText determines whether the fragments are wrapped in a Text component - * @returns report action item fragments - */ - const renderReportActionItemFragments = (shouldWrapInText: boolean): ReactElement | ReactElement[] => { - const reportActionItemFragments = fragments.map((fragment, index) => ( - - )); - - // Approving or submitting reports in oldDot results in system messages made up of multiple fragments of `TEXT` type - // which we need to wrap in `` to prevent them rendering on separate lines. - return shouldWrapInText ? {reportActionItemFragments} : reportActionItemFragments; - }; - - const openWorkspaceInvoicesPage = () => { - const policyID = report?.policyID; - - if (!policyID) { - return; - } - - Navigation.navigate(ROUTES.WORKSPACE_INVOICES.getRoute(policyID)); - }; - - const shouldShowAddBankAccountButton = action.actionName === CONST.REPORT.ACTIONS.TYPE.IOU && hasMissingInvoiceBankAccount(reportID) && !isSettled(reportID); - return ( - - {!isHidden ? ( - <> - {renderReportActionItemFragments(isApprovedOrSubmittedReportAction)} - {shouldShowAddBankAccountButton && ( -