重大功能改进:添加禁止 Claude Code 签名功能并重构代码

新增功能:
- 在添加供应商和编辑供应商窗口都增加"禁止 Claude Code 签名"选择框
- 自动同步 JSON 配置中的 includeCoAuthoredBy 字段
- 支持双向同步:手动编辑 JSON 时选择框状态自动更新

代码优化:
- 提取通用函数到 providerConfigUtils.ts 工具文件
- 重构代码避免重复,提高可维护性
- 保持原有自动提取官网地址功能

UI改进:
- 优化选择框与标签的对齐样式
- 统一两个窗口的交互体验
This commit is contained in:
farion1231
2025-08-07 23:05:11 +08:00
parent b0d4537398
commit 100b3f6e21
4 changed files with 162 additions and 21 deletions

View File

@@ -149,4 +149,34 @@
color: #7f8c8d;
font-size: 0.8rem;
line-height: 1.3;
}
/* 添加标签和选择框的样式 */
.label-with-checkbox {
display: flex;
justify-content: space-between;
align-items: baseline;
margin-bottom: 0.5rem;
}
.label-with-checkbox label:first-child {
margin-bottom: 0;
}
.checkbox-label {
display: flex;
align-items: center;
gap: 0.3rem;
font-size: 0.85rem;
color: #666;
font-weight: normal;
margin-bottom: 0;
cursor: pointer;
}
.checkbox-label input[type="checkbox"] {
width: auto;
margin: 2px;
cursor: pointer;
transform: translateY(2px);
}

View File

@@ -1,5 +1,6 @@
import React, { useState } from "react";
import { Provider } from "../../shared/types";
import { updateCoAuthoredSetting, checkCoAuthoredSetting, extractWebsiteUrl } from "../utils/providerConfigUtils";
import "./AddProviderModal.css";
interface AddProviderModalProps {
@@ -17,6 +18,7 @@ const AddProviderModal: React.FC<AddProviderModalProps> = ({
settingsConfig: ""
});
const [error, setError] = useState("");
const [disableCoAuthored, setDisableCoAuthored] = useState(false);
// 预设的供应商配置模板
const presets = [
@@ -82,22 +84,6 @@ const AddProviderModal: React.FC<AddProviderModalProps> = ({
});
};
// 从JSON配置中提取并处理官网地址
const extractWebsiteUrl = (jsonString: string): string => {
try {
const config = JSON.parse(jsonString);
const baseUrl = config?.env?.ANTHROPIC_BASE_URL;
if (baseUrl && typeof baseUrl === 'string') {
// 去掉 "api." 前缀
return baseUrl.replace(/^https?:\/\/api\./, 'https://');
}
} catch (err) {
// 忽略JSON解析错误
}
return '';
};
const handleChange = (
e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
) => {
@@ -107,6 +93,10 @@ const AddProviderModal: React.FC<AddProviderModalProps> = ({
// 当用户修改配置时,尝试自动提取官网地址
const extractedWebsiteUrl = extractWebsiteUrl(value);
// 同时检查并同步选择框状态
const hasCoAuthoredDisabled = checkCoAuthoredSetting(value);
setDisableCoAuthored(hasCoAuthoredDisabled);
setFormData({
...formData,
[name]: value,
@@ -121,12 +111,30 @@ const AddProviderModal: React.FC<AddProviderModalProps> = ({
}
};
// 处理选择框变化
const handleCoAuthoredToggle = (checked: boolean) => {
setDisableCoAuthored(checked);
// 更新JSON配置
const updatedConfig = updateCoAuthoredSetting(formData.settingsConfig, checked);
setFormData({
...formData,
settingsConfig: updatedConfig,
});
};
const applyPreset = (preset: typeof presets[0]) => {
const configString = JSON.stringify(preset.settingsConfig, null, 2);
setFormData({
name: preset.name,
websiteUrl: preset.websiteUrl,
settingsConfig: JSON.stringify(preset.settingsConfig, null, 2)
settingsConfig: configString
});
// 同步选择框状态
const hasCoAuthoredDisabled = checkCoAuthoredSetting(configString);
setDisableCoAuthored(hasCoAuthoredDisabled);
};
return (
@@ -179,7 +187,17 @@ const AddProviderModal: React.FC<AddProviderModalProps> = ({
</div>
<div className="form-group">
<label htmlFor="settingsConfig">Claude Code (JSON) *</label>
<div className="label-with-checkbox">
<label htmlFor="settingsConfig">Claude Code (JSON) *</label>
<label className="checkbox-label">
<input
type="checkbox"
checked={disableCoAuthored}
onChange={(e) => handleCoAuthoredToggle(e.target.checked)}
/>
Claude Code
</label>
</div>
<textarea
id="settingsConfig"
name="settingsConfig"

View File

@@ -1,5 +1,6 @@
import React, { useState, useEffect } from 'react'
import { Provider } from '../../shared/types'
import { updateCoAuthoredSetting, checkCoAuthoredSetting, extractWebsiteUrl } from '../utils/providerConfigUtils'
import './AddProviderModal.css'
interface EditProviderModalProps {
@@ -15,14 +16,20 @@ const EditProviderModal: React.FC<EditProviderModalProps> = ({ provider, onSave,
settingsConfig: JSON.stringify(provider.settingsConfig, null, 2)
})
const [error, setError] = useState('')
const [disableCoAuthored, setDisableCoAuthored] = useState(false)
// 初始化时更新表单数据
useEffect(() => {
const configString = JSON.stringify(provider.settingsConfig, null, 2)
setFormData({
name: provider.name,
websiteUrl: provider.websiteUrl || '',
settingsConfig: JSON.stringify(provider.settingsConfig, null, 2)
settingsConfig: configString
})
// 同步选择框状态
const hasCoAuthoredDisabled = checkCoAuthoredSetting(configString)
setDisableCoAuthored(hasCoAuthoredDisabled)
}, [provider])
const handleSubmit = (e: React.FormEvent) => {
@@ -58,9 +65,38 @@ const EditProviderModal: React.FC<EditProviderModalProps> = ({ provider, onSave,
const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
const { name, value } = e.target
if (name === 'settingsConfig') {
// 当用户修改配置时,尝试自动提取官网地址
const extractedWebsiteUrl = extractWebsiteUrl(value)
// 同时检查并同步选择框状态
const hasCoAuthoredDisabled = checkCoAuthoredSetting(value)
setDisableCoAuthored(hasCoAuthoredDisabled)
setFormData({
...formData,
[name]: value,
// 只有在官网地址为空时才自动填入
websiteUrl: formData.websiteUrl || extractedWebsiteUrl,
})
} else {
setFormData({
...formData,
[name]: value
})
}
}
// 处理选择框变化
const handleCoAuthoredToggle = (checked: boolean) => {
setDisableCoAuthored(checked)
// 更新JSON配置
const updatedConfig = updateCoAuthoredSetting(formData.settingsConfig, checked)
setFormData({
...formData,
[name]: value
settingsConfig: updatedConfig,
})
}
@@ -104,7 +140,17 @@ const EditProviderModal: React.FC<EditProviderModalProps> = ({ provider, onSave,
</div>
<div className="form-group">
<label htmlFor="settingsConfig">Claude Code (JSON) *</label>
<div className="label-with-checkbox">
<label htmlFor="settingsConfig">Claude Code (JSON) *</label>
<label className="checkbox-label">
<input
type="checkbox"
checked={disableCoAuthored}
onChange={(e) => handleCoAuthoredToggle(e.target.checked)}
/>
Claude Code
</label>
</div>
<textarea
id="settingsConfig"
name="settingsConfig"

View File

@@ -0,0 +1,47 @@
// 供应商配置处理工具函数
// 处理includeCoAuthoredBy字段的添加/删除
export const updateCoAuthoredSetting = (jsonString: string, disable: boolean): string => {
try {
const config = JSON.parse(jsonString)
if (disable) {
// 添加或更新includeCoAuthoredBy字段
config.includeCoAuthoredBy = false
} else {
// 删除includeCoAuthoredBy字段
delete config.includeCoAuthoredBy
}
return JSON.stringify(config, null, 2)
} catch (err) {
// 如果JSON解析失败返回原始字符串
return jsonString
}
}
// 从JSON配置中检查是否包含includeCoAuthoredBy设置
export const checkCoAuthoredSetting = (jsonString: string): boolean => {
try {
const config = JSON.parse(jsonString)
return config.includeCoAuthoredBy === false
} catch (err) {
return false
}
}
// 从JSON配置中提取并处理官网地址
export const extractWebsiteUrl = (jsonString: string): string => {
try {
const config = JSON.parse(jsonString)
const baseUrl = config?.env?.ANTHROPIC_BASE_URL
if (baseUrl && typeof baseUrl === 'string') {
// 去掉 "api." 前缀
return baseUrl.replace(/^https?:\/\/api\./, 'https://')
}
} catch (err) {
// 忽略JSON解析错误
}
return ''
}