Revert "feat: add Claude Code channel support with OAuth integration"
This commit is contained in:
@@ -17,6 +17,8 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
For commercial licensing, please contact support@quantumnous.com
|
||||
*/
|
||||
|
||||
import React, { useEffect, useState, useRef, useMemo } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import {
|
||||
API,
|
||||
showError,
|
||||
@@ -24,42 +26,38 @@ import {
|
||||
showSuccess,
|
||||
verifyJSON,
|
||||
} from '../../../../helpers';
|
||||
import { useIsMobile } from '../../../../hooks/common/useIsMobile.js';
|
||||
import { CHANNEL_OPTIONS } from '../../../../constants';
|
||||
import {
|
||||
Avatar,
|
||||
Banner,
|
||||
Button,
|
||||
Card,
|
||||
Checkbox,
|
||||
Col,
|
||||
Form,
|
||||
Highlight,
|
||||
ImagePreview,
|
||||
Input,
|
||||
Modal,
|
||||
Row,
|
||||
SideSheet,
|
||||
Space,
|
||||
Spin,
|
||||
Tag,
|
||||
Button,
|
||||
Typography,
|
||||
Checkbox,
|
||||
Banner,
|
||||
Modal,
|
||||
ImagePreview,
|
||||
Card,
|
||||
Tag,
|
||||
Avatar,
|
||||
Form,
|
||||
Row,
|
||||
Col,
|
||||
Highlight,
|
||||
} from '@douyinfe/semi-ui';
|
||||
import { getChannelModels, copy, getChannelIcon, getModelCategories, selectFilter } from '../../../../helpers';
|
||||
import ModelSelectModal from './ModelSelectModal';
|
||||
import JSONEditor from '../../../common/JSONEditor';
|
||||
import { CHANNEL_OPTIONS, CLAUDE_CODE_DEFAULT_SYSTEM_PROMPT } from '../../../../constants';
|
||||
import {
|
||||
IconBolt,
|
||||
IconClose,
|
||||
IconCode,
|
||||
IconGlobe,
|
||||
IconSave,
|
||||
IconClose,
|
||||
IconServer,
|
||||
IconSetting,
|
||||
IconCode,
|
||||
IconGlobe,
|
||||
IconBolt,
|
||||
} from '@douyinfe/semi-icons';
|
||||
import React, { useEffect, useMemo, useRef, useState } from 'react';
|
||||
|
||||
import { useIsMobile } from '../../../../hooks/common/useIsMobile.js';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const { Text, Title } = Typography;
|
||||
|
||||
@@ -95,8 +93,6 @@ function type2secretPrompt(type) {
|
||||
return '按照如下格式输入: AccessKey|SecretKey, 如果上游是New API,则直接输ApiKey';
|
||||
case 51:
|
||||
return '按照如下格式输入: Access Key ID|Secret Access Key';
|
||||
case 53:
|
||||
return '按照如下格式输入:AccessToken|RefreshToken';
|
||||
default:
|
||||
return '请输入渠道对应的鉴权密钥';
|
||||
}
|
||||
@@ -149,10 +145,6 @@ const EditChannelModal = (props) => {
|
||||
const [customModel, setCustomModel] = useState('');
|
||||
const [modalImageUrl, setModalImageUrl] = useState('');
|
||||
const [isModalOpenurl, setIsModalOpenurl] = useState(false);
|
||||
const [showOAuthModal, setShowOAuthModal] = useState(false);
|
||||
const [authorizationCode, setAuthorizationCode] = useState('');
|
||||
const [oauthParams, setOauthParams] = useState(null);
|
||||
const [isExchangingCode, setIsExchangingCode] = useState(false);
|
||||
const [modelModalVisible, setModelModalVisible] = useState(false);
|
||||
const [fetchedModels, setFetchedModels] = useState([]);
|
||||
const formApiRef = useRef(null);
|
||||
@@ -361,24 +353,6 @@ const EditChannelModal = (props) => {
|
||||
data.system_prompt = '';
|
||||
}
|
||||
|
||||
// 特殊处理Claude Code渠道的密钥拆分和系统提示词
|
||||
if (data.type === 53) {
|
||||
// 拆分密钥
|
||||
if (data.key) {
|
||||
const keyParts = data.key.split('|');
|
||||
if (keyParts.length === 2) {
|
||||
data.access_token = keyParts[0];
|
||||
data.refresh_token = keyParts[1];
|
||||
} else {
|
||||
// 如果没有 | 分隔符,表示只有access token
|
||||
data.access_token = data.key;
|
||||
data.refresh_token = '';
|
||||
}
|
||||
}
|
||||
// 强制设置固定系统提示词
|
||||
data.system_prompt = CLAUDE_CODE_DEFAULT_SYSTEM_PROMPT;
|
||||
}
|
||||
|
||||
setInputs(data);
|
||||
if (formApiRef.current) {
|
||||
formApiRef.current.setValues(data);
|
||||
@@ -502,72 +476,6 @@ const EditChannelModal = (props) => {
|
||||
}
|
||||
};
|
||||
|
||||
// 生成OAuth授权URL
|
||||
const handleGenerateOAuth = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
const res = await API.get('/api/channel/claude/oauth/url');
|
||||
if (res.data.success) {
|
||||
setOauthParams(res.data.data);
|
||||
setShowOAuthModal(true);
|
||||
showSuccess(t('OAuth授权URL生成成功'));
|
||||
} else {
|
||||
showError(res.data.message || t('生成OAuth授权URL失败'));
|
||||
}
|
||||
} catch (error) {
|
||||
showError(t('生成OAuth授权URL失败:') + error.message);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
// 交换授权码
|
||||
const handleExchangeCode = async () => {
|
||||
if (!authorizationCode.trim()) {
|
||||
showError(t('请输入授权码'));
|
||||
return;
|
||||
}
|
||||
|
||||
if (!oauthParams) {
|
||||
showError(t('OAuth参数丢失,请重新生成'));
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
setIsExchangingCode(true);
|
||||
const res = await API.post('/api/channel/claude/oauth/exchange', {
|
||||
authorization_code: authorizationCode,
|
||||
code_verifier: oauthParams.code_verifier,
|
||||
state: oauthParams.state,
|
||||
});
|
||||
|
||||
if (res.data.success) {
|
||||
const tokenData = res.data.data;
|
||||
// 自动填充access token和refresh token
|
||||
handleInputChange('access_token', tokenData.access_token);
|
||||
handleInputChange('refresh_token', tokenData.refresh_token);
|
||||
handleInputChange('key', `${tokenData.access_token}|${tokenData.refresh_token}`);
|
||||
|
||||
// 更新表单字段
|
||||
if (formApiRef.current) {
|
||||
formApiRef.current.setValue('access_token', tokenData.access_token);
|
||||
formApiRef.current.setValue('refresh_token', tokenData.refresh_token);
|
||||
}
|
||||
|
||||
setShowOAuthModal(false);
|
||||
setAuthorizationCode('');
|
||||
setOauthParams(null);
|
||||
showSuccess(t('授权码交换成功,已自动填充tokens'));
|
||||
} else {
|
||||
showError(res.data.message || t('授权码交换失败'));
|
||||
}
|
||||
} catch (error) {
|
||||
showError(t('授权码交换失败:') + error.message);
|
||||
} finally {
|
||||
setIsExchangingCode(false);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const modelMap = new Map();
|
||||
|
||||
@@ -880,7 +788,7 @@ const EditChannelModal = (props) => {
|
||||
const batchExtra = batchAllowed ? (
|
||||
<Space>
|
||||
<Checkbox
|
||||
disabled={isEdit || inputs.type === 53}
|
||||
disabled={isEdit}
|
||||
checked={batch}
|
||||
onChange={(e) => {
|
||||
const checked = e.target.checked;
|
||||
@@ -1216,49 +1124,6 @@ const EditChannelModal = (props) => {
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
) : inputs.type === 53 ? (
|
||||
<>
|
||||
<Form.Input
|
||||
field='access_token'
|
||||
label={isEdit ? t('Access Token(编辑模式下,保存的密钥不会显示)') : t('Access Token')}
|
||||
placeholder={t('sk-ant-xxx')}
|
||||
rules={isEdit ? [] : [{ required: true, message: t('请输入Access Token') }]}
|
||||
autoComplete='new-password'
|
||||
onChange={(value) => {
|
||||
handleInputChange('access_token', value);
|
||||
// 同时更新key字段,格式为access_token|refresh_token
|
||||
const refreshToken = inputs.refresh_token || '';
|
||||
handleInputChange('key', `${value}|${refreshToken}`);
|
||||
}}
|
||||
suffix={
|
||||
<Button
|
||||
size="small"
|
||||
type="primary"
|
||||
theme="light"
|
||||
onClick={handleGenerateOAuth}
|
||||
>
|
||||
{t('生成OAuth授权码')}
|
||||
</Button>
|
||||
}
|
||||
extraText={batchExtra}
|
||||
showClear
|
||||
/>
|
||||
<Form.Input
|
||||
field='refresh_token'
|
||||
label={isEdit ? t('Refresh Token(编辑模式下,保存的密钥不会显示)') : t('Refresh Token')}
|
||||
placeholder={t('sk-ant-xxx(可选)')}
|
||||
rules={[]}
|
||||
autoComplete='new-password'
|
||||
onChange={(value) => {
|
||||
handleInputChange('refresh_token', value);
|
||||
// 同时更新key字段,格式为access_token|refresh_token
|
||||
const accessToken = inputs.access_token || '';
|
||||
handleInputChange('key', `${accessToken}|${value}`);
|
||||
}}
|
||||
extraText={batchExtra}
|
||||
showClear
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<Form.Input
|
||||
field='key'
|
||||
@@ -1767,19 +1632,11 @@ const EditChannelModal = (props) => {
|
||||
<Form.TextArea
|
||||
field='system_prompt'
|
||||
label={t('系统提示词')}
|
||||
placeholder={inputs.type === 53 ? CLAUDE_CODE_DEFAULT_SYSTEM_PROMPT : t('输入系统提示词,用户的系统提示词将优先于此设置')}
|
||||
onChange={(value) => {
|
||||
if (inputs.type === 53) {
|
||||
// Claude Code渠道系统提示词固定,不允许修改
|
||||
return;
|
||||
}
|
||||
handleChannelSettingsChange('system_prompt', value);
|
||||
}}
|
||||
disabled={inputs.type === 53}
|
||||
value={inputs.type === 53 ? CLAUDE_CODE_DEFAULT_SYSTEM_PROMPT : undefined}
|
||||
placeholder={t('输入系统提示词,用户的系统提示词将优先于此设置')}
|
||||
onChange={(value) => handleChannelSettingsChange('system_prompt', value)}
|
||||
autosize
|
||||
showClear={inputs.type !== 53}
|
||||
extraText={inputs.type === 53 ? t('Claude Code渠道系统提示词固定为官方CLI身份,不可修改') : t('用户优先:如果用户在请求中指定了系统提示词,将优先使用用户的设置')}
|
||||
showClear
|
||||
extraText={t('用户优先:如果用户在请求中指定了系统提示词,将优先使用用户的设置')}
|
||||
/>
|
||||
</Card>
|
||||
</div>
|
||||
@@ -1803,70 +1660,8 @@ const EditChannelModal = (props) => {
|
||||
}}
|
||||
onCancel={() => setModelModalVisible(false)}
|
||||
/>
|
||||
|
||||
{/* OAuth Authorization Modal */}
|
||||
<Modal
|
||||
title={t('生成Claude Code OAuth授权码')}
|
||||
visible={showOAuthModal}
|
||||
onCancel={() => {
|
||||
setShowOAuthModal(false);
|
||||
setAuthorizationCode('');
|
||||
setOauthParams(null);
|
||||
}}
|
||||
onOk={handleExchangeCode}
|
||||
okText={isExchangingCode ? t('交换中...') : t('确认')}
|
||||
cancelText={t('取消')}
|
||||
confirmLoading={isExchangingCode}
|
||||
width={600}
|
||||
>
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<Text className="text-sm font-medium mb-2 block">{t('请访问以下授权地址:')}</Text>
|
||||
<div className="p-3 bg-gray-50 rounded-lg border">
|
||||
<Text
|
||||
link
|
||||
underline
|
||||
className="text-sm font-mono break-all cursor-pointer text-blue-600 hover:text-blue-800"
|
||||
onClick={() => {
|
||||
if (oauthParams?.auth_url) {
|
||||
window.open(oauthParams.auth_url, '_blank');
|
||||
}
|
||||
}}
|
||||
>
|
||||
{oauthParams?.auth_url || t('正在生成授权地址...')}
|
||||
</Text>
|
||||
<div className="mt-2">
|
||||
<Text
|
||||
copyable={{ content: oauthParams?.auth_url }}
|
||||
type="tertiary"
|
||||
size="small"
|
||||
>
|
||||
{t('复制链接')}
|
||||
</Text>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Text className="text-sm font-medium mb-2 block">{t('授权后,请将获得的授权码粘贴到下方:')}</Text>
|
||||
<Input
|
||||
value={authorizationCode}
|
||||
onChange={setAuthorizationCode}
|
||||
placeholder={t('请输入授权码')}
|
||||
showClear
|
||||
style={{ width: '100%' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Banner
|
||||
type="info"
|
||||
description={t('获得授权码后,系统将自动换取access token和refresh token并填充到表单中。')}
|
||||
className="!rounded-lg"
|
||||
/>
|
||||
</div>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default EditChannelModal;
|
||||
export default EditChannelModal;
|
||||
@@ -159,14 +159,6 @@ export const CHANNEL_OPTIONS = [
|
||||
color: 'purple',
|
||||
label: 'Vidu',
|
||||
},
|
||||
{
|
||||
value: 53,
|
||||
color: 'indigo',
|
||||
label: 'Claude Code',
|
||||
},
|
||||
];
|
||||
|
||||
export const MODEL_TABLE_PAGE_SIZE = 10;
|
||||
|
||||
// Claude Code 相关常量
|
||||
export const CLAUDE_CODE_DEFAULT_SYSTEM_PROMPT = "You are Claude Code, Anthropic's official CLI for Claude.";
|
||||
|
||||
@@ -358,7 +358,6 @@ export function getChannelIcon(channelType) {
|
||||
return <Ollama size={iconSize} />;
|
||||
case 14: // Anthropic Claude
|
||||
case 33: // AWS Claude
|
||||
case 53: // Claude Code
|
||||
return <Claude.Color size={iconSize} />;
|
||||
case 41: // Vertex AI
|
||||
return <Gemini.Color size={iconSize} />;
|
||||
|
||||
Reference in New Issue
Block a user