Merge branch 'feat/mcp-frontend' into deploy/dev

web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/cardView.tsx

@@ -32,7 +32,7 @@ const CardView: FC<ICardViewProps> = ({ appId, isInPanel, className }) => {
   const appDetail = useAppStore(state => state.appDetail)
   const setAppDetail = useAppStore(state => state.setAppDetail)
 
-  const showMCPCard = isInPanel && (appDetail?.mode === 'advanced-chat' || appDetail?.mode === 'workflow')
+  const showMCPCard = isInPanel
 
   const updateAppDetail = async () => {
     try {

web/app/components/tools/mcp/mcp-service-card.tsx

@@ -27,6 +27,7 @@ import {
 } from '@/service/use-tools'
 import { BlockEnum } from '@/app/components/workflow/types'
 import cn from '@/utils/classnames'
+import { fetchAppDetail } from '@/service/apps'
 
 export type IAppCardProps = {
   appInfo: AppDetailResponse & Partial<AppSSO>
@@ -36,6 +37,7 @@ function MCPServiceCard({
   appInfo,
 }: IAppCardProps) {
   const { t } = useTranslation()
+  const appId = appInfo.id
   const { mutateAsync: updateMCPServer } = useUpdateMCPServer()
   const { mutateAsync: refreshMCPServerCode, isPending: genLoading } = useRefreshMCPServerCode()
   const invalidateMCPServerDetail = useInvalidateMCPServerDetail()
@@ -43,11 +45,33 @@ function MCPServiceCard({
   const [showConfirmDelete, setShowConfirmDelete] = useState(false)
   const [showMCPServerModal, setShowMCPServerModal] = useState(false)
 
-  const { data: currentWorkflow } = useAppWorkflow(appInfo.id)
-  const { data: detail } = useMCPServerDetail(appInfo.id)
+  const isAdvancedApp = appInfo?.mode === 'advanced-chat' || appInfo?.mode === 'workflow'
+  const isBasicApp = !isAdvancedApp
+  const { data: currentWorkflow } = useAppWorkflow(isAdvancedApp ? appId : '')
+  const [basicAppConfig, setBasicAppConfig] = useState<any>({})
+  const basicAppInputForm = useMemo(() => {
+    if(!isBasicApp || !basicAppConfig?.user_input_form)
+      return []
+    return basicAppConfig.user_input_form.map((item: any) => {
+      const type = Object.keys(item)[0]
+      return {
+        ...item[type],
+        type: type || 'text-input',
+      }
+    })
+  }, [basicAppConfig.user_input_form, isBasicApp])
+  useEffect(() => {
+    if(isBasicApp && appId) {
+      (async () => {
+        const res = await fetchAppDetail({ url: '/apps', id: appId })
+        setBasicAppConfig(res?.model_config || {})
+      })()
+    }
+  }, [appId, isBasicApp])
+  const { data: detail } = useMCPServerDetail(appId)
   const { id, status, server_code } = detail ?? {}
 
-  const appUnpublished = !currentWorkflow?.graph
+  const appUnpublished = isAdvancedApp ? !currentWorkflow?.graph : !basicAppConfig.updated_at
   const serverPublished = !!id
   const serverActivated = status === 'active'
   const serverURL = serverPublished ? `${appInfo.api_base_url.replace('/v1', '')}/mcp/server/${server_code}/mcp` : '***********'
@@ -56,15 +80,18 @@ function MCPServiceCard({
   const [activated, setActivated] = useState(serverActivated)
 
   const latestParams = useMemo(() => {
+    if(isAdvancedApp) {
       if (!currentWorkflow?.graph)
         return []
       const startNode = currentWorkflow?.graph.nodes.find(node => node.data.type === BlockEnum.Start) as any
       return startNode?.data.variables as any[] || []
-  }, [currentWorkflow])
+    }
+    return basicAppInputForm
+  }, [currentWorkflow, basicAppInputForm, isAdvancedApp])
 
   const onGenCode = async () => {
     await refreshMCPServerCode(detail?.id || '')
-    invalidateMCPServerDetail(appInfo.id)
+    invalidateMCPServerDetail(appId)
   }
 
   const onChangeStatus = async (state: boolean) => {
@@ -76,23 +103,23 @@ function MCPServiceCard({
       }
 
       await updateMCPServer({
-        appID: appInfo.id,
+        appID: appId,
         id: id || '',
         description: detail?.description || '',
         parameters: detail?.parameters || {},
         status: 'active',
       })
-      invalidateMCPServerDetail(appInfo.id)
+      invalidateMCPServerDetail(appId)
     }
     else {
       await updateMCPServer({
-        appID: appInfo.id,
+        appID: appId,
         id: id || '',
         description: detail?.description || '',
         parameters: detail?.parameters || {},
         status: 'inactive',
       })
-      invalidateMCPServerDetail(appInfo.id)
+      invalidateMCPServerDetail(appId)
     }
   }
 
@@ -106,7 +133,7 @@ function MCPServiceCard({
     setActivated(serverActivated)
   }, [serverActivated])
 
-  if (!currentWorkflow)
+  if (!currentWorkflow && isAdvancedApp)
     return null
 
   return (
@@ -190,7 +217,7 @@ function MCPServiceCard({
       {showMCPServerModal && (
         <MCPServerModal
           show={showMCPServerModal}
-          appID={appInfo.id}
+          appID={appId}
           data={serverPublished ? detail : undefined}
           latestParams={latestParams}
           onHide={handleServerModalHide}

web/app/components/workflow/block-selector/all-tools.tsx

@@ -21,7 +21,6 @@ import PluginList, { type ListProps } from '@/app/components/workflow/block-sele
 import { PluginType } from '../../plugins/types'
 import { useMarketplacePlugins } from '../../plugins/marketplace/hooks'
 import { useGlobalPublicStore } from '@/context/global-public-context'
-import useCheckVerticalScrollbar from './use-check-vertical-scrollbar'
 
 type AllToolsProps = {
   className?: string
@@ -107,7 +106,6 @@ const AllTools = ({
 
   const pluginRef = useRef<ListRef>(null)
   const wrapElemRef = useRef<HTMLDivElement>(null)
-  const hasVerticalScrollbar = useCheckVerticalScrollbar(wrapElemRef)
   const isSupportGroupView = [ToolTypeEnum.All, ToolTypeEnum.BuiltIn].includes(activeTab)
 
   return (
@@ -150,7 +148,6 @@ const AllTools = ({
           hasSearchText={!!searchText}
           selectedTools={selectedTools}
           canChooseMCPTool={canChooseMCPTool}
-          hasScrollBar={hasVerticalScrollbar}
         />
         {/* Plugins from marketplace */}
         {enable_marketplace && <PluginList

web/app/components/workflow/block-selector/tools.tsx

@@ -28,7 +28,6 @@ type ToolsProps = {
   indexBarClassName?: string
   selectedTools?: ToolValue[]
   canChooseMCPTool?: boolean
-  hasScrollBar?: boolean
 }
 const Blocks = ({
   onSelect,