chore(clusters): engine v2 review improvements

[rmnbrd]

Summary

Improvements from reviewing the Engine v2 branch (origin/staging...HEAD) against every project skill: qovery-console-standards, qovery-ui, react-useeffect, vercel-react-best-practices and web-design-guidelines. Based on feat/cluster-engine-v2 (after #3057), one commit per change.

Bugs

• Keep edits made while saving: a successful save cleared every local edit, including ones typed while the request was in flight. It now removes only the values it submitted.
• Redirect once when the Operator connects: the install effect ran again on each parent re-render. With a parent that updates state in onClose, onClose ran 53 times in the test.
• Item modal dismissed with Escape: the modal's "open" flag stayed set, so unmounting the field later closed an unrelated modal.
• Focus outline: focus-visible:ring-brand generates no CSS, so the profile sidebar and Operator footer buttons had Tailwind's default blue ring. They now use outline-brand-strong, like the rest of the console.
• Provider icons in ClusterAvatar: OVH, ORACLE and IBM now map to their *_CLOUD icons for every avatar (breadcrumbs, cards, overview). The profile header uses ClusterAvatar instead of its own mapping.

Performance

• No debounce on component switches: opening another component no longer waits 300 ms before its preview request, so the skeleton doesn't flash even when the preview is cached. Edits are still debounced.

Consistency

• Copy:
  • "Qovery Operator" casing everywhere.
  • Loading layers… with an ellipsis.
  • Error text that says what to do next.
  • The search empty states no longer mention filters, which were removed.
  • No trailing period on the tooltip.
• Sidebar layer icon: the Font Awesome layer-group icon replaces a CSS mask of apps/console/public/assets/sidebar-test/layer.svg. The feature lib no longer depends on an app asset, and the SVG is deleted.
• Route ids: ProfileOperatorFooter and ClusterOperatorStatus read the route ids with useParams instead of receiving them as props.
• isHttpStatus: no longer exported publicly from clusters data-access.
• Console logging: the dev-only API response logs in cluster-profile.tsx are removed; the branch has no console calls left.

Tests

• Spec for the platform configuration helpers.
• InputSearch tests use userEvent instead of fireEvent.
• Unused import removed.

Not included (for discussion)

• Product or design choices:
  • Label the Operator step's submit "Create cluster" instead of "Continue".
  • Replace the changes bar's hardcoded shadow and button gaps with tokens (they follow Figma today).
  • Revert the green EmptyState variant.
  • Add skeletons to the profile header.
• Larger changes:
  • Real links for the profile tabs (Cmd-click, copy link).
  • Debounce or defer search URL updates.
  • Prefetch the profile queries in a route loader.
  • Warn before leaving with unsaved changes.
  • Move focus to the heading on each creation step.
  • Live regions for the polling install step.
  • Link input errors with aria-invalid / aria-describedby in shared inputs.
  • Make the password toggle a keyboard-reachable button.
  • Batch the per-card Operator status requests on the clusters list.

Test plan

• jest: clusters feature (561), shared ui (471), clusters data-access
• New tests fail without their fix (save, redirect, modal dismissal, debounce, avatar icons)
• tsc app and libs, ESLint, Prettier
• yarn build:console

🤖 Generated with Claude Code

---

Summary by cubic

Applies code review improvements to the Engine v2 cluster profile and creation flows, fixing four bugs and tightening performance, consistency, and test coverage.

Bug fixes

• Saving no longer clears edits typed while the request was in flight.
• The Operator connect redirect runs once even if the parent re-renders.
• Item modals report their mount state explicitly, so dismissing by Escape no longer leaves a stale flag that could close an unrelated modal later, and StrictMode double-mounting is handled.
• OVH, Oracle, and IBM clusters now show their *_CLOUD icons in all avatars, and the profile header uses ClusterAvatar.

Refactors

• The edit debounce now applies to profile edits only, so switching components previews immediately.
• Copy is aligned ("Qovery Operator", Loading layers…, action-oriented errors); the sidebar shows "No layers match your search" only when searching, else "No layers available"; and the layer icon uses the Font Awesome layer-group icon.
• ProfileOperatorFooter and ClusterOperatorStatus read route ids via useParams, isHttpStatus is no longer publicly exported, and dev-only API response logging is removed.
• Added tests for the platform configuration helpers and avatar icons, and InputSearch tests now use userEvent.

^{Written for commit 4734090. Summary will update on new commits.}

[nx-cloud]

View your CI Pipeline Execution ↗ for commit 4734090

Command	Status	Duration	Result
nx run console:build --parallel=3 --configurati...	✅ Succeeded	1m 3s	View ↗
nx affected --target=test --parallel=3 --config...	✅ Succeeded	2m 54s	View ↗
nx affected --target=lint --parallel=3	✅ Succeeded	2m 40s	View ↗
nx-cloud record -- yarn nx format:check	✅ Succeeded	5s	View ↗

💡 Verify your cache is correct by running tasks in a sandbox. Read docs ↗

---

☁️ Nx Cloud last updated this comment at 2026-10-02 16:34:28 UTC

[Copilot]

Copilot review overview

🟡 Changes recommended

Component-switch previews can still use stale debounced requests, and the sidebar can show search-specific copy without an active search.

Review effort: Balanced
Findings: 2

Open (2)

• Empty state shows no-results copy when profile has no components · New
• Debounced key comparison reuses stale request after A→B→A switch · New

What changed in this PR

Improves Engine v2 cluster profile reliability, consistency, performance, and test coverage.

Changes:

• Preserves edits made during saves and prevents repeated redirects or stale modal state.
• Standardizes Operator copy, provider icons, focus outlines, route parameters, and empty states.
• Adds regression coverage and removes obsolete assets/exports.

File	Description
input-search.spec.tsx	Migrates interactions to userEvent.
self-managed-cluster-creation-flow.tsx	Prevents repeated installation redirects.
self-managed-cluster-creation-flow.spec.tsx	Tests single redirect behavior.
platform-configuration-utils.spec.ts	Adds utility coverage.
profile-operator-footer.tsx	Uses route parameters and updated UI copy.
profile-operator-footer.spec.tsx	Updates footer tests.
profile-configuration-field.tsx	Tracks modal dismissal through unmounting.
profile-array-item-modal.tsx	Adds unmount notification support.
cluster-profile.tsx	Updates previews, avatar, footer, and empty state.
cluster-profile.spec.tsx	Adds save, modal, preview, and copy regressions.
cluster-profile-sidebar.tsx	Replaces the layer asset and updates UI states.
cluster-profile-context.tsx	Preserves edits made during saves.
cluster-operator-status.tsx	Reads identifiers from route parameters.
cluster-operator-status.spec.tsx	Updates status tests for route parameters.
cluster-avatar.tsx	Maps additional provider icons.
cluster-avatar.spec.tsx	Tests provider icon mappings.
cluster-add.tsx	Standardizes Operator capitalization.
data-access/​src/​index.ts	Removes the internal HTTP helper export.
layer.svg	Removes the obsolete sidebar asset.

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

[cubic-dev-ai]

All reported issues were addressed across 19 files

<sub>Reply with feedback, questions, or to request a fix.

Re-trigger cubic</sub>

[codecov]

Codecov Report

❌ Patch coverage is 80.00000% with 6 lines in your changes missing coverage. Please review.
✅ Project coverage is 51.74%. Comparing base (a7ce69c) to head (4734090).

Files with missing lines	Patch %	Lines
...rc/lib/cluster-profile/cluster-profile-sidebar.tsx	60.00%	0 Missing and 2 partials ⚠️
...rc/lib/cluster-profile/profile-operator-footer.tsx	0.00%	1 Missing and 1 partial ⚠️
...luster-operator-status/cluster-operator-status.tsx	0.00%	1 Missing ⚠️
...eature/src/lib/cluster-profile/cluster-profile.tsx	80.00%	0 Missing and 1 partial ⚠️

Additional details and impacted files

@@                    Coverage Diff                     @@
##           feat/cluster-engine-v2    #3060      +/-   ##
==========================================================
+ Coverage                   51.60%   51.74%   +0.13%     
==========================================================
  Files                        1408     1329      -79     
  Lines                       31622    29608    -2014     
  Branches                     9371     8995     -376     
==========================================================
- Hits                        16320    15322     -998     
+ Misses                      12700    11838     -862     
+ Partials                     2602     2448     -154     

Flag	Coverage Δ
unittests	51.74% <80.00%> (+0.13%)	⬆️

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

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

🚀 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.

[cubic-dev-ai]

2 issues found across 6 files (changes from recent commits).

Confidence score: 4/5

• Re-selecting a component in cluster-profile.tsx within the 300 ms debounce can leave its preview stale instead of requesting the latest values. Restart or refresh the request on re-selection.
• cluster-profile.spec.tsx does not cover the A→B→A switch within the debounce window, so the stale-preview case can go undetected. Add a test for that sequence.

Prompt for AI agents (unresolved issues)

Check if these issues are valid — if so, understand the root cause of each and fix them. When an issue isn't valid or won't be fixed in this PR, reply in its thread with the reason and then resolve the thread. If appropriate, use sub-agents to investigate and fix each issue separately.


<file name="libs/domains/clusters/feature/src/lib/cluster-profile/cluster-profile.spec.tsx">

<violation number="1" location="libs/domains/clusters/feature/src/lib/cluster-profile/cluster-profile.spec.tsx:433">
P3: These tests only cover the two extreme debounce states (a mock that never settles and one that settles instantly), so the in-window case that motivated the fix — edit in A, switch A→B→A within the 300 ms debounce — is never exercised, as noted in the inline review on cluster-profile.tsx. Neither extreme mock can represent a pending debounce, so a regression in the A→B→A transition would pass both tests. Add a controllable debounce mock (one whose resolution the test triggers explicitly, or jest fake timers) and assert that returning to A before the debounce settles still fires the immediate request and reports the latest local edit once it does.</violation>
</file>

<file name="libs/domains/clusters/feature/src/lib/cluster-profile/cluster-profile.tsx">

<violation number="1" location="libs/domains/clusters/feature/src/lib/cluster-profile/cluster-profile.tsx:330">
P2: Re-selecting a component whose latest edit is still inside the 300 ms debounce keeps showing the stale preview and does not restart its request with the current values. The request payload for each component is now built from `debouncedEdits`, so re-entering component A after editing it and switching away (A→B→A within the window) leaves A's query keyed on the pre-edit payload; the fresh request is only emitted when the debounce timer fires, and until then the visible preview and Save gating stay on old data. The removed `settledPreviewRequests` comparison refreshed requests on the selection transition, so this is a regression for the exact A→B→A case called out in the PR discussion. Consider keeping the per-component request payload derived from the latest `edits` once the component is displayed (or restarting its query on selection) while letting the debounce only delay background refreshes for non-displayed components.</violation>
</file>

<sub>Tip: Review your code locally with the cubic CLI to iterate faster.

Re-trigger cubic</sub>

[cubic-dev-ai]

P2: Re-selecting a component whose latest edit is still inside the 300 ms debounce keeps showing the stale preview and does not restart its request with the current values. The request payload for each component is now built from debouncedEdits, so re-entering component A after editing it and switching away (A→B→A within the window) leaves A's query keyed on the pre-edit payload; the fresh request is only emitted when the debounce timer fires, and until then the visible preview and Save gating stay on old data. The removed settledPreviewRequests comparison refreshed requests on the selection transition, so this is a regression for the exact A→B→A case called out in the PR discussion. Consider keeping the per-component request payload derived from the latest edits once the component is displayed (or restarting its query on selection) while letting the debounce only delay background refreshes for non-displayed components.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. When an issue isn't valid or won't be fixed in this PR, reply in its thread with the reason and then resolve the thread. At libs/domains/clusters/feature/src/lib/cluster-profile/cluster-profile.tsx, line 330:

<comment>Re-selecting a component whose latest edit is still inside the 300 ms debounce keeps showing the stale preview and does not restart its request with the current values. The request payload for each component is now built from `debouncedEdits`, so re-entering component A after editing it and switching away (A→B→A within the window) leaves A's query keyed on the pre-edit payload; the fresh request is only emitted when the debounce timer fires, and until then the visible preview and Save gating stay on old data. The removed `settledPreviewRequests` comparison refreshed requests on the selection transition, so this is a regression for the exact A→B→A case called out in the PR discussion. Consider keeping the per-component request payload derived from the latest `edits` once the component is displayed (or restarting its query on selection) while letting the debounce only delay background refreshes for non-displayed components.</comment>

<file context>
@@ -326,30 +326,36 @@ function ClusterProfileView({
     [configuration?.clusterInputs, clusterInputs, resolvedComponents]
   )
+  const edits = useMemo(() => ({ profileValues, clusterInputs }), [clusterInputs, profileValues])
+  const debouncedEdits = useDebounce(edits, 300)
   const previewRequests = useMemo(
     () =>
</file context>

[cubic-dev-ai]

P3: These tests only cover the two extreme debounce states (a mock that never settles and one that settles instantly), so the in-window case that motivated the fix — edit in A, switch A→B→A within the 300 ms debounce — is never exercised, as noted in the inline review on cluster-profile.tsx. Neither extreme mock can represent a pending debounce, so a regression in the A→B→A transition would pass both tests. Add a controllable debounce mock (one whose resolution the test triggers explicitly, or jest fake timers) and assert that returning to A before the debounce settles still fires the immediate request and reports the latest local edit once it does.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. When an issue isn't valid or won't be fixed in this PR, reply in its thread with the reason and then resolve the thread. At libs/domains/clusters/feature/src/lib/cluster-profile/cluster-profile.spec.tsx, line 433:

<comment>These tests only cover the two extreme debounce states (a mock that never settles and one that settles instantly), so the in-window case that motivated the fix — edit in A, switch A→B→A within the 300 ms debounce — is never exercised, as noted in the inline review on cluster-profile.tsx. Neither extreme mock can represent a pending debounce, so a regression in the A→B→A transition would pass both tests. Add a controllable debounce mock (one whose resolution the test triggers explicitly, or jest fake timers) and assert that returning to A before the debounce settles still fires the immediate request and reports the latest local edit once it does.</comment>

<file context>
@@ -430,6 +430,48 @@ describe('ClusterProfileFeature', () => {
     expect(screen.queryByRole('status', { name: 'Loading configuration' })).not.toBeInTheDocument()
   })
 
+  describe('edits debounce across component switches', () => {
+    function ClusterProfileWithNavigation() {
+      const [componentKey, setComponentKey] = useState<string>()
</file context>