feat(blueprints): creation flow improvements

[rmnbrd]

Summary

Blueprint-based service creation flow improvements

This PR introduces several improvements to the blueprint-based service creation flow, including:

• The addition of the missing icons in the list of blueprints
• An improved loading state when submitting the creation flow's form and while waiting for the service to be created.

Screenshots / Recordings

Before

https://www.loom.com/share/48f54a26f33e4f83b7e5f8ac18fea4b0

After

https://www.loom.com/share/66e6affaccb341c39f84175114b8a4e8

Testing

• Changes tested locally in the relevant Console's pages and Storybooks
• yarn test or yarn test -u (if you need to regenerate snapshots)
• yarn format
• yarn lint

PR Checklist

• I followed naming, styling, and TypeScript rules (see .cursor/rules)
• I performed a self-review (diff inspected, dead code removed)
• I titled the PR using Conventional Commits with a scope when possible (e.g. feat(service): add new Terraform service) - required for semantic-release
• I only kept necessary comments, written in English (watch for useless AI comments)
• I involved a designer to validate UI changes if I am not a designer
• I covered new business logic with tests (unit)
• I confirmed CI is green (Codecov red can be accepted)
• I reviewed and executed locally any AI-assisted code

[codecov]

Codecov Report

❌ Patch coverage is 76.92308% with 18 lines in your changes missing coverage. Please review.
✅ Project coverage is 48.93%. Comparing base (f19889e) to head (f4e5828).

Files with missing lines	Patch %	Lines
.../blueprint-step-summary/blueprint-step-summary.tsx	76.19%	10 Missing and 5 partials ⚠️
...ted-socket/use-blueprint-service-created-socket.ts	77.77%	1 Missing and 1 partial ⚠️
...ws-subscription/use-react-query-ws-subscription.ts	83.33%	0 Missing and 1 partial ⚠️

Additional details and impacted files

@@             Coverage Diff             @@
##           staging    #2787      +/-   ##
===========================================
+ Coverage    48.09%   48.93%   +0.84%     
===========================================
  Files         1243      861     -382     
  Lines        26222    21029    -5193     
  Branches      7737     6317    -1420     
===========================================
- Hits         12612    10291    -2321     
+ Misses       11421     8949    -2472     
+ Partials      2189     1789     -400     

Flag	Coverage Δ
unittests	48.93% <76.92%> (+0.84%)	⬆️

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.

[nx-cloud]

View your CI Pipeline Execution ↗ for commit e310b0f

---

☁️ Nx Cloud last updated this comment at 2026-06-30 15:55:40 UTC

[nx-cloud]

View your CI Pipeline Execution ↗ for commit e310b0f

---

☁️ Nx Cloud last updated this comment at 2026-06-30 15:55:40 UTC

[Copilot]

Pull request overview

This PR improves the blueprint-based service creation UX by ensuring blueprint icons are resolved through the Console’s icon registry and by keeping the creation flow in a “waiting” state until the backend confirms the service is created via WebSocket.

Changes:

• Add onInvalidateOperation support to the generic React Query WebSocket subscription hook, plus dependency/URL param stability improvements.
• Resolve blueprint icons via getServiceIcon so app://qovery-console/* URIs render correctly in the list and details panel (with updated specs).
• Introduce a blueprint “service-created” WebSocket hook and update the creation flow summary step to wait for the service-created event before navigating.

Reviewed changes

Copilot reviewed 12 out of 12 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
libs/state/util-queries/src/lib/use-react-query-ws-subscription/use-react-query-ws-subscription.ts	Adds invalidate-operation callback support and improves reconnection/deps behavior.
libs/state/util-queries/src/lib/use-react-query-ws-subscription/use-react-query-ws-subscription.spec.tsx	Extends tests to cover the new invalidate-operation callback.
libs/domains/services/feature/src/lib/service-new/service-new.spec.tsx	Updates blueprint icon expectations to match app:// icon resolution.
libs/domains/services/feature/src/lib/service-new/blueprint-card/blueprint-card.tsx	Switches blueprint card rendering to use getServiceIcon and merge icon-specific classes.
libs/domains/services/feature/src/lib/service-icon/service-icon.tsx	Adds getServiceIcon helper for resolving known icon URIs (with a noted hardening change needed).
libs/domains/services/feature/src/lib/service-creation-flow/blueprint/blueprint-step-summary/blueprint-step-summary.tsx	Keeps the UI loading while awaiting the service-created event, then navigates on confirmation.
libs/domains/services/feature/src/lib/service-creation-flow/blueprint/blueprint-creation-flow.spec.tsx	Adds coverage to ensure the flow waits for the service-created event before navigation.
libs/domains/services/feature/src/lib/hooks/use-blueprint-service-created-socket/use-blueprint-service-created-socket.ts	New hook subscribing to /blueprint/service-created and invalidating the environment services list.
libs/domains/services/feature/src/lib/hooks/use-blueprint-service-created-socket/use-blueprint-service-created-socket.spec.tsx	Unit tests for subscription config and invalidation behavior.
libs/domains/services/feature/src/lib/blueprint-details-panel/blueprint-details-panel.tsx	Uses getServiceIcon to render consistent icons in the details panel header.
libs/domains/services/feature/src/lib/blueprint-details-panel/blueprint-details-panel.spec.tsx	Updates icon assertion for details panel.
libs/domains/services/feature/src/index.ts	Exports the new useBlueprintServiceCreatedSocket hook from the package entrypoint.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[RemiBonnet]

Thanks Romain, I added few comments!

[RemiBonnet]

Thanks, LGTM 👍

Tiny optional follow-up: could we add a fallback timeout after the create mutation succeeds, just in case the websocket event never arrives? Not blocking from my side, but it would avoid leaving the user stuck in loading if the event is missed or the socket fails

[RemiBonnet]

🎉 This PR is included in version 1.326.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀