Create task form

[negreirosleo]

Changes

This PR creates the new Task form, it:

• adds react-query to fetch and manage the data
• creates the /task page
• creates a useForm hook to manage the form state
• creates the components: Input, Select, TextArea with floating label

In the Adobe Layout the form items have 40px of height, but I changed it to 56px to accommodate the floating label.

Screenshots

[anarute]

I'm tyring to test it locally and I keep being redirected to /web/v2 when I try to access /web/v2/tasks
Is there something I need to do to test it properly?

[dmtrek14]

@anarute I also keep getting redirected, but I tried commenting out the signinRedirect in the AuthorizedPage.tsx and that let me get to the form.

A few small things:
It makes sense to make the inputs a little larger to accommodate the labels, but it does make the buttons feel a little off. Do you plan on increasing the button size to match the height? Or vertically center the buttons to align with the 'More actions' dropdown? I think if you increase the button height, you might also want to use --joy-fontSize-md for the font size in the buttons instead of the smaller text to make the button feel more proportioned.

The clear button does not seem to clear the task description.

On mobile, the 'More actions' and the buttons are a bit squished on one line, so perhaps the buttons should flow underneath the dropdown at small screen sizes.

[anarute]

I agree with Danielle's comment and would also add that I think we should make the dropdowns have autocomplete feature from the beginning, as keyboard navigation was the number one request from our users.

[anarute]

It seems the autocomplete clean up is not working well, once I select a value I cannot remove it:

Screencast.from.2023-09-28.13-51-31.webm

[anarute]

I think for this PR, adding the To and From fields should be enough, and then the timer, template and data fetching can be in new PRs, what do you think @dmtrek14 ?

[dmtrek14]

I think for this PR, adding the To and From fields should be enough, and then the timer, template and data fetching can be in new PRs, what do you think @dmtrek14 ?

I agree. It will help separate the work out a little better. We expect the timer to be a little complex and it makes sense for it to be its own PR.

[dmtrek14]

Looks good to me - thank you!