[HOLD for payment 2024-01-25] [$500] Bank account - Bank account fields have narrow layoutThere is adequate spacing between each field

[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.24-4
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 Settings > Workspaces > any workspace
2. Go to Bank account > Connect manually
3. Proceed to Step 2 Company information

Expected Result:

There is adequate spacing between each field

Actual Result:

Bank account fields have narrow layout

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

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01cabecd476f4c43d0
• Upwork Job ID: 1745497337519603712
• Last Price Increase: 2024-01-11

[melvin-bot]

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

[melvin-bot]

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

[melvin-bot]

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

[bernhardoj]

Proposal

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

The spacing between input is small on android/iOS.

What is the root cause of that problem?

This is a regression from #34199 where we replace the usage of containerStyles with touchableInputWrapperStyle to fix #34136.

On web however, this issue didn't happen because we still use the containerStyles in the View wrapper.

App/src/components/TextInput/BaseTextInput/index.tsx

Lines 279 to 280 in d541723

	<View
	style={[styles.pointerEventsNone, containerStyles]}

which we didn't do for native input.

App/src/components/TextInput/BaseTextInput/index.native.tsx

Lines 265 to 266 in d541723

	<View
	style={styles.pointerEventsNone}

So, the containerStyles in native is never applied.

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

Add containerStyles to the View wrapper.

[shubham1206agra]

This has happened due to improper sync in margelo@1290c7c. But this hasn't been detected before we made changes in #34199 (which is basically a syncing the PR correctly with web counterpart). So this is a discovered bug now.

But I think @mkhutornyi could raise a PR for a quick fix.

[mkhutornyi]

yes, I can.

[shubham1206agra]

Please raise it then.

[sonialiap]

@mkhutornyi to confirm, will you submit a PR for this issue? If yes, I'd like to assign you to this issue so that it's easier to keep track

[mkhutornyi]

yes, will do

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

• add missing containerStyles in web TextInput container #34555

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

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

• @mananjadhav requires payment through NewDot Manual Requests

[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:

• [@mananjadhav] The PR that introduced the bug has been identified. Link to the PR:
• [@mananjadhav] 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:
• [@mananjadhav] 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:
• [@mananjadhav] Determine if we should create a regression test for this bug.
• [@mananjadhav] 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.
• [@sonialiap] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

[mananjadhav]

I don't think there will be a payout for this one as this was a regression.

[sonialiap]

Original issue #34136