Wizard: Replace typeahead profile selector with simple dropdown (HMS-10638)

[mgold1234]

The ProfileSelector used a typeahead variant with text filtering,
which caused the placeholder text to appear white in dark mode.
PatternFly's MenuToggle typeahead variant uses a separate CSS variable
for its input placeholder that doesn't inherit the dark mode color.

Replace with a simple button-based dropdown matching the PolicySelector
pattern. This also adds an applying state with a spinner, and adds
isPlaceholder to the PolicySelector toggle for consistency.

JIRA: HMS-10638

[codecov]

Codecov Report

❌ Patch coverage is 95.45455% with 1 line in your changes missing coverage. Please review.
✅ Project coverage is 74.81%. Comparing base (464b7c5) to head (cebc28e).
⚠️ Report is 3 commits behind head on main.

Files with missing lines	Patch %	Lines
...eWizard/steps/Oscap/components/ProfileSelector.tsx	95.23%	1 Missing ⚠️

@@            Coverage Diff             @@
##             main    #4435      +/-   ##
==========================================
+ Coverage   74.76%   74.81%   +0.04%     
==========================================
  Files         229      229              
  Lines        7612     7571      -41     
  Branches     2867     2854      -13     
==========================================
- Hits         5691     5664      -27     
+ Misses       1653     1642      -11     
+ Partials      268      265       -3     

Files with missing lines	Coverage Δ
...geWizard/steps/Oscap/components/PolicySelector.tsx	48.71% <100.00%> (+0.66%)	⬆️
...eWizard/steps/Oscap/components/ProfileSelector.tsx	87.65% <95.23%> (+6.85%)	⬆️

... and 1 file with indirect coverage changes

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 464b7c5...cebc28e. Read the comment docs.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[sourcery-ai]

Hey - I've found 1 issue, and left some high level feedback:

• In PolicySelector, removing the explicit None option means there’s no way to clear a selected policy while staying in compliance mode; consider retaining a clear/"None" affordance so users don’t have to switch back to "No additional policy or profile" just to unset a policy.
• For ProfileSelector, you now rely solely on the surrounding radios to clear the profile; if users are expected to switch between different OpenSCAP profiles frequently, it may be worth adding an in-control clear mechanism (similar to the policy selector) to avoid forcing a round-trip through the "None" radio state.

Prompt for AI Agents

Please address the comments from this code review:

## Overall Comments
- In `PolicySelector`, removing the explicit `None` option means there’s no way to clear a selected policy while staying in `compliance` mode; consider retaining a clear/"None" affordance so users don’t have to switch back to "No additional policy or profile" just to unset a policy.
- For `ProfileSelector`, you now rely solely on the surrounding radios to clear the profile; if users are expected to switch between different OpenSCAP profiles frequently, it may be worth adding an in-control clear mechanism (similar to the policy selector) to avoid forcing a round-trip through the "None" radio state.

## Individual Comments

### Comment 1
<location path="src/Components/CreateImageWizard/steps/Oscap/components/ProfileSelector.tsx" line_range="134-138" />
<code_context>
-    }
-  }, [filterValue, profileDetails, isOpen]);
-
   const handleToggle = () => {
-    if (!isOpen && complianceType === 'openscap') {
+    if (!isOpen) {
       refetch();
     }
     setIsOpen(!isOpen);
</code_context>
<issue_to_address>
**suggestion (bug_risk):** Avoid double-toggling `isOpen` between `MenuToggle` and `Select`’s `onOpenChange`.

`MenuToggle` currently calls `setIsOpen(!isOpen)` on click, and `Select`’s `onOpenChange` calls `handleToggle`, which also flips `isOpen` and triggers `refetch()` when opening. If both fire, the state can flip twice and `refetch` timing becomes unclear. Consider centralizing the toggle and `refetch` in one handler (e.g., have the toggle call `handleToggle` and let `onOpenChange` only sync state, or the reverse) so there’s a single source of truth for open/close behavior.

Suggested implementation:

```typescript
  const handleToggle = (nextIsOpen: boolean) => {
    if (nextIsOpen && !isOpen) {
      refetch();
    }
    setIsOpen(nextIsOpen);
    handleServices(undefined);
    dispatch(clearKernelAppend());
    dispatch(changeFips(false));

```

To fully avoid the double-toggle issue and centralize the behavior:
1. Update the `MenuToggle` usage in this file from something like:
   - `onClick={() => setIsOpen(!isOpen)}`  
   to:
   - `onClick={() => handleToggle(!isOpen)}`

2. Update the `Select` component’s `onOpenChange` from:
   - `onOpenChange={handleToggle}` (if currently relying on it to flip state),
   to:
   - `onOpenChange={(_event, isOpen) => handleToggle(isOpen)}`  
   so `onOpenChange` simply forwards the new open state to `handleToggle` instead of toggling it again.

These adjustments ensure `handleToggle` is the single source of truth for open/close state and `refetch()` execution, and both `MenuToggle` and `Select` only delegate to it without independently flipping `isOpen`.
</issue_to_address>

---

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

• X
• Mastodon
• LinkedIn
• Facebook

_{Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.}

[sourcery-ai]

suggestion (bug_risk): Avoid double-toggling isOpen between MenuToggle and Select’s onOpenChange.

MenuToggle currently calls setIsOpen(!isOpen) on click, and Select’s onOpenChange calls handleToggle, which also flips isOpen and triggers refetch() when opening. If both fire, the state can flip twice and refetch timing becomes unclear. Consider centralizing the toggle and refetch in one handler (e.g., have the toggle call handleToggle and let onOpenChange only sync state, or the reverse) so there’s a single source of truth for open/close behavior.

Suggested implementation:

  const handleToggle = (nextIsOpen: boolean) => {
    if (nextIsOpen && !isOpen) {
      refetch();
    }
    setIsOpen(nextIsOpen);
    handleServices(undefined);
    dispatch(clearKernelAppend());
    dispatch(changeFips(false));

To fully avoid the double-toggle issue and centralize the behavior:

1. Update the MenuToggle usage in this file from something like:

   • onClick={() => setIsOpen(!isOpen)}
     to:
   • onClick={() => handleToggle(!isOpen)}

2. Update the Select component’s onOpenChange from:

   • onOpenChange={handleToggle} (if currently relying on it to flip state),
     to:
   • onOpenChange={(_event, isOpen) => handleToggle(isOpen)}
     so onOpenChange simply forwards the new open state to handleToggle instead of toggling it again.

These adjustments ensure handleToggle is the single source of truth for open/close state and refetch() execution, and both MenuToggle and Select only delegate to it without independently flipping isOpen.