feat: fetch plugin list

web/app/components/plugins/reference-setting-modal/auto-update-setting/tool-picker.tsx

@@ -1,11 +1,13 @@
 'use client'
 import type { FC } from 'react'
-import React, { useCallback } from 'react'
+import React, { useCallback, useState } from 'react'
 import {
   PortalToFollowElem,
   PortalToFollowElemContent,
   PortalToFollowElemTrigger,
 } from '@/app/components/base/portal-to-follow-elem'
+import { useFetchPluginListOrBundleList } from '@/service/use-plugins'
+import { PLUGIN_TYPE_SEARCH_MAP } from '../../marketplace/plugin-type-switch'
 
 type Props = {
     trigger: React.ReactNode
@@ -16,6 +18,8 @@ type Props = {
 
 }
 
+const allPluginTypes = [PLUGIN_TYPE_SEARCH_MAP.all, PLUGIN_TYPE_SEARCH_MAP.model, PLUGIN_TYPE_SEARCH_MAP.tool, PLUGIN_TYPE_SEARCH_MAP.agent, PLUGIN_TYPE_SEARCH_MAP.extension, PLUGIN_TYPE_SEARCH_MAP.bundle]
+
 const ToolPicker: FC<Props> = ({
   trigger,
   value,
@@ -26,6 +30,16 @@ const ToolPicker: FC<Props> = ({
   const toggleShowPopup = useCallback(() => {
     onShowChange(!isShow)
   }, [onShowChange, isShow])
+
+  const [pluginType, setPluginType] = useState(PLUGIN_TYPE_SEARCH_MAP.all)
+  const [query, setQuery] = useState('')
+  const { data } = useFetchPluginListOrBundleList({
+    query,
+    category: pluginType,
+  })
+  const isBundle = pluginType === PLUGIN_TYPE_SEARCH_MAP.bundle
+  const list = (isBundle ? data?.data?.bundles : data?.data?.plugins) || []
+  console.log(list)
   return (
     <PortalToFollowElem
         placement='top-start'

web/service/use-plugins.ts

@@ -426,6 +426,39 @@ export const useFetchPluginsInMarketPlaceByIds = (unique_identifiers: string[],
   })
 }
 
+export const useFetchPluginListOrBundleList = (pluginsSearchParams: PluginsSearchParams) => {
+  return useQuery({
+    queryKey: [NAME_SPACE, 'fetchPluginListOrBundleList', pluginsSearchParams],
+    queryFn: () => {
+      const {
+        query,
+        sortBy,
+        sortOrder,
+        category,
+        tags,
+        exclude,
+        type,
+        page = 1,
+        pageSize = 40,
+      } = pluginsSearchParams
+      const pluginOrBundle = type === 'bundle' ? 'bundles' : 'plugins'
+      return postMarketplace<{ data: PluginsFromMarketplaceResponse }>(`/${pluginOrBundle}/search/advanced`, {
+        body: {
+          page,
+          page_size: pageSize,
+          query,
+          sort_by: sortBy,
+          sort_order: sortOrder,
+          category: category !== 'all' ? category : '',
+          tags,
+          exclude,
+          type,
+        },
+      })
+    },
+  })
+}
+
 export const useFetchPluginsInMarketPlaceByInfo = (infos: Record<string, any>[]) => {
   return useQuery({
     queryKey: [NAME_SPACE, 'fetchPluginsInMarketPlaceByInfo', infos],