[HOLD for payment 2025-02-04] [$250] Remove the `getTripTransactions` method

[tgolen]

Coming from #54965 (comment)

Problem

When getTripTransactions() is called, it accesses data from Onyx that the view is not connected to. This breaks the reactivity of the component because when the transactions are updated in Onyx, the component won't receive the changes. This leads to stale data.

Solution

Remove getTripTransactions() and connect to the data using useOnyx() instead.

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021877740338376092500
• Upwork Job ID: 1877740338376092500
• Last Price Increase: 2025-01-10
• Automatic offers:
• shubham1206agra | Contributor | 105641744

Issue Owner

Current Issue Owner: @shubham1206agra

[melvin-bot]

Triggered auto assignment to @isabelastisser (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~021877740338376092500

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @s77rt (External)

[shubham1206agra]

@tgolen You need to assign me for review as no one has trip rooms set up right now.

[mohit6789]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Make changes in getTripTransactions() so it will use reports using withOnyx() instead of Onyx.connect

What is the root cause of that problem?

Improvement remove getTripTransactions and use withOnyx()

What changes do you think we should make in order to solve the problem?

1. Make changes in ReportsUtlis so it can access reports data using withOnyx().

App/src/libs/ReportUtils.ts

Lines 8175 to 8183 in 3541c89

	function getTripTransactions(tripRoomReportID: string | undefined, reportFieldToCompare: 'parentReportID' | 'reportID' = 'parentReportID'): Transaction[] {
	const tripTransactionReportIDs = Object.values(allReports ?? {})
	.filter((report) => report && report?.[reportFieldToCompare] === tripRoomReportID)
	.map((report) => report?.reportID);
	return tripTransactionReportIDs.flatMap((reportID) => getReportTransactions(reportID));
	}
	function getTripIDFromTransactionParentReportID(transactionParentReportID: string | undefined): string | undefined {
	return getReportOrDraftReport(transactionParentReportID)?.tripData?.tripID;

function getTripTransactions(reports: OnyxCollection<Report>, tripRoomReportID: string | undefined, reportFieldToCompare: 'parentReportID' | 'reportID' = 'parentReportID'): Transaction[] {
    const tripTransactionReportIDs = Object.values(reports ?? {})
        .filter((report) => report && report?.[reportFieldToCompare] === tripRoomReportID)
        .map((report) => report?.reportID);
    return tripTransactionReportIDs.flatMap((reportID) => getReportTransactions(reportID));
}

2. pass reports data from TripDetailsView.tsx

App/src/components/ReportActionItem/TripDetailsView.tsx

Line 149 in 3541c89

const tripTransactions = ReportUtils.getTripTransactions(tripRoomReportID);

const [reports] = useOnyx(ONYXKEYS.COLLECTION.REPORT);
const tripTransactions = ReportUtils.getTripTransactions(reports, tripRoomReportID);

3. pass reports data from TripRoomPreview.tsx
   

   App/src/components/ReportActionItem/TripRoomPreview.tsx

   Line 120 in 3541c89

   const tripTransactions = ReportUtils.getTripTransactions(chatReport?.reportID);

changes in both the components

const [reports] = useOnyx(ONYXKEYS.COLLECTION.REPORT);
const tripTransactions = ReportUtils.getTripTransactions(reports, chatReport?.reportID);

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

[github-actions]

github123 Your proposal will be dismissed because you did not follow the proposal template.