🐛 Convert assessment wizard to modal

[ibolton336]

• https://issues.redhat.com/browse/MTA-1437
• https://issues.redhat.com/browse/MTA-1467
  Resolves loading state for slow connections & moves the assessment wizard to a modal to simplify code & improve UX. This was approved by Justin from UXD.

[codecov]

Codecov Report

Attention: 7 lines in your changes are missing coverage. Please review.

Comparison is base (4624f4d) 40.29% compared to head (00a6f39) 40.22%.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1486      +/-   ##
==========================================
- Coverage   40.29%   40.22%   -0.07%     
==========================================
  Files         143      143              
  Lines        4532     4539       +7     
  Branches     1096     1096              
==========================================
  Hits         1826     1826              
- Misses       2609     2616       +7     
  Partials       97       97              

Flag	Coverage Δ
client	40.22% <0.00%> (-0.07%)	⬇️
server	∅ <ø> (∅)

Flags with carried forward coverage won't be shown. Click here to find out more.

Files	Coverage Δ
client/src/app/queries/assessments.ts	20.96% <0.00%> (-2.67%)	⬇️

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[mturley]

@ibolton336 this mostly LGTM, but with the wizard in a modal it should have a WizardHeader at the top passed in via the header prop of Wizard (example here)

[gitdallas]

I was going to comment about the wizard header as well. With title/sub something like Questionaire/[Title of questionaire].

Also, I was wondering why you hid the button like that instead of using showClose={false} on the modal.. but when i attempt to do that, I get an error about a focus trap without a tabbable node. Perhaps this would change with the wizard header in place.

[sjd78]

Generally looks ok, but another issue -- on the Assessment Actions screen, the archived questionnaires View buttons have a spinner to the left:

[gitdallas]

I'm still seeing the focus trap without tabbable node error, also I think this should be reworded now that it isn't a page:

perhaps just replace "page" with "assessment" or "questionnare"?

[gitdallas]

Suggested change

	showClose={false}
	showClose={isFetching || !!fetchError}

this seems to fix the focus trap issue. it is an issue when you have an error/loader rather than the wizard.

[gitdallas]

Mostly lgtm, one verbiage comment

[gitdallas]

title should probably be changed too. "Close Assessment"? or if you want to use existing message... maybe dialog.title.discard with Assessment for the what?

[sjd78]

Other possible confirm modal titles:

• "Leave assessment"
• "Confirm cancel"
• "Close wizard"

[sjd78]

Code changes LGTM.
The assessment actions page and the wizard all work well.

As already noted, the title for the confirm cancel modal is confusing since the assessment is a wizard and not a page anymore.

[sjd78]

LGTM with a nice confirm title and everything!