chore: remove the frontend changes

This commit is contained in:
Novice 2025-10-14 20:37:14 +08:00
parent 7d91f4783b
commit 4a9fe55976
No known key found for this signature in database
GPG Key ID: EE3F68E3105DAAAB
5 changed files with 32 additions and 160 deletions

View File

@ -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
className='mb-1 flex h-6 cursor-pointer items-center justify-between'
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 className='mb-1 flex h-6 items-center'>
<span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.timeout')}</span>
</div>
{!authCollapsed && (
<div className='mt-3 space-y-5'>
<div>
<div className='mb-1 flex h-6 items-center'>
<span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.grantType')}</span>
</div>
<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>
)}
<Input
type='number'
value={timeout}
onChange={e => setMcpTimeout(Number(e.target.value))}
onBlur={e => handleBlur(e.target.value.trim())}
placeholder={t('tools.mcp.modal.timeoutPlaceholder')}
/>
</div>
<div>
<div
className='mb-1 flex h-6 cursor-pointer items-center justify-between'
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 className='mb-1 flex h-6 items-center'>
<span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.sseReadTimeout')}</span>
</div>
{!configCollapsed && (
<div className='mt-3 space-y-5'>
<div>
<div className='mb-1 flex h-6 items-center'>
<span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.timeout')}</span>
</div>
<Input
type='number'
value={timeout}
onChange={e => setMcpTimeout(Number(e.target.value))}
onBlur={e => handleBlur(e.target.value.trim())}
placeholder={t('tools.mcp.modal.timeoutPlaceholder')}
/>
</div>
<div>
<div className='mb-1 flex h-6 items-center'>
<span className='system-sm-medium text-text-secondary'>{t('tools.mcp.modal.sseReadTimeout')}</span>
</div>
<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>
)}
<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 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 className='flex flex-row-reverse pt-5'>

View File

@ -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
}

View File

@ -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}}?',

View File

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

View File

@ -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: {