[PAID] [$500] Status - Custom time page loads infinitely in offline mode

[lanitochka17]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: 1.4.14-2
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: Applause - Internal Team
Slack conversation:

Action Performed:

1. Log in and do not visit custom time page
2. Go offline
3. Go to Settings > Profile > Status
4. Click Clear after
5. Click Custom
6. Click Time

Expected Result:

Time selection page will open without issue

Actual Result:

Time selection page loads infinitely

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

Bug6321550_1703091917140.bandicam_2023-12-20_21-58-55-875.1.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01ab5fa243901ed9cb
• Upwork Job ID: 1737525375053193216
• Last Price Increase: 2023-12-20
• Automatic offers:
• paultsimura | Contributor | 28067092

[melvin-bot]

Triggered auto assignment to @strepanier03 (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[melvin-bot]

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

[melvin-bot]

Bug0 Triage Checklist (Main S/O)

• This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[melvin-bot]

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

[neonbhai]

Proposal

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

Status - Custom time page loads infinitely in offline mode

What is the root cause of that problem?

setTimePage shows FullScreenLoadingIndicator if is it still loading:

App/src/pages/settings/Profile/CustomStatus/SetTimePage.js

Lines 36 to 38 in 88631a0

	if (lodashGet(privatePersonalDetails, 'isLoading', true)) {
	return <FullscreenLoadingIndicator />;
	}

This will keep on loading when offline

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

We should add a FullPageOfflineBlockingView when the user is offline

[dukenv0307]

Proposal

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

Time selection page loads infinitely

What is the root cause of that problem?

When we offline without private personal detail, the loading page is show here

App/src/pages/settings/Profile/CustomStatus/SetTimePage.js

Line 36 in 88631a0

if (lodashGet(privatePersonalDetails, 'isLoading', true)) {

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

I think on this page, we want to get currentPersonalDetail to get the current time to display the default value of the form if the draft time is empty but we get the wrong data here.

We should get currentPersonalDetail by using withCurrentPersonalDetail HOC and then get clearAfter from currentPersonalDetail.status to display if the draft custom status is empty.

App/src/pages/settings/Profile/CustomStatus/SetTimePage.js

Line 36 in 88631a0

if (lodashGet(privatePersonalDetails, 'isLoading', true)) {

And we can display loading page when currentPersonalDetail.login is empty.

We should update other custom status pages with this approach.

What alternative solutions did you explore? (Optional)

NA

[paultsimura]

Proposal

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

In offline, the status timer is always loading.

What is the root cause of that problem?

We are checking for the privatePersonalDetails to be loaded before showing the TimePicker and displaying the loader otherwise:

App/src/pages/settings/Profile/CustomStatus/SetTimePage.js

Lines 36 to 38 in 88631a0

	if (lodashGet(privatePersonalDetails, 'isLoading', true)) {
	return <FullscreenLoadingIndicator />;
	}

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

I've checked the code – the value of privatePersonalDetails is not used anywhere, seems like it is a redundant code that was missed during development (probably, this page was initially copy-pasted from some other that uses privatePersonalDetails, most likely from DateOfBirthPage – commit).

We can remove this piece of code as well as all the code related to the privatePersonalDetails on this page:

App/src/pages/settings/Profile/CustomStatus/SetTimePage.js

Lines 36 to 38 in 88631a0

	if (lodashGet(privatePersonalDetails, 'isLoading', true)) {
	return <FullscreenLoadingIndicator />;
	}

What alternative solutions did you explore? (Optional)

[narefyev91]

Proposal from @paultsimura looks good to me #33369 (comment)
Seems we do not need that check, in case we do not use privatePersonalDetails anywhere in that flow
🎀 👀 🎀 C+ reviewed

[melvin-bot]

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

[dukenv0307]

@narefyev91
I think the purpose to display loading page here to avoid empty value is displayed when we go to this page by deeplink but we subscrible wrong key because status is stored in currentPersonalDetail.

I think we should get currenPersonalDetail here instead of privatePersonalDetail and display the loading page if it's empty. We also need to get clearAfter from currenPersonalDetail if customStatus draft is empty because if we remove this check and go to set date page by deep link before signing the empty value is displayed.

[paultsimura]

we also need to get clearAfter from currenPersonalDetail if customStatus draft is empty

This looks more like re-inventing the wheel.
Here is the structure of the PrivatePersonalDetails, it stores exactly what it's meant to store – personal details – and has nothing to do with the status:

App/src/types/onyx/PrivatePersonalDetails.ts

Lines 9 to 19 in 0a1bae4

	type PrivatePersonalDetails = {
	legalFirstName?: string;
	legalLastName?: string;
	dob?: string;
	/** User's home address */
	address?: Address;
	/** Whether we are loading the data via the API */
	isLoading?: boolean;
	};

The status has a dedicated Onyx key:

App/src/types/onyx/CustomStatusDraft.ts

Lines 1 to 10 in 278183e

	type CustomStatusDraft = {
	/** The emoji code of the draft status */
	emojiCode: string;
	/** The text of the draft status */
	text: string;
	/** ISO 8601 format string, which represents the time when the status should be cleared */
	clearAfter: string;
	};

And if using this key causes trouble with deep links or whatever else, it should be handled properly in a separate task. But we clearly shouldn't mix private personal details and status.

[dukenv0307]

The CustomStatusDraft is a part of currentPersonalDetail not PrivatePersonalDetail. It's used to store the temporary value of status before we save it.

[paultsimura]

The reason why CUSTOM_STATUS_DRAFT key was added is to allow setting the value of things like emoji, text, and clearAfter without holding to the previous value.
The corresponding values of currentPersonalDetail are correctly handled on pages that implement saving the draft status as a real status, and the draft value always takes priority:

App/src/pages/settings/Profile/CustomStatus/StatusPage.js

Lines 49 to 57 in 08a9677

	const currentUserEmojiCode = lodashGet(currentUserPersonalDetails, 'status.emojiCode', '');
	const currentUserStatusText = lodashGet(currentUserPersonalDetails, 'status.text', '');
	const currentUserClearAfter = lodashGet(currentUserPersonalDetails, 'status.clearAfter', '');
	const draftEmojiCode = lodashGet(draftStatus, 'emojiCode');
	const draftText = lodashGet(draftStatus, 'text');
	const draftClearAfter = lodashGet(draftStatus, 'clearAfter');
	const defaultEmoji = draftEmojiCode || currentUserEmojiCode || initialEmoji;
	const defaultText = draftText || currentUserStatusText;

I don't see any benefit from using the privatePersonalDetails on this page, which will unnecessarily break the offline-first approach for the user.
Moreover, we don't use this key in SetDatePage either, which is equally related to the status.
That being said, I am still confident that my proposal fixes this issue correctly without any harm to the User.

[blimpich]

I agree with @narefyev91. Thank you @paultsimura and @dukenv0307 for your proposal's and discussion, it has helped me understand this part of the codebase better. I think @paultsimura's proposal seems best for this particular situation. Assigning. Looking forward to the PR!

[melvin-bot]

📣 @paultsimura 🎉 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 📖

[paultsimura]

Thanks. The PR is ready for review: #33440

[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.17-8 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• fix: Status – remove redundant privatePersonalDetails dependencies #33440

If no regressions arise, payment will be issued on 2024-01-03. 🎊

After the hold period is over and BZ checklist items are completed, please complete any of the applicable payments for this issue, and check them off once done.

• External issue reporter
• Contributor that fixed the issue - @paultsimura - $500 via Upwork
• Contributor+ that helped on the issue and/or PR - N/A

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

• @paultsimura requires payment automatic offer (Contributor)
• @narefyev91 does not require payment (Contractor)

[melvin-bot]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@blimpich] The PR that introduced the bug has been identified. Link to the PR: Status clear after #24620
• [@blimpich] 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/24620/files#r1433890095
• [@blimpich] A discussion in #expensify-bugs 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, the PR that introduced this was part of a large feature branch, and this bug is relatively minor, so I don't think its worth discussing a change to the PR review checklist
• [@paultsimura / @narefyev91] Determine if we should create a regression test for this bug.
• [@paultsimura / @narefyev91] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
• [@strepanier03] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

[strepanier03]

Payment has been handled and part of the checklist. I'll check here tomorrow for the rest of the checklist responses and close when that's finished up.

[strepanier03]

@paultsimura @narefyev91 - Do we need to do the regresssion test at all? I think not because an indefinite load would be caught with normal testing.

I plan to close this tomorrow if I don't hear from you.

[paultsimura]

From my POV, no regression test is needed here as the issue was caused by redundant code missed during the initial feature development (I'm not a C+ though).

[strepanier03]

Thank you @paultsimura - I'm going to close this and if a reg test is needed we can reopen and I'll take care of it.