[HOLD for payment 2024-05-20] [$250] Expense - Console error shows up when opening date editor in transaction thread

[lanitochka17]

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: 1.4.71-0
Reproducible in staging?: Y
Reproducible in production?: N
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Issue reported by: Applause - Internal Team

Action Performed:

1. Go to staging.new.expensify.com
2. Go to workspace chat
3. Submit an expense
4. Go to transaction thread
5. Click Date

Expected Result:

No console error will show up

Actual Result:

Console error shows up when opening date editor in transaction thread.
The same issue also happens when opening date picker in confirmation page

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Bug6473656_1715080251902.date.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01947b8d6b6d6db97d
• Upwork Job ID: 1787870484752039936
• Last Price Increase: 2024-05-07
• Automatic offers:
• fedirjh | Reviewer | 0
• Krishna2323 | Contributor | 0

Issue Owner

Current Issue Owner: @fedirjh

[melvin-bot]

Triggered auto assignment to @hayata-suenaga (DeployBlockerCash), see https://stackoverflowteams.com/c/expensify/questions/9980/ for more details.

[github-actions]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open `StagingDeployCash` deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[lanitochka17]

@hayata-suenaga FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

[lanitochka17]

We think that this bug might be related to #wave-collect - Release 1

[melvin-bot]

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

[melvin-bot]

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

[hayata-suenaga]

The error is thrown in this method from Onyx

[Krishna2323]

Proposal

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

Expense - Console error shows up when opening date editor in transaction thread

What is the root cause of that problem?

canEvict: false, isn't included in reportActions object in IOURequestStepDateWithOnyx. canEvict: false, is also included in similar component like IOURequestStepTag, IOURequestStepDescription, IOURequestStepCategory, etc.

Reason for adding canEvict key:

/**
 * We check to see if this key is flagged as safe for eviction and add it to the recentlyAccessedKeys list so that when we
 * run out of storage the least recently accessed key can be removed.
 */
function addKeyToRecentlyAccessedIfNeeded(mapping) {
    if (!isSafeEvictionKey(mapping.key)) {
        return;
    }
    // Try to free some cache whenever we connect to a safe eviction key
    OnyxCache_1.default.removeLeastRecentlyUsedKeys();
    if ('withOnyxInstance'in mapping && mapping.withOnyxInstance && !isCollectionKey(mapping.key)) {
        // All React components subscribing to a key flagged as a safe eviction key must implement the canEvict property.
        if (mapping.canEvict === undefined) {
            throw new Error(`Cannot subscribe to safe eviction key '${mapping.key}' without providing a canEvict value.`);
        }
        addLastAccessedKey(mapping.key);
    }
}

App/src/pages/iou/request/step/IOURequestStepDate.tsx

Lines 142 to 162 in 9f4bf60

	const IOURequestStepDateWithOnyx = withOnyx<IOURequestStepDateProps, IOURequestStepDateOnyxProps>({
	splitDraftTransaction: {
	key: ({route}) => {
	const transactionID = route?.params.transactionID ?? 0;
	return `${ONYXKEYS.COLLECTION.SPLIT_TRANSACTION_DRAFT}${transactionID}`;
	},
	},
	reportActions: {
	key: ({
	route: {
	params: {action, iouType},
	},
	report,
	}) => {
	let reportID;
	if (action === CONST.IOU.ACTION.EDIT) {
	reportID = iouType === CONST.IOU.TYPE.SPLIT ? report?.reportID : report?.parentReportID;
	}
	return `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID ?? '0'}`;
	},
	},

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

Add canEvict: false, to reportActions object.

What alternative solutions did you explore? (Optional)

[Krishna2323]

Proposal Updated

• Updated RCA section.

[melvin-bot]

📣 @fedirjh 🎉 An offer has been automatically sent to your Upwork account for the Reviewer role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job

[melvin-bot]

📣 @Krishna2323 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

[hayata-suenaga]

@Krishna2323 I assigned you. please let me know when you open a PR to fix it 🙇

[Krishna2323]

@hayata-suenaga, PR is up, recording videos.

[Krishna2323]

@hayata-suenaga @fedirjh, PR ready for review.

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.4.72-1 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• [CP Staging] fix: Expense - Console error shows up when opening date editor in transaction thread #41788

If no regressions arise, payment will be issued on 2024-05-20. 🎊

For reference, here are some details about the assignees on this issue:

• @fedirjh requires payment automatic offer (Reviewer)
• @Krishna2323 requires payment automatic offer (Contributor)

[fedirjh]

I haven't reviewed the PR. The only thing left to do is make the payment for @Krishna2323. No need for a regression test.

[melvin-bot]

Issue is ready for payment but no BZ is assigned. @Christinadobrzyn you are the lucky winner! Please verify the payment summary looks correct and complete the checklist. Thanks!

[Christinadobrzyn]

Payouts due:

• Contributor: $250 @Krishna2323 (paid in Upwork - https://www.upwork.com/nx/wm/workroom/37198593/overview)
• Contributor+: $250 @fedirjh (paid in Upwork - https://www.upwork.com/nx/wm/workroom/37274679/overview)

Upwork job is here. No regression test so closing this.

[fedirjh]

@Christinadobrzyn I am not eligible for the payment. I have issued a refund.

[Christinadobrzyn]

ah thank you @fedirjh, I wasn't sure about that. Thanks for issuing the refund.