[Due for payment 2025-04-24][Report Creation UI] [$250] Create report - Not here page is shown when create a report offline and go online

[jponikarchuk]

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

---

Version Number: 9.1.24-10
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: N/A
If this was caught during regression testing, add the test name, ID and link from TestRail: #59386
Email or phone of affected tester (no customers): N/A
Issue reported by: Applause Internal Team
Device used: iPhone 15 iOS 18.3.2
App Component: Other

Action Performed:

1. Navigate to the staging.new.expensify.com and sign in with expensifail account
2. Create a workspace, if needed
3. Turn off internet connection
4. Open Reports tab
5. Click on the green plus button and select Create report
6. Create expense in the report
7. Navigate to the workspace chat via "From" link in the header of the created expense report
8. Turn on internet connection

Expected Result:

Workspace chat with the created expense report is shown after returning online

Actual Result:

Not here page is shown when create a report offline, navigate to the workspace chat via "From" link and go online. When tapping on the back arrow, user is navigated to the ws chat and the report is displayed normally.

Workaround:

Unknown

Platforms:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

1.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021910124424475110313
• Upwork Job ID: 1910124424475110313
• Last Price Increase: 2025-04-10

[melvin-bot]

Triggered auto assignment to @NicMendonca (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.

[bernhardoj]

Proposal

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

Not found page is shown after creating a report and money request while offline and then go online.

What is the root cause of that problem?

The root cause of this issue is that, when we first create an optimistic empty report, it creates a report preview action.

App/src/libs/actions/Report.ts

Lines 2656 to 2662 in 0754949

	const {optimisticReportName, optimisticData, successData, failureData} = buildNewReportOptimisticData(
	policy,
	optimisticReportID,
	reportActionID,
	creatorPersonalDetails,
	reportPreviewReportActionID,
	);

App/src/libs/actions/Report.ts

Lines 2538 to 2553 in 0754949

	const optimisticReportPreview = {
	action: CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW,
	actionName: CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW,
	childReportName: optimisticReportData.reportName,
	childReportID: reportID,
	childType: CONST.REPORT.TYPE.EXPENSE,
	created: timeOfCreation,
	shouldShow: true,
	childOwnerAccountID: accountID,
	automatic: false,
	avatar: creatorPersonalDetails.avatar,
	isAttachmentOnly: false,
	reportActionID: reportPreviewReportActionID,
	message: createReportActionMessage,
	pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD,
	};

However, after we create a money request inside that report, another report preview action is created because the existing report preview can't be found.

App/src/libs/actions/IOU.ts

Lines 3089 to 3100 in 0754949

	let reportPreviewAction = shouldCreateNewMoneyRequestReport ? null : getReportPreviewAction(chatReport.reportID, iouReport.reportID);
	if (reportPreviewAction) {
	reportPreviewAction = updateReportPreview(iouReport, reportPreviewAction, false, comment, optimisticTransaction);
	} else {
	reportPreviewAction = buildOptimisticReportPreview(chatReport, iouReport, comment, optimisticTransaction);
	chatReport.lastVisibleActionCreated = reportPreviewAction.created;
	// Generated ReportPreview action is a parent report action of the iou report.
	// We are setting the iou report's parentReportActionID to display subtitle correctly in IOU page when offline.
	iouReport.parentReportActionID = reportPreviewAction.reportActionID;
	}

It can't be found because none of the report preview actions on the workspace chat has the linkedReportID that matches the iouReportID. Why? If you see the optimistic report preview code above, you will notice that it doesn't have the originalMessage.linkedReportID, so it's empty and thus can't be matched.

App/src/libs/actions/IOU.ts

Lines 740 to 750 in 0754949

	function getReportPreviewAction(chatReportID: string | undefined, iouReportID: string | undefined): OnyxInputValue<ReportAction<typeof CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW>> {
	const reportActions = allReportActions?.[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${chatReportID}`] ?? {};
	// Find the report preview action from the chat report
	return (
	Object.values(reportActions).find(
	(reportAction): reportAction is ReportAction<typeof CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW> =>
	reportAction && isReportPreviewAction(reportAction) && getOriginalMessage(reportAction)?.linkedReportID === iouReportID,
	) ?? null
	);
	}

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

We need to add

originalMessage: {
    linkedReportID: reportID,
},

to the optimistic report. (or I think we can just use ReportUtils.buildOptimisticReporPreview)

However, we still have one problem. If we press the parent navigation link (From "..."), it won't link the action. It's because parentReportActionID is undefined.

App/src/components/ParentNavigationSubtitle.tsx

Lines 44 to 50 in 0754949

	const parentAction = getReportAction(parentReportID, parentReportActionID);
	const isVisibleAction = shouldReportActionBeVisible(parentAction, parentAction?.reportActionID ?? CONST.DEFAULT_NUMBER_ID, canUserPerformWriteAction);
	if (isVisibleAction) {
	Navigation.navigate(ROUTES.REPORT_WITH_ID.getRoute(parentReportID, parentReportActionID));
	} else {
	Navigation.navigate(ROUTES.REPORT_WITH_ID.getRoute(parentReportID));
	}

That's because we don't set the parentReportActionID when creating the optimistic empty report.

App/src/libs/ReportUtils.ts

Lines 5492 to 5508 in 0754949

	const optimisticEmptyReport: OptimisticNewReport = {
	reportName: '',
	reportID,
	policyID: policy?.id,
	type: CONST.REPORT.TYPE.EXPENSE,
	currency: policy?.outputCurrency,
	ownerAccountID: accountID,
	stateNum,
	statusNum,
	total: 0,
	nonReimbursableTotal: 0,
	participants: {},
	lastVisibleActionCreated: timeOfCreation,
	pendingFields: {createReport: CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD},
	parentReportID,
	chatReportID: parentReportID,
	};

We can pass reportPreviewReportActionID to buildOptimisticEmptyReport and use it as the parentReportActionID.

App/src/libs/actions/Report.ts

Lines 2508 to 2512 in 0754949

	function buildNewReportOptimisticData(policy: OnyxEntry<Policy>, reportID: string, reportActionID: string, creatorPersonalDetails: PersonalDetails, reportPreviewReportActionID: string) {
	const {accountID, login} = creatorPersonalDetails;
	const timeOfCreation = DateUtils.getDBTime();
	const parentReport = getPolicyExpenseChat(accountID, policy?.id);
	const optimisticReportData = buildOptimisticEmptyReport(reportID, accountID, parentReport?.reportID, policy, timeOfCreation);

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

We can test createNewReport and make sure the required attribute is present.

[melvin-bot]

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

[melvin-bot]

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

[jjcoffee]

@bernhardoj's proposal LGTM!

🎀👀🎀 C+ reviewed

[melvin-bot]

Triggered auto assignment to @amyevans, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

[mountiny]

cc @allgandalf @SzymczakJ for visibility

[SzymczakJ]

Proposal looks good 👍

[bernhardoj]

PR is ready

cc: @jjcoffee

[jjcoffee]

PR was deployed 2025-04-17, so payment is due 2025-04-24. cc @NicMendonca

[jjcoffee]

BugZero Checklist:

• [Contributor] Classify the bug:

Bug classification

Source of bug:

• 1a. Result of the original design (eg. a case wasn't considered)
• 1b. Mistake during implementation
• 1c. Backend bug
• 1z. Other:

Where bug was reported:

• 2a. Reported on production (eg. bug slipped through the normal regression and PR testing process on staging)
• 2b. Reported on staging (eg. found during regression or PR testing)
• 2d. Reported on a PR
• 2z. Other:

Who reported the bug:

• 3a. Expensify user
• 3b. Expensify employee
• 3c. Contributor
• 3d. QA
• 3z. Other:

• [Contributor] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake.

  Link to comment: https://github.com/Expensify/App/pull/57847/files#r2053766898

• [Contributor] If the regression was CRITICAL (e.g. interrupts a core flow) A discussion in #expensify-open-source has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner.

  Link to discussion: N/A

• [Contributor] If it was decided to create a regression test for the bug, please propose the regression test steps using the template below to ensure the same bug will not reach production again.

• [BugZero Assignee] Create a GH issue for creating/updating the regression test once above steps have been agreed upon.

  Link to issue:

Regression Test Proposal

Test:

1. Go offline
2. Press FAB > Create new report
3. Create a new expense inside the report
4. Press the header "From ..." link to open the parent action
5. Go online
6. Wait until the request completes
7. Verify not found page doesn't show

Do we agree 👍 or 👎

[melvin-bot]

Payment Summary

Upwork Job

• Reviewer: @jjcoffee owed $250 via NewDot
• Reviewer: @bernhardoj owed $250 via NewDot

BugZero Checklist (@NicMendonca)

• I have verified the correct assignees and roles are listed above and updated the necessary manual offers
• I have verified that there are no duplicate or incorrect contracts on Upwork for this job (https://www.upwork.com/ab/applicants/1910124424475110313/hired)
• I have paid out the Upwork contracts or cancelled the ones that are incorrect
• I have verified the payment summary above is correct

[bernhardoj]

Requested in ND.

[JmillsExpensify]

$250 approved for @bernhardoj

[garrettmknight]

$250 approved for @jjcoffee