Support OAuth Integration for Plugin Tools (#22550)

Co-authored-by: zxhlyh <jasonapring2015@outlook.com>
Co-authored-by: Yeuoly <admin@srmxy.cn>

web/app/components/plugins/plugin-detail-panel/action-list.tsx

@@ -1,17 +1,9 @@
-import React, { useMemo, useState } from 'react'
+import React, { useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
-import { useAppContext } from '@/context/app-context'
-import Button from '@/app/components/base/button'
-import Toast from '@/app/components/base/toast'
-import Indicator from '@/app/components/header/indicator'
 import ToolItem from '@/app/components/tools/provider/tool-item'
-import ConfigCredential from '@/app/components/tools/setting/build-in/config-credentials'
 import {
   useAllToolProviders,
   useBuiltinTools,
-  useInvalidateAllToolProviders,
-  useRemoveProviderCredentials,
-  useUpdateProviderCredentials,
 } from '@/service/use-tools'
 import type { PluginDetail } from '@/app/components/plugins/types'
 
@@ -23,35 +15,14 @@ const ActionList = ({
   detail,
 }: Props) => {
   const { t } = useTranslation()
-  const { isCurrentWorkspaceManager } = useAppContext()
   const providerBriefInfo = detail.declaration.tool.identity
   const providerKey = `${detail.plugin_id}/${providerBriefInfo.name}`
   const { data: collectionList = [] } = useAllToolProviders()
-  const invalidateAllToolProviders = useInvalidateAllToolProviders()
   const provider = useMemo(() => {
     return collectionList.find(collection => collection.name === providerKey)
   }, [collectionList, providerKey])
   const { data } = useBuiltinTools(providerKey)
 
-  const [showSettingAuth, setShowSettingAuth] = useState(false)
-
-  const handleCredentialSettingUpdate = () => {
-    invalidateAllToolProviders()
-    Toast.notify({
-      type: 'success',
-      message: t('common.api.actionSuccess'),
-    })
-    setShowSettingAuth(false)
-  }
-
-  const { mutate: updatePermission, isPending } = useUpdateProviderCredentials({
-    onSuccess: handleCredentialSettingUpdate,
-  })
-
-  const { mutate: removePermission } = useRemoveProviderCredentials({
-    onSuccess: handleCredentialSettingUpdate,
-  })
-
   if (!data || !provider)
     return null
 
@@ -60,26 +31,7 @@ const ActionList = ({
       <div className='mb-1 py-1'>
         <div className='system-sm-semibold-uppercase mb-1 flex h-6 items-center justify-between text-text-secondary'>
           {t('plugin.detailPanel.actionNum', { num: data.length, action: data.length > 1 ? 'actions' : 'action' })}
-          {provider.is_team_authorization && provider.allow_delete && (
-            <Button
-              variant='secondary'
-              size='small'
-              onClick={() => setShowSettingAuth(true)}
-              disabled={!isCurrentWorkspaceManager}
-            >
-              <Indicator className='mr-2' color={'green'} />
-              {t('tools.auth.authorized')}
-            </Button>
-          )}
         </div>
-        {!provider.is_team_authorization && provider.allow_delete && (
-          <Button
-            variant='primary'
-            className='w-full'
-            onClick={() => setShowSettingAuth(true)}
-            disabled={!isCurrentWorkspaceManager}
-          >{t('workflow.nodes.tool.authorize')}</Button>
-        )}
       </div>
       <div className='flex flex-col gap-2'>
         {data.map(tool => (
@@ -93,18 +45,6 @@ const ActionList = ({
           />
         ))}
       </div>
-      {showSettingAuth && (
-        <ConfigCredential
-          collection={provider}
-          onCancel={() => setShowSettingAuth(false)}
-          onSaved={async value => updatePermission({
-            providerName: provider.name,
-            credentials: value,
-          })}
-          onRemove={async () => removePermission(provider.name)}
-          isSaving={isPending}
-        />
-      )}
     </div>
   )
 }