This commit addresses warnings related to the react-hooks/exhaustive-deps rule.
It resolves these warnings by adding the missing dependencies to the useEffect hook.
This makes the wizard feel much 'faster' for a better user experience.
The implementation uses RTK Query for prefetching. For most API
requests, prefetching is done when the 'next' button is hovered over on
the previous step.
This commit improves the file system configuration step's error handling
by performing validation only when the next button is clicked. This
allows an invalid state to temporarily exist while the user is modifying
the mountpoints without bothersome error messages needlessly appearing.
Broadly speaking there were two options for the implementation: (1)
delay the validation, performing validation only upon clicking the next
button -or- (2) perform validation immediately as normal but hide error
messages until the next button is clicked. Option (1) proved to be
untenable - Data Driven Forms does provide `pauseValidation()` and
`resumeValidation()` functions from React Final Form which theoretically
would make this option possible... However, we need to call
`resumeValidation()` in the next button's click handler and then
immediately make a decision based on the validation results either to
remain on the step and display the errors or move to the next step.
When we tried implmenting this we found that `resumeValidation()` does
not immediately peform validation - validation only resumes after
exiting the handler. Therefore, this approach was not considered and
option (2) was used.
In order to gain control over the behavior of the next button, custom
buttons are implemented for this step. Sharing state between the custom
buttons and the form was a challenge. With pure React it would have been
as simple as moving the relevant state to the parent component, but that
was not possible due to Data Driven Forms. Instead, state is shared
using the form state. A new property,
`'file-system-config-show-errors'`, in the form state is used to
determine whether or not error messages should be displayed.
In order to cause a re-render upon a change in
`'file-system-config-show-errors'`, the file system configuration
component is wrapped in a `<FormSpy>` component.
