feat(blueprints): support for multiple versions and creation flow improvements

.gitignore

@@ -43,6 +43,7 @@ node_modules
 .settings/
 *.sublime-workspace
 .zed*
+.codex/environments
 
 # IDE - VSCode
 .vscode/*

apps/console/src/routes/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/blueprint/$provider/$serviceFamily/blueprint-setup.tsx

@@ -0,0 +1,21 @@
+import { createFileRoute } from '@tanstack/react-router'
+import { BlueprintManifestFieldsProvider, BlueprintSetupSection } from '@qovery/domains/services/feature'
+import { useDocumentTitle } from '@qovery/shared/util-hooks'
+
+export const Route = createFileRoute(
+  '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/blueprint/$provider/$serviceFamily/blueprint-setup'
+)({
+  component: RouteComponent,
+})
+
+function RouteComponent() {
+  const { serviceFamily } = Route.useParams()
+
+  useDocumentTitle(`${serviceFamily} setup`)
+
+  return (
+    <BlueprintManifestFieldsProvider>
+      <BlueprintSetupSection />
+    </BlueprintManifestFieldsProvider>
+  )
+}

apps/console/src/routes/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/blueprint/$provider/$serviceFamily/index.tsx

@@ -1,6 +1,4 @@
-import { createFileRoute } from '@tanstack/react-router'
-import { BlueprintConfigurationView } from '@qovery/domains/services/feature'
-import { useDocumentTitle } from '@qovery/shared/util-hooks'
+import { Navigate, createFileRoute } from '@tanstack/react-router'
 
 export const Route = createFileRoute(
   '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/blueprint/$provider/$serviceFamily/'
@@ -9,9 +7,13 @@ export const Route = createFileRoute(
 })
 
 function RouteComponent() {
-  const { serviceFamily } = Route.useParams()
+  const { organizationId, projectId, environmentId, provider, serviceFamily } = Route.useParams()
 
-  useDocumentTitle(`${serviceFamily} configuration`)
-
-  return <BlueprintConfigurationView />
+  return (
+    <Navigate
+      to="/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/blueprint/$provider/$serviceFamily/service-information"
+      params={{ organizationId, projectId, environmentId, provider, serviceFamily }}
+      replace
+    />
+  )
 }

apps/console/src/routes/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/blueprint/$provider/$serviceFamily/overrides.tsx

@@ -0,0 +1,24 @@
+import { createFileRoute } from '@tanstack/react-router'
+import {
+  BlueprintManifestFieldsProvider,
+  BlueprintOverridesConfigurationSection,
+} from '@qovery/domains/services/feature'
+import { useDocumentTitle } from '@qovery/shared/util-hooks'
+
+export const Route = createFileRoute(
+  '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/blueprint/$provider/$serviceFamily/overrides'
+)({
+  component: RouteComponent,
+})
+
+function RouteComponent() {
+  const { serviceFamily } = Route.useParams()
+
+  useDocumentTitle(`${serviceFamily} overrides`)
+
+  return (
+    <BlueprintManifestFieldsProvider>
+      <BlueprintOverridesConfigurationSection />
+    </BlueprintManifestFieldsProvider>
+  )
+}

apps/console/src/routes/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/blueprint/$provider/$serviceFamily/service-information.tsx

@@ -0,0 +1,17 @@
+import { createFileRoute } from '@tanstack/react-router'
+import { BlueprintServiceInformationSection } from '@qovery/domains/services/feature'
+import { useDocumentTitle } from '@qovery/shared/util-hooks'
+
+export const Route = createFileRoute(
+  '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/blueprint/$provider/$serviceFamily/service-information'
+)({
+  component: RouteComponent,
+})
+
+function RouteComponent() {
+  const { serviceFamily } = Route.useParams()
+
+  useDocumentTitle(`${serviceFamily} configuration`)
+
+  return <BlueprintServiceInformationSection />
+}

apps/console/src/routes/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/blueprint/$provider/$serviceFamily/summary.tsx

@@ -1,5 +1,5 @@
 import { createFileRoute } from '@tanstack/react-router'
-import { BlueprintStepSummary } from '@qovery/domains/services/feature'
+import { BlueprintManifestFieldsProvider, BlueprintStepSummary } from '@qovery/domains/services/feature'
 import { useDocumentTitle } from '@qovery/shared/util-hooks'
 
 export const Route = createFileRoute(
@@ -11,5 +11,9 @@ export const Route = createFileRoute(
 function RouteComponent() {
   useDocumentTitle('Summary - Create service from blueprint')
 
-  return <BlueprintStepSummary />
+  return (
+    <BlueprintManifestFieldsProvider>
+      <BlueprintStepSummary />
+    </BlueprintManifestFieldsProvider>
+  )
 }

libs/domains/services/data-access/src/lib/domains-services-data-access.ts

@@ -302,6 +302,13 @@ export const services = createQueryKeys('services', {
       return response.data.results
     },
   }),
+  blueprintUpdate: ({ blueprintId }: { blueprintId: string }) => ({
+    queryKey: [blueprintId],
+    async queryFn() {
+      const response = await blueprintApi.checkBlueprintUpdate(blueprintId)
+      return response.data
+    },
+  }),
   deploymentStatus: (environmentId: string, serviceId: string) => ({
     queryKey: [environmentId, serviceId],
     // NOTE: Value is set by WebSocket

libs/domains/services/feature/src/index.ts

@@ -33,6 +33,7 @@ export * from './lib/hooks/use-argocd-manifest/use-argocd-manifest'
 export * from './lib/hooks/use-blueprint-catalog/use-blueprint-catalog'
 export * from './lib/hooks/use-blueprint-catalog-service-readme/use-blueprint-catalog-service-readme'
 export * from './lib/hooks/use-blueprint-catalog-service-manifest/use-blueprint-catalog-service-manifest'
+export * from './lib/hooks/use-blueprint-update/use-blueprint-update'
 export * from './lib/hooks/use-blueprint-service-created-socket/use-blueprint-service-created-socket'
 export * from './lib/blueprint-query-boundary/blueprint-query-boundary'
 export * from './lib/hooks/use-service-deployment-and-running-statuses/use-service-deployment-and-running-statuses'

libs/domains/services/feature/src/lib/hooks/use-blueprint-catalog-service-manifest/use-blueprint-catalog-service-manifest.ts

@@ -1,4 +1,5 @@
-import { useQuery } from '@tanstack/react-query'
+import { useQuery, useQueryClient } from '@tanstack/react-query'
+import { useCallback } from 'react'
 import { queries } from '@qovery/state/util-queries'
 
 export interface UseBlueprintCatalogServiceManifestProps {
@@ -39,4 +40,30 @@ export function useBlueprintCatalogServiceManifest({
   })
 }
 
+export function usePrefetchBlueprintCatalogServiceManifest({
+  organizationId,
+  provider,
+  serviceFamily,
+  serviceVersion,
+  environmentId = '',
+}: UseBlueprintCatalogServiceManifestProps) {
+  const queryClient = useQueryClient()
+
+  return useCallback(async () => {
+    if (!organizationId || !provider || !serviceFamily || !serviceVersion || !environmentId) {
+      return
+    }
+
+    await queryClient.prefetchQuery(
+      queries.services.blueprintCatalogServiceManifest({
+        organizationId,
+        provider,
+        serviceFamily,
+        serviceVersion,
+        environmentId,
+      })
+    )
+  }, [environmentId, organizationId, provider, queryClient, serviceFamily, serviceVersion])
+}
+
 export default useBlueprintCatalogServiceManifest

libs/domains/services/feature/src/lib/hooks/use-blueprint-update/use-blueprint-update.ts

@@ -0,0 +1,18 @@
+import { useQuery } from '@tanstack/react-query'
+import { queries } from '@qovery/state/util-queries'
+
+export interface UseBlueprintUpdateProps {
+  blueprintId: string
+  enabled?: boolean
+  suspense?: boolean
+}
+
+export function useBlueprintUpdate({ blueprintId, enabled = true, suspense = false }: UseBlueprintUpdateProps) {
+  return useQuery({
+    ...queries.services.blueprintUpdate({ blueprintId }),
+    enabled,
+    suspense,
+  })
+}
+
+export default useBlueprintUpdate