[HOLD for payment 2022-10-12] [$1000][Form Refactor] BankAccountStep

[luacmartins]

Coming from the New Expensify Forms design doc, we should refactor BankAccountStep to use the new form component, follow the guidelines below:

Here's an example of a Form refactor: #9056

Guidelines

1. Replace the form component with Form.js.
2. Create a unique Onyx key in ONYXKEYS.FORM and pass it as the formID prop to Form.
3. Pass a validate callback prop.
4. Pass an onSubmit callback prop that calls the API via an action.
5. Update all inputs wrapped by Form, following the guidelines in Refactor inputs.
6. Remove any unused code.

Testing

Verify that:

• UI looks as it did before the refactor
• Values can be added and edited
• Errors are highlighted correctly (input border)
• Error messages show up correctly
• Draft values are saved properly
• Form alerts are displayed correctly
• Clicking the fix the errors link focuses the first input with error
• No duplicate submission of the form occurs (when it's already submitting)

Job Post: https://www.upwork.com/jobs/~015df14d7f44106b74

[melvin-bot]

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

[liyamahendra]

@luacmartins I did a similar work on #9234 and would be happy to take this up.

Since this isn't an usual bug, should I propose the changes required for making the BankAccountStep to use Form or you expect something else as a part of the proposal?

[luacmartins]

@liyamahendra the issue is self-explanatory so there's no proposal needed, just your interest in working on this!

Let's wait for the job to be exported to that we can follow the process though 😉

[melvin-bot]

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

[melvin-bot]

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