Add Comfy Registry store and search hook (#2848)

src/composables/useRegistrySearch.ts

@@ -0,0 +1,69 @@
+import { debounce } from 'lodash'
+import { onUnmounted, ref, watch } from 'vue'
+
+import { useComfyRegistryService } from '@/services/comfyRegistryService'
+import { useComfyRegistryStore } from '@/stores/comfyRegistryStore'
+import type { components } from '@/types/comfyRegistryTypes'
+
+const SEARCH_DEBOUNCE_TIME = 256
+const DEFAULT_PAGE_SIZE = 60
+
+/**
+ * Composable for managing UI state of Comfy Node Registry search.
+ */
+export function useRegistrySearch() {
+  const registryStore = useComfyRegistryStore()
+  const registryService = useComfyRegistryService()
+
+  const searchQuery = ref('')
+  const pageNumber = ref(1)
+  const pageSize = ref(DEFAULT_PAGE_SIZE)
+  const searchResults = ref<components['schemas']['Node'][]>([])
+
+  const search = async () => {
+    try {
+      const isEmptySearch = searchQuery.value === ''
+      const result = isEmptySearch
+        ? await registryStore.listAllPacks({
+            page: pageNumber.value,
+            limit: pageSize.value
+          })
+        : await registryService.search({
+            search: searchQuery.value,
+            page: pageNumber.value,
+            limit: pageSize.value
+          })
+
+      if (result) {
+        searchResults.value = result.nodes || []
+      } else {
+        searchResults.value = []
+      }
+    } catch (err) {
+      console.error('Error loading packs:', err)
+      searchResults.value = []
+    }
+  }
+
+  // Debounce search when query changes
+  const debouncedSearch = debounce(search, SEARCH_DEBOUNCE_TIME)
+  watch(() => searchQuery.value, debouncedSearch)
+
+  // Normal search when page number changes and on load
+  watch(() => pageNumber.value, search, { immediate: true })
+
+  onUnmounted(() => {
+    debouncedSearch.cancel() // Cancel debounced searches
+    registryStore.cancelRequests() // Cancel in-flight requests
+    registryStore.clearCache() // Clear cached responses
+  })
+
+  return {
+    pageNumber,
+    pageSize,
+    searchQuery,
+    searchResults,
+    isLoading: registryService.isLoading,
+    error: registryService.error
+  }
+}