chore: remove the frontend changes

web/app/components/tools/mcp/modal.tsx

@@ -2,7 +2,7 @@
 import React, { useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { getDomain } from 'tldts'
-import { RiArrowDownSLine, RiCloseLine, RiEditLine } from '@remixicon/react'
+import { RiCloseLine, RiEditLine } from '@remixicon/react'
 import { Mcp } from '@/app/components/base/icons/src/vender/other'
 import AppIconPicker from '@/app/components/base/app-icon-picker'
 import type { AppIconSelection } from '@/app/components/base/app-icon-picker'
@@ -10,7 +10,6 @@ import AppIcon from '@/app/components/base/app-icon'
 import Modal from '@/app/components/base/modal'
 import Button from '@/app/components/base/button'
 import Input from '@/app/components/base/input'
-import Select from '@/app/components/base/select'
 import HeadersInput from './headers-input'
 import type { AppIconType } from '@/types/app'
 import type { ToolWithProvider } from '@/app/components/workflow/types'
@@ -34,10 +33,6 @@ export type DuplicateAppModalProps = {
     timeout: number
     sse_read_timeout: number
     headers?: Record<string, string>
-    client_id?: string
-    client_secret?: string
-    grant_type?: string
-    scope?: string
   }) => void
   onHide: () => void
 }
@@ -80,12 +75,6 @@ const MCPModal = ({
   const [headers, setHeaders] = React.useState<Record<string, string>>(
     data?.masked_headers || {},
   )
-  const [clientId, setClientId] = React.useState(data?.client_id || '')
-  const [clientSecret, setClientSecret] = React.useState(data?.client_secret || '')
-  const [grantType, setGrantType] = React.useState(data?.grant_type || 'authorization_code')
-  const [scope, setScope] = React.useState(data?.scope || '')
-  const [authCollapsed, setAuthCollapsed] = React.useState(true)
-  const [configCollapsed, setConfigCollapsed] = React.useState(true)
   const [isFetchingIcon, setIsFetchingIcon] = useState(false)
   const appIconRef = useRef<HTMLDivElement>(null)
   const isHovering = useHover(appIconRef)
@@ -99,10 +88,6 @@ const MCPModal = ({
       setMcpTimeout(data.timeout || 30)
       setSseReadTimeout(data.sse_read_timeout || 300)
       setHeaders(data.masked_headers || {})
-      setClientId(data.client_id || '')
-      setClientSecret(data.client_secret || '')
-      setGrantType(data.grant_type || 'authorization_code')
-      setScope(data.scope || '')
       setAppIcon(getIcon(data))
     }
     else {
@@ -113,10 +98,6 @@ const MCPModal = ({
       setMcpTimeout(30)
       setSseReadTimeout(300)
       setHeaders({})
-      setClientId('')
-      setClientSecret('')
-      setGrantType('authorization_code')
-      setScope('')
       setAppIcon(DEFAULT_ICON as AppIconSelection)
     }
   }, [data])
@@ -145,8 +126,7 @@ const MCPModal = ({
     setIsFetchingIcon(true)
     try {
       const res = await uploadRemoteFileInfo(remoteIcon, undefined, true)
-      if ('url' in res)
+      setAppIcon({ type: 'image', url: res.url, fileId: extractFileId(res.url) || '' })
-        setAppIcon({ type: 'image', url: res.url, fileId: extractFileId(res.url) || '' })
     }
     catch (e) {
       let errorMessage = 'Failed to fetch remote icon'
@@ -180,10 +160,6 @@ const MCPModal = ({
       timeout: timeout || 30,
       sse_read_timeout: sseReadTimeout || 300,
       headers: Object.keys(headers).length > 0 ? headers : undefined,
-      client_id: clientId || undefined,
-      client_secret: clientSecret || undefined,
-      grant_type: grantType,
-      scope: scope || undefined,
     })
     if(isCreate)
       onHide()
@@ -263,116 +239,41 @@ const MCPModal = ({
               </div>
             )}
           </div>
-
           <div>
-            <div
+            <div className='mb-1 flex h-6 items-center'>
-              className='mb-1 flex h-6 cursor-pointer items-center justify-between'
+              <span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.timeout')}</span>
-              onClick={() => setAuthCollapsed(!authCollapsed)}
-            >
-              <span className='system-sm-semibold-uppercase text-text-secondary'>{t('tools.mcp.modal.authentication')}</span>
-              <RiArrowDownSLine className={cn('h-4 w-4 text-text-tertiary transition-transform', authCollapsed && '-rotate-90')} />
             </div>
-            {!authCollapsed && (
+            <Input
-              <div className='mt-3 space-y-5'>
+              type='number'
-                <div>
+              value={timeout}
-                  <div className='mb-1 flex h-6 items-center'>
+              onChange={e => setMcpTimeout(Number(e.target.value))}
-                    <span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.grantType')}</span>
+              onBlur={e => handleBlur(e.target.value.trim())}
-                  </div>
+              placeholder={t('tools.mcp.modal.timeoutPlaceholder')}
-                  <Select
+            />
-                    items={[
-                      { value: 'authorization_code', name: t('tools.mcp.modal.grantTypeAuthCode') },
-                      { value: 'client_credentials', name: t('tools.mcp.modal.grantTypeClientCredentials') },
-                    ]}
-                    defaultValue={grantType}
-                    onSelect={item => setGrantType(item.value as string)}
-                    placeholder={t('tools.mcp.modal.grantType')}
-                  />
-                </div>
-                <div>
-                  <div className='mb-1 flex h-6 items-center'>
-                    <span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.clientId')}</span>
-                  </div>
-                  <Input
-                    value={clientId}
-                    onChange={e => setClientId(e.target.value)}
-                    placeholder={t('tools.mcp.modal.clientIdPlaceholder')}
-                  />
-                </div>
-                <div>
-                  <div className='mb-1 flex h-6 items-center'>
-                    <span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.clientSecret')}</span>
-                  </div>
-                  <Input
-                    type='password'
-                    value={clientSecret}
-                    onChange={e => setClientSecret(e.target.value)}
-                    placeholder={t('tools.mcp.modal.clientSecretPlaceholder')}
-                  />
-                </div>
-                {grantType === 'client_credentials' && (
-                  <div>
-                    <div className='mb-1 flex h-6 items-center'>
-                      <span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.scope')}</span>
-                    </div>
-                    <Input
-                      value={scope}
-                      onChange={e => setScope(e.target.value)}
-                      placeholder={t('tools.mcp.modal.scopePlaceholder')}
-                    />
-                  </div>
-                )}
-                <div>
-                  <div className='mb-1 flex h-6 items-center'>
-                    <span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.headers')}</span>
-                  </div>
-                  <div className='body-xs-regular mb-2 text-text-tertiary'>{t('tools.mcp.modal.headersTip')}</div>
-                  <HeadersInput
-                    headers={headers}
-                    onChange={setHeaders}
-                    readonly={false}
-                    isMasked={!isCreate && Object.keys(headers).length > 0}
-                  />
-                </div>
-              </div>
-            )}
           </div>
-
           <div>
-            <div
+            <div className='mb-1 flex h-6 items-center'>
-              className='mb-1 flex h-6 cursor-pointer items-center justify-between'
+              <span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.sseReadTimeout')}</span>
-              onClick={() => setConfigCollapsed(!configCollapsed)}
-            >
-              <span className='system-sm-semibold-uppercase text-text-secondary'>{t('tools.mcp.modal.configuration')}</span>
-              <RiArrowDownSLine className={cn('h-4 w-4 text-text-tertiary transition-transform', configCollapsed && '-rotate-90')} />
             </div>
-            {!configCollapsed && (
+            <Input
-              <div className='mt-3 space-y-5'>
+              type='number'
-                <div>
+              value={sseReadTimeout}
-                  <div className='mb-1 flex h-6 items-center'>
+              onChange={e => setSseReadTimeout(Number(e.target.value))}
-                    <span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.timeout')}</span>
+              onBlur={e => handleBlur(e.target.value.trim())}
-                  </div>
+              placeholder={t('tools.mcp.modal.timeoutPlaceholder')}
-                  <Input
+            />
-                    type='number'
+          </div>
-                    value={timeout}
+          <div>
-                    onChange={e => setMcpTimeout(Number(e.target.value))}
+            <div className='mb-1 flex h-6 items-center'>
-                    onBlur={e => handleBlur(e.target.value.trim())}
+              <span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.headers')}</span>
-                    placeholder={t('tools.mcp.modal.timeoutPlaceholder')}
+            </div>
-                  />
+            <div className='body-xs-regular mb-2 text-text-tertiary'>{t('tools.mcp.modal.headersTip')}</div>
-                </div>
+            <HeadersInput
-                <div>
+              headers={headers}
-                  <div className='mb-1 flex h-6 items-center'>
+              onChange={setHeaders}
-                    <span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.sseReadTimeout')}</span>
+              readonly={false}
-                  </div>
+              isMasked={!isCreate && Object.keys(headers).length > 0}
-                  <Input
+            />
-                    type='number'
-                    value={sseReadTimeout}
-                    onChange={e => setSseReadTimeout(Number(e.target.value))}
-                    onBlur={e => handleBlur(e.target.value.trim())}
-                    placeholder={t('tools.mcp.modal.timeoutPlaceholder')}
-                  />
-                </div>
-              </div>
-            )}
           </div>
         </div>
         <div className='flex flex-row-reverse pt-5'>

web/app/components/tools/types.ts

@@ -62,10 +62,6 @@ export type Collection = {
   sse_read_timeout?: number
   headers?: Record<string, string>
   masked_headers?: Record<string, string>
-  client_id?: string
-  client_secret?: string
-  grant_type?: string
-  scope?: string
   is_authorized?: boolean
   provider?: string
 }

web/i18n/en-US/tools.ts

@@ -203,17 +203,6 @@ const translation = {
       timeout: 'Timeout',
       sseReadTimeout: 'SSE Read Timeout',
       timeoutPlaceholder: '30',
-      configuration: 'Configuration',
-      authentication: 'Authentication',
-      grantType: 'Grant Type',
-      grantTypeAuthCode: 'Authorization Code (User Authentication)',
-      grantTypeClientCredentials: 'Client Credentials (Service-to-Service)',
-      scope: 'OAuth Scope',
-      scopePlaceholder: 'Enter OAuth scope (optional)',
-      clientId: 'Client ID',
-      clientIdPlaceholder: 'Enter client ID',
-      clientSecret: 'Client Secret',
-      clientSecretPlaceholder: 'Enter client secret',
     },
     delete: 'Remove MCP Server',
     deleteConfirmTitle: 'Would you like to remove {{mcp}}?',

web/i18n/zh-Hans/tools.ts

@@ -203,12 +203,6 @@ const translation = {
       timeout: '超时时间',
       sseReadTimeout: 'SSE 读取超时时间',
       timeoutPlaceholder: '30',
-      configuration: '配置',
-      authentication: '认证',
-      clientId: '客户端 ID',
-      clientIdPlaceholder: '请输入客户端 ID',
-      clientSecret: '客户端密钥',
-      clientSecretPlaceholder: '请输入客户端密钥',
     },
     delete: '删除 MCP 服务',
     deleteConfirmTitle: '你想要删除 {{mcp}} 吗？',

web/service/use-tools.ts

@@ -88,10 +88,6 @@ export const useCreateMCP = () => {
       timeout?: number
       sse_read_timeout?: number
       headers?: Record<string, string>
-      client_id?: string
-      client_secret?: string
-      grant_type?: string
-      scope?: string
     }) => {
       return post<ToolWithProvider>('workspaces/current/tool-provider/mcp', {
         body: {
@@ -119,10 +115,6 @@ export const useUpdateMCP = ({
       timeout?: number
       sse_read_timeout?: number
       headers?: Record<string, string>
-      client_id?: string
-      client_secret?: string
-      grant_type?: string
-      scope?: string
     }) => {
       return put('workspaces/current/tool-provider/mcp', {
         body: {