[$500] Chat - In offline mode, starting a new chat results in the header being greyed out and tapping on it doesn't trigger any action

[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.18-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. Go to https://staging.new.expensify.com/
2. Tap profile icon---Preferences
3. Toggle on forced offline
4. Navigate to LHN
5. Tap on fab---Start chat
6. Enter a new user email id eg: tail@gmail.com
   and select it
7. Tap on the header

Expected Result:

Tapping on header must direct user to profile page

Actual Result:

In offline, header greyed out and tapping on it doesn't trigger any action

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

Bug6327114_1703714413547.tail.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~0159feb175c7125e53
• Upwork Job ID: 1740170117380186112
• Last Price Increase: 2024-01-04

[melvin-bot]

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

[melvin-bot]

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

[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 - @c3024 (External)

[unidev727]

Proposal

from: @unicorndev-727

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

In offline, header greyed out and tapping on it doesn't trigger any action.

What is the root cause of that problem?

The root cause is that shouldDisableDetailPage is true here becuase the chat report only has one participant and that participant is the optimistic personal detail.
This issue happens if we don't have personal detail of a participant when creating a chat in offline state.

App/src/pages/home/HeaderView.js

Line 197 in 595bf40

const shouldDisableDetailPage = ReportUtils.shouldDisableDetailPage(props.report);

App/src/libs/ReportUtils.ts

Lines 776 to 778 in 595bf40

	if (participantAccountIDs.length === 1) {
	return isOptimisticPersonalDetail(participantAccountIDs[0]);
	}

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

Solution 1: We can return false if the report is chat report

if (isChatRoom(report) || isPolicyExpenseChat(report) || isChatThread(report) || isTaskReport(report) || isChatReport(report)) {
        return false;
    }

Solution 2: We can delete this condition in shouldDisableDetailPage function.

App/src/libs/ReportUtils.ts

Lines 776 to 778 in 595bf40

	if (participantAccountIDs.length === 1) {
	return isOptimisticPersonalDetail(participantAccountIDs[0]);
	}

screen-capture.1.webm

What alternative solutions did you explore? (Optional)

App/src/libs/ReportUtils.ts

Lines 770 to 780 in 595bf40

	function shouldDisableDetailPage(report: OnyxEntry<Report>): boolean {
	const participantAccountIDs = report?.participantAccountIDs ?? [];
	if (isChatRoom(report) || isPolicyExpenseChat(report) || isChatThread(report) || isTaskReport(report)) {
	return false;
	}
	if (participantAccountIDs.length === 1) {
	return isOptimisticPersonalDetail(participantAccountIDs[0]);
	}
	return false;
	}

if we exclude this code snippet here

if (participantAccountIDs.length === 1) {
        return isOptimisticPersonalDetail(participantAccountIDs[0]);
    }

shouldDisableDetailPage always returns false.
So we don't need shouldDisableDetailPage function.
cc: @jliexpensify @c3024

if we have to return false always, we can delete disable attribute here.

App/src/pages/home/HeaderView.js

Line 236 in 595bf40

disabled={shouldDisableDetailPage}

[Tony-MK]

I am assuming, but this is expected. To be sure, could we confirm? Thank you 😄

App/src/libs/ReportUtils.ts

Lines 760 to 765 in 376bb95

	/**
	* Check if the report is a single chat report that isn't a thread
	* and personal detail of participant is optimistic data
	*/
	function shouldDisableDetailPage(report: OnyxEntry<Report>): boolean {

[jliexpensify]

I can reproduce on 1.4.18-3: