Fix trip summary for nested threads

src/libs/ReportUtils.ts

@@ -154,6 +154,7 @@ import {
     isThreadParentMessage,
     isTrackExpenseAction,
     isTransactionThread,
+    isTripPreview,
     isUnapprovedAction,
     isWhisperAction,
     wasActionTakenByCurrentUser,
@@ -4465,10 +4466,9 @@ function getReportNameInternal({
             const modifiedMessage = ModifiedExpenseMessage.getForReportAction({reportOrID: report?.reportID, reportAction: parentReportAction, searchReports: reports});
             return formatReportLastMessageText(modifiedMessage);
         }
-        if (isTripRoom(report)) {
+        if (isTripRoom(report) && report?.reportName !== CONST.REPORT.DEFAULT_REPORT_NAME) {
             return report?.reportName ?? '';
         }
-
         if (isCardIssuedAction(parentReportAction)) {
             return getCardIssuedMessage({reportAction: parentReportAction, personalDetails});
         }
@@ -8424,6 +8424,11 @@ function getAllAncestorReportActions(report: Report | null | undefined, currentU
             break;
         }
 
+        // For threads, we don't want to display trip summary
+        if (isTripPreview(parentReportAction) && allAncestors.length > 0) {
+            break;
+        }
+
         const isParentReportActionUnread = isCurrentActionUnread(parentReport, parentReportAction);
         allAncestors.push({
             report: parentReport,

src/pages/home/report/PureReportActionItem.tsx

@@ -153,6 +153,7 @@ import ReportActionItemMessageEdit from './ReportActionItemMessageEdit';
 import ReportActionItemSingle from './ReportActionItemSingle';
 import ReportActionItemThread from './ReportActionItemThread';
 import ReportAttachmentsContext from './ReportAttachmentsContext';
+import TripSummary from './TripSummary';
 
 type PureReportActionItemProps = {
     /** Report for this action */
@@ -1117,6 +1118,11 @@ function PureReportActionItem({
             />
         );
     }
+
+    if (isTripPreview(action) && isThreadReportParentAction) {
+        return <TripSummary reportID={getOriginalMessage(action)?.linkedReportID} />;
+    }
+
     if (isChronosOOOListAction(action)) {
         return (
             <ChronosOOOListActions

src/pages/home/report/ReportActionItemParentAction.tsx

@@ -7,7 +7,7 @@ import useNetwork from '@hooks/useNetwork';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@libs/Navigation/Navigation';
 import onyxSubscribe from '@libs/onyxSubscribe';
-import {shouldReportActionBeVisible} from '@libs/ReportActionsUtils';
+import {isTripPreview, shouldReportActionBeVisible} from '@libs/ReportActionsUtils';
 import type {Ancestor} from '@libs/ReportUtils';
 import {canCurrentUserOpenReport, canUserPerformWriteAction as canUserPerformWriteActionReportUtils, getAllAncestorReportActionIDs, getAllAncestorReportActions} from '@libs/ReportUtils';
 import {navigateToConciergeChatAndDeleteReport} from '@userActions/Report';
@@ -111,6 +111,8 @@ function ReportActionItemParentAction({
             {allAncestors.map((ancestor) => {
                 const ancestorReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${ancestor.report.reportID}`];
                 const canUserPerformWriteAction = canUserPerformWriteActionReportUtils(ancestorReport);
+                const shouldDisplayThreadDivider = !isTripPreview(ancestor.reportAction);
+
                 return (
                     <OfflineWithFeedback
                         key={ancestor.reportAction.reportActionID}
@@ -120,10 +122,12 @@ function ReportActionItemParentAction({
                         errorRowStyles={[styles.ml10, styles.mr2]}
                         onClose={() => navigateToConciergeChatAndDeleteReport(ancestor.report.reportID)}
                     >
-                        <ThreadDivider
-                            ancestor={ancestor}
-                            isLinkDisabled={!canCurrentUserOpenReport(ancestorReports.current?.[ancestor?.report?.reportID])}
-                        />
+                        {shouldDisplayThreadDivider && (
+                            <ThreadDivider
+                                ancestor={ancestor}
+                                isLinkDisabled={!canCurrentUserOpenReport(ancestorReports.current?.[ancestor?.report?.reportID])}
+                            />
+                        )}
                         <ReportActionItem
                             onPress={
                                 canCurrentUserOpenReport(ancestorReports.current?.[ancestor?.report?.reportID])

src/pages/home/report/ReportActionsListItemRenderer.tsx

@@ -1,12 +1,11 @@
 import React, {memo, useMemo} from 'react';
 import type {OnyxEntry} from 'react-native-onyx';
 import {getOriginalMessage, isSentMoneyReportAction, isTransactionThread} from '@libs/ReportActionsUtils';
-import {isChatThread, isInvoiceRoom, isPolicyExpenseChat, isTripRoom} from '@libs/ReportUtils';
+import {isChatThread, isInvoiceRoom, isPolicyExpenseChat} from '@libs/ReportUtils';
 import CONST from '@src/CONST';
 import type {Report, ReportAction} from '@src/types/onyx';
 import ReportActionItem from './ReportActionItem';
 import ReportActionItemParentAction from './ReportActionItemParentAction';
-import TripSummary from './TripSummary';
 
 type ReportActionsListItemRendererProps = {
     /** All the data of the action item */
@@ -144,11 +143,6 @@ function ReportActionsListItemRenderer({
 
     const shouldDisplayParentAction =
         reportAction.actionName === CONST.REPORT.ACTIONS.TYPE.CREATED && (!isTransactionThread(parentReportAction) || isSentMoneyReportAction(parentReportAction));
-    const shouldDisplayTripSummary = shouldDisplayParentAction && isTripRoom(report);
-
-    if (shouldDisplayTripSummary) {
-        return <TripSummary report={report} />;
-    }
 
     if (shouldDisplayParentAction && isChatThread(report)) {
         return (

src/pages/home/report/TripSummary.tsx

@@ -1,39 +1,32 @@
 import React from 'react';
-import {View} from 'react-native';
-import type {OnyxEntry} from 'react-native-onyx';
+import {useOnyx} from 'react-native-onyx';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import TripDetailsView from '@components/ReportActionItem/TripDetailsView';
-import useThemeStyles from '@hooks/useThemeStyles';
 import useTripTransactions from '@hooks/useTripTransactions';
-import type * as OnyxTypes from '@src/types/onyx';
-import AnimatedEmptyStateBackground from './AnimatedEmptyStateBackground';
-import RepliesDivider from './RepliesDivider';
+import CONST from '@src/CONST';
+import ONYXKEYS from '@src/ONYXKEYS';
 
 type TripSummaryProps = {
-    /** The current report is displayed */
-    report: OnyxEntry<OnyxTypes.Report>;
+    /** The report ID */
+    reportID: string | undefined;
 };
 
-function TripSummary({report}: TripSummaryProps) {
-    const styles = useThemeStyles();
-    const tripTransactions = useTripTransactions(report?.reportID);
+function TripSummary({reportID}: TripSummaryProps) {
+    const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportID ?? CONST.DEFAULT_NUMBER_ID}`);
+    const tripTransactions = useTripTransactions(reportID);
 
-    if (!report?.reportID) {
+    if (!reportID || tripTransactions.length === 0) {
         return null;
     }
 
     return (
-        <View style={[styles.pRelative]}>
-            <AnimatedEmptyStateBackground />
-            <OfflineWithFeedback pendingAction={report.pendingAction}>
-                <TripDetailsView
-                    tripRoomReportID={report.reportID}
-                    tripTransactions={tripTransactions}
-                    shouldShowHorizontalRule={false}
-                />
-            </OfflineWithFeedback>
-            <RepliesDivider shouldHideThreadDividerLine={false} />
-        </View>
+        <OfflineWithFeedback pendingAction={report?.pendingAction}>
+            <TripDetailsView
+                tripRoomReportID={reportID}
+                tripTransactions={tripTransactions}
+                shouldShowHorizontalRule={false}
+            />
+        </OfflineWithFeedback>
     );
 }