diff --git a/src/features/providers/sheets/forms/BaseProviderForm.tsx b/src/features/providers/sheets/forms/BaseProviderForm.tsx index 820bb16..316e6cf 100644 --- a/src/features/providers/sheets/forms/BaseProviderForm.tsx +++ b/src/features/providers/sheets/forms/BaseProviderForm.tsx @@ -4,6 +4,8 @@ import { IconAlertTriangle, IconCheckCircle2, IconDownload, + IconEye, + IconEyeOff, IconLoader2, IconPlus, IconX, @@ -133,7 +135,8 @@ function buildInitialForm( const disabled = hasDisableAllModelsRule(cfg.excludedModels); const excludedList = stripDisableAllRule(cfg.excludedModels); return { - apiKey: '', + // Populate apiKey from resource.raw in edit mode so the field is not empty + apiKey: cfg.apiKey ?? '', name: '', baseUrl: cfg.baseUrl ?? '', proxyUrl: cfg.proxyUrl ?? '', @@ -211,6 +214,20 @@ export function BaseProviderForm({ JSON.stringify(buildInitialForm(brand, resource, mode)) ); const [error, setError] = useState(null); + const [showPasswords, setShowPasswords] = useState>(new Set()); + const [showSingleApiKey, setShowSingleApiKey] = useState(false); + + const togglePasswordVisibility = (idx: number) => { + setShowPasswords((prev) => { + const next = new Set(prev); + if (next.has(idx)) { + next.delete(idx); + } else { + next.add(idx); + } + return next; + }); + }; const isDirty = useMemo( () => JSON.stringify(form) !== initialFormSignature, @@ -454,19 +471,43 @@ export function BaseProviderForm({ - updateField('apiKey', e.target.value)} - placeholder={ - mode === 'edit' - ? t('providersPage.form.apiKeyEditPlaceholder') - : t('providersPage.form.apiKeyCreatePlaceholder') - } - disabled={mutating} - /> +
+ updateField('apiKey', e.target.value)} + placeholder={ + mode === 'edit' + ? t('providersPage.form.apiKeyEditPlaceholder') + : t('providersPage.form.apiKeyCreatePlaceholder') + } + disabled={mutating} + /> + +
) : null} @@ -709,21 +750,45 @@ export function BaseProviderForm({ - - updateField( - 'apiKeyEntries', - apiKeyEntries.map((it, i) => - i === realIdx ? { ...it, apiKey: e.target.value } : it +
+ + updateField( + 'apiKeyEntries', + apiKeyEntries.map((it, i) => + i === realIdx ? { ...it, apiKey: e.target.value } : it + ) ) - ) - } - disabled={mutating} - placeholder={t('providersPage.form.apiKeyCreatePlaceholder')} - /> + } + disabled={mutating} + placeholder={t('providersPage.form.apiKeyCreatePlaceholder')} + /> + +