youngkingdom/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-03-27 09:09:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/main' into feat/trigger

Browse Source
This commit is contained in:
yessenia
2025-09-25 17:14:24 +08:00
parent ef9a741781 407323f817
commit cd07eef639
3013 changed files with 148826 additions and 44294 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web/app/components/tools/marketplace/index.tsx
View File

@ -58,6 +58,10 @@ const Marketplace = ({
{t('plugin.category.tools')}
</span>
,
<span className="body-md-medium relative ml-1 text-text-secondary after:absolute after:bottom-[1.5px] after:left-0 after:h-2 after:w-full after:bg-text-text-selected after:content-['']">
{t('plugin.category.datasources')}
</span>
,
<span className="body-md-medium relative ml-1 text-text-secondary after:absolute after:bottom-[1.5px] after:left-0 after:h-2 after:w-full after:bg-text-text-selected after:content-['']">
{t('plugin.category.agents')}
</span>

143
web/app/components/tools/mcp/headers-input.tsx Normal file
View File

@ -0,0 +1,143 @@
'use client'
import React, { useCallback } from 'react'
import { useTranslation } from 'react-i18next'
import { RiAddLine, RiDeleteBinLine } from '@remixicon/react'
import Input from '@/app/components/base/input'
import Button from '@/app/components/base/button'
import ActionButton from '@/app/components/base/action-button'
import cn from '@/utils/classnames'
export type HeaderItem = {
key: string
value: string
}
type Props = {
headers: Record<string, string>
onChange: (headers: Record<string, string>) => void
readonly?: boolean
isMasked?: boolean
}
const HeadersInput = ({
headers,
onChange,
readonly = false,
isMasked = false,
}: Props) => {
const { t } = useTranslation()
const headerItems = Object.entries(headers).map(([key, value]) => ({ key, value }))
const handleItemChange = useCallback((index: number, field: 'key' | 'value', value: string) => {
const newItems = [...headerItems]
newItems[index] = { ...newItems[index], [field]: value }
const newHeaders = newItems.reduce((acc, item) => {
if (item.key.trim())
acc[item.key.trim()] = item.value
return acc
}, {} as Record<string, string>)
onChange(newHeaders)
}, [headerItems, onChange])
const handleRemoveItem = useCallback((index: number) => {
const newItems = headerItems.filter((_, i) => i !== index)
const newHeaders = newItems.reduce((acc, item) => {
if (item.key.trim())
acc[item.key.trim()] = item.value
return acc
}, {} as Record<string, string>)
onChange(newHeaders)
}, [headerItems, onChange])
const handleAddItem = useCallback(() => {
const newHeaders = { ...headers, '': '' }
onChange(newHeaders)
}, [headers, onChange])
if (headerItems.length === 0) {
return (
<div className='space-y-2'>
<div className='body-xs-regular text-text-tertiary'>
{t('tools.mcp.modal.noHeaders')}
</div>
{!readonly && (
<Button
variant='secondary'
size='small'
onClick={handleAddItem}
className='w-full'
>
<RiAddLine className='mr-1 h-4 w-4' />
{t('tools.mcp.modal.addHeader')}
</Button>
)}
</div>
)
}
return (
<div className='space-y-2'>
{isMasked && (
<div className='body-xs-regular text-text-tertiary'>
{t('tools.mcp.modal.maskedHeadersTip')}
</div>
)}
<div className='overflow-hidden rounded-lg border border-divider-regular'>
<div className='system-xs-medium-uppercase bg-background-secondary flex h-7 items-center leading-7 text-text-tertiary'>
<div className='h-full w-1/2 border-r border-divider-regular pl-3'>{t('tools.mcp.modal.headerKey')}</div>
<div className='h-full w-1/2 pl-3 pr-1'>{t('tools.mcp.modal.headerValue')}</div>
</div>
{headerItems.map((item, index) => (
<div key={index} className={cn(
'flex items-center border-divider-regular',
index < headerItems.length - 1 && 'border-b',
)}>
<div className='w-1/2 border-r border-divider-regular'>
<Input
value={item.key}
onChange={e => handleItemChange(index, 'key', e.target.value)}
placeholder={t('tools.mcp.modal.headerKeyPlaceholder')}
className='rounded-none border-0'
readOnly={readonly}
/>
</div>
<div className='flex w-1/2 items-center'>
<Input
value={item.value}
onChange={e => handleItemChange(index, 'value', e.target.value)}
placeholder={t('tools.mcp.modal.headerValuePlaceholder')}
className='flex-1 rounded-none border-0'
readOnly={readonly}
/>
{!readonly && headerItems.length > 1 && (
<ActionButton
onClick={() => handleRemoveItem(index)}
className='mr-2'
>
<RiDeleteBinLine className='h-4 w-4 text-text-destructive' />
</ActionButton>
)}
</div>
</div>
))}
</div>
{!readonly && (
<Button
variant='secondary'
size='small'
onClick={handleAddItem}
className='w-full'
>
<RiAddLine className='mr-1 h-4 w-4' />
{t('tools.mcp.modal.addHeader')}
</Button>
)}
</div>
)
}
export default React.memo(HeadersInput)

47
web/app/components/tools/mcp/modal.tsx
View File

@ -9,6 +9,7 @@ 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 HeadersInput from './headers-input'
import type { AppIconType } from '@/types/app'
import type { ToolWithProvider } from '@/app/components/workflow/types'
import { noop } from 'lodash-es'
@ -29,6 +30,7 @@ export type DuplicateAppModalProps = {
server_identifier: string
timeout: number
sse_read_timeout: number
headers?: Record<string, string>
}) => void
onHide: () => void
}
@ -66,15 +68,41 @@ const MCPModal = ({
const [appIcon, setAppIcon] = useState<AppIconSelection>(getIcon(data))
const [showAppIconPicker, setShowAppIconPicker] = useState(false)
const [serverIdentifier, setServerIdentifier] = React.useState(data?.server_identifier || '')
const [timeout, setMcpTimeout] = React.useState(30)
const [sseReadTimeout, setSseReadTimeout] = React.useState(300)
const [timeout, setMcpTimeout] = React.useState(data?.timeout || 30)
const [sseReadTimeout, setSseReadTimeout] = React.useState(data?.sse_read_timeout || 300)
const [headers, setHeaders] = React.useState<Record<string, string>>(
data?.masked_headers || {},
)
const [isFetchingIcon, setIsFetchingIcon] = useState(false)
const appIconRef = useRef<HTMLDivElement>(null)
const isHovering = useHover(appIconRef)
// Update states when data changes (for edit mode)
React.useEffect(() => {
if (data) {
setUrl(data.server_url || '')
setName(data.name || '')
setServerIdentifier(data.server_identifier || '')
setMcpTimeout(data.timeout || 30)
setSseReadTimeout(data.sse_read_timeout || 300)
setHeaders(data.masked_headers || {})
setAppIcon(getIcon(data))
}
else {
// Reset for create mode
setUrl('')
setName('')
setServerIdentifier('')
setMcpTimeout(30)
setSseReadTimeout(300)
setHeaders({})
setAppIcon(DEFAULT_ICON as AppIconSelection)
}
}, [data])
const isValidUrl = (string: string) => {
try {
const urlPattern = /^(https?:\/\/)((([a-z\d]([a-z\d-]*[a-z\d])*)\.)+[a-z]{2,}|((\d{1,3}\.){3}\d{1,3})|localhost)(\:\d+)?(\/[-a-z\d%_.~+]*)*(\?[;&a-z\d%_.~+=-]*)?/i
const urlPattern = /^(https?:\/\/)((([a-z\d]([a-z\d-]*[a-z\d])*)\.)+[a-z]{2,}|((\d{1,3}\.){3}\d{1,3})|localhost)(:\d+)?(\/[-a-z\d%_.~+]*)*(\?[;&a-z\d%_.~+=-]*)?/i
return urlPattern.test(string)
}
catch {
@ -129,6 +157,7 @@ const MCPModal = ({
server_identifier: serverIdentifier.trim(),
timeout: timeout || 30,
sse_read_timeout: sseReadTimeout || 300,
headers: Object.keys(headers).length > 0 ? headers : undefined,
})
if(isCreate)
onHide()
@ -231,6 +260,18 @@ const MCPModal = ({
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'>
<Button disabled={!name || !url || !serverIdentifier || isFetchingIcon} className='ml-2' variant='primary' onClick={submit}>{data ? t('tools.mcp.modal.save') : t('tools.mcp.modal.confirm')}</Button>

2
web/app/components/tools/setting/build-in/config-credentials.tsx
View File

@ -111,7 +111,7 @@ const ConfigCredential: FC<Props> = ({
<Button onClick={onRemove}>{t('common.operation.remove')}</Button>
)
}
< div className='flex space-x-2'>
<div className='flex space-x-2'>
<Button onClick={onCancel}>{t('common.operation.cancel')}</Button>
<Button loading={isLoading || isSaving} disabled={isLoading || isSaving} variant='primary' onClick={handleSave}>{t('common.operation.save')}</Button>
</div>

9
web/app/components/tools/types.ts
View File

@ -32,6 +32,7 @@ export enum CollectionType {
model = 'model',
workflow = 'workflow',
mcp = 'mcp',
datasource = 'datasource',
}
export type Emoji = {
@ -46,7 +47,7 @@ export type Collection = {
description: TypeWithI18N
icon: string | Emoji
label: TypeWithI18N
type: CollectionType
type: CollectionType | string
team_credentials: Record<string, any>
is_team_authorization: boolean
allow_delete: boolean
@ -59,6 +60,11 @@ export type Collection = {
server_identifier?: string
timeout?: number
sse_read_timeout?: number
headers?: Record<string, string>
masked_headers?: Record<string, string>
is_authorized?: boolean
provider?: string
credential_id?: string
}
export type ToolParameter = {
@ -211,4 +217,5 @@ export type MCPServerDetail = {
description: string
status: string
parameters?: Record<string, string>
headers?: Record<string, string>
}

2
web/app/components/tools/utils/to-form-schema.ts
View File

@ -153,7 +153,7 @@ export const getConfiguredValue = (value: Record<string, any>, formSchemas: { va
const value = formSchema.default
newValues[formSchema.variable] = {
type: 'constant',
value: formSchema.default,
value: typeof formSchema.default === 'string' ? formSchema.default.replace(/\n/g, '\\n') : formSchema.default,
}
newValues[formSchema.variable] = correctInitialData(formSchema.type, newValues[formSchema.variable], value)
}