[HOLD for payment 2022-05-24] [$1000] [HOLD for payment after regression testing] Refactor Picker to be compatible with Form

[luacmartins]

With the implementation of our new Form component we need to refactor Picker to be Form compatible. Here are the changes that need to be made:

1. An optional isFormInput prop.
2. If isFormInput is true, require a inputID prop. Use getInputIDPropTypes to enforce this propType rule.
3. Add an optional shouldSaveDraft prop. Defaults to false.
4. Make the value prop optional.
5. In the input’s onBlur method, call props.onBlur().
6. In the input’s onChange method (or equivalent e.g. onTextChange, etc), call props.onChange().
7. Remove the hasError prop.
8. Add an optional errorText prop. Defaults to an empty string.
9. Update the error message to display if errorText is truthy.
10. Update the inline error display style so it is left aligned with the label and input value. See example image for TextInput:
    
11. Make sure that props.ref is attached to the appropriate DOM node. This could involve forwarding the ref to a child component. This is important so we can call ref.focus().
12. Add the input to the test Form stories and make sure that it works. You can check this by running npm run storybook and testing the component in the example form.
13. Remove any unused code.

There's an example of a refactor to TextInput in this PR.

[MelvinBot]

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

[MelvinBot]

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

[laurenreidexpensify]

https://www.upwork.com/jobs/~013e89828de19f7536

[MelvinBot]

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

[MelvinBot]

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

[LucioChavezFuentes]

This issue looks self explanatory. May I take it as my task?

[rushatgabhane]

Sure, that'd be great. Looks like you're a new contributor, as a reminder make sure you go through CONTRIBUTING.md.

You could also #expensify-open-source slack channel if you like.

🎀👀🎀 C+ reviewed
@LucioChavezFuentes wants to volunteer for this task.

cc: @stitesExpensify

[LucioChavezFuentes]

Thank you for the opportunity! In a few moments I will send my request to be invited to slack channel. I plan to post an update on issue progress on Monday 7th Frebuary 2022, is that ok?

[rushatgabhane]

@LucioChavezFuentes
If @ stitesExpensify, gives you a go ahead for the PR. You can proceed with one

[LucioChavezFuentes]

My bad, I will proceed if approval.

[stitesExpensify]

Go for it @LucioChavezFuentes! Please apply for the job on Upwork and then @laurenreidexpensify will accept you

[MelvinBot]

📣 @LucioChavezFuentes You have been assigned to this job by @laurenreidexpensify!
Please apply to this job in Upwork and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

[LucioChavezFuentes]

Thank you! I submitted my proposal on Upwork. I plan to finish the issue on Wednesday, 9th February.

[melvin-bot]

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

[melvin-bot]

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

[luacmartins]

@Santhosh-Sellavel assigning you as C+ for this issue, since @rushatgabhane is OOO. I also assigned you to the corresponding PR.

[kadiealexander]

Just noting for the record that @parasharrajat needs a reporting bonus for reporting the regression here. The regression issue is here, but we decided to use this issue to manage everything to avoid confusion.

cc: @laurenreidexpensify @stitesExpensify

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.1.61-3 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Removing focus style on blur - Web/Desktop #8765

If no regressions arise, payment will be issued on 2022-05-24. 🎊

[LucioChavezFuentes]

I have a question, I requested a rise on cost to this issue to $1000 and it was accepted . Is it normal to still show $250 on the title?

[kadiealexander]

Ah, yes! That title doesn't update automatically. I've updated this to reflect the correct amount.

[Santhosh-Sellavel]

@laurenreidexpensify Can you set up a job on Upwork or send an invite for this issue! Its payment is due tomorrow. Thanks!

[laurenreidexpensify]

@Santhosh-Sellavel sent you a proposal, ignore the per hour bit - I'll issue payment as a bonus as soon as you accept today

[laurenreidexpensify]

@LucioChavezFuentes payment has been issued 👍🏽

[Santhosh-Sellavel]

Accepted the offer, @laurenreidexpensify!

[laurenreidexpensify]

Paid @Santhosh-Sellavel 🙌🏽

[parasharrajat]

@laurenreidexpensify I am eligible for a bonus here #7535 (comment).

[laurenreidexpensify]

Sorry @parasharrajat will sort you out now!

[laurenreidexpensify]

@parasharrajat created a new job here https://www.upwork.com/ab/applicants/1529457532430389248/job-details - I'll issue payment as soon as you're hired

[laurenreidexpensify]

@parasharrajat all done - sorry about that!