[$1000] Offline: auto-suggestion modal is transparent when Offline so UI is being distorted

[kavimuru]

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

---

Action Performed:

1. Go offline
2. Create a new chat, with a user with no chat history
3. Type :sm and we will see the auto-suggestion modal is transparent

Expected Result:

Auto-suggestion modal UI should display correctly, and should not have the transparent background

Actual Result:

Auto-suggestion modal UI distorted when offline

Workaround:

unknown

Platforms:

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

• Android / native
• Android / Chrome
• iOS / native
• iOS / Safari
• MacOS / Chrome / Safari
• MacOS / Desktop

Version Number: 1.2.92-0
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
Notes/Photos/Videos: Any additional supporting documentation

az_recorder_20230329_221217.1.mp4

Expensify/Expensify Issue URL:
Issue reported by: @harshad2711
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1679846524710219

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~0163de738c1968d0cf
• Upwork Job ID: 1641455102435086336
• Last Price Increase: 2023-04-06

[MelvinBot]

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

[MelvinBot]

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

[esh-g]

I think the better steps to reproduce this are:

1. Go Offline.
2. Create a new Chat.
3. Type :sm to see the emoji suggestions.

Because this is not reproducible with steps given in the inital Action Performed.
This also occurs on mWeb and native/ios and macOs/Chrome/Safari.

cc @kavimuru

[conorpendergrast]

Haven't been able to reproduce via Browserstack (Android) or iOS yet and will keep trying.

Online	Offline (simulated via app)

[esh-g]

@conorpendergrast First go offline and then create a new chat like "test@asd.com". And after that, try opening the emoji Suggestions. The whole report screen should be grayed out when you open the newly created chat offline.

[conorpendergrast]

Ah, nice! That got it, thanks @esh-g!

Updated the OP with the platforms affected and the exact duplication steps

[MelvinBot]

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

[MelvinBot]

Current assignee @conorpendergrast is eligible for the External assigner, not assigning anyone new.

[MelvinBot]

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