Update locales [skip ci]

.github/workflows/test-ui.yaml

@@ -46,8 +46,8 @@ jobs:
         id: cache-key
         run: echo "key=$(date +%s)" >> $GITHUB_OUTPUT
 
-      - name: Save cache
-        uses: actions/cache/save@5a3ec84eff668545956fd18022155c47e93e2684
+      - name: Cache setup
+        uses: actions/cache@v3
         with:
           path: |
             ComfyUI
@@ -62,13 +62,9 @@ jobs:
       matrix:
         browser: [chromium, chromium-2x, mobile-chrome]
     steps:
-      - name: Wait for cache propagation
-        run: sleep 10
-
       - name: Restore cached setup
-        uses: actions/cache/restore@5a3ec84eff668545956fd18022155c47e93e2684
+        uses: actions/cache@v3
         with:
-          fail-on-cache-miss: true
           path: |
             ComfyUI
             ComfyUI_frontend

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@comfyorg/comfyui-frontend",
-  "version": "1.23.3",
+  "version": "1.22.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@comfyorg/comfyui-frontend",
-      "version": "1.23.3",
+      "version": "1.22.2",
       "license": "GPL-3.0-only",
       "dependencies": {
         "@alloc/quick-lru": "^5.2.0",

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@comfyorg/comfyui-frontend",
   "private": true,
-  "version": "1.23.3",
+  "version": "1.22.2",
   "type": "module",
   "repository": "https://github.com/Comfy-Org/ComfyUI_frontend",
   "homepage": "https://comfy.org",

src/components/common/ContentDivider.vue

@@ -1,12 +1,15 @@
 <template>
-  <div
+  <hr
     :class="{
-      'content-divider': true,
-      'content-divider--horizontal': orientation === 'horizontal',
-      'content-divider--vertical': orientation === 'vertical'
+      'm-0': true,
+      'border-t': orientation === 'horizontal',
+      'border-l': orientation === 'vertical',
+      'h-full': orientation === 'vertical',
+      'w-full': orientation === 'horizontal'
     }"
     :style="{
-      backgroundColor: isLightTheme ? '#DCDAE1' : '#2C2C2C'
+      borderColor: isLightTheme ? '#DCDAE1' : '#2C2C2C',
+      borderWidth: `${width}px !important`
     }"
   />
 </template>
@@ -26,25 +29,3 @@ const isLightTheme = computed(
   () => colorPaletteStore.completedActivePalette.light_theme
 )
 </script>
-
-<style scoped>
-.content-divider {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  border: none;
-  flex-shrink: 0;
-  position: relative;
-  z-index: 1;
-}
-
-.content-divider--horizontal {
-  width: 100%;
-  height: v-bind('width + "px"');
-}
-
-.content-divider--vertical {
-  height: 100%;
-  width: v-bind('width + "px"');
-}
-</style>

src/components/common/VirtualGrid.vue

@@ -92,21 +92,12 @@ whenever(
 const updateItemSize = () => {
   if (container.value) {
     const firstItem = container.value.querySelector('[data-virtual-grid-item]')
-
-    // Don't update item size if the first item is not rendered yet
-    if (!firstItem?.clientHeight || !firstItem?.clientWidth) return
-
-    if (itemHeight.value !== firstItem.clientHeight) {
-      itemHeight.value = firstItem.clientHeight
-    }
-    if (itemWidth.value !== firstItem.clientWidth) {
-      itemWidth.value = firstItem.clientWidth
-    }
+    itemHeight.value = firstItem?.clientHeight || defaultItemHeight
+    itemWidth.value = firstItem?.clientWidth || defaultItemWidth
   }
 }
 const onResize = debounce(updateItemSize, resizeDebounce)
 watch([width, height], onResize, { flush: 'post' })
-whenever(() => items, updateItemSize, { flush: 'post' })
 onBeforeUnmount(() => {
   onResize.cancel() // Clear pending debounced calls
 })

src/components/dialog/GlobalDialog.vue

@@ -50,17 +50,4 @@ const dialogStore = useDialogStore()
   @apply p-2 2xl:p-[var(--p-dialog-content-padding)];
   @apply pt-0;
 }
-
-.manager-dialog {
-  height: 80vh;
-  max-width: 1724px;
-  max-height: 1026px;
-}
-
-@media (min-width: 3000px) {
-  .manager-dialog {
-    max-width: 2200px;
-    max-height: 1320px;
-  }
-}
 </style>

src/components/dialog/content/LoadWorkflowWarning.vue

@@ -5,7 +5,6 @@
     title="Missing Node Types"
     message="When loading the graph, the following node types were not found"
   />
-  <MissingCoreNodesMessage :missing-core-nodes="missingCoreNodes" />
   <ListBox
     :options="uniqueNodes"
     option-label="label"
@@ -32,12 +31,6 @@
     </template>
   </ListBox>
   <div v-if="isManagerInstalled" class="flex justify-end py-3">
-    <PackInstallButton
-      :disabled="isLoading || !!error || missingNodePacks.length === 0"
-      :node-packs="missingNodePacks"
-      variant="black"
-      :label="$t('manager.installAllMissingNodes')"
-    />
     <Button label="Open Manager" size="small" outlined @click="openManager" />
   </div>
 </template>
@@ -48,9 +41,6 @@ import ListBox from 'primevue/listbox'
 import { computed } from 'vue'
 
 import NoResultsPlaceholder from '@/components/common/NoResultsPlaceholder.vue'
-import MissingCoreNodesMessage from '@/components/dialog/content/MissingCoreNodesMessage.vue'
-import PackInstallButton from '@/components/dialog/content/manager/button/PackInstallButton.vue'
-import { useMissingNodes } from '@/composables/nodePack/useMissingNodes'
 import { useDialogService } from '@/services/dialogService'
 import { useAboutPanelStore } from '@/stores/aboutPanelStore'
 import type { MissingNodeType } from '@/types/comfy'
@@ -62,10 +52,6 @@ const props = defineProps<{
 
 const aboutPanelStore = useAboutPanelStore()
 
-// Get missing node packs from workflow with loading and error states
-const { missingNodePacks, isLoading, error, missingCoreNodes } =
-  useMissingNodes()
-
 // Determines if ComfyUI-Manager is installed by checking for its badge in the about panel
 // This allows us to conditionally show the Manager button only when the extension is available
 // TODO: Remove this check when Manager functionality is fully migrated into core

src/components/dialog/content/MissingCoreNodesMessage.vue

@@ -1,95 +0,0 @@
-<template>
-  <Message
-    v-if="hasMissingCoreNodes"
-    severity="info"
-    icon="pi pi-info-circle"
-    class="my-2 mx-2"
-    :pt="{
-      root: { class: 'flex-col' },
-      text: { class: 'flex-1' }
-    }"
-  >
-    <div class="flex flex-col gap-2">
-      <div>
-        {{
-          currentComfyUIVersion
-            ? $t('loadWorkflowWarning.outdatedVersion', {
-                version: currentComfyUIVersion
-              })
-            : $t('loadWorkflowWarning.outdatedVersionGeneric')
-        }}
-      </div>
-      <div
-        v-for="[version, nodes] in sortedMissingCoreNodes"
-        :key="version"
-        class="ml-4"
-      >
-        <div
-          class="text-sm font-medium text-surface-600 dark-theme:text-surface-400"
-        >
-          {{
-            $t('loadWorkflowWarning.coreNodesFromVersion', {
-              version: version || 'unknown'
-            })
-          }}
-        </div>
-        <div class="ml-4 text-sm text-surface-500 dark-theme:text-surface-500">
-          {{ getUniqueNodeNames(nodes).join(', ') }}
-        </div>
-      </div>
-    </div>
-  </Message>
-</template>
-
-<script setup lang="ts">
-import type { LGraphNode } from '@comfyorg/litegraph'
-import { whenever } from '@vueuse/core'
-import Message from 'primevue/message'
-import { computed, ref } from 'vue'
-
-import { useSystemStatsStore } from '@/stores/systemStatsStore'
-import { compareVersions } from '@/utils/formatUtil'
-
-const props = defineProps<{
-  missingCoreNodes: Record<string, LGraphNode[]>
-}>()
-
-const systemStatsStore = useSystemStatsStore()
-
-const hasMissingCoreNodes = computed(() => {
-  return Object.keys(props.missingCoreNodes).length > 0
-})
-
-const currentComfyUIVersion = ref<string | null>(null)
-whenever(
-  hasMissingCoreNodes,
-  async () => {
-    if (!systemStatsStore.systemStats) {
-      await systemStatsStore.fetchSystemStats()
-    }
-    currentComfyUIVersion.value =
-      systemStatsStore.systemStats?.system?.comfyui_version ?? null
-  },
-  {
-    immediate: true
-  }
-)
-
-const sortedMissingCoreNodes = computed(() => {
-  return Object.entries(props.missingCoreNodes).sort(([a], [b]) => {
-    // Sort by version in descending order (newest first)
-    return compareVersions(b, a) // Reversed for descending order
-  })
-})
-
-const getUniqueNodeNames = (nodes: LGraphNode[]): string[] => {
-  return nodes
-    .reduce<string[]>((acc, node) => {
-      if (node.type && !acc.includes(node.type)) {
-        acc.push(node.type)
-      }
-      return acc
-    }, [])
-    .sort()
-}
-</script>

src/components/dialog/content/manager/ManagerDialogContent.vue

@@ -1,16 +1,14 @@
 <template>
   <div
-    class="h-full flex flex-col mx-auto overflow-hidden"
+    class="flex flex-col mx-auto overflow-hidden h-[83vh] relative"
     :aria-label="$t('manager.title')"
   >
-    <ContentDivider :width="0.3" />
     <Button
       v-if="isSmallScreen"
       :icon="isSideNavOpen ? 'pi pi-chevron-left' : 'pi pi-chevron-right'"
-      severity="secondary"
-      filled
+      text
       class="absolute top-1/2 -translate-y-1/2 z-10"
-      :class="isSideNavOpen ? 'left-[12rem]' : 'left-2'"
+      :class="isSideNavOpen ? 'left-[19rem]' : 'left-2'"
       @click="toggleSideNav"
     />
     <div class="flex flex-1 relative overflow-hidden">
@@ -20,20 +18,20 @@
         :tabs="tabs"
       />
       <div
-        class="flex-1 overflow-auto bg-gray-50 dark-theme:bg-neutral-900"
+        class="flex-1 overflow-auto pr-80"
         :class="{
-          'transition-all duration-300': isSmallScreen
+          'transition-all duration-300': isSmallScreen,
+          'pl-80': isSideNavOpen || !isSmallScreen,
+          'pl-8': !isSideNavOpen && isSmallScreen
         }"
       >
-        <div class="px-6 flex flex-col h-full">
+        <div class="px-6 pt-6 flex flex-col h-full">
           <RegistrySearchBar
             v-model:searchQuery="searchQuery"
             v-model:searchMode="searchMode"
             v-model:sortField="sortField"
             :search-results="searchResults"
             :suggestions="suggestions"
-            :is-missing-tab="isMissingTab"
-            :sort-options="sortOptions"
           />
           <div class="flex-1 overflow-auto">
             <div
@@ -59,7 +57,7 @@
               <VirtualGrid
                 id="results-grid"
                 :items="resultsWithKeys"
-                :buffer-rows="4"
+                :buffer-rows="3"
                 :grid-style="GRID_STYLE"
                 @approach-end="onApproachEnd"
               >
@@ -77,9 +75,9 @@
           </div>
         </div>
       </div>
-      <div class="w-[clamp(250px,33%,306px)] border-l-0 flex z-20">
+      <div class="w-80 border-l-0 absolute right-0 top-0 bottom-0 flex z-20">
         <ContentDivider orientation="vertical" :width="0.2" />
-        <div class="w-full flex flex-col isolate">
+        <div class="flex-1 flex flex-col isolate">
           <InfoPanel
             v-if="!hasMultipleSelections && selectedNodePack"
             :node-pack="selectedNodePack"
@@ -181,8 +179,7 @@ const {
   searchResults,
   searchMode,
   sortField,
-  suggestions,
-  sortOptions
+  suggestions
 } = useRegistrySearch({
   initialSortField: initialState.sortField,
   initialSearchMode: initialState.searchMode,
@@ -219,6 +216,10 @@ const {
 const filterMissingPacks = (packs: components['schemas']['Node'][]) =>
   packs.filter((pack) => !comfyManagerStore.isPackInstalled(pack.id))
 
+whenever(selectedTab, () => {
+  pageNumber.value = 0
+})
+
 const isUpdateAvailableTab = computed(
   () => selectedTab.value?.id === ManagerTab.UpdateAvailable
 )
@@ -464,10 +465,9 @@ let gridContainer: HTMLElement | null = null
 onMounted(() => {
   gridContainer = document.getElementById('results-grid')
 })
-watch([searchQuery, selectedTab], () => {
+watch(searchQuery, () => {
   gridContainer ??= document.getElementById('results-grid')
   if (gridContainer) {
-    pageNumber.value = 0
     gridContainer.scrollTop = 0
   }
 })

src/components/dialog/content/manager/ManagerHeader.vue

@@ -1,9 +1,14 @@
 <template>
   <div class="w-full">
-    <div class="flex items-center">
+    <div class="px-6 py-4">
       <h2 class="text-lg font-normal text-left">
         {{ $t('manager.discoverCommunityContent') }}
       </h2>
     </div>
+    <ContentDivider :width="0.3" />
   </div>
 </template>
+
+<script setup lang="ts">
+import ContentDivider from '@/components/common/ContentDivider.vue'
+</script>

src/components/dialog/content/manager/ManagerNavSidebar.vue

@@ -1,8 +1,8 @@
 <template>
   <aside
-    class="flex translate-x-0 max-w-[250px] w-3/12 z-5 transition-transform duration-300 ease-in-out"
+    class="absolute translate-x-0 top-0 left-0 h-full w-80 shadow-md z-5 transition-transform duration-300 ease-in-out flex"
   >
-    <ScrollPanel class="flex-1">
+    <ScrollPanel class="w-80 mt-7">
       <Listbox
         v-model="selectedTab"
         :options="tabs"
@@ -10,20 +10,20 @@
         list-style="max-height:unset"
         class="w-full border-0 bg-transparent shadow-none"
         :pt="{
-          list: { class: 'p-3 gap-2' },
-          option: { class: 'px-4 py-2 text-lg rounded-lg' },
+          list: { class: 'p-5' },
+          option: { class: 'px-8 py-3 text-lg rounded-xl' },
           optionGroup: { class: 'p-0 text-left text-inherit' }
         }"
       >
         <template #option="slotProps">
           <div class="text-left flex items-center">
-            <i :class="['pi', slotProps.option.icon, 'text-sm mr-2']" />
-            <span class="text-sm">{{ slotProps.option.label }}</span>
+            <i :class="['pi', slotProps.option.icon, 'mr-3']" />
+            <span class="text-lg">{{ slotProps.option.label }}</span>
           </div>
         </template>
       </Listbox>
     </ScrollPanel>
-    <ContentDivider orientation="vertical" :width="0.3" />
+    <ContentDivider orientation="vertical" />
   </aside>
 </template>
 

src/components/dialog/content/manager/PackVersionBadge.test.ts

@@ -1,5 +1,6 @@
 import { VueWrapper, mount } from '@vue/test-utils'
 import { createPinia } from 'pinia'
+import Button from 'primevue/button'
 import PrimeVue from 'primevue/config'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { nextTick } from 'vue'
@@ -32,12 +33,6 @@ vi.mock('@/stores/comfyManagerStore', () => ({
   }))
 }))
 
-vi.mock('@/composables/nodePack/usePackUpdateStatus', () => ({
-  usePackUpdateStatus: vi.fn(() => ({
-    isUpdateAvailable: false
-  }))
-}))
-
 const mockToggle = vi.fn()
 const mockHide = vi.fn()
 const PopoverStub = {
@@ -83,9 +78,9 @@ describe('PackVersionBadge', () => {
   it('renders with installed version from store', () => {
     const wrapper = mountComponent()
 
-    const badge = wrapper.find('[role="button"]')
-    expect(badge.exists()).toBe(true)
-    expect(badge.find('span').text()).toBe('1.5.0') // From mockInstalledPacks
+    const button = wrapper.findComponent(Button)
+    expect(button.exists()).toBe(true)
+    expect(button.props('label')).toBe('1.5.0') // From mockInstalledPacks
   })
 
   it('falls back to latest_version when not installed', () => {
@@ -102,9 +97,9 @@ describe('PackVersionBadge', () => {
       props: { nodePack: uninstalledPack }
     })
 
-    const badge = wrapper.find('[role="button"]')
-    expect(badge.exists()).toBe(true)
-    expect(badge.find('span').text()).toBe('3.0.0') // From latest_version
+    const button = wrapper.findComponent(Button)
+    expect(button.exists()).toBe(true)
+    expect(button.props('label')).toBe('3.0.0') // From latest_version
   })
 
   it('falls back to NIGHTLY when no latest_version and not installed', () => {
@@ -118,9 +113,9 @@ describe('PackVersionBadge', () => {
       props: { nodePack: noVersionPack }
     })
 
-    const badge = wrapper.find('[role="button"]')
-    expect(badge.exists()).toBe(true)
-    expect(badge.find('span').text()).toBe(SelectedVersion.NIGHTLY)
+    const button = wrapper.findComponent(Button)
+    expect(button.exists()).toBe(true)
+    expect(button.props('label')).toBe(SelectedVersion.NIGHTLY)
   })
 
   it('falls back to NIGHTLY when nodePack.id is missing', () => {
@@ -132,16 +127,16 @@ describe('PackVersionBadge', () => {
       props: { nodePack: invalidPack }
     })
 
-    const badge = wrapper.find('[role="button"]')
-    expect(badge.exists()).toBe(true)
-    expect(badge.find('span').text()).toBe(SelectedVersion.NIGHTLY)
+    const button = wrapper.findComponent(Button)
+    expect(button.exists()).toBe(true)
+    expect(button.props('label')).toBe(SelectedVersion.NIGHTLY)
   })
 
   it('toggles the popover when button is clicked', async () => {
     const wrapper = mountComponent()
 
-    // Click the badge
-    await wrapper.find('[role="button"]').trigger('click')
+    // Click the button
+    await wrapper.findComponent(Button).trigger('click')
 
     // Verify that the toggle method was called
     expect(mockToggle).toHaveBeenCalled()

src/components/dialog/content/manager/PackVersionBadge.vue

@@ -1,23 +1,18 @@
 <template>
-  <div>
-    <div
-      class="inline-flex items-center gap-1 rounded-2xl text-xs cursor-pointer px-2 py-1"
-      :class="{ 'bg-gray-100 dark-theme:bg-neutral-700': fill }"
+  <div class="relative">
+    <Button
+      :label="installedVersion"
+      severity="secondary"
+      icon="pi pi-chevron-right"
+      icon-pos="right"
+      class="rounded-xl text-xs tracking-tighter p-0"
+      :pt="{
+        label: { class: 'pl-2 pr-0 py-0.5' },
+        icon: { class: 'text-xs pl-0 pr-2 py-0.5' }
+      }"
       aria-haspopup="true"
-      role="button"
-      tabindex="0"
       @click="toggleVersionSelector"
-      @keydown.enter="toggleVersionSelector"
-      @keydown.space="toggleVersionSelector"
-    >
-      <i
-        v-if="isUpdateAvailable"
-        class="pi pi-arrow-circle-up text-blue-600"
-        style="font-size: 8px"
-      />
-      <span>{{ installedVersion }}</span>
-      <i class="pi pi-chevron-right" style="font-size: 8px" />
-    </div>
+    />
 
     <Popover
       ref="popoverRef"
@@ -36,11 +31,11 @@
 </template>
 
 <script setup lang="ts">
+import Button from 'primevue/button'
 import Popover from 'primevue/popover'
 import { computed, ref, watch } from 'vue'
 
 import PackVersionSelectorPopover from '@/components/dialog/content/manager/PackVersionSelectorPopover.vue'
-import { usePackUpdateStatus } from '@/composables/nodePack/usePackUpdateStatus'
 import { useComfyManagerStore } from '@/stores/comfyManagerStore'
 import { SelectedVersion } from '@/types/comfyManagerTypes'
 import { components } from '@/types/comfyRegistryTypes'
@@ -48,17 +43,11 @@ import { isSemVer } from '@/utils/formatUtil'
 
 const TRUNCATED_HASH_LENGTH = 7
 
-const {
-  nodePack,
-  isSelected,
-  fill = true
-} = defineProps<{
+const { nodePack, isSelected } = defineProps<{
   nodePack: components['schemas']['Node']
   isSelected: boolean
-  fill?: boolean
 }>()
 
-const { isUpdateAvailable } = usePackUpdateStatus(nodePack)
 const popoverRef = ref()
 
 const managerStore = useComfyManagerStore()

src/components/dialog/content/manager/button/PackActionButton.vue

@@ -1,18 +1,16 @@
 <template>
   <Button
     outlined
-    class="!m-0 p-0 rounded-lg text-gray-900 dark-theme:text-gray-50"
-    :class="[
-      variant === 'black'
-        ? 'bg-neutral-900 text-white border-neutral-900'
-        : 'border-neutral-700',
-      fullWidth ? 'w-full' : 'w-min-content'
-    ]"
+    class="m-0 p-0 rounded-lg border-neutral-700"
+    :class="{
+      'w-full': fullWidth,
+      'w-min-content': !fullWidth
+    }"
     :disabled="loading"
     v-bind="$attrs"
     @click="onClick"
   >
-    <span class="py-2 px-3 whitespace-nowrap">
+    <span class="py-2.5 px-3">
       <template v-if="loading">
         {{ loadingMessage ?? $t('g.loading') }}
       </template>
@@ -29,14 +27,12 @@ import Button from 'primevue/button'
 const {
   label,
   loadingMessage,
-  fullWidth = false,
-  variant = 'default'
+  fullWidth = false
 } = defineProps<{
   label: string
   loading?: boolean
   loadingMessage?: string
   fullWidth?: boolean
-  variant?: 'default' | 'black'
 }>()
 
 const emit = defineEmits<{

src/components/dialog/content/manager/button/PackInstallButton.vue

@@ -2,11 +2,9 @@
   <PackActionButton
     v-bind="$attrs"
     :label="
-      label ??
-      (nodePacks.length > 1 ? $t('manager.installSelected') : $t('g.install'))
+      nodePacks.length > 1 ? $t('manager.installSelected') : $t('g.install')
     "
-    :severity="variant === 'black' ? undefined : 'secondary'"
-    :variant="variant"
+    severity="secondary"
     :loading="isInstalling"
     :loading-message="$t('g.installing')"
     @action="installAllPacks"
@@ -29,10 +27,8 @@ import type { components } from '@/types/comfyRegistryTypes'
 
 type NodePack = components['schemas']['Node']
 
-const { nodePacks, variant, label } = defineProps<{
+const { nodePacks } = defineProps<{
   nodePacks: NodePack[]
-  variant?: 'default' | 'black'
-  label?: string
 }>()
 
 const isInstalling = inject(IsInstallingKey, ref(false))

src/components/dialog/content/manager/infoPanel/InfoPanel.vue

@@ -1,6 +1,6 @@
 <template>
   <template v-if="nodePack">
-    <div class="flex flex-col h-full z-40 overflow-hidden relative">
+    <div class="flex flex-col h-full z-40 w-80 overflow-hidden relative">
       <div class="top-0 z-10 px-6 pt-6 w-full">
         <InfoPanelHeader :node-packs="[nodePack]" />
       </div>
@@ -42,7 +42,7 @@
     </div>
   </template>
   <template v-else>
-    <div class="pt-4 px-8 flex-1 overflow-hidden text-sm">
+    <div class="mt-4 mx-8 flex-1 overflow-hidden text-sm">
       {{ $t('manager.infoPanelEmpty') }}
     </div>
   </template>

src/components/dialog/content/manager/infoPanel/InfoPanelMultiItem.vue

@@ -51,11 +51,7 @@ const getPackNodes = async (pack: components['schemas']['Node']) => {
   if (!pack.latest_version?.version) return []
   const nodeDefs = await getNodeDefs.call({
     packId: pack.id,
-    version: pack.latest_version?.version,
-    // Fetch all nodes.
-    // TODO: Render all nodes previews and handle pagination.
-    // For determining length, use the `totalNumberOfPages` field of response
-    limit: 8192
+    version: pack.latest_version?.version
   })
   return nodeDefs?.comfy_nodes ?? []
 }

src/components/dialog/content/manager/packBanner/PackBanner.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="w-full aspect-[7/3] overflow-hidden">
+  <div :style="{ width: cssWidth, height: cssHeight }" class="overflow-hidden">
     <!-- default banner show -->
     <div v-if="showDefaultBanner" class="w-full h-full">
       <img
@@ -41,12 +41,24 @@ import { components } from '@/types/comfyRegistryTypes'
 
 const DEFAULT_BANNER = '/assets/images/fallback-gradient-avatar.svg'
 
-const { nodePack } = defineProps<{
+const {
+  nodePack,
+  width = '100%',
+  height = '12rem'
+} = defineProps<{
   nodePack: components['schemas']['Node']
+  width?: string
+  height?: string
 }>()
 
 const isImageError = ref(false)
 
 const showDefaultBanner = computed(() => !nodePack.banner_url && !nodePack.icon)
 const imgSrc = computed(() => nodePack.banner_url || nodePack.icon)
+
+const convertToCssValue = (value: string | number) =>
+  typeof value === 'number' ? `${value}rem` : value
+
+const cssWidth = computed(() => convertToCssValue(width))
+const cssHeight = computed(() => convertToCssValue(height))
 </script>

src/components/dialog/content/manager/packCard/PackCard.vue

@@ -9,12 +9,7 @@
       body: { class: 'p-0 flex flex-col w-full h-full rounded-lg gap-0' },
       content: { class: 'flex-1 flex flex-col rounded-lg min-h-0' },
       title: { class: 'w-full h-full rounded-t-lg cursor-pointer' },
-      footer: {
-        class: 'p-0 m-0 flex flex-col gap-0',
-        style: {
-          borderTop: isLightTheme ? '1px solid #f4f4f4' : '1px solid #2C2C2C'
-        }
-      }
+      footer: { class: 'p-0 m-0' }
     }"
   >
     <template #title>
@@ -34,43 +29,67 @@
         </div>
       </template>
       <template v-else>
-        <div class="pt-4 px-4 pb-3 w-full h-full">
-          <div class="flex flex-col gap-y-1 w-full h-full">
-            <span
-              class="text-sm font-bold truncate overflow-hidden text-ellipsis"
+        <div
+          class="self-stretch inline-flex flex-col justify-start items-start"
+        >
+          <div
+            class="px-4 py-3 inline-flex justify-start items-start cursor-pointer w-full"
+          >
+            <div
+              class="inline-flex flex-col justify-start items-start overflow-hidden gap-y-3 w-full"
             >
-              {{ nodePack.name }}
-            </span>
-            <p
-              v-if="nodePack.description"
-              class="flex-1 text-muted text-xs font-medium break-words overflow-hidden min-h-12 line-clamp-3 my-0 leading-4 mb-1 overflow-hidden"
-            >
-              {{ nodePack.description }}
-            </p>
-            <div class="flex flex-col gap-y-2">
-              <div class="flex-1 flex items-center gap-2">
-                <div v-if="nodesCount" class="p-2 pl-0 text-xs">
-                  {{ nodesCount }} {{ $t('g.nodes') }}
-                </div>
-                <PackVersionBadge
-                  :node-pack="nodePack"
-                  :is-selected="isSelected"
-                  :fill="false"
-                />
+              <span
+                class="text-base font-bold truncate overflow-hidden text-ellipsis"
+              >
+                {{ nodePack.name }}
+              </span>
+              <p
+                v-if="nodePack.description"
+                class="flex-1 justify-start text-muted text-sm font-medium break-words overflow-hidden min-h-12 line-clamp-3 my-0 leading-5"
+              >
+                {{ nodePack.description }}
+              </p>
+              <div class="flex flex-col gap-y-2">
                 <div
-                  v-if="formattedLatestVersionDate"
-                  class="px-2 py-1 flex justify-center items-center gap-1 text-xs text-muted font-medium"
+                  class="self-stretch inline-flex justify-start items-center gap-1"
                 >
-                  {{ formattedLatestVersionDate }}
+                  <div
+                    v-if="nodesCount"
+                    class="pr-2 py-1 flex justify-center text-sm items-center gap-1"
+                  >
+                    <div
+                      class="text-center justify-center font-medium leading-3"
+                    >
+                      {{ nodesCount }} {{ $t('g.nodes') }}
+                    </div>
+                  </div>
+                  <div class="px-2 py-1 flex justify-center items-center gap-1">
+                    <div
+                      v-if="isUpdateAvailable"
+                      class="w-4 h-4 relative overflow-hidden"
+                    >
+                      <i class="pi pi-arrow-circle-up text-blue-600" />
+                    </div>
+                    <PackVersionBadge
+                      :node-pack="nodePack"
+                      :is-selected="isSelected"
+                    />
+                  </div>
+                  <div
+                    v-if="formattedLatestVersionDate"
+                    class="px-2 py-1 flex justify-center items-center gap-1 text-xs text-muted font-medium"
+                  >
+                    {{ formattedLatestVersionDate }}
+                  </div>
+                </div>
+                <div class="flex">
+                  <span
+                    v-if="publisherName"
+                    class="text-xs text-muted font-medium leading-3 max-w-40 truncate"
+                  >
+                    {{ publisherName }}
+                  </span>
                 </div>
-              </div>
-              <div class="flex">
-                <span
-                  v-if="publisherName"
-                  class="text-xs text-muted font-medium leading-3 max-w-40 truncate"
-                >
-                  {{ publisherName }}
-                </span>
               </div>
             </div>
           </div>
@@ -78,6 +97,7 @@
       </template>
     </template>
     <template #footer>
+      <ContentDivider :width="0.1" />
       <PackCardFooter :node-pack="nodePack" />
     </template>
   </Card>
@@ -90,11 +110,12 @@ import ProgressSpinner from 'primevue/progressspinner'
 import { computed, provide, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
+import ContentDivider from '@/components/common/ContentDivider.vue'
 import PackVersionBadge from '@/components/dialog/content/manager/PackVersionBadge.vue'
 import PackBanner from '@/components/dialog/content/manager/packBanner/PackBanner.vue'
 import PackCardFooter from '@/components/dialog/content/manager/packCard/PackCardFooter.vue'
+import { usePackUpdateStatus } from '@/composables/nodePack/usePackUpdateStatus'
 import { useComfyManagerStore } from '@/stores/comfyManagerStore'
-import { useColorPaletteStore } from '@/stores/workspace/colorPaletteStore'
 import {
   IsInstallingKey,
   type MergedNodePack,
@@ -109,15 +130,11 @@ const { nodePack, isSelected = false } = defineProps<{
 
 const { d } = useI18n()
 
-const colorPaletteStore = useColorPaletteStore()
-const isLightTheme = computed(
-  () => colorPaletteStore.completedActivePalette.light_theme
-)
-
 const isInstalling = ref(false)
 provide(IsInstallingKey, isInstalling)
 
 const { isPackInstalled, isPackEnabled } = useComfyManagerStore()
+const { isUpdateAvailable } = usePackUpdateStatus(nodePack)
 
 const isInstalled = computed(() => isPackInstalled(nodePack?.id))
 const isDisabled = computed(
@@ -150,14 +167,14 @@ const formattedLatestVersionDate = computed(() => {
   position: relative;
 }
 
-.selected-card::after {
+.selected-card::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
-  border: 4px solid var(--p-primary-color);
+  border: 3px solid var(--p-primary-color);
   border-radius: 0.5rem;
   pointer-events: none;
   z-index: 100;

src/components/dialog/content/manager/packCard/PackCardFooter.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    class="min-h-12 flex justify-between items-center px-4 py-2 text-xs text-muted font-medium leading-3"
+    class="flex justify-between items-center px-4 py-2 text-xs text-muted font-medium leading-3"
   >
     <div v-if="nodePack.downloads" class="flex items-center gap-1.5">
       <i class="pi pi-download text-muted"></i>

src/components/dialog/content/manager/registrySearchBar/RegistrySearchBar.vue

@@ -1,37 +1,28 @@
 <template>
   <div class="relative w-full p-6">
-    <div class="h-12 flex items-center gap-1 justify-between">
-      <div class="flex items-center w-5/12">
-        <AutoComplete
-          v-model.lazy="searchQuery"
-          :suggestions="suggestions || []"
-          :placeholder="$t('manager.searchPlaceholder')"
-          :complete-on-focus="false"
-          :delay="8"
-          option-label="query"
-          class="w-full"
-          :pt="{
-            pcInputText: {
-              root: {
-                autofocus: true,
-                class: 'w-full rounded-2xl'
-              }
-            },
-            loader: {
-              style: 'display: none'
+    <div class="flex items-center w-full">
+      <AutoComplete
+        v-model.lazy="searchQuery"
+        :suggestions="suggestions || []"
+        :placeholder="$t('manager.searchPlaceholder')"
+        :complete-on-focus="false"
+        :delay="8"
+        option-label="query"
+        class="w-full"
+        :pt="{
+          pcInputText: {
+            root: {
+              autofocus: true,
+              class: 'w-5/12 rounded-2xl'
             }
-          }"
-          :show-empty-message="false"
-          @complete="stubTrue"
-          @option-select="onOptionSelect"
-        />
-      </div>
-      <PackInstallButton
-        v-if="isMissingTab && missingNodePacks.length > 0"
-        variant="black"
-        :disabled="isLoading || !!error"
-        :node-packs="missingNodePacks"
-        :label="$t('manager.installAllMissingNodes')"
+          },
+          loader: {
+            style: 'display: none'
+          }
+        }"
+        :show-empty-message="false"
+        @complete="stubTrue"
+        @option-select="onOptionSelect"
       />
     </div>
     <div class="flex mt-3 text-sm">
@@ -43,7 +34,7 @@
         />
         <SearchFilterDropdown
           v-model:modelValue="sortField"
-          :options="availableSortOptions"
+          :options="sortOptions"
           :label="$t('g.sort')"
         />
       </div>
@@ -64,55 +55,43 @@ import AutoComplete, {
 import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 
-import PackInstallButton from '@/components/dialog/content/manager/button/PackInstallButton.vue'
 import SearchFilterDropdown from '@/components/dialog/content/manager/registrySearchBar/SearchFilterDropdown.vue'
-import { useMissingNodes } from '@/composables/nodePack/useMissingNodes'
+import type { NodesIndexSuggestion } from '@/types/algoliaTypes'
 import {
   type SearchOption,
   SortableAlgoliaField
 } from '@/types/comfyManagerTypes'
 import { components } from '@/types/comfyRegistryTypes'
-import type {
-  QuerySuggestion,
-  SearchMode,
-  SortableField
-} from '@/types/searchServiceTypes'
 
-const { searchResults, sortOptions } = defineProps<{
+const { searchResults } = defineProps<{
   searchResults?: components['schemas']['Node'][]
-  suggestions?: QuerySuggestion[]
-  sortOptions?: SortableField[]
-  isMissingTab?: boolean
+  suggestions?: NodesIndexSuggestion[]
 }>()
 
 const searchQuery = defineModel<string>('searchQuery')
-const searchMode = defineModel<SearchMode>('searchMode', { default: 'packs' })
-const sortField = defineModel<string>('sortField', {
+const searchMode = defineModel<string>('searchMode', { default: 'packs' })
+const sortField = defineModel<SortableAlgoliaField>('sortField', {
   default: SortableAlgoliaField.Downloads
 })
 
 const { t } = useI18n()
 
-// Get missing node packs from workflow with loading and error states
-const { missingNodePacks, isLoading, error } = useMissingNodes()
-
 const hasResults = computed(
   () => searchQuery.value?.trim() && searchResults?.length
 )
 
-const availableSortOptions = computed<SearchOption<string>[]>(() => {
-  if (!sortOptions) return []
-  return sortOptions.map((field) => ({
-    id: field.id,
-    label: field.label
-  }))
-})
-const filterOptions: SearchOption<SearchMode>[] = [
+const sortOptions: SearchOption<SortableAlgoliaField>[] = [
+  { id: SortableAlgoliaField.Downloads, label: t('manager.sort.downloads') },
+  { id: SortableAlgoliaField.Created, label: t('manager.sort.created') },
+  { id: SortableAlgoliaField.Updated, label: t('manager.sort.updated') },
+  { id: SortableAlgoliaField.Publisher, label: t('manager.sort.publisher') },
+  { id: SortableAlgoliaField.Name, label: t('g.name') }
+]
+const filterOptions: SearchOption<string>[] = [
   { id: 'packs', label: t('manager.filter.nodePack') },
   { id: 'nodes', label: t('g.nodes') }
 ]
 
-// When a dropdown query suggestion is selected, update the search query
 const onOptionSelect = (event: AutoCompleteOptionSelectEvent) => {
   searchQuery.value = event.value.query
 }

src/components/graph/SelectionToolbox.vue

@@ -10,7 +10,6 @@
     <ColorPickerButton />
     <BypassButton />
     <PinButton />
-    <EditModelButton />
     <MaskEditorButton />
     <DeleteButton />
     <RefreshButton />
@@ -30,7 +29,6 @@ import { computed } from 'vue'
 import BypassButton from '@/components/graph/selectionToolbox/BypassButton.vue'
 import ColorPickerButton from '@/components/graph/selectionToolbox/ColorPickerButton.vue'
 import DeleteButton from '@/components/graph/selectionToolbox/DeleteButton.vue'
-import EditModelButton from '@/components/graph/selectionToolbox/EditModelButton.vue'
 import ExecuteButton from '@/components/graph/selectionToolbox/ExecuteButton.vue'
 import ExtensionCommandButton from '@/components/graph/selectionToolbox/ExtensionCommandButton.vue'
 import HelpButton from '@/components/graph/selectionToolbox/HelpButton.vue'

src/components/graph/selectionToolbox/EditModelButton.vue

@@ -1,37 +0,0 @@
-<template>
-  <Button
-    v-show="isImageOutputSelected"
-    v-tooltip.top="{
-      value: t('commands.Comfy_Canvas_AddEditModelStep.label'),
-      showDelay: 1000
-    }"
-    severity="secondary"
-    text
-    icon="pi pi-pen-to-square"
-    @click="() => commandStore.execute('Comfy.Canvas.AddEditModelStep')"
-  />
-</template>
-
-<script setup lang="ts">
-import Button from 'primevue/button'
-import { computed } from 'vue'
-import { useI18n } from 'vue-i18n'
-
-import { useCommandStore } from '@/stores/commandStore'
-import { useCanvasStore } from '@/stores/graphStore'
-import { isImageNode, isLGraphNode } from '@/utils/litegraphUtil'
-
-const { t } = useI18n()
-const commandStore = useCommandStore()
-const canvasStore = useCanvasStore()
-
-const isImageOutputOrEditModelNode = (node: unknown) =>
-  isLGraphNode(node) &&
-  (isImageNode(node) || node.type === 'workflow>FLUX.1 Kontext Image Edit')
-
-const isImageOutputSelected = computed(
-  () =>
-    canvasStore.selectedItems.length === 1 &&
-    isImageOutputOrEditModelNode(canvasStore.selectedItems[0])
-)
-</script>

src/composables/node/useNodeImageUpload.ts

@@ -3,29 +3,15 @@ import type { LGraphNode } from '@comfyorg/litegraph'
 import { useNodeDragAndDrop } from '@/composables/node/useNodeDragAndDrop'
 import { useNodeFileInput } from '@/composables/node/useNodeFileInput'
 import { useNodePaste } from '@/composables/node/useNodePaste'
-import type { ResultItemType } from '@/schemas/apiSchema'
 import { api } from '@/scripts/api'
 import { useToastStore } from '@/stores/toastStore'
 
 const PASTED_IMAGE_EXPIRY_MS = 2000
 
-interface ImageUploadFormFields {
-  /**
-   * The folder to upload the file to.
-   * @example 'input', 'output', 'temp'
-   */
-  type: ResultItemType
-}
-
-const uploadFile = async (
-  file: File,
-  isPasted: boolean,
-  formFields: Partial<ImageUploadFormFields> = {}
-) => {
+const uploadFile = async (file: File, isPasted: boolean) => {
   const body = new FormData()
   body.append('image', file)
   if (isPasted) body.append('subfolder', 'pasted')
-  if (formFields.type) body.append('type', formFields.type)
 
   const resp = await api.fetchApi('/upload/image', {
     method: 'POST',
@@ -50,11 +36,6 @@ interface ImageUploadOptions {
    * @example 'image/png,image/jpeg,image/webp,video/webm,video/mp4'
    */
   accept?: string
-  /**
-   * The folder to upload the file to.
-   * @example 'input', 'output', 'temp'
-   */
-  folder?: ResultItemType
 }
 
 /**
@@ -72,9 +53,7 @@ export const useNodeImageUpload = (
 
   const handleUpload = async (file: File) => {
     try {
-      const path = await uploadFile(file, isPastedFile(file), {
-        type: options.folder
-      })
+      const path = await uploadFile(file, isPastedFile(file))
       if (!path) return
       return path
     } catch (error) {

src/composables/nodePack/useInstalledPacks.ts

@@ -1,4 +1,3 @@
-import { whenever } from '@vueuse/core'
 import { computed, onUnmounted } from 'vue'
 
 import { useNodePacks } from '@/composables/nodePack/useNodePacks'
@@ -19,16 +18,6 @@ export const useInstalledPacks = (options: UseNodePacksOptions = {}) => {
   const filterInstalledPack = (packs: components['schemas']['Node'][]) =>
     packs.filter((pack) => comfyManagerStore.isPackInstalled(pack.id))
 
-  const startFetchInstalled = async () => {
-    await comfyManagerStore.refreshInstalledList()
-    await startFetch()
-  }
-
-  // When installedPackIds changes, we need to update the nodePacks
-  whenever(installedPackIds, async () => {
-    await startFetch()
-  })
-
   onUnmounted(() => {
     cleanup()
   })
@@ -38,7 +27,7 @@ export const useInstalledPacks = (options: UseNodePacksOptions = {}) => {
     isLoading,
     isReady,
     installedPacks: nodePacks,
-    startFetchInstalled,
+    startFetchInstalled: startFetch,
     filterInstalledPack
   }
 }

src/composables/nodePack/useMissingNodes.ts

@@ -1,76 +0,0 @@
-import { LGraphNode } from '@comfyorg/litegraph'
-import { NodeProperty } from '@comfyorg/litegraph/dist/LGraphNode'
-import { groupBy } from 'lodash'
-import { computed, onMounted } from 'vue'
-
-import { useWorkflowPacks } from '@/composables/nodePack/useWorkflowPacks'
-import { app } from '@/scripts/app'
-import { useComfyManagerStore } from '@/stores/comfyManagerStore'
-import { useNodeDefStore } from '@/stores/nodeDefStore'
-import type { components } from '@/types/comfyRegistryTypes'
-
-/**
- * Composable to find missing NodePacks from workflow
- * Uses the same filtering approach as ManagerDialogContent.vue
- * Automatically fetches workflow pack data when initialized
- */
-export const useMissingNodes = () => {
-  const nodeDefStore = useNodeDefStore()
-  const comfyManagerStore = useComfyManagerStore()
-  const { workflowPacks, isLoading, error, startFetchWorkflowPacks } =
-    useWorkflowPacks()
-
-  // Same filtering logic as ManagerDialogContent.vue
-  const filterMissingPacks = (packs: components['schemas']['Node'][]) =>
-    packs.filter((pack) => !comfyManagerStore.isPackInstalled(pack.id))
-
-  // Filter only uninstalled packs from workflow packs
-  const missingNodePacks = computed(() => {
-    if (!workflowPacks.value.length) return []
-    return filterMissingPacks(workflowPacks.value)
-  })
-
-  /**
-   * Check if a pack is the ComfyUI builtin node pack (nodes that come pre-installed)
-   * @param packId - The id of the pack to check
-   * @returns True if the pack is the comfy-core pack, false otherwise
-   */
-  const isCorePack = (packId: NodeProperty) => {
-    return packId === 'comfy-core'
-  }
-
-  /**
-   * Check if a node is a missing core node
-   * A missing core node is a node that is in the workflow and originates from
-   * the comfy-core pack (pre-installed) but not registered in the node def
-   * store (the node def was not found on the server)
-   * @param node - The node to check
-   * @returns True if the node is a missing core node, false otherwise
-   */
-  const isMissingCoreNode = (node: LGraphNode) => {
-    const packId = node.properties?.cnr_id
-    if (packId === undefined || !isCorePack(packId)) return false
-    const nodeName = node.type
-    const isRegisteredNodeDef = !!nodeDefStore.nodeDefsByName[nodeName]
-    return !isRegisteredNodeDef
-  }
-
-  const missingCoreNodes = computed<Record<string, LGraphNode[]>>(() => {
-    const missingNodes = app.graph.nodes.filter(isMissingCoreNode)
-    return groupBy(missingNodes, (node) => String(node.properties?.ver || ''))
-  })
-
-  // Automatically fetch workflow pack data when composable is used
-  onMounted(async () => {
-    if (!workflowPacks.value.length && !isLoading.value) {
-      await startFetchWorkflowPacks()
-    }
-  })
-
-  return {
-    missingNodePacks,
-    missingCoreNodes,
-    isLoading,
-    error
-  }
-}

src/composables/useCoreCommands.ts

@@ -14,7 +14,6 @@ import {
 import { t } from '@/i18n'
 import { api } from '@/scripts/api'
 import { app } from '@/scripts/app'
-import { addFluxKontextGroupNode } from '@/scripts/fluxKontextEditNode'
 import { useDialogService } from '@/services/dialogService'
 import { useLitegraphService } from '@/services/litegraphService'
 import { useWorkflowService } from '@/services/workflowService'
@@ -719,17 +718,6 @@ export function useCoreCommands(): ComfyCommand[] {
       label: 'Move Selected Nodes Right',
       versionAdded: moveSelectedNodesVersionAdded,
       function: () => moveSelectedNodes(([x, y], gridSize) => [x + gridSize, y])
-    },
-    {
-      id: 'Comfy.Canvas.AddEditModelStep',
-      icon: 'pi pi-pen-to-square',
-      label: 'Add Edit Model Step',
-      versionAdded: '1.23.3',
-      function: async () => {
-        const node = app.canvas.selectedItems.values().next().value
-        if (!(node instanceof LGraphNode)) return
-        await addFluxKontextGroupNode(node)
-      }
     }
   ]
 

src/composables/useRegistrySearch.ts

@@ -1,61 +1,95 @@
 import { watchDebounced } from '@vueuse/core'
-import { orderBy } from 'lodash'
+import type { Hit } from 'algoliasearch/dist/lite/browser'
+import { memoize, orderBy } from 'lodash'
 import { computed, ref, watch } from 'vue'
 
-import { DEFAULT_PAGE_SIZE } from '@/constants/searchConstants'
-import { useRegistrySearchGateway } from '@/services/gateway/registrySearchGateway'
-import type { SearchAttribute } from '@/types/algoliaTypes'
+import { useAlgoliaSearchService } from '@/services/algoliaSearchService'
+import type {
+  AlgoliaNodePack,
+  NodesIndexSuggestion,
+  SearchAttribute
+} from '@/types/algoliaTypes'
 import { SortableAlgoliaField } from '@/types/comfyManagerTypes'
-import type { components } from '@/types/comfyRegistryTypes'
-import type { QuerySuggestion, SearchMode } from '@/types/searchServiceTypes'
-
-type RegistryNodePack = components['schemas']['Node']
 
 const SEARCH_DEBOUNCE_TIME = 320
+const DEFAULT_PAGE_SIZE = 64
 const DEFAULT_SORT_FIELD = SortableAlgoliaField.Downloads // Set in the index configuration
+const SORT_DIRECTIONS: Record<SortableAlgoliaField, 'asc' | 'desc'> = {
+  [SortableAlgoliaField.Downloads]: 'desc',
+  [SortableAlgoliaField.Created]: 'desc',
+  [SortableAlgoliaField.Updated]: 'desc',
+  [SortableAlgoliaField.Publisher]: 'asc',
+  [SortableAlgoliaField.Name]: 'asc'
+}
+
+const isDateField = (field: SortableAlgoliaField): boolean =>
+  field === SortableAlgoliaField.Created ||
+  field === SortableAlgoliaField.Updated
 
 /**
  * Composable for managing UI state of Comfy Node Registry search.
  */
-export function useRegistrySearch(
-  options: {
-    initialSortField?: string
-    initialSearchMode?: SearchMode
-    initialSearchQuery?: string
-    initialPageNumber?: number
-  } = {}
-) {
+export function useRegistrySearch(options: {
+  initialSortField?: SortableAlgoliaField
+  initialSearchMode?: 'nodes' | 'packs'
+  initialSearchQuery?: string
+  initialPageNumber?: number
+}) {
   const {
-    initialSortField = DEFAULT_SORT_FIELD,
+    initialSortField = SortableAlgoliaField.Downloads,
     initialSearchMode = 'packs',
     initialSearchQuery = '',
     initialPageNumber = 0
   } = options
 
   const isLoading = ref(false)
-  const sortField = ref<string>(initialSortField)
-  const searchMode = ref<SearchMode>(initialSearchMode)
+  const sortField = ref<SortableAlgoliaField>(initialSortField)
+  const searchMode = ref<'nodes' | 'packs'>(initialSearchMode)
   const pageSize = ref(DEFAULT_PAGE_SIZE)
   const pageNumber = ref(initialPageNumber)
   const searchQuery = ref(initialSearchQuery)
-  const searchResults = ref<RegistryNodePack[]>([])
-  const suggestions = ref<QuerySuggestion[]>([])
+  const results = ref<AlgoliaNodePack[]>([])
+  const suggestions = ref<NodesIndexSuggestion[]>([])
 
   const searchAttributes = computed<SearchAttribute[]>(() =>
     searchMode.value === 'nodes' ? ['comfy_nodes'] : ['name', 'description']
   )
 
-  const searchGateway = useRegistrySearchGateway()
+  const resultsAsRegistryPacks = computed(() =>
+    results.value ? results.value.map(algoliaToRegistry) : []
+  )
+  const resultsAsNodes = computed(() =>
+    results.value
+      ? results.value.reduce(
+          (acc, hit) => acc.concat(hit.comfy_nodes),
+          [] as string[]
+        )
+      : []
+  )
 
-  const { searchPacks, clearSearchCache, getSortValue, getSortableFields } =
-    searchGateway
+  const { searchPacksCached, toRegistryPack, clearSearchPacksCache } =
+    useAlgoliaSearchService()
+
+  const algoliaToRegistry = memoize(
+    toRegistryPack,
+    (algoliaNode: AlgoliaNodePack) => algoliaNode.id
+  )
+  const getSortValue = (pack: Hit<AlgoliaNodePack>) => {
+    if (isDateField(sortField.value)) {
+      const value = pack[sortField.value]
+      return value ? new Date(value).getTime() : 0
+    } else {
+      const value = pack[sortField.value]
+      return value ?? 0
+    }
+  }
 
   const updateSearchResults = async (options: { append?: boolean }) => {
     isLoading.value = true
     if (!options.append) {
       pageNumber.value = 0
     }
-    const { nodePacks, querySuggestions } = await searchPacks(
+    const { nodePacks, querySuggestions } = await searchPacksCached(
       searchQuery.value,
       {
         pageSize: pageSize.value,
@@ -68,22 +102,17 @@ export function useRegistrySearch(
 
     // Results are sorted by the default field to begin with -- so don't manually sort again
     if (sortField.value && sortField.value !== DEFAULT_SORT_FIELD) {
-      // Get the sort direction from the provider's sortable fields
-      const sortableFields = getSortableFields()
-      const fieldConfig = sortableFields.find((f) => f.id === sortField.value)
-      const direction = fieldConfig?.direction || 'desc'
-
       sortedPacks = orderBy(
         nodePacks,
-        [(pack) => getSortValue(pack, sortField.value)],
-        [direction]
+        [getSortValue],
+        [SORT_DIRECTIONS[sortField.value]]
       )
     }
 
-    if (options.append && searchResults.value?.length) {
-      searchResults.value = searchResults.value.concat(sortedPacks)
+    if (options.append && results.value?.length) {
+      results.value = results.value.concat(sortedPacks)
     } else {
-      searchResults.value = sortedPacks
+      results.value = sortedPacks
     }
     suggestions.value = querySuggestions
     isLoading.value = false
@@ -99,10 +128,6 @@ export function useRegistrySearch(
     immediate: true
   })
 
-  const sortOptions = computed(() => {
-    return getSortableFields()
-  })
-
   return {
     isLoading,
     pageNumber,
@@ -111,8 +136,8 @@ export function useRegistrySearch(
     searchMode,
     searchQuery,
     suggestions,
-    searchResults,
-    sortOptions,
-    clearCache: clearSearchCache
+    searchResults: resultsAsRegistryPacks,
+    nodeSearchResults: resultsAsNodes,
+    clearCache: clearSearchPacksCache
   }
 }

src/composables/widgets/useImageUploadWidget.ts

@@ -5,11 +5,10 @@ import { useNodeImage, useNodeVideo } from '@/composables/node/useNodeImage'
 import { useNodeImageUpload } from '@/composables/node/useNodeImageUpload'
 import { useValueTransform } from '@/composables/useValueTransform'
 import { t } from '@/i18n'
-import type { ResultItem, ResultItemType } from '@/schemas/apiSchema'
+import type { ResultItem } from '@/schemas/apiSchema'
 import type { InputSpec } from '@/schemas/nodeDefSchema'
 import type { ComfyWidgetConstructor } from '@/scripts/widgets'
 import { useNodeOutputStore } from '@/stores/imagePreviewStore'
-import { isImageUploadInput } from '@/types/nodeDefAugmentation'
 import { createAnnotatedPath } from '@/utils/formatUtil'
 import { addToComboValues } from '@/utils/litegraphUtil'
 
@@ -34,15 +33,8 @@ export const useImageUploadWidget = () => {
     inputName: string,
     inputData: InputSpec
   ) => {
-    if (!isImageUploadInput(inputData)) {
-      throw new Error(
-        'Image upload widget requires imageInputName augmentation'
-      )
-    }
-
-    const inputOptions = inputData[1]
+    const inputOptions = inputData[1] ?? {}
     const { imageInputName, allow_batch, image_folder = 'input' } = inputOptions
-    const folder: ResultItemType | undefined = image_folder
     const nodeOutputStore = useNodeOutputStore()
 
     const isAnimated = !!inputOptions.animated_image_upload
@@ -51,9 +43,11 @@ export const useImageUploadWidget = () => {
     const { showPreview } = isVideo ? useNodeVideo(node) : useNodeImage(node)
 
     const fileFilter = isVideo ? isVideoFile : isImageFile
+    // @ts-expect-error InputSpec is not typed correctly
     const fileComboWidget = findFileComboWidget(node, imageInputName)
     const initialFile = `${fileComboWidget.value}`
     const formatPath = (value: InternalFile) =>
+      // @ts-expect-error InputSpec is not typed correctly
       createAnnotatedPath(value, { rootFolder: image_folder })
 
     const transform = (internalValue: InternalValue): ExposedValue => {
@@ -73,10 +67,10 @@ export const useImageUploadWidget = () => {
 
     // Setup file upload handling
     const { openFileSelection } = useNodeImageUpload(node, {
+      // @ts-expect-error InputSpec is not typed correctly
       allow_batch,
       fileFilter,
       accept,
-      folder,
       onUploadComplete: (output) => {
         output.forEach((path) => addToComboValues(fileComboWidget, path))
         // @ts-expect-error litegraph combo value type does not support arrays yet

src/composables/widgets/useRemoteWidget.ts

@@ -2,9 +2,7 @@ import { LGraphNode } from '@comfyorg/litegraph'
 import { IWidget } from '@comfyorg/litegraph'
 import axios from 'axios'
 
-import { useChainCallback } from '@/composables/functional/useChainCallback'
 import type { RemoteWidgetConfig } from '@/schemas/nodeDefSchema'
-import { api } from '@/scripts/api'
 
 const MAX_RETRIES = 5
 const TIMEOUT = 4096
@@ -222,46 +220,6 @@ export function useRemoteWidget<
     node.addWidget('button', 'refresh', 'refresh', widget.refresh)
   }
 
-  /**
-   * Add auto-refresh toggle widget and execution success listener
-   */
-  function addAutoRefreshToggle() {
-    let autoRefreshEnabled = false
-
-    // Handler for execution success
-    const handleExecutionSuccess = () => {
-      if (autoRefreshEnabled && widget.refresh) {
-        widget.refresh()
-      }
-    }
-
-    // Add toggle widget
-    const autoRefreshWidget = node.addWidget(
-      'toggle',
-      'Auto-refresh after generation',
-      false,
-      (value: boolean) => {
-        autoRefreshEnabled = value
-      },
-      {
-        serialize: false
-      }
-    )
-
-    // Register event listener
-    api.addEventListener('execution_success', handleExecutionSuccess)
-
-    // Cleanup on node removal
-    node.onRemoved = useChainCallback(node.onRemoved, function () {
-      api.removeEventListener('execution_success', handleExecutionSuccess)
-    })
-
-    return autoRefreshWidget
-  }
-
-  // Always add auto-refresh toggle for remote widgets
-  addAutoRefreshToggle()
-
   return {
     getCachedValue,
     getValue,

src/constants/searchConstants.ts

@@ -1,3 +0,0 @@
-export const SEARCH_CACHE_MAX_SIZE = 64
-export const DEFAULT_PAGE_SIZE = 64
-export const MIN_CHARS_FOR_SUGGESTIONS_ALGOLIA = 2

src/extensions/core/electronAdapter.ts

@@ -43,6 +43,15 @@ import { checkMirrorReachable } from '@/utils/networkUtil'
         defaultValue: true,
         onChange: onChangeRestartApp
       },
+      {
+        id: 'Comfy-Desktop.LaunchOptions',
+        category: ['Comfy-Desktop', 'General', 'Launch Options'],
+        name: 'Custom Launch Arguments',
+        tooltip:
+          'Custom command line arguments for launching the backend (e.g., --cpu). Requires restart.',
+        type: 'text',
+        defaultValue: ''
+      },
       {
         id: 'Comfy-Desktop.WindowStyle',
         category: ['Comfy-Desktop', 'General', 'Window Style'],

src/extensions/core/groupNodeManage.ts

@@ -7,8 +7,7 @@ import {
 import { useToastStore } from '@/stores/toastStore'
 
 import { type ComfyApp, app } from '../../scripts/app'
-import { $el } from '../../scripts/ui'
-import { ComfyDialog } from '../../scripts/ui/dialog'
+import { $el, ComfyDialog } from '../../scripts/ui'
 import { DraggableList } from '../../scripts/ui/draggableList'
 import { GroupNodeConfig, GroupNodeHandler } from './groupNode'
 import './groupNodeManage.css'

src/extensions/core/uploadAudio.ts

@@ -5,7 +5,6 @@ import { useNodeDragAndDrop } from '@/composables/node/useNodeDragAndDrop'
 import { useNodeFileInput } from '@/composables/node/useNodeFileInput'
 import { useNodePaste } from '@/composables/node/useNodePaste'
 import { t } from '@/i18n'
-import type { ResultItemType } from '@/schemas/apiSchema'
 import type { ComfyNodeDef } from '@/schemas/nodeDefSchema'
 import type { DOMWidget } from '@/scripts/domWidget'
 import { useToastStore } from '@/stores/toastStore'
@@ -13,6 +12,8 @@ import { useToastStore } from '@/stores/toastStore'
 import { api } from '../../scripts/api'
 import { app } from '../../scripts/app'
 
+type FolderType = 'input' | 'output' | 'temp'
+
 function splitFilePath(path: string): [string, string] {
   const folder_separator = path.lastIndexOf('/')
   if (folder_separator === -1) {
@@ -27,7 +28,7 @@ function splitFilePath(path: string): [string, string] {
 function getResourceURL(
   subfolder: string,
   filename: string,
-  type: ResultItemType = 'input'
+  type: FolderType = 'input'
 ): string {
   const params = [
     'filename=' + encodeURIComponent(filename),

src/locales/en/commands.json

@@ -38,9 +38,6 @@
   "Comfy_BrowseTemplates": {
     "label": "Browse Templates"
   },
-  "Comfy_Canvas_AddEditModelStep": {
-    "label": "Add Edit Model Step"
-  },
   "Comfy_Canvas_DeleteSelectedItems": {
     "label": "Delete Selected Items"
   },

src/locales/en/main.json

@@ -161,7 +161,6 @@
     "lastUpdated": "Last Updated",
     "noDescription": "No description available",
     "installSelected": "Install Selected",
-    "installAllMissingNodes": "Install All Missing Nodes",
     "packsSelected": "Packs Selected",
     "status": {
       "active": "Active",
@@ -793,7 +792,6 @@
     "Reinstall": "Reinstall",
     "Restart": "Restart",
     "Browse Templates": "Browse Templates",
-    "Add Edit Model Step": "Add Edit Model Step",
     "Delete Selected Items": "Delete Selected Items",
     "Fit view to selected nodes": "Fit view to selected nodes",
     "Move Selected Nodes Down": "Move Selected Nodes Down",
@@ -1196,11 +1194,6 @@
     "missingModels": "Missing Models",
     "missingModelsMessage": "When loading the graph, the following models were not found"
   },
-  "loadWorkflowWarning": {
-    "outdatedVersion": "Some nodes require a newer version of ComfyUI (current: {version}). Please update to use all nodes.",
-    "outdatedVersionGeneric": "Some nodes require a newer version of ComfyUI. Please update to use all nodes.",
-    "coreNodesFromVersion": "Requires ComfyUI {version}:"
-  },
   "errorDialog": {
     "defaultTitle": "An error occurred",
     "loadWorkflowTitle": "Loading aborted due to error reloading workflow data",

src/locales/en/settings.json

@@ -2,6 +2,10 @@
   "Comfy-Desktop_AutoUpdate": {
     "name": "Automatically check for updates"
   },
+  "Comfy-Desktop_LaunchOptions": {
+    "name": "Custom Launch Arguments",
+    "tooltip": "Custom command line arguments for launching the backend (e.g., --cpu). Requires restart."
+  },
   "Comfy-Desktop_SendStatistics": {
     "name": "Send anonymous usage metrics"
   },

src/locales/es/commands.json

@@ -38,9 +38,6 @@
   "Comfy_BrowseTemplates": {
     "label": "Explorar plantillas"
   },
-  "Comfy_Canvas_AddEditModelStep": {
-    "label": "Agregar paso de edición de modelo"
-  },
   "Comfy_Canvas_DeleteSelectedItems": {
     "label": "Eliminar elementos seleccionados"
   },

src/locales/es/main.json

@@ -551,11 +551,6 @@
     "uploadBackgroundImage": "Subir imagen de fondo",
     "uploadTexture": "Subir textura"
   },
-  "loadWorkflowWarning": {
-    "coreNodesFromVersion": "Requiere ComfyUI {version}:",
-    "outdatedVersion": "Algunos nodos requieren una versión más reciente de ComfyUI (actual: {version}). Por favor, actualiza para usar todos los nodos.",
-    "outdatedVersionGeneric": "Algunos nodos requieren una versión más reciente de ComfyUI. Por favor, actualiza para usar todos los nodos."
-  },
   "maintenance": {
     "None": "Ninguno",
     "OK": "OK",
@@ -591,7 +586,6 @@
     },
     "inWorkflow": "En Flujo de Trabajo",
     "infoPanelEmpty": "Haz clic en un elemento para ver la información",
-    "installAllMissingNodes": "Instalar todos los nodos faltantes",
     "installSelected": "Instalar Seleccionado",
     "installationQueue": "Cola de Instalación",
     "lastUpdated": "Última Actualización",
@@ -684,7 +678,6 @@
   },
   "menuLabels": {
     "About ComfyUI": "Acerca de ComfyUI",
-    "Add Edit Model Step": "Agregar paso de edición de modelo",
     "Browse Templates": "Explorar plantillas",
     "Bypass/Unbypass Selected Nodes": "Evitar/No evitar nodos seleccionados",
     "Canvas Toggle Link Visibility": "Alternar visibilidad de enlace en lienzo",

src/locales/es/settings.json

@@ -2,6 +2,10 @@
   "Comfy-Desktop_AutoUpdate": {
     "name": "Verificar actualizaciones automáticamente"
   },
+  "Comfy-Desktop_LaunchOptions": {
+    "name": "Argumentos de lanzamiento personalizados",
+    "tooltip": "Argumentos personalizados de línea de comandos para iniciar el backend (por ejemplo, --cpu). Requiere reinicio."
+  },
   "Comfy-Desktop_SendStatistics": {
     "name": "Enviar métricas de uso anónimas"
   },

src/locales/fr/commands.json

@@ -38,9 +38,6 @@
   "Comfy_BrowseTemplates": {
     "label": "Parcourir les modèles"
   },
-  "Comfy_Canvas_AddEditModelStep": {
-    "label": "Ajouter/Modifier une étape de modèle"
-  },
   "Comfy_Canvas_DeleteSelectedItems": {
     "label": "Supprimer les éléments sélectionnés"
   },

src/locales/fr/main.json

@@ -551,11 +551,6 @@
     "uploadBackgroundImage": "Télécharger l'image de fond",
     "uploadTexture": "Télécharger Texture"
   },
-  "loadWorkflowWarning": {
-    "coreNodesFromVersion": "Nécessite ComfyUI {version} :",
-    "outdatedVersion": "Certains nœuds nécessitent une version plus récente de ComfyUI (actuelle : {version}). Veuillez mettre à jour pour utiliser tous les nœuds.",
-    "outdatedVersionGeneric": "Certains nœuds nécessitent une version plus récente de ComfyUI. Veuillez mettre à jour pour utiliser tous les nœuds."
-  },
   "maintenance": {
     "None": "Aucun",
     "OK": "OK",
@@ -591,7 +586,6 @@
     },
     "inWorkflow": "Dans le flux de travail",
     "infoPanelEmpty": "Cliquez sur un élément pour voir les informations",
-    "installAllMissingNodes": "Installer tous les nœuds manquants",
     "installSelected": "Installer sélectionné",
     "installationQueue": "File d'attente d'installation",
     "lastUpdated": "Dernière mise à jour",
@@ -684,7 +678,6 @@
   },
   "menuLabels": {
     "About ComfyUI": "À propos de ComfyUI",
-    "Add Edit Model Step": "Ajouter une étape d’édition de modèle",
     "Browse Templates": "Parcourir les modèles",
     "Bypass/Unbypass Selected Nodes": "Contourner/Ne pas contourner les nœuds sélectionnés",
     "Canvas Toggle Link Visibility": "Basculer la visibilité du lien de la toile",

src/locales/fr/settings.json

@@ -2,6 +2,10 @@
   "Comfy-Desktop_AutoUpdate": {
     "name": "Vérifier automatiquement les mises à jour"
   },
+  "Comfy-Desktop_LaunchOptions": {
+    "name": "Arguments de lancement personnalisés",
+    "tooltip": "Arguments de ligne de commande personnalisés pour lancer le backend (par exemple, --cpu). Nécessite un redémarrage."
+  },
   "Comfy-Desktop_SendStatistics": {
     "name": "Envoyer des métriques d'utilisation anonymes"
   },

src/locales/ja/commands.json

@@ -38,9 +38,6 @@
   "Comfy_BrowseTemplates": {
     "label": "テンプレートを参照"
   },
-  "Comfy_Canvas_AddEditModelStep": {
-    "label": "編集モデルステップを追加"
-  },
   "Comfy_Canvas_DeleteSelectedItems": {
     "label": "選択したアイテムを削除"
   },

src/locales/ja/main.json

@@ -551,11 +551,6 @@
     "uploadBackgroundImage": "背景画像をアップロード",
     "uploadTexture": "テクスチャをアップロード"
   },
-  "loadWorkflowWarning": {
-    "coreNodesFromVersion": "ComfyUI {version} が必要です：",
-    "outdatedVersion": "一部のノードはより新しいバージョンのComfyUIが必要です（現在のバージョン：{version}）。すべてのノードを使用するにはアップデートしてください。",
-    "outdatedVersionGeneric": "一部のノードはより新しいバージョンのComfyUIが必要です。すべてのノードを使用するにはアップデートしてください。"
-  },
   "maintenance": {
     "None": "なし",
     "OK": "OK",
@@ -591,7 +586,6 @@
     },
     "inWorkflow": "ワークフロー内",
     "infoPanelEmpty": "アイテムをクリックして情報を表示します",
-    "installAllMissingNodes": "すべての不足しているノードをインストール",
     "installSelected": "選択したものをインストール",
     "installationQueue": "インストールキュー",
     "lastUpdated": "最終更新日",
@@ -684,7 +678,6 @@
   },
   "menuLabels": {
     "About ComfyUI": "ComfyUIについて",
-    "Add Edit Model Step": "モデル編集ステップを追加",
     "Browse Templates": "テンプレートを参照",
     "Bypass/Unbypass Selected Nodes": "選択したノードのバイパス/バイパス解除",
     "Canvas Toggle Link Visibility": "キャンバスのリンク表示を切り替え",

src/locales/ja/settings.json

@@ -2,6 +2,10 @@
   "Comfy-Desktop_AutoUpdate": {
     "name": "自動的に更新を確認する"
   },
+  "Comfy-Desktop_LaunchOptions": {
+    "name": "カスタム起動引数",
+    "tooltip": "バックエンドを起動するためのカスタムコマンドライン引数（例: --cpu）。再起動が必要です。"
+  },
   "Comfy-Desktop_SendStatistics": {
     "name": "匿名の使用統計を送信する"
   },

src/locales/ko/commands.json

@@ -38,9 +38,6 @@
   "Comfy_BrowseTemplates": {
     "label": "템플릿 탐색"
   },
-  "Comfy_Canvas_AddEditModelStep": {
-    "label": "모델 편집 단계 추가"
-  },
   "Comfy_Canvas_DeleteSelectedItems": {
     "label": "선택한 항목 삭제"
   },

src/locales/ko/main.json

@@ -551,11 +551,6 @@
     "uploadBackgroundImage": "배경 이미지 업로드",
     "uploadTexture": "텍스처 업로드"
   },
-  "loadWorkflowWarning": {
-    "coreNodesFromVersion": "ComfyUI {version} 이상 필요:",
-    "outdatedVersion": "일부 노드는 더 최신 버전의 ComfyUI가 필요합니다 (현재: {version}). 모든 노드를 사용하려면 업데이트해 주세요.",
-    "outdatedVersionGeneric": "일부 노드는 더 최신 버전의 ComfyUI가 필요합니다. 모든 노드를 사용하려면 업데이트해 주세요."
-  },
   "maintenance": {
     "None": "없음",
     "OK": "확인",
@@ -591,7 +586,6 @@
     },
     "inWorkflow": "워크플로우 내",
     "infoPanelEmpty": "정보를 보려면 항목을 클릭하세요",
-    "installAllMissingNodes": "모든 누락된 노드 설치",
     "installSelected": "선택한 항목 설치",
     "installationQueue": "설치 대기열",
     "lastUpdated": "마지막 업데이트",
@@ -684,7 +678,6 @@
   },
   "menuLabels": {
     "About ComfyUI": "ComfyUI에 대하여",
-    "Add Edit Model Step": "모델 편집 단계 추가",
     "Browse Templates": "템플릿 탐색",
     "Bypass/Unbypass Selected Nodes": "선택한 노드 우회/우회 해제",
     "Canvas Toggle Link Visibility": "캔버스 토글 링크 가시성",

src/locales/ko/settings.json

@@ -2,6 +2,10 @@
   "Comfy-Desktop_AutoUpdate": {
     "name": "자동 업데이트 확인"
   },
+  "Comfy-Desktop_LaunchOptions": {
+    "name": "사용자 지정 실행 인수",
+    "tooltip": "백엔드 실행을 위한 사용자 지정 명령줄 인수입니다(예: --cpu). 재시작이 필요합니다."
+  },
   "Comfy-Desktop_SendStatistics": {
     "name": "익명 사용 통계 보내기"
   },

src/locales/ru/commands.json

@@ -38,9 +38,6 @@
   "Comfy_BrowseTemplates": {
     "label": "Просмотр шаблонов"
   },
-  "Comfy_Canvas_AddEditModelStep": {
-    "label": "Добавить или изменить шаг модели"
-  },
   "Comfy_Canvas_DeleteSelectedItems": {
     "label": "Удалить выбранные элементы"
   },

src/locales/ru/main.json

@@ -551,11 +551,6 @@
     "uploadBackgroundImage": "Загрузить фоновое изображение",
     "uploadTexture": "Загрузить текстуру"
   },
-  "loadWorkflowWarning": {
-    "coreNodesFromVersion": "Требуется ComfyUI {version}:",
-    "outdatedVersion": "Некоторые узлы требуют более новой версии ComfyUI (текущая: {version}). Пожалуйста, обновите, чтобы использовать все узлы.",
-    "outdatedVersionGeneric": "Некоторые узлы требуют более новой версии ComfyUI. Пожалуйста, обновите, чтобы использовать все узлы."
-  },
   "maintenance": {
     "None": "Нет",
     "OK": "OK",
@@ -591,7 +586,6 @@
     },
     "inWorkflow": "В рабочем процессе",
     "infoPanelEmpty": "Нажмите на элемент, чтобы увидеть информацию",
-    "installAllMissingNodes": "Установить все отсутствующие узлы",
     "installSelected": "Установить выбранное",
     "installationQueue": "Очередь установки",
     "lastUpdated": "Последнее обновление",
@@ -684,7 +678,6 @@
   },
   "menuLabels": {
     "About ComfyUI": "О ComfyUI",
-    "Add Edit Model Step": "Добавить или изменить шаг модели",
     "Browse Templates": "Просмотреть шаблоны",
     "Bypass/Unbypass Selected Nodes": "Обойти/восстановить выбранные ноды",
     "Canvas Toggle Link Visibility": "Переключение видимости ссылки на холст",

src/locales/ru/settings.json

@@ -2,6 +2,10 @@
   "Comfy-Desktop_AutoUpdate": {
     "name": "Автоматически проверять обновления"
   },
+  "Comfy-Desktop_LaunchOptions": {
+    "name": "Пользовательские параметры запуска",
+    "tooltip": "Пользовательские аргументы командной строки для запуска backend (например, --cpu). Требуется перезапуск."
+  },
   "Comfy-Desktop_SendStatistics": {
     "name": "Отправлять анонимную статистику использования"
   },

src/locales/zh/commands.json

@@ -38,9 +38,6 @@
   "Comfy_BrowseTemplates": {
     "label": "浏览模板"
   },
-  "Comfy_Canvas_AddEditModelStep": {
-    "label": "添加编辑模型步骤"
-  },
   "Comfy_Canvas_DeleteSelectedItems": {
     "label": "删除选定的项目"
   },

src/locales/zh/main.json

@@ -551,11 +551,6 @@
     "uploadBackgroundImage": "上传背景图片",
     "uploadTexture": "上传纹理"
   },
-  "loadWorkflowWarning": {
-    "coreNodesFromVersion": "需要 ComfyUI {version}：",
-    "outdatedVersion": "某些节点需要更高版本的 ComfyUI（当前版本：{version}）。请更新以使用所有节点。",
-    "outdatedVersionGeneric": "某些节点需要更高版本的 ComfyUI。请更新以使用所有节点。"
-  },
   "maintenance": {
     "None": "无",
     "OK": "确定",
@@ -591,7 +586,6 @@
     },
     "inWorkflow": "在工作流中",
     "infoPanelEmpty": "点击一个项目查看信息",
-    "installAllMissingNodes": "安装所有缺失节点",
     "installSelected": "安装选定",
     "installationQueue": "安装队列",
     "lastUpdated": "最后更新",
@@ -684,7 +678,6 @@
   },
   "menuLabels": {
     "About ComfyUI": "关于ComfyUI",
-    "Add Edit Model Step": "添加编辑模型步骤",
     "Browse Templates": "浏览模板",
     "Bypass/Unbypass Selected Nodes": "忽略/取消忽略选定节点",
     "Canvas Toggle Link Visibility": "切换连线可见性",
@@ -1044,9 +1037,9 @@
     "Extension": "扩展",
     "General": "常规",
     "Graph": "画面",
-    "Group": "组",
+    "Group": "组节点",
     "Keybinding": "快捷键",
-    "Light": "光照",
+    "Light": "浅色",
     "Link": "连线",
     "LinkRelease": "释放链接",
     "LiteGraph": "画面",

src/locales/zh/settings.json

@@ -2,6 +2,10 @@
   "Comfy-Desktop_AutoUpdate": {
     "name": "自动检查更新"
   },
+  "Comfy-Desktop_LaunchOptions": {
+    "name": "自定义启动参数",
+    "tooltip": "用于启动后端的自定义命令行参数（例如：--cpu）。需要重启。"
+  },
   "Comfy-Desktop_SendStatistics": {
     "name": "发送匿名使用情况统计"
   },

src/schemas/apiSchema.ts

@@ -11,13 +11,10 @@ import { LinkReleaseTriggerAction } from '@/types/searchBoxTypes'
 const zNodeType = z.string()
 const zQueueIndex = z.number()
 const zPromptId = z.string()
-export const resultItemType = z.enum(['input', 'output', 'temp'])
-export type ResultItemType = z.infer<typeof resultItemType>
-
 const zResultItem = z.object({
   filename: z.string().optional(),
   subfolder: z.string().optional(),
-  type: resultItemType.optional()
+  type: z.string().optional()
 })
 export type ResultItem = z.infer<typeof zResultItem>
 const zOutputs = z
@@ -453,6 +450,7 @@ const zSettings = z.object({
   'Comfy.TutorialCompleted': z.boolean(),
   'Comfy.Node.AllowImageSizeDraw': z.boolean(),
   'Comfy-Desktop.AutoUpdate': z.boolean(),
+  'Comfy-Desktop.LaunchOptions': z.string(),
   'Comfy-Desktop.SendStatistics': z.boolean(),
   'Comfy-Desktop.WindowStyle': z.string(),
   'Comfy-Desktop.UV.PythonInstallMirror': z.string(),

src/schemas/nodeDef/migration.ts

@@ -46,26 +46,22 @@ export function transformNodeDefV1ToV2(
   const outputs: OutputSpecV2[] = []
 
   if (nodeDefV1.output) {
-    if (Array.isArray(nodeDefV1.output)) {
-      nodeDefV1.output.forEach((outputType, index) => {
-        const outputSpec: OutputSpecV2 = {
-          index,
-          name: nodeDefV1.output_name?.[index] || `output_${index}`,
-          type: Array.isArray(outputType) ? 'COMBO' : outputType,
-          is_list: nodeDefV1.output_is_list?.[index] || false,
-          tooltip: nodeDefV1.output_tooltips?.[index]
-        }
+    nodeDefV1.output.forEach((outputType, index) => {
+      const outputSpec: OutputSpecV2 = {
+        index,
+        name: nodeDefV1.output_name?.[index] || `output_${index}`,
+        type: Array.isArray(outputType) ? 'COMBO' : outputType,
+        is_list: nodeDefV1.output_is_list?.[index] || false,
+        tooltip: nodeDefV1.output_tooltips?.[index]
+      }
 
-        // Add options for combo outputs
-        if (Array.isArray(outputType)) {
-          outputSpec.options = outputType
-        }
+      // Add options for combo outputs
+      if (Array.isArray(outputType)) {
+        outputSpec.options = outputType
+      }
 
-        outputs.push(outputSpec)
-      })
-    } else {
-      console.warn('nodeDefV1.output is not an array:', nodeDefV1.output)
-    }
+      outputs.push(outputSpec)
+    })
   }
 
   // Create the V2 node definition

src/schemas/nodeDefSchema.ts

@@ -1,8 +1,6 @@
 import { z } from 'zod'
 import { fromZodError } from 'zod-validation-error'
 
-import { resultItemType } from '@/schemas/apiSchema'
-
 const zComboOption = z.union([z.string(), z.number()])
 const zRemoteWidgetConfig = z.object({
   route: z.string().url().or(z.string().startsWith('/')),
@@ -74,7 +72,7 @@ export const zStringInputOptions = zBaseInputOptions.extend({
 export const zComboInputOptions = zBaseInputOptions.extend({
   control_after_generate: z.boolean().optional(),
   image_upload: z.boolean().optional(),
-  image_folder: resultItemType.optional(),
+  image_folder: z.enum(['input', 'output', 'temp']).optional(),
   allow_batch: z.boolean().optional(),
   video_upload: z.boolean().optional(),
   animated_image_upload: z.boolean().optional(),

src/scripts/fluxKontextEditNode.ts

@@ -1,693 +0,0 @@
-import {
-  type INodeOutputSlot,
-  type LGraph,
-  type LGraphNode,
-  LLink,
-  LiteGraph,
-  type Point
-} from '@comfyorg/litegraph'
-import type { IBaseWidget } from '@comfyorg/litegraph/dist/types/widgets'
-import _ from 'lodash'
-
-import { parseFilePath } from '@/utils/formatUtil'
-
-import { app } from './app'
-
-const fluxKontextGroupNode = {
-  nodes: [
-    {
-      id: -1,
-      type: 'Reroute',
-      pos: [2354.87890625, -127.23468780517578],
-      size: [75, 26],
-      flags: {},
-      order: 20,
-      mode: 0,
-      inputs: [{ name: '', type: '*', link: null }],
-      outputs: [{ name: '', type: '*', links: null }],
-      properties: { showOutputText: false, horizontal: false },
-      index: 0
-    },
-    {
-      id: -1,
-      type: 'ReferenceLatent',
-      pos: [2730, -220],
-      size: [197.712890625, 46],
-      flags: {},
-      order: 22,
-      mode: 0,
-      inputs: [
-        {
-          localized_name: 'conditioning',
-          name: 'conditioning',
-          type: 'CONDITIONING',
-          link: null
-        },
-        {
-          localized_name: 'latent',
-          name: 'latent',
-          shape: 7,
-          type: 'LATENT',
-          link: null
-        }
-      ],
-      outputs: [
-        {
-          localized_name: 'CONDITIONING',
-          name: 'CONDITIONING',
-          type: 'CONDITIONING',
-          links: []
-        }
-      ],
-      properties: {
-        'Node name for S&R': 'ReferenceLatent',
-        cnr_id: 'comfy-core',
-        ver: '0.3.38'
-      },
-      index: 1
-    },
-    {
-      id: -1,
-      type: 'VAEDecode',
-      pos: [3270, -110],
-      size: [210, 46],
-      flags: {},
-      order: 25,
-      mode: 0,
-      inputs: [
-        {
-          localized_name: 'samples',
-          name: 'samples',
-          type: 'LATENT',
-          link: null
-        },
-        {
-          localized_name: 'vae',
-          name: 'vae',
-          type: 'VAE',
-          link: null
-        }
-      ],
-      outputs: [
-        {
-          localized_name: 'IMAGE',
-          name: 'IMAGE',
-          type: 'IMAGE',
-          slot_index: 0,
-          links: []
-        }
-      ],
-      properties: {
-        'Node name for S&R': 'VAEDecode',
-        cnr_id: 'comfy-core',
-        ver: '0.3.38'
-      },
-      index: 2
-    },
-    {
-      id: -1,
-      type: 'KSampler',
-      pos: [2930, -110],
-      size: [315, 262],
-      flags: {},
-      order: 24,
-      mode: 0,
-      inputs: [
-        {
-          localized_name: 'model',
-          name: 'model',
-          type: 'MODEL',
-          link: null
-        },
-        {
-          localized_name: 'positive',
-          name: 'positive',
-          type: 'CONDITIONING',
-          link: null
-        },
-        {
-          localized_name: 'negative',
-          name: 'negative',
-          type: 'CONDITIONING',
-          link: null
-        },
-        {
-          localized_name: 'latent_image',
-          name: 'latent_image',
-          type: 'LATENT',
-          link: null
-        },
-        {
-          localized_name: 'seed',
-          name: 'seed',
-          type: 'INT',
-          widget: { name: 'seed' },
-          link: null
-        },
-        {
-          localized_name: 'steps',
-          name: 'steps',
-          type: 'INT',
-          widget: { name: 'steps' },
-          link: null
-        },
-        {
-          localized_name: 'cfg',
-          name: 'cfg',
-          type: 'FLOAT',
-          widget: { name: 'cfg' },
-          link: null
-        },
-        {
-          localized_name: 'sampler_name',
-          name: 'sampler_name',
-          type: 'COMBO',
-          widget: { name: 'sampler_name' },
-          link: null
-        },
-        {
-          localized_name: 'scheduler',
-          name: 'scheduler',
-          type: 'COMBO',
-          widget: { name: 'scheduler' },
-          link: null
-        },
-        {
-          localized_name: 'denoise',
-          name: 'denoise',
-          type: 'FLOAT',
-          widget: { name: 'denoise' },
-          link: null
-        }
-      ],
-      outputs: [
-        {
-          localized_name: 'LATENT',
-          name: 'LATENT',
-          type: 'LATENT',
-          slot_index: 0,
-          links: []
-        }
-      ],
-      properties: {
-        'Node name for S&R': 'KSampler',
-        cnr_id: 'comfy-core',
-        ver: '0.3.38'
-      },
-      widgets_values: [972054013131369, 'fixed', 20, 1, 'euler', 'simple', 1],
-      index: 3
-    },
-    {
-      id: -1,
-      type: 'FluxGuidance',
-      pos: [2940, -220],
-      size: [211.60000610351562, 58],
-      flags: {},
-      order: 23,
-      mode: 0,
-      inputs: [
-        {
-          localized_name: 'conditioning',
-          name: 'conditioning',
-          type: 'CONDITIONING',
-          link: null
-        },
-        {
-          localized_name: 'guidance',
-          name: 'guidance',
-          type: 'FLOAT',
-          widget: { name: 'guidance' },
-          link: null
-        }
-      ],
-      outputs: [
-        {
-          localized_name: 'CONDITIONING',
-          name: 'CONDITIONING',
-          type: 'CONDITIONING',
-          slot_index: 0,
-          links: []
-        }
-      ],
-      properties: {
-        'Node name for S&R': 'FluxGuidance',
-        cnr_id: 'comfy-core',
-        ver: '0.3.38'
-      },
-      widgets_values: [2.5],
-      index: 4
-    },
-    {
-      id: -1,
-      type: 'SaveImage',
-      pos: [3490, -110],
-      size: [985.3012084960938, 1060.3828125],
-      flags: {},
-      order: 26,
-      mode: 0,
-      inputs: [
-        {
-          localized_name: 'images',
-          name: 'images',
-          type: 'IMAGE',
-          link: null
-        },
-        {
-          localized_name: 'filename_prefix',
-          name: 'filename_prefix',
-          type: 'STRING',
-          widget: { name: 'filename_prefix' },
-          link: null
-        }
-      ],
-      outputs: [],
-      properties: { cnr_id: 'comfy-core', ver: '0.3.38' },
-      widgets_values: ['ComfyUI'],
-      index: 5
-    },
-    {
-      id: -1,
-      type: 'CLIPTextEncode',
-      pos: [2500, -110],
-      size: [422.84503173828125, 164.31304931640625],
-      flags: {},
-      order: 12,
-      mode: 0,
-      inputs: [
-        {
-          localized_name: 'clip',
-          name: 'clip',
-          type: 'CLIP',
-          link: null
-        },
-        {
-          localized_name: 'text',
-          name: 'text',
-          type: 'STRING',
-          widget: { name: 'text' },
-          link: null
-        }
-      ],
-      outputs: [
-        {
-          localized_name: 'CONDITIONING',
-          name: 'CONDITIONING',
-          type: 'CONDITIONING',
-          slot_index: 0,
-          links: []
-        }
-      ],
-      title: 'CLIP Text Encode (Positive Prompt)',
-      properties: {
-        'Node name for S&R': 'CLIPTextEncode',
-        cnr_id: 'comfy-core',
-        ver: '0.3.38'
-      },
-      widgets_values: ['there is a bright light'],
-      color: '#232',
-      bgcolor: '#353',
-      index: 6
-    },
-    {
-      id: -1,
-      type: 'CLIPTextEncode',
-      pos: [2504.1435546875, 97.9598617553711],
-      size: [422.84503173828125, 164.31304931640625],
-      flags: { collapsed: true },
-      order: 13,
-      mode: 0,
-      inputs: [
-        {
-          localized_name: 'clip',
-          name: 'clip',
-          type: 'CLIP',
-          link: null
-        },
-        {
-          localized_name: 'text',
-          name: 'text',
-          type: 'STRING',
-          widget: { name: 'text' },
-          link: null
-        }
-      ],
-      outputs: [
-        {
-          localized_name: 'CONDITIONING',
-          name: 'CONDITIONING',
-          type: 'CONDITIONING',
-          slot_index: 0,
-          links: []
-        }
-      ],
-      title: 'CLIP Text Encode (Negative Prompt)',
-      properties: {
-        'Node name for S&R': 'CLIPTextEncode',
-        cnr_id: 'comfy-core',
-        ver: '0.3.38'
-      },
-      widgets_values: [''],
-      color: '#322',
-      bgcolor: '#533',
-      index: 7
-    },
-    {
-      id: -1,
-      type: 'UNETLoader',
-      pos: [2630, -370],
-      size: [270, 82],
-      flags: {},
-      order: 6,
-      mode: 0,
-      inputs: [
-        {
-          localized_name: 'unet_name',
-          name: 'unet_name',
-          type: 'COMBO',
-          widget: { name: 'unet_name' },
-          link: null
-        },
-        {
-          localized_name: 'weight_dtype',
-          name: 'weight_dtype',
-          type: 'COMBO',
-          widget: { name: 'weight_dtype' },
-          link: null
-        }
-      ],
-      outputs: [
-        {
-          localized_name: 'MODEL',
-          name: 'MODEL',
-          type: 'MODEL',
-          links: []
-        }
-      ],
-      properties: {
-        'Node name for S&R': 'UNETLoader',
-        cnr_id: 'comfy-core',
-        ver: '0.3.38'
-      },
-      widgets_values: ['flux1-kontext-dev.safetensors', 'default'],
-      color: '#223',
-      bgcolor: '#335',
-      index: 8
-    },
-    {
-      id: -1,
-      type: 'DualCLIPLoader',
-      pos: [2100, -290],
-      size: [337.76861572265625, 130],
-      flags: {},
-      order: 8,
-      mode: 0,
-      inputs: [
-        {
-          localized_name: 'clip_name1',
-          name: 'clip_name1',
-          type: 'COMBO',
-          widget: { name: 'clip_name1' },
-          link: null
-        },
-        {
-          localized_name: 'clip_name2',
-          name: 'clip_name2',
-          type: 'COMBO',
-          widget: { name: 'clip_name2' },
-          link: null
-        },
-        {
-          localized_name: 'type',
-          name: 'type',
-          type: 'COMBO',
-          widget: { name: 'type' },
-          link: null
-        },
-        {
-          localized_name: 'device',
-          name: 'device',
-          shape: 7,
-          type: 'COMBO',
-          widget: { name: 'device' },
-          link: null
-        }
-      ],
-      outputs: [
-        {
-          localized_name: 'CLIP',
-          name: 'CLIP',
-          type: 'CLIP',
-          links: []
-        }
-      ],
-      properties: {
-        'Node name for S&R': 'DualCLIPLoader',
-        cnr_id: 'comfy-core',
-        ver: '0.3.38'
-      },
-      widgets_values: [
-        'clip_l.safetensors',
-        't5xxl_fp8_e4m3fn_scaled.safetensors',
-        'flux',
-        'default'
-      ],
-      color: '#223',
-      bgcolor: '#335',
-      index: 9
-    },
-    {
-      id: -1,
-      type: 'VAELoader',
-      pos: [2960, -370],
-      size: [270, 58],
-      flags: {},
-      order: 7,
-      mode: 0,
-      inputs: [
-        {
-          localized_name: 'vae_name',
-          name: 'vae_name',
-          type: 'COMBO',
-          widget: { name: 'vae_name' },
-          link: null
-        }
-      ],
-      outputs: [
-        {
-          localized_name: 'VAE',
-          name: 'VAE',
-          type: 'VAE',
-          links: []
-        }
-      ],
-      properties: {
-        'Node name for S&R': 'VAELoader',
-        cnr_id: 'comfy-core',
-        ver: '0.3.38'
-      },
-      widgets_values: ['ae.safetensors'],
-      color: '#223',
-      bgcolor: '#335',
-      index: 10
-    }
-  ],
-  links: [
-    [6, 0, 1, 0, 72, 'CONDITIONING'],
-    [0, 0, 1, 1, 66, '*'],
-    [3, 0, 2, 0, 69, 'LATENT'],
-    [10, 0, 2, 1, 76, 'VAE'],
-    [8, 0, 3, 0, 74, 'MODEL'],
-    [4, 0, 3, 1, 70, 'CONDITIONING'],
-    [7, 0, 3, 2, 73, 'CONDITIONING'],
-    [0, 0, 3, 3, 66, '*'],
-    [1, 0, 4, 0, 67, 'CONDITIONING'],
-    [2, 0, 5, 0, 68, 'IMAGE'],
-    [9, 0, 6, 0, 75, 'CLIP'],
-    [9, 0, 7, 0, 75, 'CLIP']
-  ],
-  external: [],
-  config: {
-    '0': {},
-    '1': {},
-    '2': { output: { '0': { visible: true } } },
-    '3': {
-      output: { '0': { visible: true } },
-      input: {
-        denoise: { visible: false },
-        cfg: { visible: false }
-      }
-    },
-    '4': {},
-    '5': {},
-    '6': {},
-    '7': { input: { text: { visible: false } } },
-    '8': { input: { weight_dtype: { visible: false } } },
-    '9': { input: { type: { visible: false }, device: { visible: false } } },
-    '10': {}
-  }
-}
-
-export async function ensureGraphHasFluxKontextGroupNode(
-  graph: LGraph & { extra: { groupNodes?: Record<string, any> } }
-) {
-  graph.extra ??= {}
-  graph.extra.groupNodes ??= {}
-  if (graph.extra.groupNodes['FLUX.1 Kontext Image Edit']) return
-
-  graph.extra.groupNodes['FLUX.1 Kontext Image Edit'] =
-    structuredClone(fluxKontextGroupNode)
-
-  // Lazy import to avoid circular dependency issues
-  const { GroupNodeConfig } = await import('@/extensions/core/groupNode')
-  await GroupNodeConfig.registerFromWorkflow(
-    {
-      'FLUX.1 Kontext Image Edit':
-        graph.extra.groupNodes['FLUX.1 Kontext Image Edit']
-    },
-    []
-  )
-}
-
-export async function addFluxKontextGroupNode(fromNode: LGraphNode) {
-  const { canvas } = app
-  const { graph } = canvas
-  if (!graph) throw new TypeError('Graph is not initialized')
-  await ensureGraphHasFluxKontextGroupNode(graph)
-
-  const node = LiteGraph.createNode('workflow>FLUX.1 Kontext Image Edit')
-  if (!node) throw new TypeError('Failed to create node')
-
-  const pos = getPosToRightOfNode(fromNode)
-
-  graph.add(node)
-  node.pos = pos
-  app.canvas.processSelect(node, undefined)
-
-  connectPreviousLatent(fromNode, node)
-
-  const symb = Object.getOwnPropertySymbols(node)[0]
-  // @ts-expect-error It's there -- promise.
-  node[symb].populateWidgets()
-
-  setWidgetValues(node)
-}
-
-function setWidgetValues(node: LGraphNode) {
-  const seedInput = node.widgets?.find((x) => x.name === 'seed')
-  if (!seedInput) throw new TypeError('Seed input not found')
-  seedInput.value = Math.floor(Math.random() * 1_125_899_906_842_624)
-
-  const firstClip = node.widgets?.find((x) => x.name === 'clip_name1')
-  setPreferredValue('t5xxl_fp8_e4m3fn_scaled.safetensors', 't5xxl', firstClip)
-
-  const secondClip = node.widgets?.find((x) => x.name === 'clip_name2')
-  setPreferredValue('clip_l.safetensors', 'clip_l', secondClip)
-
-  const unet = node.widgets?.find((x) => x.name === 'unet_name')
-  setPreferredValue('flux1-kontext-dev.safetensors', 'kontext', unet)
-
-  const vae = node.widgets?.find((x) => x.name === 'vae_name')
-  setPreferredValue('ae.safetensors', 'ae.s', vae)
-}
-
-function setPreferredValue(
-  preferred: string,
-  match: string,
-  widget: IBaseWidget | undefined
-): void {
-  if (!widget) throw new TypeError('Widget not found')
-
-  const { values } = widget.options
-  if (!Array.isArray(values)) return
-
-  // Match against filename portion only
-  const mapped = values.map((x) => parseFilePath(x).filename)
-  const value =
-    mapped.find((x) => x === preferred) ??
-    mapped.find((x) => x.includes?.(match))
-  widget.value = value ?? preferred
-}
-
-function getPosToRightOfNode(fromNode: LGraphNode) {
-  const nodes = app.canvas.graph?.nodes
-  if (!nodes) throw new TypeError('Could not get graph nodes')
-
-  const pos = [
-    fromNode.pos[0] + fromNode.size[0] + 100,
-    fromNode.pos[1]
-  ] satisfies Point
-
-  while (nodes.find((x) => isPointTooClose(x.pos, pos))) {
-    pos[0] += 20
-    pos[1] += 20
-  }
-
-  return pos
-}
-
-function connectPreviousLatent(fromNode: LGraphNode, toEditNode: LGraphNode) {
-  const { canvas } = app
-  const { graph } = canvas
-  if (!graph) throw new TypeError('Graph is not initialized')
-
-  const l = findNearestOutputOfType([fromNode], 'LATENT')
-  if (!l) {
-    const imageOutput = findNearestOutputOfType([fromNode], 'IMAGE')
-    if (!imageOutput) throw new TypeError('No image output found')
-
-    const vaeEncode = LiteGraph.createNode('VAEEncode')
-    if (!vaeEncode) throw new TypeError('Failed to create node')
-
-    const { node: imageNode, index: imageIndex } = imageOutput
-    graph.add(vaeEncode)
-    vaeEncode.pos = getPosToRightOfNode(fromNode)
-    vaeEncode.pos[1] -= 200
-
-    vaeEncode.connect(0, toEditNode, 0)
-    imageNode.connect(imageIndex, vaeEncode, 0)
-    return
-  }
-
-  const { node, index } = l
-
-  node.connect(index, toEditNode, 0)
-}
-
-function getInputNodes(node: LGraphNode): LGraphNode[] {
-  return node.inputs
-    .map((x) => LLink.resolve(x.link, app.graph)?.outputNode)
-    .filter((x) => !!x)
-}
-
-function getOutputOfType(
-  node: LGraphNode,
-  type: string
-): {
-  output: INodeOutputSlot
-  index: number
-} {
-  const index = node.outputs.findIndex((x) => x.type === type)
-  const output = node.outputs[index]
-  return { output, index }
-}
-
-function findNearestOutputOfType(
-  nodes: Iterable<LGraphNode>,
-  type: string = 'LATENT',
-  depth: number = 0
-): { node: LGraphNode; index: number } | undefined {
-  for (const node of nodes) {
-    const { output, index } = getOutputOfType(node, type)
-    if (output) return { node, index }
-  }
-
-  if (depth < 3) {
-    const closestNodes = new Set([...nodes].flatMap((x) => getInputNodes(x)))
-    const res = findNearestOutputOfType(closestNodes, type, depth + 1)
-    if (res) return res
-  }
-}
-
-function isPointTooClose(a: Point, b: Point, precision: number = 5) {
-  return Math.abs(a[0] - b[0]) < precision && Math.abs(a[1] - b[1]) < precision
-}

src/services/algoliaSearchService.ts

@@ -0,0 +1,175 @@
+import QuickLRU from '@alloc/quick-lru'
+import type {
+  SearchQuery,
+  SearchResponse
+} from 'algoliasearch/dist/lite/browser'
+import { liteClient as algoliasearch } from 'algoliasearch/dist/lite/builds/browser'
+import { omit } from 'lodash'
+
+import type {
+  AlgoliaNodePack,
+  NodesIndexSuggestion,
+  SearchAttribute,
+  SearchNodePacksParams,
+  SearchPacksResult
+} from '@/types/algoliaTypes'
+import type { components } from '@/types/comfyRegistryTypes'
+import { paramsToCacheKey } from '@/utils/formatUtil'
+
+type RegistryNodePack = components['schemas']['Node']
+
+const DEFAULT_MAX_CACHE_SIZE = 64
+const DEFAULT_MIN_CHARS_FOR_SUGGESTIONS = 2
+
+const RETRIEVE_ATTRIBUTES: SearchAttribute[] = [
+  'comfy_nodes',
+  'name',
+  'description',
+  'latest_version',
+  'status',
+  'publisher_id',
+  'total_install',
+  'create_time',
+  'update_time',
+  'license',
+  'repository_url',
+  'latest_version_status',
+  'comfy_node_extract_status',
+  'id',
+  'icon_url'
+]
+
+interface AlgoliaSearchServiceOptions {
+  /**
+   * Minimum number of characters for suggestions. An additional query
+   * will be made to the suggestions/completions index for queries that
+   * are this length or longer.
+   * @default 3
+   */
+  minCharsForSuggestions?: number
+}
+
+const searchPacksCache = new QuickLRU<string, SearchPacksResult>({
+  maxSize: DEFAULT_MAX_CACHE_SIZE
+})
+
+export const useAlgoliaSearchService = (
+  options: AlgoliaSearchServiceOptions = {}
+) => {
+  const { minCharsForSuggestions = DEFAULT_MIN_CHARS_FOR_SUGGESTIONS } = options
+  const searchClient = algoliasearch(__ALGOLIA_APP_ID__, __ALGOLIA_API_KEY__)
+
+  const toRegistryLatestVersion = (
+    algoliaNode: AlgoliaNodePack
+  ): RegistryNodePack['latest_version'] => {
+    return {
+      version: algoliaNode.latest_version,
+      createdAt: algoliaNode.update_time,
+      status: algoliaNode.latest_version_status,
+      comfy_node_extract_status:
+        algoliaNode.comfy_node_extract_status ?? undefined
+    }
+  }
+
+  const toRegistryPublisher = (
+    algoliaNode: AlgoliaNodePack
+  ): RegistryNodePack['publisher'] => {
+    return {
+      id: algoliaNode.publisher_id,
+      name: algoliaNode.publisher_id
+    }
+  }
+
+  /**
+   * Convert from node pack in Algolia format to Comfy Registry format
+   */
+  function toRegistryPack(algoliaNode: AlgoliaNodePack): RegistryNodePack {
+    return {
+      id: algoliaNode.id ?? algoliaNode.objectID,
+      name: algoliaNode.name,
+      description: algoliaNode.description,
+      repository: algoliaNode.repository_url,
+      license: algoliaNode.license,
+      downloads: algoliaNode.total_install,
+      status: algoliaNode.status,
+      icon: algoliaNode.icon_url,
+      latest_version: toRegistryLatestVersion(algoliaNode),
+      publisher: toRegistryPublisher(algoliaNode),
+      // @ts-expect-error remove when comfy_nodes is added to node (pack) info
+      comfy_nodes: algoliaNode.comfy_nodes
+    }
+  }
+
+  /**
+   * Search for node packs in Algolia
+   */
+  const searchPacks = async (
+    query: string,
+    params: SearchNodePacksParams
+  ): Promise<SearchPacksResult> => {
+    const { pageSize, pageNumber } = params
+    const rest = omit(params, ['pageSize', 'pageNumber'])
+
+    const requests: SearchQuery[] = [
+      {
+        query,
+        indexName: 'nodes_index',
+        attributesToRetrieve: RETRIEVE_ATTRIBUTES,
+        ...rest,
+        hitsPerPage: pageSize,
+        page: pageNumber
+      }
+    ]
+
+    const shouldQuerySuggestions = query.length >= minCharsForSuggestions
+
+    // If the query is long enough, also query the suggestions index
+    if (shouldQuerySuggestions) {
+      requests.push({
+        indexName: 'nodes_index_query_suggestions',
+        query
+      })
+    }
+
+    const { results } = await searchClient.search<
+      AlgoliaNodePack | NodesIndexSuggestion
+    >({
+      requests,
+      strategy: 'none'
+    })
+
+    const [nodePacks, querySuggestions = { hits: [] }] = results as [
+      SearchResponse<AlgoliaNodePack>,
+      SearchResponse<NodesIndexSuggestion>
+    ]
+
+    return {
+      nodePacks: nodePacks.hits,
+      querySuggestions: querySuggestions.hits
+    }
+  }
+
+  const searchPacksCached = async (
+    query: string,
+    params: SearchNodePacksParams
+  ): Promise<SearchPacksResult> => {
+    const cacheKey = paramsToCacheKey({ query, ...params })
+    const cachedResult = searchPacksCache.get(cacheKey)
+    if (cachedResult !== undefined) return cachedResult
+
+    const result = await searchPacks(query, params)
+    searchPacksCache.set(cacheKey, result)
+    return result
+  }
+
+  const clearSearchPacksCache = () => {
+    searchPacksCache.clear()
+  }
+
+  return {
+    searchPacks,
+    searchPacksCached,
+    toRegistryPack,
+    clearSearchPacksCache
+  }
+}

src/services/dialogService.ts

@@ -137,17 +137,8 @@ export const useDialogService = () => {
       dialogComponentProps: {
         closable: true,
         pt: {
-          pcCloseButton: {
-            root: {
-              class:
-                'bg-gray-500 dark-theme:bg-neutral-700 w-9 h-9 p-1.5 rounded-full text-white'
-            }
-          },
-          header: { class: '!py-0 px-6 !m-0 h-[68px]' },
-          content: {
-            class: '!p-0 h-full w-[90vw] max-w-full flex-1 overflow-hidden'
-          },
-          root: { class: 'manager-dialog' }
+          header: { class: '!p-0 !m-0' },
+          content: { class: '!px-0 h-[83vh] w-[90vw] overflow-y-hidden' }
         }
       },
       props
@@ -163,7 +154,6 @@ export const useDialogService = () => {
       headerComponent: ManagerProgressHeader,
       footerComponent: ManagerProgressFooter,
       props: options?.props,
-      priority: 2,
       dialogComponentProps: {
         closable: false,
         modal: false,

src/services/gateway/registrySearchGateway.ts

@@ -1,227 +0,0 @@
-import { useAlgoliaSearchProvider } from '@/services/providers/algoliaSearchProvider'
-import { useComfyRegistrySearchProvider } from '@/services/providers/registrySearchProvider'
-import type { SearchNodePacksParams } from '@/types/algoliaTypes'
-import type { components } from '@/types/comfyRegistryTypes'
-import type {
-  NodePackSearchProvider,
-  SearchPacksResult
-} from '@/types/searchServiceTypes'
-
-type RegistryNodePack = components['schemas']['Node']
-
-interface ProviderState {
-  provider: NodePackSearchProvider
-  name: string
-  isHealthy: boolean
-  lastError?: Error
-  lastAttempt?: Date
-  consecutiveFailures: number
-}
-
-const CIRCUIT_BREAKER_THRESHOLD = 3 // Number of failures before circuit opens
-const CIRCUIT_BREAKER_TIMEOUT = 60000 // 1 minute before retry
-
-/**
- * API Gateway for registry search providers with circuit breaker pattern.
- * Acts as a single entry point that routes search requests to appropriate providers
- * and handles failures gracefully by falling back to alternative providers.
- *
- * Implements:
- * - Gateway pattern: Single entry point for all search requests
- * - Circuit breaker: Prevents repeated calls to failed services
- * - Automatic failover: Cascades through providers on failure
- */
-export const useRegistrySearchGateway = (): NodePackSearchProvider => {
-  const providers: ProviderState[] = []
-  let activeProviderIndex = 0
-
-  // Initialize providers in priority order
-  try {
-    providers.push({
-      provider: useAlgoliaSearchProvider(),
-      name: 'Algolia',
-      isHealthy: true,
-      consecutiveFailures: 0
-    })
-  } catch (error) {
-    console.warn('Failed to initialize Algolia provider:', error)
-  }
-
-  providers.push({
-    provider: useComfyRegistrySearchProvider(),
-    name: 'ComfyRegistry',
-    isHealthy: true,
-    consecutiveFailures: 0
-  })
-
-  // TODO: Add an "offline" provider that operates on a local cache of the registry.
-
-  /**
-   * Check if a provider's circuit breaker should be closed (available to try)
-   */
-  const isCircuitClosed = (providerState: ProviderState): boolean => {
-    if (providerState.consecutiveFailures < CIRCUIT_BREAKER_THRESHOLD) {
-      return true
-    }
-
-    // Check if enough time has passed to retry
-    if (providerState.lastAttempt) {
-      const timeSinceLastAttempt =
-        Date.now() - providerState.lastAttempt.getTime()
-      if (timeSinceLastAttempt > CIRCUIT_BREAKER_TIMEOUT) {
-        console.info(
-          `Retrying ${providerState.name} provider after circuit breaker timeout`
-        )
-        return true
-      }
-    }
-
-    return false
-  }
-
-  /**
-   * Record a successful call to a provider
-   */
-  const recordSuccess = (providerState: ProviderState) => {
-    providerState.isHealthy = true
-    providerState.consecutiveFailures = 0
-    providerState.lastError = undefined
-  }
-
-  /**
-   * Record a failed call to a provider
-   */
-  const recordFailure = (providerState: ProviderState, error: Error) => {
-    providerState.consecutiveFailures++
-    providerState.lastError = error
-    providerState.lastAttempt = new Date()
-
-    if (providerState.consecutiveFailures >= CIRCUIT_BREAKER_THRESHOLD) {
-      providerState.isHealthy = false
-      console.warn(
-        `${providerState.name} provider circuit breaker opened after ${providerState.consecutiveFailures} failures`
-      )
-    }
-  }
-
-  /**
-   * Get the currently active provider based on circuit breaker states
-   */
-  const getActiveProvider = (): NodePackSearchProvider => {
-    // First, try to use the current active provider if it's healthy
-    const currentProvider = providers[activeProviderIndex]
-    if (currentProvider && isCircuitClosed(currentProvider)) {
-      return currentProvider.provider
-    }
-
-    // Otherwise, find the first healthy provider
-    for (let i = 0; i < providers.length; i++) {
-      const providerState = providers[i]
-      if (isCircuitClosed(providerState)) {
-        activeProviderIndex = i
-        return providerState.provider
-      }
-    }
-
-    throw new Error('No available search providers')
-  }
-
-  /**
-   * Update the active provider index after a failure.
-   * Move to the next provider if available.
-   */
-  const updateActiveProviderOnFailure = () => {
-    if (activeProviderIndex < providers.length - 1) {
-      activeProviderIndex++
-    }
-  }
-
-  /**
-   * Search for node packs.
-   */
-  const searchPacks = async (
-    query: string,
-    params: SearchNodePacksParams
-  ): Promise<SearchPacksResult> => {
-    let lastError: Error | null = null
-
-    // Start with the current active provider
-    for (let attempts = 0; attempts < providers.length; attempts++) {
-      try {
-        const provider = getActiveProvider()
-        const providerState = providers[activeProviderIndex]
-
-        const result = await provider.searchPacks(query, params)
-        recordSuccess(providerState)
-        return result
-      } catch (error) {
-        lastError = error as Error
-        const providerState = providers[activeProviderIndex]
-        recordFailure(providerState, lastError)
-        console.warn(
-          `${providerState.name} search provider failed (${providerState.consecutiveFailures} failures):`,
-          error
-        )
-
-        // Try the next provider
-        updateActiveProviderOnFailure()
-      }
-    }
-
-    // If we get here, all providers failed
-    throw new Error(
-      `All search providers failed. Last error: ${lastError?.message || 'Unknown error'}`
-    )
-  }
-
-  /**
-   * Clear the search cache for all providers that implement it.
-   */
-  const clearSearchCache = () => {
-    for (const providerState of providers) {
-      try {
-        providerState.provider.clearSearchCache()
-      } catch (error) {
-        console.warn(
-          `Failed to clear cache for ${providerState.name} provider:`,
-          error
-        )
-      }
-    }
-  }
-
-  /**
-   * Get the sort value for a pack.
-   * @example
-   * const pack = {
-   *   id: '123',
-   *   name: 'Test Pack',
-   *   downloads: 100
-   * }
-   * const sortValue = getSortValue(pack, 'downloads')
-   * console.log(sortValue) // 100
-   */
-  const getSortValue = (
-    pack: RegistryNodePack,
-    sortField: string
-  ): string | number => {
-    return getActiveProvider().getSortValue(pack, sortField)
-  }
-
-  /**
-   * Get the sortable fields for the active provider.
-   * @example
-   * const sortableFields = getSortableFields()
-   * console.log(sortableFields) // ['downloads', 'created', 'updated', 'publisher', 'name']
-   */
-  const getSortableFields = () => {
-    return getActiveProvider().getSortableFields()
-  }
-
-  return {
-    searchPacks,
-    clearSearchCache,
-    getSortValue,
-    getSortableFields
-  }
-}

src/services/providers/algoliaSearchProvider.ts

@@ -1,247 +0,0 @@
-import QuickLRU from '@alloc/quick-lru'
-import type {
-  SearchQuery,
-  SearchResponse
-} from 'algoliasearch/dist/lite/browser'
-import { liteClient as algoliasearch } from 'algoliasearch/dist/lite/builds/browser'
-import { memoize, omit } from 'lodash'
-
-import {
-  MIN_CHARS_FOR_SUGGESTIONS_ALGOLIA,
-  SEARCH_CACHE_MAX_SIZE
-} from '@/constants/searchConstants'
-import type {
-  AlgoliaNodePack,
-  NodesIndexSuggestion,
-  SearchAttribute,
-  SearchNodePacksParams
-} from '@/types/algoliaTypes'
-import { SortableAlgoliaField } from '@/types/comfyManagerTypes'
-import type { components } from '@/types/comfyRegistryTypes'
-import type {
-  NodePackSearchProvider,
-  SearchPacksResult,
-  SortableField
-} from '@/types/searchServiceTypes'
-import { paramsToCacheKey } from '@/utils/formatUtil'
-
-type RegistryNodePack = components['schemas']['Node']
-
-const RETRIEVE_ATTRIBUTES: SearchAttribute[] = [
-  'comfy_nodes',
-  'name',
-  'description',
-  'latest_version',
-  'status',
-  'publisher_id',
-  'total_install',
-  'create_time',
-  'update_time',
-  'license',
-  'repository_url',
-  'latest_version_status',
-  'comfy_node_extract_status',
-  'id',
-  'icon_url',
-  'github_stars',
-  'supported_os',
-  'supported_comfyui_version',
-  'supported_comfyui_frontend_version',
-  'supported_accelerators',
-  'banner_url'
-]
-
-const searchPacksCache = new QuickLRU<string, SearchPacksResult>({
-  maxSize: SEARCH_CACHE_MAX_SIZE
-})
-
-const toRegistryLatestVersion = (
-  algoliaNode: AlgoliaNodePack
-): RegistryNodePack['latest_version'] => {
-  return {
-    version: algoliaNode.latest_version,
-    createdAt: algoliaNode.update_time,
-    status: algoliaNode.latest_version_status,
-    comfy_node_extract_status:
-      algoliaNode.comfy_node_extract_status ?? undefined
-  }
-}
-
-const toRegistryPublisher = (
-  algoliaNode: AlgoliaNodePack
-): RegistryNodePack['publisher'] => {
-  return {
-    id: algoliaNode.publisher_id,
-    name: algoliaNode.publisher_id
-  }
-}
-
-/**
- * Convert from node pack in Algolia format to Comfy Registry format
- */
-const toRegistryPack = memoize(
-  (
-    algoliaNode: AlgoliaNodePack
-  ): RegistryNodePack & { comfy_nodes: string[] } => {
-    return {
-      id: algoliaNode.id ?? algoliaNode.objectID,
-      name: algoliaNode.name,
-      description: algoliaNode.description,
-      repository: algoliaNode.repository_url,
-      license: algoliaNode.license,
-      downloads: algoliaNode.total_install,
-      status: algoliaNode.status,
-      icon: algoliaNode.icon_url,
-      latest_version: toRegistryLatestVersion(algoliaNode),
-      publisher: toRegistryPublisher(algoliaNode),
-      created_at: algoliaNode.create_time,
-      category: algoliaNode.category,
-      author: algoliaNode.author,
-      tags: algoliaNode.tags,
-      github_stars: algoliaNode.github_stars,
-      supported_os: algoliaNode.supported_os,
-      supported_comfyui_version: algoliaNode.supported_comfyui_version,
-      supported_comfyui_frontend_version:
-        algoliaNode.supported_comfyui_frontend_version,
-      supported_accelerators: algoliaNode.supported_accelerators,
-      banner_url: algoliaNode.banner_url,
-      comfy_nodes: algoliaNode.comfy_nodes
-    }
-  },
-  (algoliaNode: AlgoliaNodePack) => algoliaNode.id
-)
-
-export const useAlgoliaSearchProvider = (): NodePackSearchProvider => {
-  const searchClient = algoliasearch(__ALGOLIA_APP_ID__, __ALGOLIA_API_KEY__)
-
-  /**
-   * Search for node packs in Algolia (internal method)
-   */
-  const searchPacksInternal = async (
-    query: string,
-    params: SearchNodePacksParams
-  ): Promise<SearchPacksResult> => {
-    const { pageSize, pageNumber } = params
-    const rest = omit(params, ['pageSize', 'pageNumber'])
-
-    const requests: SearchQuery[] = [
-      {
-        query,
-        indexName: 'nodes_index',
-        attributesToRetrieve: RETRIEVE_ATTRIBUTES,
-        ...rest,
-        hitsPerPage: pageSize,
-        page: pageNumber
-      }
-    ]
-
-    const shouldQuerySuggestions =
-      query.length >= MIN_CHARS_FOR_SUGGESTIONS_ALGOLIA
-
-    // If the query is long enough, also query the suggestions index
-    if (shouldQuerySuggestions) {
-      requests.push({
-        indexName: 'nodes_index_query_suggestions',
-        query
-      })
-    }
-
-    const { results } = await searchClient.search<
-      AlgoliaNodePack | NodesIndexSuggestion
-    >({
-      requests,
-      strategy: 'none'
-    })
-
-    const [nodePacks, querySuggestions = { hits: [] }] = results as [
-      SearchResponse<AlgoliaNodePack>,
-      SearchResponse<NodesIndexSuggestion>
-    ]
-
-    // Convert Algolia hits to RegistryNodePack format
-    const registryPacks = nodePacks.hits.map(toRegistryPack)
-
-    // Extract query suggestions from search results
-    const suggestions = querySuggestions.hits.map((suggestion) => ({
-      query: suggestion.query,
-      popularity: suggestion.popularity
-    }))
-
-    return {
-      nodePacks: registryPacks,
-      querySuggestions: suggestions
-    }
-  }
-
-  /**
-   * Search for node packs in Algolia with caching.
-   */
-  const searchPacks = async (
-    query: string,
-    params: SearchNodePacksParams
-  ): Promise<SearchPacksResult> => {
-    const cacheKey = paramsToCacheKey({ query, ...params })
-    const cachedResult = searchPacksCache.get(cacheKey)
-    if (cachedResult !== undefined) return cachedResult
-
-    const result = await searchPacksInternal(query, params)
-    searchPacksCache.set(cacheKey, result)
-    return result
-  }
-
-  const clearSearchCache = () => {
-    searchPacksCache.clear()
-  }
-
-  const getSortValue = (
-    pack: RegistryNodePack,
-    sortField: string
-  ): string | number => {
-    // For Algolia, we rely on the default sorting behavior
-    // The results are already sorted by the index configuration
-    // This is mainly used for re-sorting after results are fetched
-    switch (sortField) {
-      case SortableAlgoliaField.Downloads:
-        return pack.downloads ?? 0
-      case SortableAlgoliaField.Created: {
-        const createTime = pack.created_at
-        return createTime ? new Date(createTime).getTime() : 0
-      }
-      case SortableAlgoliaField.Updated:
-        return pack.latest_version?.createdAt
-          ? new Date(pack.latest_version.createdAt).getTime()
-          : 0
-      case SortableAlgoliaField.Publisher:
-        return pack.publisher?.name ?? ''
-      case SortableAlgoliaField.Name:
-        return pack.name ?? ''
-      default:
-        return 0
-    }
-  }
-
-  const getSortableFields = (): SortableField[] => {
-    return [
-      {
-        id: SortableAlgoliaField.Downloads,
-        label: 'Downloads',
-        direction: 'desc'
-      },
-      { id: SortableAlgoliaField.Created, label: 'Created', direction: 'desc' },
-      { id: SortableAlgoliaField.Updated, label: 'Updated', direction: 'desc' },
-      {
-        id: SortableAlgoliaField.Publisher,
-        label: 'Publisher',
-        direction: 'asc'
-      },
-      { id: SortableAlgoliaField.Name, label: 'Name', direction: 'asc' }
-    ]
-  }
-
-  return {
-    searchPacks,
-    clearSearchCache,
-    getSortValue,
-    getSortableFields
-  }
-}

src/services/providers/registrySearchProvider.ts

@@ -1,92 +0,0 @@
-import { useComfyRegistryStore } from '@/stores/comfyRegistryStore'
-import type { SearchNodePacksParams } from '@/types/algoliaTypes'
-import type { components } from '@/types/comfyRegistryTypes'
-import type {
-  NodePackSearchProvider,
-  SearchPacksResult,
-  SortableField
-} from '@/types/searchServiceTypes'
-
-type RegistryNodePack = components['schemas']['Node']
-
-/**
- * Search provider for the Comfy Registry.
- * Uses public Comfy Registry API.
- */
-export const useComfyRegistrySearchProvider = (): NodePackSearchProvider => {
-  const registryStore = useComfyRegistryStore()
-
-  /**
-   * Search for node packs using the Comfy Registry API.
-   */
-  const searchPacks = async (
-    query: string,
-    params: SearchNodePacksParams
-  ): Promise<SearchPacksResult> => {
-    const { pageSize, pageNumber, restrictSearchableAttributes } = params
-
-    // Determine search mode based on searchable attributes
-    const isNodeSearch = restrictSearchableAttributes?.includes('comfy_nodes')
-
-    const searchParams = {
-      search: isNodeSearch ? undefined : query,
-      comfy_node_search: isNodeSearch ? query : undefined,
-      limit: pageSize,
-      page: pageNumber + 1 // Registry API uses 1-based pagination
-    }
-
-    const searchResult = await registryStore.search.call(searchParams)
-
-    if (!searchResult || !searchResult.nodes) {
-      return {
-        nodePacks: [],
-        querySuggestions: []
-      }
-    }
-
-    return {
-      nodePacks: searchResult.nodes,
-      querySuggestions: [] // Registry doesn't support query suggestions
-    }
-  }
-
-  const clearSearchCache = () => {
-    registryStore.search.clear()
-  }
-
-  const getSortValue = (
-    pack: RegistryNodePack,
-    sortField: string
-  ): string | number => {
-    switch (sortField) {
-      case 'downloads':
-        return pack.downloads ?? 0
-      case 'name':
-        return pack.name ?? ''
-      case 'publisher':
-        return pack.publisher?.name ?? ''
-      case 'updated':
-        return pack.latest_version?.createdAt
-          ? new Date(pack.latest_version.createdAt).getTime()
-          : 0
-      default:
-        return 0
-    }
-  }
-
-  const getSortableFields = (): SortableField[] => {
-    return [
-      { id: 'downloads', label: 'Downloads', direction: 'desc' },
-      { id: 'name', label: 'Name', direction: 'asc' },
-      { id: 'publisher', label: 'Publisher', direction: 'asc' },
-      { id: 'updated', label: 'Updated', direction: 'desc' }
-    ]
-  }
-
-  return {
-    searchPacks,
-    clearSearchCache,
-    getSortValue,
-    getSortableFields
-  }
-}

src/stores/comfyManagerStore.ts

@@ -213,7 +213,6 @@ export const useComfyManagerStore = defineStore('comfyManager', () => {
     isPackInstalled: isInstalledPackId,
     isPackEnabled: isEnabledPackId,
     getInstalledPackVersion,
-    refreshInstalledList,
 
     // Pack actions
     installPack,

src/stores/dialogStore.ts

@@ -40,7 +40,6 @@ interface DialogInstance {
   contentProps: Record<string, any>
   footerComponent?: Component
   dialogComponentProps: DialogComponentProps
-  priority: number
 }
 
 export interface ShowDialogOptions {
@@ -51,12 +50,6 @@ export interface ShowDialogOptions {
   component: Component
   props?: Record<string, any>
   dialogComponentProps?: DialogComponentProps
-  /**
-   * Optional priority for dialog stacking.
-   * A dialog will never be shown above a dialog with a higher priority.
-   * @default 1
-   */
-  priority?: number
 }
 
 export const useDialogStore = defineStore('dialog', () => {
@@ -64,29 +57,13 @@ export const useDialogStore = defineStore('dialog', () => {
 
   const genDialogKey = () => `dialog-${Math.random().toString(36).slice(2, 9)}`
 
-  /**
-   * Inserts a dialog into the stack at the correct position based on priority.
-   * Higher priority dialogs are placed before lower priority ones.
-   */
-  function insertDialogByPriority(dialog: DialogInstance) {
-    const insertIndex = dialogStack.value.findIndex(
-      (d) => d.priority <= dialog.priority
-    )
-
-    dialogStack.value.splice(
-      insertIndex === -1 ? dialogStack.value.length : insertIndex,
-      0,
-      dialog
-    )
-  }
-
   function riseDialog(options: { key: string }) {
     const dialogKey = options.key
 
     const index = dialogStack.value.findIndex((d) => d.key === dialogKey)
     if (index !== -1) {
-      const [dialog] = dialogStack.value.splice(index, 1)
-      insertDialogByPriority(dialog)
+      const dialogs = dialogStack.value.splice(index, 1)
+      dialogStack.value.push(...dialogs)
     }
   }
 
@@ -108,13 +85,12 @@ export const useDialogStore = defineStore('dialog', () => {
     component: Component
     props?: Record<string, any>
     dialogComponentProps?: DialogComponentProps
-    priority?: number
   }) {
     if (dialogStack.value.length >= 10) {
       dialogStack.value.shift()
     }
 
-    const dialog: DialogInstance = {
+    const dialog = {
       key: options.key,
       visible: true,
       title: options.title,
@@ -126,7 +102,6 @@ export const useDialogStore = defineStore('dialog', () => {
         : undefined,
       component: markRaw(options.component),
       contentProps: { ...options.props },
-      priority: options.priority ?? 1,
       dialogComponentProps: {
         maximizable: false,
         modal: true,
@@ -135,7 +110,6 @@ export const useDialogStore = defineStore('dialog', () => {
         dismissableMask: true,
         ...options.dialogComponentProps,
         maximized: false,
-        // @ts-expect-error TODO: fix this
         onMaximize: () => {
           dialog.dialogComponentProps.maximized = true
         },
@@ -154,8 +128,7 @@ export const useDialogStore = defineStore('dialog', () => {
         })
       }
     }
-
-    insertDialogByPriority(dialog)
+    dialogStack.value.push(dialog)
 
     return dialog
   }

src/stores/imagePreviewStore.ts

@@ -1,11 +1,7 @@
 import { LGraphNode } from '@comfyorg/litegraph'
 import { defineStore } from 'pinia'
 
-import {
-  ExecutedWsMessage,
-  ResultItem,
-  ResultItemType
-} from '@/schemas/apiSchema'
+import { ExecutedWsMessage, ResultItem } from '@/schemas/apiSchema'
 import { api } from '@/scripts/api'
 import { app } from '@/scripts/app'
 import { parseFilePath } from '@/utils/formatUtil'
@@ -13,7 +9,7 @@ import { isVideoNode } from '@/utils/litegraphUtil'
 
 const createOutputs = (
   filenames: string[],
-  type: ResultItemType,
+  type: string,
   isAnimated: boolean
 ): ExecutedWsMessage['output'] => {
   return {
@@ -92,7 +88,7 @@ export const useNodeOutputStore = defineStore('nodeOutput', () => {
     {
       folder = 'input',
       isAnimated = false
-    }: { folder?: ResultItemType; isAnimated?: boolean } = {}
+    }: { folder?: string; isAnimated?: boolean } = {}
   ) {
     if (!filenames || !node) return
 

src/types/algoliaTypes.ts

@@ -12,20 +12,11 @@ type SafeNestedProperty<
 > = T[K1] extends undefined | null ? undefined : NonNullable<T[K1]>[K2]
 
 type RegistryNodePack = components['schemas']['Node']
-
-/**
- * Result of searching the Algolia index.
- * Represents the entire result of a search query.
- */
 export type SearchPacksResult = {
   nodePacks: Hit<AlgoliaNodePack>[]
   querySuggestions: Hit<NodesIndexSuggestion>[]
 }
 
-/**
- * Node pack record after it has been mapped to Algolia index format.
- * @see https://github.com/Comfy-Org/comfy-api/blob/main/mapper/algolia.go
- */
 export interface AlgoliaNodePack {
   objectID: RegistryNodePack['id']
   name: RegistryNodePack['name']
@@ -59,25 +50,9 @@ export interface AlgoliaNodePack {
     'comfy_node_extract_status'
   >
   icon_url: RegistryNodePack['icon']
-  category: RegistryNodePack['category']
-  author: RegistryNodePack['author']
-  tags: RegistryNodePack['tags']
-  github_stars: RegistryNodePack['github_stars']
-  supported_os: RegistryNodePack['supported_os']
-  supported_comfyui_version: RegistryNodePack['supported_comfyui_version']
-  supported_comfyui_frontend_version: RegistryNodePack['supported_comfyui_frontend_version']
-  supported_accelerators: RegistryNodePack['supported_accelerators']
-  banner_url: RegistryNodePack['banner_url']
 }
 
-/**
- * An attribute that can be used to search the Algolia index by.
- */
 export type SearchAttribute = keyof AlgoliaNodePack
-
-/**
- * Suggestion for a search query (autocomplete).
- */
 export interface NodesIndexSuggestion {
   nb_words: number
   nodes_index: {
@@ -92,11 +67,8 @@ export interface NodesIndexSuggestion {
   query: string
 }
 
-/**
- * Parameters for searching the Algolia index.
- */
 export type SearchNodePacksParams = BaseSearchParamsWithoutQuery & {
   pageSize: number
   pageNumber: number
-  restrictSearchableAttributes?: SearchAttribute[]
+  restrictSearchableAttributes: SearchAttribute[]
 }

src/types/comfyManagerTypes.ts

@@ -3,7 +3,6 @@ import type { InjectionKey, Ref } from 'vue'
 import type { ComfyWorkflowJSON } from '@/schemas/comfyWorkflowSchema'
 import type { AlgoliaNodePack } from '@/types/algoliaTypes'
 import type { components } from '@/types/comfyRegistryTypes'
-import type { SearchMode } from '@/types/searchServiceTypes'
 
 type WorkflowNodeProperties = ComfyWorkflowJSON['nodes'][0]['properties']
 
@@ -239,6 +238,6 @@ export interface UpdateAllPacksParams {
 export interface ManagerState {
   selectedTabId: ManagerTab
   searchQuery: string
-  searchMode: SearchMode
-  sortField: string
+  searchMode: 'nodes' | 'packs'
+  sortField: SortableAlgoliaField
 }

src/types/comfyRegistryTypes.ts

@@ -896,23 +896,6 @@ export interface paths {
     patch?: never
     trace?: never
   }
-  '/nodes/update-github-stars': {
-    parameters: {
-      query?: never
-      header?: never
-      path?: never
-      cookie?: never
-    }
-    get?: never
-    put?: never
-    /** Update GitHub stars for nodes */
-    post: operations['updateGithubStars']
-    delete?: never
-    options?: never
-    head?: never
-    patch?: never
-    trace?: never
-  }
   '/nodes': {
     parameters: {
       query?: never
@@ -1095,30 +1078,6 @@ export interface paths {
     patch?: never
     trace?: never
   }
-  '/releases': {
-    parameters: {
-      query?: never
-      header?: never
-      path?: never
-      cookie?: never
-    }
-    /**
-     * Get release notes
-     * @description Fetch release notes from Strapi with caching
-     */
-    get: operations['getReleaseNotes']
-    put?: never
-    /**
-     * Process Github release webhook
-     * @description Webhook endpoint to process Github release events and generate release notes
-     */
-    post: operations['processReleaseWebhook']
-    delete?: never
-    options?: never
-    head?: never
-    patch?: never
-    trace?: never
-  }
   '/security-scan': {
     parameters: {
       query?: never
@@ -3248,13 +3207,6 @@ export interface components {
       preempted_comfy_node_names?: string[]
       /** @description URL to the node's banner. */
       banner_url?: string
-      /** @description Number of stars on the GitHub repository. */
-      github_stars?: number
-      /**
-       * Format: date-time
-       * @description The date and time when the node was created
-       */
-      created_at?: string
     }
     NodeVersion: {
       id?: string
@@ -3393,8 +3345,6 @@ export interface components {
       stripe_id?: string
       /** @description The Metronome customer ID */
       metronome_id?: string
-      /** @description Whether the user has funds */
-      has_fund?: boolean
     }
     AuditLog: {
       /** @description the type of the event */
@@ -8742,292 +8692,6 @@ export interface components {
     MoonvalleyUploadResponse: {
       access_url?: string
     }
-    /** @description GitHub release webhook payload based on official webhook documentation */
-    GithubReleaseWebhook: {
-      /**
-       * @description The action performed on the release
-       * @enum {string}
-       */
-      action:
-        | 'published'
-        | 'unpublished'
-        | 'created'
-        | 'edited'
-        | 'deleted'
-        | 'prereleased'
-        | 'released'
-      /** @description The release object */
-      release: {
-        /** @description The ID of the release */
-        id: number
-        /** @description The node ID of the release */
-        node_id: string
-        /** @description The API URL of the release */
-        url: string
-        /** @description The HTML URL of the release */
-        html_url: string
-        /** @description The URL to the release assets */
-        assets_url?: string
-        /** @description The URL to upload release assets */
-        upload_url?: string
-        /** @description The tag name of the release */
-        tag_name: string
-        /** @description The branch or commit the release was created from */
-        target_commitish: string
-        /** @description The name of the release */
-        name?: string | null
-        /** @description The release notes/body */
-        body?: string | null
-        /** @description Whether the release is a draft */
-        draft: boolean
-        /** @description Whether the release is a prerelease */
-        prerelease: boolean
-        /**
-         * Format: date-time
-         * @description When the release was created
-         */
-        created_at: string
-        /**
-         * Format: date-time
-         * @description When the release was published
-         */
-        published_at?: string | null
-        author: components['schemas']['GithubUser']
-        /** @description URL to the tarball */
-        tarball_url: string
-        /** @description URL to the zipball */
-        zipball_url: string
-        /** @description Array of release assets */
-        assets: components['schemas']['GithubReleaseAsset'][]
-      }
-      repository: components['schemas']['GithubRepository']
-      sender: components['schemas']['GithubUser']
-      organization?: components['schemas']['GithubOrganization']
-      installation?: components['schemas']['GithubInstallation']
-      enterprise?: components['schemas']['GithubEnterprise']
-    }
-    /** @description A GitHub user */
-    GithubUser: {
-      /** @description The user's login name */
-      login: string
-      /** @description The user's ID */
-      id: number
-      /** @description The user's node ID */
-      node_id: string
-      /** @description URL to the user's avatar */
-      avatar_url: string
-      /** @description The user's gravatar ID */
-      gravatar_id?: string | null
-      /** @description The API URL of the user */
-      url: string
-      /** @description The HTML URL of the user */
-      html_url: string
-      /**
-       * @description The type of user
-       * @enum {string}
-       */
-      type: 'Bot' | 'User' | 'Organization'
-      /** @description Whether the user is a site admin */
-      site_admin: boolean
-    }
-    /** @description A GitHub repository */
-    GithubRepository: {
-      /** @description The repository ID */
-      id: number
-      /** @description The repository node ID */
-      node_id: string
-      /** @description The name of the repository */
-      name: string
-      /** @description The full name of the repository (owner/repo) */
-      full_name: string
-      /** @description Whether the repository is private */
-      private: boolean
-      owner: components['schemas']['GithubUser']
-      /** @description The HTML URL of the repository */
-      html_url: string
-      /** @description The repository description */
-      description?: string | null
-      /** @description Whether the repository is a fork */
-      fork: boolean
-      /** @description The API URL of the repository */
-      url: string
-      /** @description The clone URL of the repository */
-      clone_url: string
-      /** @description The git URL of the repository */
-      git_url: string
-      /** @description The SSH URL of the repository */
-      ssh_url: string
-      /** @description The default branch of the repository */
-      default_branch: string
-      /**
-       * Format: date-time
-       * @description When the repository was created
-       */
-      created_at: string
-      /**
-       * Format: date-time
-       * @description When the repository was last updated
-       */
-      updated_at: string
-      /**
-       * Format: date-time
-       * @description When the repository was last pushed to
-       */
-      pushed_at: string
-    }
-    /** @description A GitHub release asset */
-    GithubReleaseAsset: {
-      /** @description The asset ID */
-      id: number
-      /** @description The asset node ID */
-      node_id: string
-      /** @description The name of the asset */
-      name: string
-      /** @description The label of the asset */
-      label?: string | null
-      /** @description The content type of the asset */
-      content_type: string
-      /**
-       * @description The state of the asset
-       * @enum {string}
-       */
-      state: 'uploaded' | 'open'
-      /** @description The size of the asset in bytes */
-      size: number
-      /** @description The number of downloads */
-      download_count: number
-      /**
-       * Format: date-time
-       * @description When the asset was created
-       */
-      created_at: string
-      /**
-       * Format: date-time
-       * @description When the asset was last updated
-       */
-      updated_at: string
-      /** @description The browser download URL */
-      browser_download_url: string
-      uploader: components['schemas']['GithubUser']
-    }
-    /** @description A GitHub organization */
-    GithubOrganization: {
-      /** @description The organization's login name */
-      login: string
-      /** @description The organization ID */
-      id: number
-      /** @description The organization node ID */
-      node_id: string
-      /** @description The API URL of the organization */
-      url: string
-      /** @description The API URL of the organization's repositories */
-      repos_url: string
-      /** @description The API URL of the organization's events */
-      events_url: string
-      /** @description The API URL of the organization's hooks */
-      hooks_url: string
-      /** @description The API URL of the organization's issues */
-      issues_url: string
-      /** @description The API URL of the organization's members */
-      members_url: string
-      /** @description The API URL of the organization's public members */
-      public_members_url: string
-      /** @description URL to the organization's avatar */
-      avatar_url: string
-      /** @description The organization description */
-      description?: string | null
-    }
-    /** @description A GitHub App installation */
-    GithubInstallation: {
-      /** @description The installation ID */
-      id: number
-      account: components['schemas']['GithubUser']
-      /**
-       * @description Repository selection for the installation
-       * @enum {string}
-       */
-      repository_selection: 'selected' | 'all'
-      /** @description The API URL for access tokens */
-      access_tokens_url: string
-      /** @description The API URL for repositories */
-      repositories_url: string
-      /** @description The HTML URL of the installation */
-      html_url: string
-      /** @description The GitHub App ID */
-      app_id: number
-      /** @description The target ID */
-      target_id: number
-      /** @description The target type */
-      target_type: string
-      /** @description The installation permissions */
-      permissions: Record<string, never>
-      /** @description The events the installation subscribes to */
-      events: string[]
-      /**
-       * Format: date-time
-       * @description When the installation was created
-       */
-      created_at: string
-      /**
-       * Format: date-time
-       * @description When the installation was last updated
-       */
-      updated_at: string
-      /** @description The single file name if applicable */
-      single_file_name?: string | null
-    }
-    /** @description A GitHub enterprise */
-    GithubEnterprise: {
-      /** @description The enterprise ID */
-      id: number
-      /** @description The enterprise slug */
-      slug: string
-      /** @description The enterprise name */
-      name: string
-      /** @description The enterprise node ID */
-      node_id: string
-      /** @description URL to the enterprise avatar */
-      avatar_url: string
-      /** @description The enterprise description */
-      description?: string | null
-      /** @description The enterprise website URL */
-      website_url?: string | null
-      /** @description The HTML URL of the enterprise */
-      html_url: string
-      /**
-       * Format: date-time
-       * @description When the enterprise was created
-       */
-      created_at: string
-      /**
-       * Format: date-time
-       * @description When the enterprise was last updated
-       */
-      updated_at: string
-    }
-    ReleaseNote: {
-      /** @description Unique identifier for the release note */
-      id: number
-      /**
-       * @description The project this release note belongs to
-       * @enum {string}
-       */
-      project: 'comfyui' | 'comfyui_frontend' | 'desktop'
-      /** @description The version of the release */
-      version: string
-      /**
-       * @description The attention level for this release
-       * @enum {string}
-       */
-      attention: 'low' | 'medium' | 'high'
-      /** @description The content of the release note in markdown format */
-      content: string
-      /**
-       * Format: date-time
-       * @description When the release note was published
-       */
-      published_at: string
-    }
   }
   responses: never
   parameters: {
@@ -11131,6 +10795,8 @@ export interface operations {
       query?: {
         /** @description Maximum number of nodes to send to algolia at a time */
         max_batch?: number
+        /** @description Minimum interval from the last time the nodes were indexed to algolia */
+        min_age?: string
       }
       header?: never
       path?: never
@@ -11165,52 +10831,6 @@ export interface operations {
       }
     }
   }
-  updateGithubStars: {
-    parameters: {
-      query?: {
-        /** @description Maximum number of nodes to update in one batch */
-        max_batch?: number
-      }
-      header?: never
-      path?: never
-      cookie?: never
-    }
-    requestBody?: never
-    responses: {
-      /** @description Update GithubStars request triggered successfully */
-      200: {
-        headers: {
-          [name: string]: unknown
-        }
-        content?: never
-      }
-      /** @description Bad request. */
-      400: {
-        headers: {
-          [name: string]: unknown
-        }
-        content: {
-          'application/json': components['schemas']['ErrorResponse']
-        }
-      }
-      /** @description Unauthorized */
-      401: {
-        headers: {
-          [name: string]: unknown
-        }
-        content?: never
-      }
-      /** @description Internal server error */
-      500: {
-        headers: {
-          [name: string]: unknown
-        }
-        content: {
-          'application/json': components['schemas']['ErrorResponse']
-        }
-      }
-    }
-  }
   listAllNodes: {
     parameters: {
       query?: {
@@ -11232,8 +10852,6 @@ export interface operations {
         sort?: string[]
         /** @description node_id to use as filter */
         node_id?: string[]
-        /** @description Comfy UI version */
-        comfyui_version?: string
         /** @description The platform requesting the nodes */
         form_factor?: string
       }
@@ -11800,115 +11418,6 @@ export interface operations {
       }
     }
   }
-  getReleaseNotes: {
-    parameters: {
-      query: {
-        /** @description The project to get release notes for */
-        project: 'comfyui' | 'comfyui_frontend' | 'desktop'
-        /** @description The current version to filter release notes */
-        current_version?: string
-        /** @description The locale for the release notes */
-        locale?: 'en' | 'es' | 'fr' | 'ja' | 'ko' | 'ru' | 'zh'
-        /** @description The platform requesting the release notes */
-        form_factor?: string
-      }
-      header?: never
-      path?: never
-      cookie?: never
-    }
-    requestBody?: never
-    responses: {
-      /** @description Release notes retrieved successfully */
-      200: {
-        headers: {
-          [name: string]: unknown
-        }
-        content: {
-          'application/json': components['schemas']['ReleaseNote'][]
-        }
-      }
-      /** @description Bad request */
-      400: {
-        headers: {
-          [name: string]: unknown
-        }
-        content: {
-          'application/json': components['schemas']['ErrorResponse']
-        }
-      }
-      /** @description Internal server error */
-      500: {
-        headers: {
-          [name: string]: unknown
-        }
-        content: {
-          'application/json': components['schemas']['ErrorResponse']
-        }
-      }
-    }
-  }
-  processReleaseWebhook: {
-    parameters: {
-      query?: never
-      header: {
-        /** @description The name of the event that triggered the delivery */
-        'X-GitHub-Event': 'release'
-        /** @description A globally unique identifier (GUID) to identify the event */
-        'X-GitHub-Delivery': string
-        /** @description The unique identifier of the webhook */
-        'X-GitHub-Hook-ID': string
-        /** @description HMAC hex digest of the request body using SHA-256 hash function */
-        'X-Hub-Signature-256'?: string
-        /** @description The type of resource where the webhook was created */
-        'X-GitHub-Hook-Installation-Target-Type'?: string
-        /** @description The unique identifier of the resource where the webhook was created */
-        'X-GitHub-Hook-Installation-Target-ID'?: string
-      }
-      path?: never
-      cookie?: never
-    }
-    requestBody: {
-      content: {
-        'application/json': components['schemas']['GithubReleaseWebhook']
-      }
-    }
-    responses: {
-      /** @description Webhook processed successfully */
-      200: {
-        headers: {
-          [name: string]: unknown
-        }
-        content?: never
-      }
-      /** @description Bad request */
-      400: {
-        headers: {
-          [name: string]: unknown
-        }
-        content: {
-          'application/json': components['schemas']['ErrorResponse']
-        }
-      }
-      /** @description Validation failed or endpoint has been spammed */
-      422: {
-        headers: {
-          [name: string]: unknown
-        }
-        content: {
-          'application/json': components['schemas']['ErrorResponse']
-        }
-      }
-      /** @description Internal server error */
-      500: {
-        headers: {
-          [name: string]: unknown
-        }
-        content: {
-          'application/json': components['schemas']['ErrorResponse']
-        }
-      }
-    }
-  }
   securityScan: {
     parameters: {
       query?: {

src/types/nodeDefAugmentation.ts

@@ -1,38 +0,0 @@
-/**
- * Frontend augmentations for node definitions.
- *
- * This module defines type extensions that augment the backend node definition
- * types with frontend-specific properties. These augmentations are applied at
- * runtime and are not part of the backend API contract.
- */
-import type { ComboInputOptions, InputSpec } from '@/schemas/nodeDefSchema'
-
-/**
- * Frontend augmentation for image upload combo inputs.
- * This extends ComboInputOptions with properties injected by the uploadImage extension.
- */
-export interface ImageUploadComboOptions extends ComboInputOptions {
-  /**
-   * Reference to the associated filename combo widget.
-   * Injected by uploadImage.ts to link upload buttons with their combo widgets.
-   *
-   * @remarks This property exists only in the frontend runtime.
-   */
-  imageInputName: string
-}
-
-/**
- * Type guard to check if an InputSpec has image upload augmentations.
- * Narrows from base InputSpec to augmented type.
- */
-export function isImageUploadInput(
-  inputData: InputSpec
-): inputData is [string, ImageUploadComboOptions] {
-  const options = inputData[1]
-  return (
-    options !== undefined &&
-    typeof options === 'object' &&
-    'imageInputName' in options &&
-    typeof options.imageInputName === 'string'
-  )
-}

src/types/searchServiceTypes.ts

@@ -1,49 +0,0 @@
-import type { SearchNodePacksParams } from '@/types/algoliaTypes'
-import type { components } from '@/types/comfyRegistryTypes'
-
-type RegistryNodePack = components['schemas']['Node']
-
-/**
- * Search mode for filtering results
- */
-export type SearchMode = 'nodes' | 'packs'
-export type QuerySuggestion = {
-  query: string
-  popularity: number
-}
-
-export interface SearchPacksResult {
-  nodePacks: RegistryNodePack[]
-  querySuggestions: QuerySuggestion[]
-}
-
-export interface SortableField<T = string> {
-  id: T
-  label: string
-  direction: 'asc' | 'desc'
-}
-
-export interface NodePackSearchProvider {
-  /**
-   * Search for node packs
-   */
-  searchPacks(
-    query: string,
-    params: SearchNodePacksParams
-  ): Promise<SearchPacksResult>
-
-  /**
-   * Clear the search cache
-   */
-  clearSearchCache(): void
-
-  /**
-   * Get the sort value for a pack based on the sort field
-   */
-  getSortValue(pack: RegistryNodePack, sortField: string): string | number
-
-  /**
-   * Get the list of sortable fields supported by this provider
-   */
-  getSortableFields(): SortableField[]
-}

tests-ui/tests/components/dialog/content/MissingCoreNodesMessage.spec.ts

@@ -1,205 +0,0 @@
-import type { LGraphNode } from '@comfyorg/litegraph'
-import { mount } from '@vue/test-utils'
-import PrimeVue from 'primevue/config'
-import Message from 'primevue/message'
-import { beforeEach, describe, expect, it, vi } from 'vitest'
-import { nextTick } from 'vue'
-
-import MissingCoreNodesMessage from '@/components/dialog/content/MissingCoreNodesMessage.vue'
-import { useSystemStatsStore } from '@/stores/systemStatsStore'
-
-// Mock the stores
-vi.mock('@/stores/systemStatsStore', () => ({
-  useSystemStatsStore: vi.fn()
-}))
-
-const createMockNode = (type: string, version?: string): LGraphNode =>
-  // @ts-expect-error - Creating a partial mock of LGraphNode for testing purposes.
-  // We only need specific properties for our tests, not the full LGraphNode interface.
-  ({
-    type,
-    properties: { cnr_id: 'comfy-core', ver: version },
-    id: 1,
-    title: type,
-    pos: [0, 0],
-    size: [100, 100],
-    flags: {},
-    graph: null,
-    mode: 0,
-    inputs: [],
-    outputs: []
-  })
-
-describe('MissingCoreNodesMessage', () => {
-  const mockSystemStatsStore = {
-    systemStats: null as { system?: { comfyui_version?: string } } | null,
-    fetchSystemStats: vi.fn()
-  }
-
-  beforeEach(() => {
-    vi.clearAllMocks()
-    // Reset the mock store state
-    mockSystemStatsStore.systemStats = null
-    mockSystemStatsStore.fetchSystemStats = vi.fn()
-    // @ts-expect-error - Mocking the return value of useSystemStatsStore for testing.
-    // The actual store has more properties, but we only need these for our tests.
-    useSystemStatsStore.mockReturnValue(mockSystemStatsStore)
-  })
-
-  const mountComponent = (props = {}) => {
-    return mount(MissingCoreNodesMessage, {
-      global: {
-        plugins: [PrimeVue],
-        components: { Message },
-        mocks: {
-          $t: (key: string, params?: { version?: string }) => {
-            const translations: Record<string, string> = {
-              'loadWorkflowWarning.outdatedVersion': `Some nodes require a newer version of ComfyUI (current: ${params?.version}). Please update to use all nodes.`,
-              'loadWorkflowWarning.outdatedVersionGeneric':
-                'Some nodes require a newer version of ComfyUI. Please update to use all nodes.',
-              'loadWorkflowWarning.coreNodesFromVersion': `Requires ComfyUI ${params?.version}:`
-            }
-            return translations[key] || key
-          }
-        }
-      },
-      props: {
-        missingCoreNodes: {},
-        ...props
-      }
-    })
-  }
-
-  it('does not render when there are no missing core nodes', () => {
-    const wrapper = mountComponent()
-    expect(wrapper.findComponent(Message).exists()).toBe(false)
-  })
-
-  it('renders message when there are missing core nodes', async () => {
-    const missingCoreNodes = {
-      '1.2.0': [createMockNode('TestNode', '1.2.0')]
-    }
-
-    const wrapper = mountComponent({ missingCoreNodes })
-    await nextTick()
-
-    expect(wrapper.findComponent(Message).exists()).toBe(true)
-  })
-
-  it('fetches and displays current ComfyUI version', async () => {
-    // Start with no systemStats to trigger fetch
-    mockSystemStatsStore.fetchSystemStats.mockImplementation(() => {
-      // Simulate the fetch setting the systemStats
-      mockSystemStatsStore.systemStats = {
-        system: { comfyui_version: '1.0.0' }
-      }
-      return Promise.resolve()
-    })
-
-    const missingCoreNodes = {
-      '1.2.0': [createMockNode('TestNode', '1.2.0')]
-    }
-
-    const wrapper = mountComponent({ missingCoreNodes })
-
-    // Wait for all async operations
-    await nextTick()
-    await new Promise((resolve) => setTimeout(resolve, 0))
-    await nextTick()
-
-    expect(mockSystemStatsStore.fetchSystemStats).toHaveBeenCalled()
-    expect(wrapper.text()).toContain(
-      'Some nodes require a newer version of ComfyUI (current: 1.0.0)'
-    )
-  })
-
-  it('displays generic message when version is unavailable', async () => {
-    // Mock fetchSystemStats to resolve without setting systemStats
-    mockSystemStatsStore.fetchSystemStats.mockResolvedValue(undefined)
-
-    const missingCoreNodes = {
-      '1.2.0': [createMockNode('TestNode', '1.2.0')]
-    }
-
-    const wrapper = mountComponent({ missingCoreNodes })
-
-    // Wait for the async operations to complete
-    await nextTick()
-    await new Promise((resolve) => setTimeout(resolve, 0))
-    await nextTick()
-
-    expect(wrapper.text()).toContain(
-      'Some nodes require a newer version of ComfyUI. Please update to use all nodes.'
-    )
-  })
-
-  it('groups nodes by version and displays them', async () => {
-    const missingCoreNodes = {
-      '1.2.0': [
-        createMockNode('NodeA', '1.2.0'),
-        createMockNode('NodeB', '1.2.0')
-      ],
-      '1.3.0': [createMockNode('NodeC', '1.3.0')]
-    }
-
-    const wrapper = mountComponent({ missingCoreNodes })
-    await nextTick()
-
-    const text = wrapper.text()
-    expect(text).toContain('Requires ComfyUI 1.3.0:')
-    expect(text).toContain('NodeC')
-    expect(text).toContain('Requires ComfyUI 1.2.0:')
-    expect(text).toContain('NodeA, NodeB')
-  })
-
-  it('sorts versions in descending order', async () => {
-    const missingCoreNodes = {
-      '1.1.0': [createMockNode('Node1', '1.1.0')],
-      '1.3.0': [createMockNode('Node3', '1.3.0')],
-      '1.2.0': [createMockNode('Node2', '1.2.0')]
-    }
-
-    const wrapper = mountComponent({ missingCoreNodes })
-    await nextTick()
-
-    const text = wrapper.text()
-    const version13Index = text.indexOf('1.3.0')
-    const version12Index = text.indexOf('1.2.0')
-    const version11Index = text.indexOf('1.1.0')
-
-    expect(version13Index).toBeLessThan(version12Index)
-    expect(version12Index).toBeLessThan(version11Index)
-  })
-
-  it('removes duplicate node names within the same version', async () => {
-    const missingCoreNodes = {
-      '1.2.0': [
-        createMockNode('DuplicateNode', '1.2.0'),
-        createMockNode('DuplicateNode', '1.2.0'),
-        createMockNode('UniqueNode', '1.2.0')
-      ]
-    }
-
-    const wrapper = mountComponent({ missingCoreNodes })
-    await nextTick()
-
-    const text = wrapper.text()
-    // Should only appear once in the sorted list
-    expect(text).toContain('DuplicateNode, UniqueNode')
-    // Count occurrences of 'DuplicateNode' - should be only 1
-    const matches = text.match(/DuplicateNode/g) || []
-    expect(matches.length).toBe(1)
-  })
-
-  it('handles nodes with missing version info', async () => {
-    const missingCoreNodes = {
-      '': [createMockNode('NoVersionNode')]
-    }
-
-    const wrapper = mountComponent({ missingCoreNodes })
-    await nextTick()
-
-    expect(wrapper.text()).toContain('Requires ComfyUI unknown:')
-    expect(wrapper.text()).toContain('NoVersionNode')
-  })
-})

tests-ui/tests/composables/useMissingNodes.test.ts

@@ -1,385 +0,0 @@
-import type { LGraphNode } from '@comfyorg/litegraph'
-import { beforeEach, describe, expect, it, vi } from 'vitest'
-import { nextTick, ref } from 'vue'
-
-import { useMissingNodes } from '@/composables/nodePack/useMissingNodes'
-import { useWorkflowPacks } from '@/composables/nodePack/useWorkflowPacks'
-import { app } from '@/scripts/app'
-import { useComfyManagerStore } from '@/stores/comfyManagerStore'
-import { useNodeDefStore } from '@/stores/nodeDefStore'
-
-// Mock Vue's onMounted to execute immediately for testing
-vi.mock('vue', async () => {
-  const actual = await vi.importActual<typeof import('vue')>('vue')
-  return {
-    ...actual,
-    onMounted: (cb: () => void) => cb()
-  }
-})
-
-// Mock the dependencies
-vi.mock('@/composables/nodePack/useWorkflowPacks', () => ({
-  useWorkflowPacks: vi.fn()
-}))
-
-vi.mock('@/stores/comfyManagerStore', () => ({
-  useComfyManagerStore: vi.fn()
-}))
-
-vi.mock('@/stores/nodeDefStore', () => ({
-  useNodeDefStore: vi.fn()
-}))
-
-vi.mock('@/scripts/app', () => ({
-  app: {
-    graph: {
-      nodes: []
-    }
-  }
-}))
-
-const mockUseWorkflowPacks = vi.mocked(useWorkflowPacks)
-const mockUseComfyManagerStore = vi.mocked(useComfyManagerStore)
-const mockUseNodeDefStore = vi.mocked(useNodeDefStore)
-
-describe('useMissingNodes', () => {
-  const mockWorkflowPacks = [
-    {
-      id: 'pack-1',
-      name: 'Test Pack 1',
-      latest_version: { version: '1.0.0' }
-    },
-    {
-      id: 'pack-2',
-      name: 'Test Pack 2',
-      latest_version: { version: '2.0.0' }
-    },
-    {
-      id: 'pack-3',
-      name: 'Installed Pack',
-      latest_version: { version: '1.5.0' }
-    }
-  ]
-
-  const mockStartFetchWorkflowPacks = vi.fn()
-  const mockIsPackInstalled = vi.fn()
-
-  beforeEach(() => {
-    vi.clearAllMocks()
-
-    // Default setup: pack-3 is installed, others are not
-    mockIsPackInstalled.mockImplementation((id: string) => id === 'pack-3')
-
-    // @ts-expect-error - Mocking partial ComfyManagerStore for testing.
-    // We only need isPackInstalled method for these tests.
-    mockUseComfyManagerStore.mockReturnValue({
-      isPackInstalled: mockIsPackInstalled
-    })
-
-    mockUseWorkflowPacks.mockReturnValue({
-      workflowPacks: ref([]),
-      isLoading: ref(false),
-      error: ref(null),
-      startFetchWorkflowPacks: mockStartFetchWorkflowPacks,
-      isReady: ref(false),
-      filterWorkflowPack: vi.fn()
-    })
-
-    // Reset node def store mock
-    // @ts-expect-error - Mocking partial NodeDefStore for testing.
-    // We only need nodeDefsByName for these tests.
-    mockUseNodeDefStore.mockReturnValue({
-      nodeDefsByName: {}
-    })
-
-    // Reset app.graph.nodes
-    // @ts-expect-error - app.graph.nodes is readonly, but we need to modify it for testing.
-    app.graph.nodes = []
-  })
-
-  describe('core filtering logic', () => {
-    it('filters out installed packs correctly', () => {
-      mockUseWorkflowPacks.mockReturnValue({
-        workflowPacks: ref(mockWorkflowPacks),
-        isLoading: ref(false),
-        error: ref(null),
-        startFetchWorkflowPacks: mockStartFetchWorkflowPacks,
-        isReady: ref(true),
-        filterWorkflowPack: vi.fn()
-      })
-
-      const { missingNodePacks } = useMissingNodes()
-
-      // Should only include packs that are not installed (pack-1, pack-2)
-      expect(missingNodePacks.value).toHaveLength(2)
-      expect(missingNodePacks.value[0].id).toBe('pack-1')
-      expect(missingNodePacks.value[1].id).toBe('pack-2')
-      expect(
-        missingNodePacks.value.find((pack) => pack.id === 'pack-3')
-      ).toBeUndefined()
-    })
-
-    it('returns empty array when all packs are installed', () => {
-      mockUseWorkflowPacks.mockReturnValue({
-        workflowPacks: ref(mockWorkflowPacks),
-        isLoading: ref(false),
-        error: ref(null),
-        startFetchWorkflowPacks: mockStartFetchWorkflowPacks,
-        isReady: ref(true),
-        filterWorkflowPack: vi.fn()
-      })
-
-      // Mock all packs as installed
-      mockIsPackInstalled.mockReturnValue(true)
-
-      const { missingNodePacks } = useMissingNodes()
-
-      expect(missingNodePacks.value).toEqual([])
-    })
-
-    it('returns all packs when none are installed', () => {
-      mockUseWorkflowPacks.mockReturnValue({
-        workflowPacks: ref(mockWorkflowPacks),
-        isLoading: ref(false),
-        error: ref(null),
-        startFetchWorkflowPacks: mockStartFetchWorkflowPacks,
-        isReady: ref(true),
-        filterWorkflowPack: vi.fn()
-      })
-
-      // Mock no packs as installed
-      mockIsPackInstalled.mockReturnValue(false)
-
-      const { missingNodePacks } = useMissingNodes()
-
-      expect(missingNodePacks.value).toHaveLength(3)
-      expect(missingNodePacks.value).toEqual(mockWorkflowPacks)
-    })
-
-    it('returns empty array when no workflow packs exist', () => {
-      const { missingNodePacks } = useMissingNodes()
-
-      expect(missingNodePacks.value).toEqual([])
-    })
-  })
-
-  describe('automatic data fetching', () => {
-    it('fetches workflow packs automatically when none exist', async () => {
-      useMissingNodes()
-
-      expect(mockStartFetchWorkflowPacks).toHaveBeenCalledOnce()
-    })
-
-    it('does not fetch when packs already exist', async () => {
-      mockUseWorkflowPacks.mockReturnValue({
-        workflowPacks: ref(mockWorkflowPacks),
-        isLoading: ref(false),
-        error: ref(null),
-        startFetchWorkflowPacks: mockStartFetchWorkflowPacks,
-        isReady: ref(true),
-        filterWorkflowPack: vi.fn()
-      })
-
-      useMissingNodes()
-
-      expect(mockStartFetchWorkflowPacks).not.toHaveBeenCalled()
-    })
-
-    it('does not fetch when already loading', async () => {
-      mockUseWorkflowPacks.mockReturnValue({
-        workflowPacks: ref([]),
-        isLoading: ref(true),
-        error: ref(null),
-        startFetchWorkflowPacks: mockStartFetchWorkflowPacks,
-        isReady: ref(false),
-        filterWorkflowPack: vi.fn()
-      })
-
-      useMissingNodes()
-
-      expect(mockStartFetchWorkflowPacks).not.toHaveBeenCalled()
-    })
-  })
-
-  describe('state management', () => {
-    it('exposes loading state from useWorkflowPacks', () => {
-      mockUseWorkflowPacks.mockReturnValue({
-        workflowPacks: ref([]),
-        isLoading: ref(true),
-        error: ref(null),
-        startFetchWorkflowPacks: mockStartFetchWorkflowPacks,
-        isReady: ref(false),
-        filterWorkflowPack: vi.fn()
-      })
-
-      const { isLoading } = useMissingNodes()
-
-      expect(isLoading.value).toBe(true)
-    })
-
-    it('exposes error state from useWorkflowPacks', () => {
-      const testError = 'Failed to fetch workflow packs'
-      mockUseWorkflowPacks.mockReturnValue({
-        workflowPacks: ref([]),
-        isLoading: ref(false),
-        error: ref(testError),
-        startFetchWorkflowPacks: mockStartFetchWorkflowPacks,
-        isReady: ref(false),
-        filterWorkflowPack: vi.fn()
-      })
-
-      const { error } = useMissingNodes()
-
-      expect(error.value).toBe(testError)
-    })
-  })
-
-  describe('reactivity', () => {
-    it('updates when workflow packs change', async () => {
-      const workflowPacksRef = ref([])
-      mockUseWorkflowPacks.mockReturnValue({
-        workflowPacks: workflowPacksRef,
-        isLoading: ref(false),
-        error: ref(null),
-        startFetchWorkflowPacks: mockStartFetchWorkflowPacks,
-        isReady: ref(true),
-        filterWorkflowPack: vi.fn()
-      })
-
-      const { missingNodePacks } = useMissingNodes()
-
-      // Initially empty
-      expect(missingNodePacks.value).toEqual([])
-
-      // Update workflow packs
-      // @ts-expect-error - mockWorkflowPacks is a simplified version without full WorkflowPack interface.
-      workflowPacksRef.value = mockWorkflowPacks
-      await nextTick()
-
-      // Should update missing packs (2 missing since pack-3 is installed)
-      expect(missingNodePacks.value).toHaveLength(2)
-    })
-  })
-
-  describe('missing core nodes detection', () => {
-    const createMockNode = (
-      type: string,
-      packId?: string,
-      version?: string
-    ): LGraphNode =>
-      // @ts-expect-error - Creating a partial mock of LGraphNode for testing.
-      // We only need specific properties for our tests, not the full LGraphNode interface.
-      ({
-        type,
-        properties: { cnr_id: packId, ver: version },
-        id: 1,
-        title: type,
-        pos: [0, 0],
-        size: [100, 100],
-        flags: {},
-        graph: null,
-        mode: 0,
-        inputs: [],
-        outputs: []
-      })
-
-    it('identifies missing core nodes not in nodeDefStore', () => {
-      const coreNode1 = createMockNode('CoreNode1', 'comfy-core', '1.2.0')
-      const coreNode2 = createMockNode('CoreNode2', 'comfy-core', '1.2.0')
-      const registeredNode = createMockNode(
-        'RegisteredNode',
-        'comfy-core',
-        '1.0.0'
-      )
-
-      // @ts-expect-error - app.graph.nodes is readonly, but we need to modify it for testing.
-      app.graph.nodes = [coreNode1, coreNode2, registeredNode]
-
-      mockUseNodeDefStore.mockReturnValue({
-        nodeDefsByName: {
-          // @ts-expect-error - Creating minimal mock of ComfyNodeDefImpl for testing.
-          // Only including required properties for our test assertions.
-          RegisteredNode: { name: 'RegisteredNode' }
-        }
-      })
-
-      const { missingCoreNodes } = useMissingNodes()
-
-      expect(Object.keys(missingCoreNodes.value)).toHaveLength(1)
-      expect(missingCoreNodes.value['1.2.0']).toHaveLength(2)
-      expect(missingCoreNodes.value['1.2.0'][0].type).toBe('CoreNode1')
-      expect(missingCoreNodes.value['1.2.0'][1].type).toBe('CoreNode2')
-    })
-
-    it('groups missing core nodes by version', () => {
-      const node120 = createMockNode('Node120', 'comfy-core', '1.2.0')
-      const node130 = createMockNode('Node130', 'comfy-core', '1.3.0')
-      const nodeNoVer = createMockNode('NodeNoVer', 'comfy-core')
-
-      // @ts-expect-error - app.graph.nodes is readonly, but we need to modify it for testing.
-      app.graph.nodes = [node120, node130, nodeNoVer]
-
-      // @ts-expect-error - Mocking partial NodeDefStore for testing.
-      mockUseNodeDefStore.mockReturnValue({
-        nodeDefsByName: {}
-      })
-
-      const { missingCoreNodes } = useMissingNodes()
-
-      expect(Object.keys(missingCoreNodes.value)).toHaveLength(3)
-      expect(missingCoreNodes.value['1.2.0']).toHaveLength(1)
-      expect(missingCoreNodes.value['1.3.0']).toHaveLength(1)
-      expect(missingCoreNodes.value['']).toHaveLength(1)
-    })
-
-    it('ignores non-core nodes', () => {
-      const coreNode = createMockNode('CoreNode', 'comfy-core', '1.2.0')
-      const customNode = createMockNode('CustomNode', 'custom-pack', '1.0.0')
-      const noPackNode = createMockNode('NoPackNode')
-
-      // @ts-expect-error - app.graph.nodes is readonly, but we need to modify it for testing.
-      app.graph.nodes = [coreNode, customNode, noPackNode]
-
-      // @ts-expect-error - Mocking partial NodeDefStore for testing.
-      mockUseNodeDefStore.mockReturnValue({
-        nodeDefsByName: {}
-      })
-
-      const { missingCoreNodes } = useMissingNodes()
-
-      expect(Object.keys(missingCoreNodes.value)).toHaveLength(1)
-      expect(missingCoreNodes.value['1.2.0']).toHaveLength(1)
-      expect(missingCoreNodes.value['1.2.0'][0].type).toBe('CoreNode')
-    })
-
-    it('returns empty object when no core nodes are missing', () => {
-      const registeredNode1 = createMockNode(
-        'RegisteredNode1',
-        'comfy-core',
-        '1.0.0'
-      )
-      const registeredNode2 = createMockNode(
-        'RegisteredNode2',
-        'comfy-core',
-        '1.1.0'
-      )
-
-      // @ts-expect-error - app.graph.nodes is readonly, but we need to modify it for testing.
-      app.graph.nodes = [registeredNode1, registeredNode2]
-
-      mockUseNodeDefStore.mockReturnValue({
-        nodeDefsByName: {
-          // @ts-expect-error - Creating minimal mock of ComfyNodeDefImpl for testing.
-          // Only including required properties for our test assertions.
-          RegisteredNode1: { name: 'RegisteredNode1' },
-          // @ts-expect-error - Creating minimal mock of ComfyNodeDefImpl for testing.
-          RegisteredNode2: { name: 'RegisteredNode2' }
-        }
-      })
-
-      const { missingCoreNodes } = useMissingNodes()
-
-      expect(Object.keys(missingCoreNodes.value)).toHaveLength(0)
-    })
-  })
-})

tests-ui/tests/composables/widgets/useRemoteWidget.test.ts

@@ -26,22 +26,6 @@ vi.mock('@/stores/settingStore', () => ({
   })
 }))
 
-vi.mock('@/scripts/api', () => ({
-  api: {
-    addEventListener: vi.fn(),
-    removeEventListener: vi.fn()
-  }
-}))
-
-vi.mock('@/composables/functional/useChainCallback', () => ({
-  useChainCallback: vi.fn((original, ...callbacks) => {
-    return function (this: any, ...args: any[]) {
-      original?.apply(this, args)
-      callbacks.forEach((cb: any) => cb.apply(this, args))
-    }
-  })
-}))
-
 const FIRST_BACKOFF = 1000 // backoff is 1s on first retry
 const DEFAULT_VALUE = 'Loading...'
 
@@ -56,9 +40,7 @@ function createMockConfig(overrides = {}): RemoteWidgetConfig {
 const createMockOptions = (inputOverrides = {}) => ({
   remoteConfig: createMockConfig(inputOverrides),
   defaultValue: DEFAULT_VALUE,
-  node: {
-    addWidget: vi.fn()
-  } as any,
+  node: {} as any,
   widget: {} as any
 })
 
@@ -517,168 +499,4 @@ describe('useRemoteWidget', () => {
       expect(data2).toEqual(DEFAULT_VALUE)
     })
   })
-
-  describe('auto-refresh on task completion', () => {
-    it('should add auto-refresh toggle widget', () => {
-      const mockNode = {
-        addWidget: vi.fn(),
-        widgets: []
-      }
-      const mockWidget = {
-        refresh: vi.fn()
-      }
-
-      useRemoteWidget({
-        remoteConfig: createMockConfig(),
-        defaultValue: DEFAULT_VALUE,
-        node: mockNode as any,
-        widget: mockWidget as any
-      })
-
-      // Should add auto-refresh toggle widget
-      expect(mockNode.addWidget).toHaveBeenCalledWith(
-        'toggle',
-        'Auto-refresh after generation',
-        false,
-        expect.any(Function),
-        {
-          serialize: false
-        }
-      )
-    })
-
-    it('should register event listener when enabled', async () => {
-      const { api } = await import('@/scripts/api')
-
-      const mockNode = {
-        addWidget: vi.fn(),
-        widgets: []
-      }
-      const mockWidget = {
-        refresh: vi.fn()
-      }
-
-      useRemoteWidget({
-        remoteConfig: createMockConfig(),
-        defaultValue: DEFAULT_VALUE,
-        node: mockNode as any,
-        widget: mockWidget as any
-      })
-
-      // Event listener should be registered immediately
-      expect(api.addEventListener).toHaveBeenCalledWith(
-        'execution_success',
-        expect.any(Function)
-      )
-    })
-
-    it('should refresh widget when workflow completes successfully', async () => {
-      const { api } = await import('@/scripts/api')
-      let executionSuccessHandler: (() => void) | undefined
-
-      // Capture the event handler
-      vi.mocked(api.addEventListener).mockImplementation((event, handler) => {
-        if (event === 'execution_success') {
-          executionSuccessHandler = handler as () => void
-        }
-      })
-
-      const mockNode = {
-        addWidget: vi.fn(),
-        widgets: []
-      }
-      const mockWidget = {} as any
-
-      useRemoteWidget({
-        remoteConfig: createMockConfig(),
-        defaultValue: DEFAULT_VALUE,
-        node: mockNode as any,
-        widget: mockWidget
-      })
-
-      // Spy on the refresh function that was added by useRemoteWidget
-      const refreshSpy = vi.spyOn(mockWidget, 'refresh')
-
-      // Get the toggle callback and enable auto-refresh
-      const toggleCallback = mockNode.addWidget.mock.calls.find(
-        (call) => call[0] === 'toggle'
-      )?.[3]
-      toggleCallback?.(true)
-
-      // Simulate workflow completion
-      executionSuccessHandler?.()
-
-      expect(refreshSpy).toHaveBeenCalled()
-    })
-
-    it('should not refresh when toggle is disabled', async () => {
-      const { api } = await import('@/scripts/api')
-      let executionSuccessHandler: (() => void) | undefined
-
-      // Capture the event handler
-      vi.mocked(api.addEventListener).mockImplementation((event, handler) => {
-        if (event === 'execution_success') {
-          executionSuccessHandler = handler as () => void
-        }
-      })
-
-      const mockNode = {
-        addWidget: vi.fn(),
-        widgets: []
-      }
-      const mockWidget = {} as any
-
-      useRemoteWidget({
-        remoteConfig: createMockConfig(),
-        defaultValue: DEFAULT_VALUE,
-        node: mockNode as any,
-        widget: mockWidget
-      })
-
-      // Spy on the refresh function that was added by useRemoteWidget
-      const refreshSpy = vi.spyOn(mockWidget, 'refresh')
-
-      // Toggle is disabled by default
-      // Simulate workflow completion
-      executionSuccessHandler?.()
-
-      expect(refreshSpy).not.toHaveBeenCalled()
-    })
-
-    it('should cleanup event listener on node removal', async () => {
-      const { api } = await import('@/scripts/api')
-      let executionSuccessHandler: (() => void) | undefined
-
-      // Capture the event handler
-      vi.mocked(api.addEventListener).mockImplementation((event, handler) => {
-        if (event === 'execution_success') {
-          executionSuccessHandler = handler as () => void
-        }
-      })
-
-      const mockNode = {
-        addWidget: vi.fn(),
-        widgets: [],
-        onRemoved: undefined as any
-      }
-      const mockWidget = {
-        refresh: vi.fn()
-      }
-
-      useRemoteWidget({
-        remoteConfig: createMockConfig(),
-        defaultValue: DEFAULT_VALUE,
-        node: mockNode as any,
-        widget: mockWidget as any
-      })
-
-      // Simulate node removal
-      mockNode.onRemoved?.()
-
-      expect(api.removeEventListener).toHaveBeenCalledWith(
-        'execution_success',
-        executionSuccessHandler
-      )
-    })
-  })
 })

tests-ui/tests/services/algoliaSearchProvider.test.ts

@@ -1,374 +0,0 @@
-import { liteClient as algoliasearch } from 'algoliasearch/dist/lite/builds/browser'
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
-
-import { useAlgoliaSearchProvider } from '@/services/providers/algoliaSearchProvider'
-import { SortableAlgoliaField } from '@/types/comfyManagerTypes'
-
-// Mock global Algolia constants
-
-;(global as any).__ALGOLIA_APP_ID__ = 'test-app-id'
-;(global as any).__ALGOLIA_API_KEY__ = 'test-api-key'
-
-// Mock algoliasearch
-vi.mock('algoliasearch/dist/lite/builds/browser', () => ({
-  liteClient: vi.fn()
-}))
-
-describe('useAlgoliaSearchProvider', () => {
-  let mockSearchClient: any
-
-  beforeEach(() => {
-    vi.clearAllMocks()
-
-    // Create mock search client
-    mockSearchClient = {
-      search: vi.fn()
-    }
-
-    vi.mocked(algoliasearch).mockReturnValue(mockSearchClient)
-  })
-
-  afterEach(() => {
-    // Clear the module-level cache between tests
-    const provider = useAlgoliaSearchProvider()
-    provider.clearSearchCache()
-  })
-
-  describe('searchPacks', () => {
-    it('should search for packs and convert results', async () => {
-      const mockAlgoliaResults = {
-        results: [
-          {
-            hits: [
-              {
-                objectID: 'algolia-1',
-                id: 'pack-1',
-                name: 'Test Pack',
-                description: 'A test pack',
-                publisher_id: 'publisher-1',
-                total_install: 500,
-                create_time: '2024-01-01T00:00:00Z',
-                update_time: '2024-01-15T00:00:00Z',
-                repository_url: 'https://github.com/test/pack',
-                license: 'MIT',
-                status: 'active',
-                latest_version: '1.0.0',
-                latest_version_status: 'published',
-                icon_url: 'https://example.com/icon.png',
-                comfy_nodes: ['LoadImage', 'SaveImage']
-              }
-            ]
-          },
-          { hits: [] } // Query suggestions
-        ]
-      }
-
-      mockSearchClient.search.mockResolvedValue(mockAlgoliaResults)
-
-      const provider = useAlgoliaSearchProvider()
-      const result = await provider.searchPacks('test', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-
-      expect(mockSearchClient.search).toHaveBeenCalledWith({
-        requests: [
-          {
-            query: 'test',
-            indexName: 'nodes_index',
-            attributesToRetrieve: expect.any(Array),
-            hitsPerPage: 10,
-            page: 0
-          },
-          {
-            query: 'test',
-            indexName: 'nodes_index_query_suggestions'
-          }
-        ],
-        strategy: 'none'
-      })
-
-      expect(result.nodePacks).toHaveLength(1)
-      expect(result.nodePacks[0]).toEqual({
-        id: 'pack-1',
-        name: 'Test Pack',
-        description: 'A test pack',
-        repository: 'https://github.com/test/pack',
-        license: 'MIT',
-        downloads: 500,
-        status: 'active',
-        icon: 'https://example.com/icon.png',
-        latest_version: {
-          version: '1.0.0',
-          createdAt: '2024-01-15T00:00:00Z',
-          status: 'published',
-          comfy_node_extract_status: undefined
-        },
-        publisher: {
-          id: 'publisher-1',
-          name: 'publisher-1'
-        },
-        created_at: '2024-01-01T00:00:00Z',
-        comfy_nodes: ['LoadImage', 'SaveImage'],
-        category: undefined,
-        author: undefined,
-        tags: undefined,
-        github_stars: undefined,
-        supported_os: undefined,
-        supported_comfyui_version: undefined,
-        supported_comfyui_frontend_version: undefined,
-        supported_accelerators: undefined,
-        banner_url: undefined
-      })
-    })
-
-    it('should include query suggestions when query is long enough', async () => {
-      const mockAlgoliaResults = {
-        results: [
-          { hits: [] }, // Main results
-          {
-            hits: [
-              { query: 'test query', popularity: 10 },
-              { query: 'test pack', popularity: 5 }
-            ]
-          }
-        ]
-      }
-
-      mockSearchClient.search.mockResolvedValue(mockAlgoliaResults)
-
-      const provider = useAlgoliaSearchProvider()
-      const result = await provider.searchPacks('test', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-
-      // Should make 2 requests (main + suggestions)
-      expect(mockSearchClient.search).toHaveBeenCalledWith({
-        requests: [
-          expect.objectContaining({ indexName: 'nodes_index' }),
-          expect.objectContaining({
-            indexName: 'nodes_index_query_suggestions'
-          })
-        ],
-        strategy: 'none'
-      })
-
-      expect(result.querySuggestions).toEqual([
-        { query: 'test query', popularity: 10 },
-        { query: 'test pack', popularity: 5 }
-      ])
-    })
-
-    it('should not query suggestions for short queries', async () => {
-      mockSearchClient.search.mockResolvedValue({
-        results: [{ hits: [] }]
-      })
-
-      const provider = useAlgoliaSearchProvider()
-      await provider.searchPacks('a', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-
-      // Should only make 1 request (no suggestions)
-      expect(mockSearchClient.search).toHaveBeenCalledWith({
-        requests: [expect.objectContaining({ indexName: 'nodes_index' })],
-        strategy: 'none'
-      })
-    })
-
-    it('should cache search results', async () => {
-      mockSearchClient.search.mockResolvedValue({
-        results: [{ hits: [] }, { hits: [] }]
-      })
-
-      const provider = useAlgoliaSearchProvider()
-      const params = { pageSize: 10, pageNumber: 0 }
-
-      // First call
-      await provider.searchPacks('test', params)
-      expect(mockSearchClient.search).toHaveBeenCalledTimes(1)
-
-      // Second call with same params should use cache
-      await provider.searchPacks('test', params)
-      expect(mockSearchClient.search).toHaveBeenCalledTimes(1)
-
-      // Different params should make new request
-      await provider.searchPacks('test', { ...params, pageNumber: 1 })
-      expect(mockSearchClient.search).toHaveBeenCalledTimes(2)
-    })
-
-    it('should handle missing objectID by using id field', async () => {
-      const mockAlgoliaResults = {
-        results: [
-          {
-            hits: [
-              {
-                id: 'pack-id-only',
-                name: 'Pack without objectID',
-                // ... other required fields
-                publisher_id: 'pub',
-                total_install: 0,
-                comfy_nodes: []
-              }
-            ]
-          },
-          { hits: [] }
-        ]
-      }
-
-      mockSearchClient.search.mockResolvedValue(mockAlgoliaResults)
-
-      const provider = useAlgoliaSearchProvider()
-      const result = await provider.searchPacks('test', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-
-      expect(result.nodePacks[0].id).toBe('pack-id-only')
-    })
-  })
-
-  describe('clearSearchCache', () => {
-    it('should clear the cache', async () => {
-      mockSearchClient.search.mockResolvedValue({
-        results: [{ hits: [] }, { hits: [] }]
-      })
-
-      const provider = useAlgoliaSearchProvider()
-      const params = { pageSize: 10, pageNumber: 0 }
-
-      // Populate cache
-      await provider.searchPacks('test', params)
-      expect(mockSearchClient.search).toHaveBeenCalledTimes(1)
-
-      // Clear cache
-      provider.clearSearchCache()
-
-      // Same search should hit API again
-      await provider.searchPacks('test', params)
-      expect(mockSearchClient.search).toHaveBeenCalledTimes(2)
-    })
-  })
-
-  describe('getSortValue', () => {
-    const testPack = {
-      id: '1',
-      name: 'Test Pack',
-      downloads: 100,
-      publisher: { id: 'pub1', name: 'Publisher One' },
-      latest_version: {
-        version: '1.0.0',
-        createdAt: '2024-01-15T10:00:00Z'
-      },
-      created_at: '2024-01-01T10:00:00Z'
-    }
-
-    it('should return correct values for each sort field', () => {
-      const provider = useAlgoliaSearchProvider()
-
-      expect(
-        provider.getSortValue(testPack, SortableAlgoliaField.Downloads)
-      ).toBe(100)
-      expect(provider.getSortValue(testPack, SortableAlgoliaField.Name)).toBe(
-        'Test Pack'
-      )
-      expect(
-        provider.getSortValue(testPack, SortableAlgoliaField.Publisher)
-      ).toBe('Publisher One')
-
-      const createdTimestamp = new Date('2024-01-01T10:00:00Z').getTime()
-      expect(
-        provider.getSortValue(testPack as any, SortableAlgoliaField.Created)
-      ).toBe(createdTimestamp)
-
-      const updatedTimestamp = new Date('2024-01-15T10:00:00Z').getTime()
-      expect(
-        provider.getSortValue(testPack, SortableAlgoliaField.Updated)
-      ).toBe(updatedTimestamp)
-    })
-
-    it('should handle missing values', () => {
-      const incompletePack = { id: '1', name: 'Incomplete' }
-      const provider = useAlgoliaSearchProvider()
-
-      expect(
-        provider.getSortValue(incompletePack, SortableAlgoliaField.Downloads)
-      ).toBe(0)
-      expect(
-        provider.getSortValue(incompletePack, SortableAlgoliaField.Publisher)
-      ).toBe('')
-      expect(
-        provider.getSortValue(
-          incompletePack as any,
-          SortableAlgoliaField.Created
-        )
-      ).toBe(0)
-      expect(
-        provider.getSortValue(incompletePack, SortableAlgoliaField.Updated)
-      ).toBe(0)
-    })
-  })
-
-  describe('getSortableFields', () => {
-    it('should return all Algolia sort fields', () => {
-      const provider = useAlgoliaSearchProvider()
-      const fields = provider.getSortableFields()
-
-      expect(fields).toEqual([
-        {
-          id: SortableAlgoliaField.Downloads,
-          label: 'Downloads',
-          direction: 'desc'
-        },
-        {
-          id: SortableAlgoliaField.Created,
-          label: 'Created',
-          direction: 'desc'
-        },
-        {
-          id: SortableAlgoliaField.Updated,
-          label: 'Updated',
-          direction: 'desc'
-        },
-        {
-          id: SortableAlgoliaField.Publisher,
-          label: 'Publisher',
-          direction: 'asc'
-        },
-        { id: SortableAlgoliaField.Name, label: 'Name', direction: 'asc' }
-      ])
-    })
-  })
-
-  describe('memoization', () => {
-    it('should memoize toRegistryPack conversions', async () => {
-      const mockHit = {
-        objectID: 'algolia-1',
-        id: 'pack-1',
-        name: 'Test Pack',
-        publisher_id: 'pub1',
-        total_install: 100,
-        comfy_nodes: []
-      }
-
-      mockSearchClient.search.mockResolvedValue({
-        results: [
-          { hits: [mockHit, mockHit, mockHit] }, // Same object 3 times
-          { hits: [] }
-        ]
-      })
-
-      const provider = useAlgoliaSearchProvider()
-      const result = await provider.searchPacks('test', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-
-      // All 3 results should be the same object reference due to memoization
-      expect(result.nodePacks[0]).toBe(result.nodePacks[1])
-      expect(result.nodePacks[1]).toBe(result.nodePacks[2])
-    })
-  })
-})

tests-ui/tests/services/registrySearchGateway.test.ts

@@ -1,445 +0,0 @@
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
-
-import { useRegistrySearchGateway } from '@/services/gateway/registrySearchGateway'
-import { useAlgoliaSearchProvider } from '@/services/providers/algoliaSearchProvider'
-import { useComfyRegistrySearchProvider } from '@/services/providers/registrySearchProvider'
-
-// Mock the provider modules to control their behavior
-vi.mock('@/services/providers/algoliaSearchProvider')
-vi.mock('@/services/providers/registrySearchProvider')
-
-describe('useRegistrySearchGateway', () => {
-  let consoleWarnSpy: any
-  let consoleInfoSpy: any
-
-  beforeEach(() => {
-    vi.clearAllMocks()
-    consoleWarnSpy = vi.spyOn(console, 'warn').mockImplementation(() => {})
-    consoleInfoSpy = vi.spyOn(console, 'info').mockImplementation(() => {})
-  })
-
-  afterEach(() => {
-    consoleWarnSpy.mockRestore()
-    consoleInfoSpy.mockRestore()
-    vi.useRealTimers()
-  })
-
-  describe('Provider initialization', () => {
-    it('should initialize with both providers', () => {
-      const mockAlgoliaProvider = {
-        searchPacks: vi.fn(),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      const mockRegistryProvider = {
-        searchPacks: vi.fn(),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      vi.mocked(useAlgoliaSearchProvider).mockReturnValue(mockAlgoliaProvider)
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-
-      expect(useAlgoliaSearchProvider).toHaveBeenCalled()
-      expect(useComfyRegistrySearchProvider).toHaveBeenCalled()
-      expect(gateway).toBeDefined()
-    })
-
-    it('should handle Algolia initialization failure gracefully', () => {
-      vi.mocked(useAlgoliaSearchProvider).mockImplementation(() => {
-        throw new Error('Algolia init failed')
-      })
-
-      const mockRegistryProvider = {
-        searchPacks: vi
-          .fn()
-          .mockResolvedValue({ nodePacks: [], querySuggestions: [] }),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-
-      // Gateway should still work with just the Registry provider
-      expect(gateway).toBeDefined()
-      expect(typeof gateway.searchPacks).toBe('function')
-
-      // Verify it can still search using the fallback provider
-      return expect(
-        gateway.searchPacks('test', { pageSize: 10, pageNumber: 0 })
-      ).resolves.toBeDefined()
-    })
-  })
-
-  describe('Search functionality', () => {
-    it('should use Algolia provider by default and fallback on failure', async () => {
-      const algoliaResult = {
-        nodePacks: [{ id: 'algolia-1', name: 'Algolia Pack' }],
-        querySuggestions: []
-      }
-      const registryResult = {
-        nodePacks: [{ id: 'registry-1', name: 'Registry Pack' }],
-        querySuggestions: []
-      }
-
-      const mockAlgoliaProvider = {
-        searchPacks: vi
-          .fn()
-          .mockResolvedValueOnce(algoliaResult)
-          .mockRejectedValueOnce(new Error('Algolia failed')),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      const mockRegistryProvider = {
-        searchPacks: vi.fn().mockResolvedValue(registryResult),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      vi.mocked(useAlgoliaSearchProvider).mockReturnValue(mockAlgoliaProvider)
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-
-      // First call should use Algolia
-      const result1 = await gateway.searchPacks('test', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-      expect(result1.nodePacks[0].name).toBe('Algolia Pack')
-
-      // Second call should fallback to Registry when Algolia fails
-      const result2 = await gateway.searchPacks('test', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-      expect(result2.nodePacks[0].name).toBe('Registry Pack')
-    })
-
-    it('should throw error when all providers fail', async () => {
-      const mockAlgoliaProvider = {
-        searchPacks: vi.fn().mockRejectedValue(new Error('Algolia failed')),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      const mockRegistryProvider = {
-        searchPacks: vi.fn().mockRejectedValue(new Error('Registry failed')),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      vi.mocked(useAlgoliaSearchProvider).mockReturnValue(mockAlgoliaProvider)
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-
-      await expect(
-        gateway.searchPacks('test', { pageSize: 10, pageNumber: 0 })
-      ).rejects.toThrow('All search providers failed')
-    })
-  })
-
-  describe('Circuit breaker functionality', () => {
-    it('should switch to fallback provider after failure and log warnings', async () => {
-      const registryResult = {
-        nodePacks: [{ id: 'registry-1', name: 'Registry Pack' }],
-        querySuggestions: []
-      }
-
-      // Create mock that fails
-      const mockAlgoliaProvider = {
-        searchPacks: vi.fn().mockRejectedValue(new Error('Algolia failed')),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      const mockRegistryProvider = {
-        searchPacks: vi.fn().mockResolvedValue(registryResult),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      vi.mocked(useAlgoliaSearchProvider).mockReturnValue(mockAlgoliaProvider)
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-
-      // First call should try Algolia, fail, and use Registry
-      const result = await gateway.searchPacks('test', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-
-      expect(mockAlgoliaProvider.searchPacks).toHaveBeenCalledTimes(1)
-      expect(mockRegistryProvider.searchPacks).toHaveBeenCalledTimes(1)
-      expect(result.nodePacks[0].name).toBe('Registry Pack')
-
-      // Circuit breaker behavior is internal implementation detail
-      // We only test the observable behavior (fallback works)
-    })
-
-    it('should have circuit breaker timeout mechanism', () => {
-      // This test verifies that the constants exist for circuit breaker behavior
-      // The actual circuit breaker logic is tested in integration with real provider behavior
-      expect(typeof useRegistrySearchGateway).toBe('function')
-
-      // We can test that the gateway logs circuit breaker behavior
-      const mockAlgoliaProvider = {
-        searchPacks: vi.fn().mockRejectedValue(new Error('Persistent failure')),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      const mockRegistryProvider = {
-        searchPacks: vi
-          .fn()
-          .mockResolvedValue({ nodePacks: [], querySuggestions: [] }),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      vi.mocked(useAlgoliaSearchProvider).mockReturnValue(mockAlgoliaProvider)
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-      expect(gateway).toBeDefined()
-    })
-  })
-
-  describe('Cache management', () => {
-    it('should clear cache for all providers', () => {
-      const mockAlgoliaProvider = {
-        searchPacks: vi.fn(),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      const mockRegistryProvider = {
-        searchPacks: vi.fn(),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      vi.mocked(useAlgoliaSearchProvider).mockReturnValue(mockAlgoliaProvider)
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-      gateway.clearSearchCache()
-
-      expect(mockAlgoliaProvider.clearSearchCache).toHaveBeenCalled()
-      expect(mockRegistryProvider.clearSearchCache).toHaveBeenCalled()
-    })
-
-    it('should handle cache clear failures gracefully', () => {
-      const mockAlgoliaProvider = {
-        searchPacks: vi.fn(),
-        clearSearchCache: vi.fn().mockImplementation(() => {
-          throw new Error('Cache clear failed')
-        }),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      const mockRegistryProvider = {
-        searchPacks: vi.fn(),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      vi.mocked(useAlgoliaSearchProvider).mockReturnValue(mockAlgoliaProvider)
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-
-      // Should not throw when clearing cache even if one provider fails
-      expect(() => gateway.clearSearchCache()).not.toThrow()
-
-      // Should still attempt to clear cache for all providers
-      expect(mockAlgoliaProvider.clearSearchCache).toHaveBeenCalled()
-      expect(mockRegistryProvider.clearSearchCache).toHaveBeenCalled()
-    })
-  })
-
-  describe('Sort functionality', () => {
-    it('should use sort fields from active provider', () => {
-      const algoliaFields = [
-        { id: 'downloads', label: 'Downloads', direction: 'desc' }
-      ]
-
-      const mockAlgoliaProvider = {
-        searchPacks: vi.fn(),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue(algoliaFields)
-      }
-
-      const mockRegistryProvider = {
-        searchPacks: vi.fn(),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      vi.mocked(useAlgoliaSearchProvider).mockReturnValue(mockAlgoliaProvider)
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-      const sortFields = gateway.getSortableFields()
-
-      expect(sortFields).toEqual(algoliaFields)
-    })
-
-    it('should switch sort fields when provider changes', async () => {
-      const algoliaFields = [
-        { id: 'downloads', label: 'Downloads', direction: 'desc' }
-      ]
-      const registryFields = [{ id: 'name', label: 'Name', direction: 'asc' }]
-
-      const mockAlgoliaProvider = {
-        searchPacks: vi.fn().mockRejectedValue(new Error('Algolia failed')),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue(algoliaFields)
-      }
-
-      const mockRegistryProvider = {
-        searchPacks: vi
-          .fn()
-          .mockResolvedValue({ nodePacks: [], querySuggestions: [] }),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue(registryFields)
-      }
-
-      vi.mocked(useAlgoliaSearchProvider).mockReturnValue(mockAlgoliaProvider)
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-
-      // Initially should use Algolia's sort fields
-      expect(gateway.getSortableFields()).toEqual(algoliaFields)
-
-      // Force a search to trigger provider switch
-      await gateway.searchPacks('test', { pageSize: 10, pageNumber: 0 })
-
-      // Now should use Registry's sort fields
-      expect(gateway.getSortableFields()).toEqual(registryFields)
-    })
-
-    it('should delegate getSortValue to active provider', () => {
-      const mockAlgoliaProvider = {
-        searchPacks: vi.fn(),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn().mockReturnValue(100),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      const mockRegistryProvider = {
-        searchPacks: vi.fn(),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      vi.mocked(useAlgoliaSearchProvider).mockReturnValue(mockAlgoliaProvider)
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-      const pack = { id: '1', name: 'Test Pack' }
-
-      const value = gateway.getSortValue(pack, 'downloads')
-
-      expect(mockAlgoliaProvider.getSortValue).toHaveBeenCalledWith(
-        pack,
-        'downloads'
-      )
-      expect(value).toBe(100)
-    })
-  })
-
-  describe('Provider recovery', () => {
-    it('should use fallback provider when primary fails', async () => {
-      const algoliaError = new Error('Algolia service unavailable')
-      const registryResult = {
-        nodePacks: [{ id: 'registry-1', name: 'Registry Pack' }],
-        querySuggestions: []
-      }
-
-      const mockAlgoliaProvider = {
-        searchPacks: vi.fn().mockRejectedValue(algoliaError),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      const mockRegistryProvider = {
-        searchPacks: vi.fn().mockResolvedValue(registryResult),
-        clearSearchCache: vi.fn(),
-        getSortValue: vi.fn(),
-        getSortableFields: vi.fn().mockReturnValue([])
-      }
-
-      vi.mocked(useAlgoliaSearchProvider).mockReturnValue(mockAlgoliaProvider)
-      vi.mocked(useComfyRegistrySearchProvider).mockReturnValue(
-        mockRegistryProvider
-      )
-
-      const gateway = useRegistrySearchGateway()
-
-      // Should fallback to Registry when Algolia fails
-      const result = await gateway.searchPacks('test', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-
-      expect(result.nodePacks[0].name).toBe('Registry Pack')
-      expect(mockAlgoliaProvider.searchPacks).toHaveBeenCalledTimes(1)
-      expect(mockRegistryProvider.searchPacks).toHaveBeenCalledTimes(1)
-
-      // The gateway successfully handled the failure and returned results
-    })
-  })
-})

tests-ui/tests/services/registrySearchProvider.test.ts

@@ -1,186 +0,0 @@
-import { beforeEach, describe, expect, it, vi } from 'vitest'
-
-import { useComfyRegistrySearchProvider } from '@/services/providers/registrySearchProvider'
-import { useComfyRegistryStore } from '@/stores/comfyRegistryStore'
-
-// Mock the store
-vi.mock('@/stores/comfyRegistryStore', () => ({
-  useComfyRegistryStore: vi.fn()
-}))
-
-describe('useComfyRegistrySearchProvider', () => {
-  const mockSearchCall = vi.fn()
-  const mockSearchClear = vi.fn()
-
-  beforeEach(() => {
-    vi.clearAllMocks()
-
-    // Setup store mock
-    vi.mocked(useComfyRegistryStore).mockReturnValue({
-      search: {
-        call: mockSearchCall,
-        clear: mockSearchClear
-      }
-    } as any)
-  })
-
-  describe('searchPacks', () => {
-    it('should search for packs by name', async () => {
-      const mockResults = {
-        nodes: [
-          { id: '1', name: 'Test Pack 1' },
-          { id: '2', name: 'Test Pack 2' }
-        ]
-      }
-      mockSearchCall.mockResolvedValue(mockResults)
-
-      const provider = useComfyRegistrySearchProvider()
-      const result = await provider.searchPacks('test', {
-        pageSize: 10,
-        pageNumber: 0,
-        restrictSearchableAttributes: ['name', 'description']
-      })
-
-      expect(mockSearchCall).toHaveBeenCalledWith({
-        search: 'test',
-        comfy_node_search: undefined,
-        limit: 10,
-        page: 1
-      })
-      expect(result.nodePacks).toEqual(mockResults.nodes)
-      expect(result.querySuggestions).toEqual([])
-    })
-
-    it('should search for packs by node names', async () => {
-      const mockResults = {
-        nodes: [{ id: '1', name: 'Pack with LoadImage node' }]
-      }
-      mockSearchCall.mockResolvedValue(mockResults)
-
-      const provider = useComfyRegistrySearchProvider()
-      const result = await provider.searchPacks('LoadImage', {
-        pageSize: 20,
-        pageNumber: 1,
-        restrictSearchableAttributes: ['comfy_nodes']
-      })
-
-      expect(mockSearchCall).toHaveBeenCalledWith({
-        search: undefined,
-        comfy_node_search: 'LoadImage',
-        limit: 20,
-        page: 2
-      })
-      expect(result.nodePacks).toEqual(mockResults.nodes)
-    })
-
-    it('should handle empty results', async () => {
-      mockSearchCall.mockResolvedValue({ nodes: [] })
-
-      const provider = useComfyRegistrySearchProvider()
-      const result = await provider.searchPacks('nonexistent', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-
-      expect(result.nodePacks).toEqual([])
-      expect(result.querySuggestions).toEqual([])
-    })
-
-    it('should handle null results', async () => {
-      mockSearchCall.mockResolvedValue(null)
-
-      const provider = useComfyRegistrySearchProvider()
-      const result = await provider.searchPacks('test', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-
-      expect(result.nodePacks).toEqual([])
-      expect(result.querySuggestions).toEqual([])
-    })
-
-    it('should handle results without nodes property', async () => {
-      mockSearchCall.mockResolvedValue({})
-
-      const provider = useComfyRegistrySearchProvider()
-      const result = await provider.searchPacks('test', {
-        pageSize: 10,
-        pageNumber: 0
-      })
-
-      expect(result.nodePacks).toEqual([])
-      expect(result.querySuggestions).toEqual([])
-    })
-  })
-
-  describe('clearSearchCache', () => {
-    it('should delegate to store search.clear', () => {
-      const provider = useComfyRegistrySearchProvider()
-      provider.clearSearchCache()
-
-      expect(mockSearchClear).toHaveBeenCalled()
-    })
-  })
-
-  describe('getSortValue', () => {
-    const testPack = {
-      id: '1',
-      name: 'Test Pack',
-      downloads: 100,
-      publisher: { id: 'pub1', name: 'Publisher One' },
-      latest_version: {
-        version: '1.0.0',
-        createdAt: '2024-01-15T10:00:00Z'
-      }
-    }
-
-    it('should return download count for downloads field', () => {
-      const provider = useComfyRegistrySearchProvider()
-      expect(provider.getSortValue(testPack, 'downloads')).toBe(100)
-    })
-
-    it('should return pack name for name field', () => {
-      const provider = useComfyRegistrySearchProvider()
-      expect(provider.getSortValue(testPack, 'name')).toBe('Test Pack')
-    })
-
-    it('should return publisher name for publisher field', () => {
-      const provider = useComfyRegistrySearchProvider()
-      expect(provider.getSortValue(testPack, 'publisher')).toBe('Publisher One')
-    })
-
-    it('should return timestamp for updated field', () => {
-      const provider = useComfyRegistrySearchProvider()
-      const timestamp = new Date('2024-01-15T10:00:00Z').getTime()
-      expect(provider.getSortValue(testPack, 'updated')).toBe(timestamp)
-    })
-
-    it('should handle missing values gracefully', () => {
-      const incompletePack = { id: '1', name: 'Incomplete' }
-      const provider = useComfyRegistrySearchProvider()
-
-      expect(provider.getSortValue(incompletePack, 'downloads')).toBe(0)
-      expect(provider.getSortValue(incompletePack, 'publisher')).toBe('')
-      expect(provider.getSortValue(incompletePack, 'updated')).toBe(0)
-    })
-
-    it('should return 0 for unknown sort fields', () => {
-      const provider = useComfyRegistrySearchProvider()
-      expect(provider.getSortValue(testPack, 'unknown')).toBe(0)
-    })
-  })
-
-  describe('getSortableFields', () => {
-    it('should return supported sort fields', () => {
-      const provider = useComfyRegistrySearchProvider()
-      const fields = provider.getSortableFields()
-
-      expect(fields).toEqual([
-        { id: 'downloads', label: 'Downloads', direction: 'desc' },
-        { id: 'name', label: 'Name', direction: 'asc' },
-        { id: 'publisher', label: 'Publisher', direction: 'asc' },
-        { id: 'updated', label: 'Updated', direction: 'desc' }
-      ])
-    })
-  })
-})

tests-ui/tests/store/dialogStore.test.ts

@@ -1,175 +0,0 @@
-import { createPinia, setActivePinia } from 'pinia'
-import { beforeEach, describe, expect, it } from 'vitest'
-import { defineComponent } from 'vue'
-
-import { useDialogStore } from '@/stores/dialogStore'
-
-const MockComponent = defineComponent({
-  name: 'MockComponent',
-  template: '<div>Mock</div>'
-})
-
-describe('dialogStore', () => {
-  beforeEach(() => {
-    setActivePinia(createPinia())
-  })
-
-  describe('priority system', () => {
-    it('should create dialogs in correct priority order', () => {
-      const store = useDialogStore()
-
-      // Create dialogs with different priorities
-      store.showDialog({
-        key: 'low-priority',
-        component: MockComponent,
-        priority: 0
-      })
-
-      store.showDialog({
-        key: 'high-priority',
-        component: MockComponent,
-        priority: 10
-      })
-
-      store.showDialog({
-        key: 'medium-priority',
-        component: MockComponent,
-        priority: 5
-      })
-
-      store.showDialog({
-        key: 'no-priority',
-        component: MockComponent
-      })
-
-      // Check order: high (2) -> medium (1) -> low (0)
-      expect(store.dialogStack.map((d) => d.key)).toEqual([
-        'high-priority',
-        'medium-priority',
-        'no-priority',
-        'low-priority'
-      ])
-    })
-
-    it('should maintain priority order when rising dialogs', () => {
-      const store = useDialogStore()
-
-      // Create dialogs with different priorities
-      store.showDialog({
-        key: 'priority-2',
-        component: MockComponent,
-        priority: 2
-      })
-
-      store.showDialog({
-        key: 'priority-1',
-        component: MockComponent,
-        priority: 1
-      })
-
-      store.showDialog({
-        key: 'priority-0',
-        component: MockComponent,
-        priority: 0
-      })
-
-      // Try to rise the lowest priority dialog
-      store.riseDialog({ key: 'priority-0' })
-
-      // Should still be at the bottom because of its priority
-      expect(store.dialogStack.map((d) => d.key)).toEqual([
-        'priority-2',
-        'priority-1',
-        'priority-0'
-      ])
-
-      // Rise the medium priority dialog
-      store.riseDialog({ key: 'priority-1' })
-
-      // Should be above priority-0 but below priority-2
-      expect(store.dialogStack.map((d) => d.key)).toEqual([
-        'priority-2',
-        'priority-1',
-        'priority-0'
-      ])
-    })
-
-    it('should keep high priority dialogs on top when creating new lower priority dialogs', () => {
-      const store = useDialogStore()
-
-      // Create a high priority dialog (like manager progress)
-      store.showDialog({
-        key: 'manager-progress',
-        component: MockComponent,
-        priority: 10
-      })
-
-      store.showDialog({
-        key: 'dialog-2',
-        component: MockComponent,
-        priority: 0
-      })
-
-      store.showDialog({
-        key: 'dialog-3',
-        component: MockComponent
-        // Default priority is 1
-      })
-
-      // Manager progress should still be on top
-      expect(store.dialogStack[0].key).toBe('manager-progress')
-
-      // Check full order
-      expect(store.dialogStack.map((d) => d.key)).toEqual([
-        'manager-progress', // priority 2
-        'dialog-3', // priority 1 (default)
-        'dialog-2' // priority 0
-      ])
-    })
-  })
-
-  describe('basic dialog operations', () => {
-    it('should show and close dialogs', () => {
-      const store = useDialogStore()
-
-      store.showDialog({
-        key: 'test-dialog',
-        component: MockComponent
-      })
-
-      expect(store.dialogStack).toHaveLength(1)
-      expect(store.isDialogOpen('test-dialog')).toBe(true)
-
-      store.closeDialog({ key: 'test-dialog' })
-
-      expect(store.dialogStack).toHaveLength(0)
-      expect(store.isDialogOpen('test-dialog')).toBe(false)
-    })
-
-    it('should reuse existing dialog when showing with same key', () => {
-      const store = useDialogStore()
-
-      store.showDialog({
-        key: 'reusable-dialog',
-        component: MockComponent,
-        title: 'Original Title'
-      })
-
-      // First call should create the dialog
-      expect(store.dialogStack).toHaveLength(1)
-      expect(store.dialogStack[0].title).toBe('Original Title')
-
-      // Second call with same key should reuse the dialog
-      store.showDialog({
-        key: 'reusable-dialog',
-        component: MockComponent,
-        title: 'New Title' // This should be ignored
-      })
-
-      // Should still have only one dialog with original title
-      expect(store.dialogStack).toHaveLength(1)
-      expect(store.dialogStack[0].key).toBe('reusable-dialog')
-      expect(store.dialogStack[0].title).toBe('Original Title')
-    })
-  })
-})

vitest.config.ts

@@ -7,10 +7,7 @@ export default defineConfig({
     globals: true,
     environment: 'happy-dom',
     setupFiles: ['./vitest.setup.ts'],
-    include: [
-      'tests-ui/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}',
-      'src/components/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'
-    ],
+    include: ['**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
     coverage: {
       reporter: ['text', 'json', 'html']
     }