[$500] DEV: mWeb - Bottom Spacing Issues on NewChatSelectorPage

[kbecciv]

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:

Action Performed:

1. Have a chat list that reaches the full screen OR
2. Expand the content in the Room tab and select the 'Welcome message' input in this PR (soon to be merged) - Allow Welcome Message on Room Creation #27836

Expected Result:

Content should reach to the top of software keyboard/bottom of screen

Actual Result:

Content ends before it reaches the bottom of screen/top of keyboard

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: Dev 1.3.75.2
Reproducible in staging?: n
Reproducible in production?: n
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

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

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~011f8b38c2bf78c3c2
• Upwork Job ID: 1708820161758822400
• Last Price Increase: 2023-10-09

[melvin-bot]

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

[melvin-bot]

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

[micahelchan623]

Proposal

Please re-state the issue
Content should reach to the top of software keyboard/bottom of screen

What is the root cause of the problem?
The root cause is that the content container inside KeyboardAvoidingView is not handled

What changes do you think should be made to fix this problem?
on NewChatPage.js

               <KeyboardAvoidingView
                    style={{height: '100%'}}
                    behavior="padding"
                    keyboardVerticalOffset={
                        variables.contentHeaderHeight + insets.top + (Permissions.canUsePolicyRooms(betas) ? variables.tabSelectorButtonHeight + variables.tabSelectorButtonPadding : 0)
                    }
                    contentContainerStyle={{flexGrow: 1}}   //<-- add this line
                >

What other alternative options did you explore? (Optional)

[Ollyws]

#27836 has been merged now.

The second image is just what happens when you have a hardware keyboard connected in the simulator. I don't think that's a bug it's just the behaviour of the simulator.

I couldn't reproduce the other issues on main, looks fine to me:

Image

Image

I think we can close this, adding the reviewed label to get an internal engineer as I'm the only assignee.

🎀👀🎀 C+ reviewed

[melvin-bot]

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

[carlosalmonte04]

This issue is still happening on main ios safari mweb.

parent-scroll.mov