Migrate deprecated Wizard component to PF5 and fix Wizard's focus issue #1428
Conversation
sgratch
added
bug
| shouldFocusContent | ||
| title={title} | ||
| startIndex={startAtStep} | ||
| onClose={() => history.goBack()} |
There was a problem hiding this comment.
this can be a bit problematic sometimes, for example if someone enter directly to wizard URL, onclose will send out of the app - consider navigate to a list page
There was a problem hiding this comment.
I fixed it as follows:
If the wizard is triggered by the provider - vms tab => cancel will navigate back to the provider - vms tab
If the wizard is triggered by the plans list page => cancel will navigate back to the plans list page
If the wizard is triggered by entering the wizard url directly => cancel will navigate back to the plans list page.
This is another bug fix, so added that to main comment as well.
| Object.values(state?.validation || []).some( | ||
| (validation) => validation === 'error', | ||
| ) || | ||
| state?.validation?.planName === 'default', |
There was a problem hiding this comment.
seems like state.validation can be object or array?
also consider extracting it to a isDsiabled func
There was a problem hiding this comment.
validation is an object property within the CreateVmMigrationPageState interface, this huge state object is very complicated to track and debug as is so I prefer to leave it and not extract it to a local env.
But I extract it to separate funcs to make it more readable.
sgratch
force-pushed
the
Migrate-deprecated-wizard-to-pf5-and-fix-focus-bug
branch
from
02a2181 to
9bfc03d
Compare
References: https://issues.redhat.com/browse/MTV-1051 https://issues.redhat.com/browse/MTV-1863 1. Migrate the deprecated Wizard component to PF5 - see https://v5-archive.patternfly.org/components/wizard/react-deprecated 2. When moving between steps in plan wizard, set the initial focus to the top of the step's page. Signed-off-by: Sharon Gratch <[email protected]>
sgratch
force-pushed
the
Migrate-deprecated-wizard-to-pf5-and-fix-focus-bug
branch
from
9bfc03d to
c2c63c6
Compare
|
|
Codecov ReportAll modified and coverable lines are covered by tests ✅
❗ Your organization needs to install the Codecov GitHub app to enable full functionality. Additional details and impacted files@@ Coverage Diff @@
## main #1428 +/- ##
==========================================
- Coverage 36.81% 36.20% -0.62%
==========================================
Files 158 159 +1
Lines 2548 2580 +32
Branches 599 606 +7
==========================================
- Hits 938 934 -4
- Misses 1428 1464 +36
Partials 182 182 ☔ View full report in Codecov by Sentry. |
References:
https://issues.redhat.com/browse/MTV-1051
https://issues.redhat.com/browse/MTV-1863
Wizardcomponent to PF5 - see https://v5-archive.patternfly.org/components/wizard/react-deprecatedCancelbutton within the wizard, instead of always navigating tohistory.goBack(),the following happens now:
If the wizard is triggered by the provider - vms tab => cancel will navigate back to the provider - vms tab
If the wizard is triggered by the plans list page => cancel will navigate back to the plans list page
If the wizard is triggered by entering the wizard url directly => cancel will navigate back to the plans list page.
Screencasts
Before
Screencast.from.2025-01-06.18-33-35.webm
After
Screencast.from.2025-01-06.18-38-54.webm