feat(blueprints): blueprint update flow

apps/console/src/routes/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/$serviceId/update/blueprint/index.tsx

@@ -0,0 +1,24 @@
+import { createFileRoute, useNavigate } from '@tanstack/react-router'
+import { BlueprintUpdateReviewStep } from '@qovery/domains/services/feature'
+
+export const Route = createFileRoute(
+  '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/$serviceId/update/blueprint/'
+)({
+  component: RouteComponent,
+})
+
+function RouteComponent() {
+  const { organizationId, projectId, environmentId, serviceId } = Route.useParams()
+  const navigate = useNavigate()
+
+  return (
+    <BlueprintUpdateReviewStep
+      onContinue={() => {
+        navigate({
+          to: '/organization/$organizationId/project/$projectId/environment/$environmentId/service/$serviceId/update/blueprint/preview',
+          params: { organizationId, projectId, environmentId, serviceId },
+        })
+      }}
+    />
+  )
+}

apps/console/src/routes/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/$serviceId/update/blueprint/preview.tsx

@@ -0,0 +1,24 @@
+import { createFileRoute, useNavigate } from '@tanstack/react-router'
+import { BlueprintUpdatePreviewStep } from '@qovery/domains/services/feature'
+
+export const Route = createFileRoute(
+  '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/$serviceId/update/blueprint/preview'
+)({
+  component: RouteComponent,
+})
+
+function RouteComponent() {
+  const { organizationId, projectId, environmentId, serviceId } = Route.useParams()
+  const navigate = useNavigate()
+
+  return (
+    <BlueprintUpdatePreviewStep
+      onBack={() => {
+        navigate({
+          to: '/organization/$organizationId/project/$projectId/environment/$environmentId/service/$serviceId/update/blueprint',
+          params: { organizationId, projectId, environmentId, serviceId },
+        })
+      }}
+    />
+  )
+}

apps/console/src/routes/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/$serviceId/update/blueprint/route.tsx

@@ -0,0 +1,45 @@
+import { Outlet, createFileRoute, useLocation, useNavigate } from '@tanstack/react-router'
+import { useCallback, useEffect } from 'react'
+import { useEnvironment } from '@qovery/domains/environments/feature'
+import { BlueprintUpdateFlow, useService } from '@qovery/domains/services/feature'
+
+export const Route = createFileRoute(
+  '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/$serviceId/update/blueprint'
+)({
+  component: RouteComponent,
+})
+
+function RouteComponent() {
+  const { organizationId, projectId, environmentId, serviceId } = Route.useParams()
+  const { pathname } = useLocation()
+  const navigate = useNavigate()
+  const { data: environment } = useEnvironment({ environmentId, suspense: true })
+  const { data: service } = useService({ environmentId, serviceId, suspense: true })
+  const blueprintId = service && 'blueprint_id' in service ? service.blueprint_id : undefined
+  const currentStep = pathname.endsWith('/preview') ? 2 : 1
+  const navigateToOverview = useCallback(() => {
+    navigate({
+      to: '/organization/$organizationId/project/$projectId/environment/$environmentId/service/$serviceId/overview',
+      params: { organizationId, projectId, environmentId, serviceId },
+    })
+  }, [environmentId, navigate, organizationId, projectId, serviceId])
+
+  useEffect(() => {
+    if (service && !blueprintId) navigateToOverview()
+  }, [blueprintId, navigateToOverview, service])
+
+  if (!service || !blueprintId) return null
+
+  return (
+    <BlueprintUpdateFlow
+      blueprintId={blueprintId}
+      clusterId={environment?.cluster_id}
+      currentStep={currentStep}
+      environmentId={environmentId}
+      service={service}
+      onExit={navigateToOverview}
+    >
+      <Outlet />
+    </BlueprintUpdateFlow>
+  )
+}

apps/console/src/routes/_authenticated/organization/$organizationId/route.tsx

@@ -56,6 +56,7 @@ const hiddenProgressCardRouteIds: FileRouteTypes['id'][] = [
   '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/helm',
   '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/lifecycle-job',
   '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/terraform',
+  '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/$serviceId/update/blueprint',
 ]
 
 function RouteComponent() {

apps/console/src/routes/_authenticated/organization/route.tsx

@@ -493,6 +493,7 @@ const bypassLayoutRouteIds: FileRouteTypes['id'][] = [
   '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/terraform',
   '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/lifecycle-job',
   '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/create/cron-job',
+  '/_authenticated/organization/$organizationId/project/$projectId/environment/$environmentId/service/$serviceId/update/blueprint',
 ]
 
 function useBypassLayout(): boolean {

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

@@ -16,6 +16,7 @@ import {
   BlueprintCatalogApi,
   type BlueprintCreateRequest,
   BlueprintMainCallsApi,
+  type BlueprintUpdateRequest,
   type CleanFailedJobsRequest,
   ContainerActionsApi,
   type ContainerAdvancedSettings,
@@ -769,6 +770,16 @@ type CreateBlueprintRequest = {
   deploy?: boolean
 }
 
+type PreviewBlueprintUpdateRequest = {
+  blueprintId: string
+  payload: BlueprintUpdateRequest
+}
+
+type UpdateBlueprintRequest = {
+  blueprintId: string
+  payload: BlueprintUpdateRequest
+}
+
 type EditServiceRequest = {
   serviceId: string
   payload:
@@ -1042,6 +1053,14 @@ export const mutations = {
     const response = await blueprintApi.createBlueprint(environmentId, payload, deploy)
     return response.data
   },
+  async previewBlueprintUpdate({ blueprintId, payload }: PreviewBlueprintUpdateRequest) {
+    const response = await blueprintApi.previewBlueprintUpdate(blueprintId, payload)
+    return response.data
+  },
+  async updateBlueprint({ blueprintId, payload }: UpdateBlueprintRequest) {
+    const response = await blueprintApi.updateBlueprint(blueprintId, payload)
+    return response.data
+  },
   async editService({ serviceId, payload }: EditServiceRequest) {
     const { mutation } = match(payload)
       .with({ serviceType: 'APPLICATION' }, ({ serviceType, ...payload }) => ({

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

@@ -34,6 +34,9 @@ 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-update-preview-socket/use-blueprint-update-preview-socket'
+export * from './lib/hooks/use-preview-blueprint-update/use-preview-blueprint-update'
+export * from './lib/hooks/use-update-blueprint/use-update-blueprint'
 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'
@@ -102,6 +105,7 @@ export * from './lib/service-creation-flow/database/step-resources/step-resource
 export * from './lib/service-creation-flow/database/database-summary-view/database-summary-view'
 export * from './lib/service-creation-flow/database/step-summary/step-summary'
 export * from './lib/service-creation-flow/blueprint/blueprint-creation-flow'
+export * from './lib/service-update-flow/blueprint/blueprint-update-flow'
 export * from './lib/application-container-healthchecks/application-container-healthchecks-form/application-container-healthchecks-form'
 export * from './lib/application-container-healthchecks/healthchecks-utils'
 export * from './lib/application-container-healthchecks/step-healthchecks/step-healthchecks'