Login - Email and password fields are misaligned with left edge

[isagoico]

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. Open app while logged out
2. Input an email address and tap Continue

Expected Result:

Text input is aligned with left edge - no croppings

Actual Result:

Text input is not aligned with left edge. Because of that, any text that doesn't fit the field gets cropped in the right

Workaround:

Can the user still use Expensify without this being fixed? Have you informed them of the workaround?

Platform:

Where is this issue occurring?

• Android

Version Number: 1.1.15-1

Reproducible in staging?: Yes
Reproducible in production?: Unknown

Logs: https://stackoverflow.com/c/expensify/questions/4856

Notes/Photos/Videos: Any additional supporting documentation

Expensify/Expensify Issue URL:
Issue reported by: @roryabraham / Applause
Slack conversation: https://expensify.slack.com/archives/C01GTK53T8Q/p1636663544142100

View all open jobs on GitHub

[MelvinBot]

Triggered auto assignment to @flodnv (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

[MelvinBot]

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

[emonidi]

in LoginForm.js Line:114 set translateX={-10}

This will fix it.

[isagoico]

@AndrewGable @roryabraham I think this bug may be a deploy blocker. This was not reproducible when I checked this comment from Rory last week on the staging build https://expensify.slack.com/archives/C01GTK53T8Q/p1636680928146700?thread_ts=1636663544.142100&cid=C01GTK53T8Q

I'm gonna add the blocker label. Please remove if you disagree.

[OSBotify]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open StagingDeployCash deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[roryabraham]

Since this is now an hourly deploy blocker, we need to make it internal.

[MelvinBot]

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

[Jag96]

Looking into this one, translateX doesn't fully solve the issue since that also affects the x value of the label

[Jag96]

I think I sorted it out, looks like translateX was being passed via inputProps to the TextInput component here, but we recently updated inputProps to omit the ExpensiTextInput prop types here which includes translateX, so it was never being passed down. Will run through some testing and make a PR.

[emonidi]

I think I sorted it out, looks like translateX was being passed via inputProps to the TextInput component here, but we recently updated inputProps to omit the ExpensiTextInput prop types here which includes translateX, so it was never being passed down. Will run through some testing and make a PR.

Yep. Too deep to much cascading. Flat is not that bad you know. And yeah take a look at my comment above 😂