fix: batched v2 http api fetch & fix deployment update

web/crux-ui/src/components/deployments/edit-deployment-card.tsx

@@ -55,7 +55,9 @@ const EditDeploymentCard = (props: EditDeploymentCardProps) => {
     t,
     onSubmit: async (values, { setFieldError }) => {
       const body: UpdateDeployment = {
-        ...values,
+        note: values.note,
+        prefix: values.prefix,
+        protected: values.protected,
         configBundles: values.configBundles.map(it => it.id),
       }
 

web/crux-ui/src/components/projects/versions/use-version-state.ts

@@ -104,6 +104,7 @@ export interface VersionStateOptions {
   projectId: string
   version: VersionDetails
   initialSection: VersionSectionsState
+  fetchTagInfo?: boolean
   setSaveState?: (saveState: WebSocketSaveState) => void
 }
 
@@ -180,11 +181,18 @@ export const useVersionState = (options: VersionStateOptions): [VerionState, Ver
   const editor = useEditorState(versionSock)
 
   const registriesSock = useWebSocket(routes.registry.socket(), {
-    onOpen: () =>
+    onOpen: () => {
+      // TODO(@robot9706): Not sure why we fetch all the tags here,
+      // it is super slow with our 8+ images / version, where each image has 200+ tags, so disable it
+      if (options.fetchTagInfo === false) {
+        return
+      }
+
       refreshImageTags(
         registriesSock,
         version.images.filter(it => it.registry.type !== 'unchecked'),
-      ),
+      )
+    },
   })
 
   registriesSock.on(WS_TYPE_REGISTRY_IMAGE_TAGS, (message: RegistryImageTagsMessage) => {

web/crux-ui/src/components/projects/versions/versionless-project-sections.tsx

@@ -20,6 +20,7 @@ const VersionlessProjectSections = (props: VersionlessProjectSectionsProps) => {
     version,
     projectId: project.id,
     initialSection,
+    fetchTagInfo: false,
     setSaveState,
   })
 

web/crux-ui/src/pages/[teamSlug]/projects/[projectId]/versions/[versionId].tsx

@@ -43,6 +43,7 @@ const VersionDetailsPage = (props: VersionDetailsPageProps) => {
     initialSection,
     projectId: project.id,
     version,
+    fetchTagInfo: false,
   })
 
   const onVersionEdited = async (newVersion: EditableVersion) => {

web/crux/src/app/registry/registry-clients/registry-api-client.ts

@@ -1,5 +1,7 @@
 import { RegistryImageTag, RegistryImageTags } from '../registry.message'
 
+const TAG_INFO_BATCH_SIZE = 5
+
 export interface RegistryApiClient {
   catalog(text: string): Promise<string[]>
   tags(image: string): Promise<RegistryImageTags>
@@ -12,20 +14,26 @@ export const fetchInfoForTags = async (
   tags: string[],
   client: RegistryApiClient,
 ): Promise<Record<string, RegistryImageTag>> => {
-  const tagsWithInfoPromise = tags.map(async it => {
-    const info = await client.tagInfo(image, it)
+  const map: Record<string, RegistryImageTag> = {}
+
+  for (let batch = 0; batch < Math.ceil(tags.length / TAG_INFO_BATCH_SIZE); batch++) {
+    const start = batch * TAG_INFO_BATCH_SIZE
+    const end = Math.min(tags.length, start + TAG_INFO_BATCH_SIZE)
+    const promises = tags.slice(start, end).map(async it => {
+      const info = await client.tagInfo(image, it)
 
-    return {
-      tag: it,
-      info,
-    }
-  })
+      return {
+        tag: it,
+        info,
+      }
+    })
 
-  return (await Promise.all(tagsWithInfoPromise)).reduce(
-    (map, it) => {
+    // eslint-disable-next-line no-await-in-loop
+    const results = await Promise.all(promises)
+    results.forEach(it => {
       map[it.tag] = it.info
-      return map
-    },
-    {} as Record<string, RegistryImageTag>,
-  )
+    })
+  }
+
+  return map
 }