Update Add Debit Card form to match VBA styles #5940
Conversation
| } | ||
|
|
||
| /** | ||
| * Automatically adds the / character while the user is typing expiration date |
There was a problem hiding this comment.
This reminded me of some conversation about how we did not want to manipulate the user input as it was being entered. Does that apply here? I'll try to dig it up...
There was a problem hiding this comment.
I think we discussed it in this thread. While testing, I noticed that we add / the first time, but not if we delete it and type more chars, which is inconsistent. Maybe we should remove this forced formatting?
There was a problem hiding this comment.
Good find, ok so what if we do this:
- Don't update the input the user is adding (remove the function that monitors and adds
/) - Update
getYearFromExpirationDateStringso that instead of checking if the 3rd character is a/, we just check if it is not a numeric character (here)
That should allow us to let the user enter whatever they want (02/2020 or 022020 or 0220 or 02-2020) and we'd still let it validate, and take 02 as the month and 2020 as the year.
We'd have to update the regex to something like ^(0[1-9]|1[0-2])([^0-9])?([0-9]{4}|([0-9]{2}))$, but I think that will be fine since we're only using it there.
Open to other ideas though!
| } | ||
|
|
||
| /** | ||
| * Automatically adds the / character while the user is typing expiration date |
There was a problem hiding this comment.
I think we discussed it in this thread. While testing, I noticed that we add / the first time, but not if we delete it and type more chars, which is inconsistent. Maybe we should remove this forced formatting?
|
Updated the PR and addressed the comments, this is ready for another look! |
| label={this.props.translate('addDebitCardPage.billingAddress')} | ||
| containerStyles={[styles.mt4]} | ||
| value={this.state.addressStreet} | ||
| onChangeText={(fieldName, value) => this.clearErrorAndSetValue(fieldName, value)} |
There was a problem hiding this comment.
Oh wow this field is responsible for setting multiple fields? That should be a fun one for the New Expensify Forms detailed conversation :)
|
✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release. |
|
🚀 Deployed to staging by @marcaaron in version: 1.1.10-3 🚀
|
|
🚀 Deployed to production by @roryabraham in version: 1.1.11-1 🚀
|
@luacmartins @marcaaron will you please review this?
Details
This PR updates the add debit card form to match the form styles when adding a bank account.
Fixed Issues
$ #5644
Tests/QA
fix the errorsLocal Testing (no QA)
Tested On
Screenshots