unsupported actions

web/app/components/plugins/plugin-detail-panel/index.tsx

@@ -9,7 +9,6 @@ import AgentStrategyList from './agent-strategy-list'
 import Drawer from '@/app/components/base/drawer'
 import type { PluginDetail } from '@/app/components/plugins/types'
 import cn from '@/utils/classnames'
-import ToolSelector from '@/app/components/plugins/plugin-detail-panel/tool-selector'
 
 type Props = {
   detail?: PluginDetail
@@ -28,16 +27,6 @@ const PluginDetailPanel: FC<Props> = ({
     onUpdate()
   }
 
-  const [value, setValue] = React.useState({
-    provider_name: 'langgenius/google/google',
-    tool_name: 'google_search',
-  })
-
-  const testHandle = (item: any) => {
-    console.log(item)
-    setValue(item)
-  }
-
   if (!detail)
     return null
 
@@ -63,17 +52,6 @@ const PluginDetailPanel: FC<Props> = ({
             {!!detail.declaration.agent_strategy && <AgentStrategyList detail={detail} />}
             {!!detail.declaration.endpoint && <EndpointList detail={detail} />}
             {!!detail.declaration.model && <ModelList detail={detail} />}
-            {false && (
-              <div className='px-4'>
-                <ToolSelector
-                  scope={'all'}
-                  value={value}
-                  onSelect={item => testHandle(item)}
-                  onDelete={() => testHandle(null)}
-                  supportEnableSwitch
-                />
-              </div>
-            )}
           </div>
         </>
       )}

web/app/components/plugins/plugin-detail-panel/tool-selector/index.tsx

@@ -102,7 +102,7 @@ const ToolSelector: FC<Props> = ({
   const currentProvider = useMemo(() => {
     const mergedTools = [...(buildInTools || []), ...(customTools || []), ...(workflowTools || [])]
     return mergedTools.find((toolWithProvider) => {
-      return toolWithProvider.id === value?.provider_name && toolWithProvider.tools.some(tool => tool.name === value?.tool_name)
+      return toolWithProvider.id === value?.provider_name
     })
   }, [value, buildInTools, customTools, workflowTools])
 
@@ -172,7 +172,9 @@ const ToolSelector: FC<Props> = ({
   })
 
   // install from marketplace
-
+  const currentTool = useMemo(() => {
+    return currentProvider?.tools.find(tool => tool.name === value?.tool_name)
+  }, [currentProvider?.tools, value?.tool_name])
   const manifestIcon = useMemo(() => {
     if (!manifest)
       return ''
@@ -193,7 +195,10 @@ const ToolSelector: FC<Props> = ({
       >
         <PortalToFollowElemTrigger
           className='w-full'
-          onClick={handleTriggerClick}
+          onClick={() => {
+            if (!currentProvider || !currentTool) return
+            handleTriggerClick()
+          }}
         >
           {trigger}
           {!trigger && !value?.provider_name && (
@@ -214,19 +219,22 @@ const ToolSelector: FC<Props> = ({
               switchValue={value.enabled}
               onSwitchChange={handleEnabledChange}
               onDelete={onDelete}
-              noAuth={currentProvider && !currentProvider.is_team_authorization}
+              noAuth={currentProvider && currentTool && !currentProvider.is_team_authorization}
               onAuth={() => setShowSettingAuth(true)}
               uninstalled={!currentProvider && inMarketPlace}
+              versionMismatch={currentProvider && inMarketPlace && !currentTool}
               installInfo={manifest?.latest_package_identifier}
               onInstall={() => handleInstall()}
-              isError={!currentProvider && !inMarketPlace}
+              isError={(!currentProvider || !currentTool) && !inMarketPlace}
-              errorTip={<div className='space-y-1 max-w-[240px] text-xs'>
+              errorTip={
-                <h3 className='text-text-primary font-semibold'>{t('plugin.detailPanel.toolSelector.uninstalledTitle')}</h3>
+                <div className='space-y-1 max-w-[240px] text-xs'>
-                <p className='text-text-secondary tracking-tight'>{t('plugin.detailPanel.toolSelector.uninstalledContent')}</p>
+                  <h3 className='text-text-primary font-semibold'>{currentTool ? t('plugin.detailPanel.toolSelector.uninstalledTitle') : t('plugin.detailPanel.toolSelector.unsupportedTitle')}</h3>
+                  <p className='text-text-secondary tracking-tight'>{currentTool ? t('plugin.detailPanel.toolSelector.uninstalledContent') : t('plugin.detailPanel.toolSelector.unsupportedContent')}</p>
                   <p>
                     <Link href={'/plugins'} className='text-text-accent tracking-tight'>{t('plugin.detailPanel.toolSelector.uninstalledLink')}</Link>
                   </p>
-              </div>}
+                </div>
+              }
             />
           )}
         </PortalToFollowElemTrigger>

web/app/components/plugins/plugin-detail-panel/tool-selector/tool-item.tsx

@@ -13,7 +13,9 @@ import Button from '@/app/components/base/button'
 import Indicator from '@/app/components/header/indicator'
 import ActionButton from '@/app/components/base/action-button'
 import Tooltip from '@/app/components/base/tooltip'
+import { ToolTipContent } from '@/app/components/base/tooltip/content'
 import { InstallPluginButton } from '@/app/components/workflow/nodes/_base/components/install-plugin-button'
+import { SwitchPluginVersion } from '@/app/components/workflow/nodes/_base/components/switch-plugin-version'
 import cn from '@/utils/classnames'
 
 type Props = {
@@ -31,6 +33,7 @@ type Props = {
   uninstalled?: boolean
   installInfo?: string
   onInstall?: () => void
+  versionMismatch?: boolean
   open: boolean
 }
 
@@ -50,10 +53,11 @@ const ToolItem = ({
   onInstall,
   isError,
   errorTip,
+  versionMismatch,
 }: Props) => {
   const { t } = useTranslation()
   const providerNameText = providerName?.split('/').pop()
-  const isTransparent = uninstalled || isError
+  const isTransparent = uninstalled || versionMismatch || isError
   const [isDeleting, setIsDeleting] = useState(false)
 
   return (
@@ -82,7 +86,7 @@ const ToolItem = ({
         <div className='text-text-secondary system-xs-medium'>{toolName}</div>
       </div>
       <div className='hidden group-hover:flex items-center gap-1'>
-        {!noAuth && !isError && !uninstalled && (
+        {!noAuth && !isError && !uninstalled && !versionMismatch && (
           <ActionButton>
             <RiEqualizer2Line className='w-4 h-4' />
           </ActionButton>
@@ -99,7 +103,7 @@ const ToolItem = ({
           <RiDeleteBinLine className='w-4 h-4' />
         </div>
       </div>
-      {!isError && !uninstalled && !noAuth && showSwitch && (
+      {!isError && !uninstalled && !noAuth && !versionMismatch && showSwitch && (
         <div className='mr-1' onClick={e => e.stopPropagation()}>
           <Switch
             size='md'
@@ -108,12 +112,30 @@ const ToolItem = ({
           />
         </div>
       )}
-      {!isError && !uninstalled && noAuth && (
+      {!isError && !uninstalled && !versionMismatch && noAuth && (
         <Button variant='secondary' size='small' onClick={onAuth}>
           {t('tools.notAuthorized')}
           <Indicator className='ml-2' color='orange' />
         </Button>
       )}
+      {!isError && !uninstalled && versionMismatch && installInfo && (
+        <div onClick={e => e.stopPropagation()}>
+          <SwitchPluginVersion
+            className='-mt-1'
+            uniqueIdentifier={installInfo}
+            tooltip={
+              <ToolTipContent
+                title={t('plugin.detailPanel.toolSelector.unsupportedTitle')}
+              >
+                {`${t('plugin.detailPanel.toolSelector.unsupportedContent')} ${t('plugin.detailPanel.toolSelector.unsupportedContent2')}`}
+              </ToolTipContent>
+            }
+            onChange={() => {
+              onInstall?.()
+            }}
+          />
+        </div>
+      )}
       {!isError && uninstalled && installInfo && (
         <InstallPluginButton
           onClick={e => e.stopPropagation()}

web/app/components/workflow/nodes/_base/components/switch-plugin-version.tsx

@@ -6,19 +6,20 @@ import PluginVersionPicker from '@/app/components/plugins/update-plugin/plugin-v
 import { RiArrowLeftRightLine } from '@remixicon/react'
 import type { ReactNode } from 'react'
 import { type FC, useCallback, useState } from 'react'
-import cn from '@/utils/classnames'
 import UpdateFromMarketplace from '@/app/components/plugins/update-plugin/from-market-place'
 import { useBoolean } from 'ahooks'
 import { useCheckInstalled } from '@/service/use-plugins'
+import cn from '@/utils/classnames'
 
 export type SwitchPluginVersionProps = {
   uniqueIdentifier: string
   tooltip?: ReactNode
   onChange?: (version: string) => void
+  className?: string
 }
 
 export const SwitchPluginVersion: FC<SwitchPluginVersionProps> = (props) => {
-  const { uniqueIdentifier, tooltip, onChange } = props
+  const { uniqueIdentifier, tooltip, onChange, className } = props
   const [pluginId] = uniqueIdentifier.split(':')
   const [isShow, setIsShow] = useState(false)
   const [isShowUpdateModal, { setTrue: showUpdateModal, setFalse: hideUpdateModal }] = useBoolean(false)
@@ -40,7 +41,7 @@ export const SwitchPluginVersion: FC<SwitchPluginVersionProps> = (props) => {
     return uniqueIdentifier.replaceAll(pluginDetail.version, targetVersion)
   })()
   return <Tooltip popupContent={!isShow && !isShowUpdateModal && tooltip} triggerMethod='hover'>
-    <div className='w-fit'>
+    <div className={cn('w-fit', className)}>
       {isShowUpdateModal && pluginDetail && <UpdateFromMarketplace
         payload={{
           originalPackageInfo: {

web/i18n/en-US/plugin.ts

@@ -77,6 +77,9 @@ const translation = {
       uninstalledTitle: 'Tool not installed',
       uninstalledContent: 'This plugin is installed from the local/GitHub repository. Please use after installation.',
       uninstalledLink: 'Manage in Plugins',
+      unsupportedTitle: 'Unsupported Action',
+      unsupportedContent: 'The installed plugin version does not provide this action.',
+      unsupportedContent2: 'Click to switch version.',
     },
     configureApp: 'Configure App',
     configureModel: 'Configure model',

web/i18n/zh-Hans/plugin.ts

@@ -77,6 +77,9 @@ const translation = {
       uninstalledTitle: '工具未安装',
       uninstalledContent: '此插件安装自 本地 / GitHub 仓库，请安装后使用。',
       uninstalledLink: '在插件中管理',
+      unsupportedTitle: '不支持的 Action',
+      unsupportedContent: '已安装的插件版本不提供这个 action。',
+      unsupportedContent2: '点击切换版本',
     },
     configureApp: '应用设置',
     configureModel: '模型设置',