5f78e58ffc
- Add isPartner and partnerPromotionKey fields to Provider and ProviderPreset types - Display gold star badge on partner presets in selector - Show promotional message in API Key section for partners - Configure Zhipu GLM as official partner with 10% discount promotion - Support both Claude and Codex provider presets - Add i18n support for partner promotion messages (zh/en)
92 lines
2.4 KiB
TypeScript
92 lines
2.4 KiB
TypeScript
import { useTranslation } from "react-i18next";
|
||
import ApiKeyInput from "../ApiKeyInput";
|
||
import type { ProviderCategory } from "@/types";
|
||
|
||
interface ApiKeySectionProps {
|
||
id?: string;
|
||
label?: string;
|
||
value: string;
|
||
onChange: (value: string) => void;
|
||
category?: ProviderCategory;
|
||
shouldShowLink: boolean;
|
||
websiteUrl: string;
|
||
placeholder?: {
|
||
official: string;
|
||
thirdParty: string;
|
||
};
|
||
disabled?: boolean;
|
||
isPartner?: boolean;
|
||
partnerPromotionKey?: string;
|
||
}
|
||
|
||
export function ApiKeySection({
|
||
id,
|
||
label,
|
||
value,
|
||
onChange,
|
||
category,
|
||
shouldShowLink,
|
||
websiteUrl,
|
||
placeholder,
|
||
disabled,
|
||
isPartner,
|
||
partnerPromotionKey,
|
||
}: ApiKeySectionProps) {
|
||
const { t } = useTranslation();
|
||
|
||
const defaultPlaceholder = {
|
||
official: t("providerForm.officialNoApiKey", {
|
||
defaultValue: "官方供应商无需 API Key",
|
||
}),
|
||
thirdParty: t("providerForm.apiKeyAutoFill", {
|
||
defaultValue: "输入 API Key，将自动填充到配置",
|
||
}),
|
||
};
|
||
|
||
const finalPlaceholder = placeholder || defaultPlaceholder;
|
||
|
||
return (
|
||
<div className="space-y-1">
|
||
<ApiKeyInput
|
||
id={id}
|
||
label={label}
|
||
value={value}
|
||
onChange={onChange}
|
||
placeholder={
|
||
category === "official"
|
||
? finalPlaceholder.official
|
||
: finalPlaceholder.thirdParty
|
||
}
|
||
disabled={disabled ?? category === "official"}
|
||
/>
|
||
{/* API Key 获取链接 */}
|
||
{shouldShowLink && websiteUrl && (
|
||
<div className="space-y-2 -mt-1 pl-1">
|
||
<a
|
||
href={websiteUrl}
|
||
target="_blank"
|
||
rel="noopener noreferrer"
|
||
className="text-xs text-blue-400 dark:text-blue-500 hover:text-blue-500 dark:hover:text-blue-400 transition-colors"
|
||
>
|
||
{t("providerForm.getApiKey", {
|
||
defaultValue: "获取 API Key",
|
||
})}
|
||
</a>
|
||
|
||
{/* 合作伙伴促销信息 */}
|
||
{isPartner && partnerPromotionKey && (
|
||
<div className="rounded-md bg-blue-50 dark:bg-blue-950/30 p-2.5 border border-blue-200 dark:border-blue-800">
|
||
<p className="text-xs leading-relaxed text-blue-700 dark:text-blue-300">
|
||
💡{" "}
|
||
{t(`providerForm.partnerPromotion.${partnerPromotionKey}`, {
|
||
defaultValue: "",
|
||
})}
|
||
</p>
|
||
</div>
|
||
)}
|
||
</div>
|
||
)}
|
||
</div>
|
||
);
|
||
}
|