Fix multi-stage form: cursor pointer & previous step selection#6101
Fix multi-stage form: cursor pointer & previous step selection#6101harshrajeevsingh wants to merge 2 commits intoFlowFuse:mainfrom
Conversation
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #6101 +/- ##
=======================================
Coverage 76.85% 76.85%
=======================================
Files 381 381
Lines 19272 19272
Branches 4641 4641
=======================================
Hits 14812 14812
Misses 4460 4460
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
|
@cstns review |
cstns
left a comment
There was a problem hiding this comment.
Thank you for your contribution!
The fix is halfway there, currently I'm able to skip steps with mandatory/required information:
multi-step-form.mp4
You'll need to take some things into consideration:
- some steps have mandatory/required information that should block step advancement
- until those steps are mounted, we have no way of knowing if the information they contain is mandatory or not
- the fix would need to be added in the common MultiStepForm and it should be picked up automatically by any form that implements it in an identical format/manner
- in order to allow navigation to forward steps (even when skipping steps) you'd need to know the state of all previous steps up to the one you'd want to navigate to
Looking at the code, I now realize that I haven't followed a common pattern to pass errors or the hasError state properly so it could complicate things a bit. One fix would be to normalize that between steps, but it's not required.
Another way to approach this would be to add a new key to each step that would represent if the step was mounted (and defer from it if it had mandatory/required steps) and not allow users to move to a step if:
- any previous steps have not been rendered yet
- any previous steps has required information / errors that have not been filled in or resolved
Description
Closes: #5386
Related Issue(s)
Checklist
flowforge.yml?FlowFuse/helmto update ConfigMap TemplateFlowFuse/CloudProjectto update values for Staging/ProductionLabels
area:migrationlabel