瀏覽代碼

Feat: Add authorization token field to the MCP form #3221 (#8850)

### What problem does this PR solve?

Feat: Add authorization token field to the MCP form #3221
### Type of change


- [x] New Feature (non-breaking change which adds functionality)
tags/v0.20.0
balibabu 3 月之前
父節點
當前提交
148fde8b1b
No account linked to committer's email address

+ 7
- 3
web/src/pages/profile-setting/mcp/edit-mcp-dialog.tsx 查看文件

import { IMCPTool, IMCPToolObject } from '@/interfaces/database/mcp'; import { IMCPTool, IMCPToolObject } from '@/interfaces/database/mcp';
import { cn } from '@/lib/utils'; import { cn } from '@/lib/utils';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { isEmpty, pick } from 'lodash';
import { isEmpty, omit, pick } from 'lodash';
import { RefreshCw } from 'lucide-react'; import { RefreshCw } from 'lucide-react';
import { import {
MouseEventHandler, MouseEventHandler,
}, []); }, []);


const handleOk = async (values: z.infer<typeof FormSchema>) => { const handleOk = async (values: z.infer<typeof FormSchema>) => {
const nextValues = {
...omit(values, 'authorization_token'),
headers: { authorization_token: values.authorization_token },
};
if (isTriggeredBySaving) { if (isTriggeredBySaving) {
onOk?.(values);
onOk?.(nextValues);
} else { } else {
const ret = await testMcpServer(values);
const ret = await testMcpServer(nextValues);
if (ret.code === 0) { if (ret.code === 0) {
setFieldChanged(false); setFieldChanged(false);
} }

+ 10
- 10
web/src/pages/profile-setting/mcp/edit-mcp-form.tsx 查看文件

import { RAGFlowSelect } from '@/components/ui/select'; import { RAGFlowSelect } from '@/components/ui/select';
import { IModalProps } from '@/interfaces/common'; import { IModalProps } from '@/interfaces/common';
import { buildOptions } from '@/utils/form'; import { buildOptions } from '@/utils/form';
import { Editor, loader } from '@monaco-editor/react';
import { loader } from '@monaco-editor/react';
import { Dispatch, SetStateAction } from 'react'; import { Dispatch, SetStateAction } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';


message: t('common.namePlaceholder'), message: t('common.namePlaceholder'),
}) })
.trim(), .trim(),
headers: z.record(z.string(), z.any()).optional(),
authorization_token: z.string().optional(),
}); });


return FormSchema; return FormSchema;
/> />
<FormField <FormField
control={form.control} control={form.control}
name="headers"
name="authorization_token"
render={({ field }) => ( render={({ field }) => (
<FormItem> <FormItem>
<FormLabel>Headers</FormLabel>
<FormLabel>Authorization Token</FormLabel>
<FormControl> <FormControl>
<Editor
height={200}
defaultLanguage="json"
theme="vs-dark"
<Input
placeholder={t('common.namePlaceholder')}
{...field} {...field}
onChange={(value) => {
field.onChange(value);
autoComplete="off"
type="password"
onChange={(e) => {
field.onChange(e.target.value.trim());
setFieldChanged(true); setFieldChanged(true);
}} }}
/> />

Loading…
取消
儲存