fix(frontend/credentials): Auto-select user credentials in run dialog

Add auto-selection for user credentials (like MCP OAuth) in the
CredentialsGroupedView run dialog. When exactly one credential matches
the provider, type, and discriminator values (e.g. MCP server URL),
it is pre-selected instead of defaulting to "None (skip this credential)".
This commit is contained in:
Zamil Majdy
2026-02-10 14:21:23 +04:00
parent ed50f7f87d
commit 65987ff15e

View File

@@ -16,6 +16,7 @@ import {
areSystemCredentialProvidersLoading,
CredentialField,
findSavedCredentialByProviderAndType,
findSavedUserCredentialByProviderAndType,
hasMissingRequiredSystemCredentials,
splitCredentialFieldsBySystem,
} from "./helpers";
@@ -45,6 +46,7 @@ export function CredentialsGroupedView({
const hasSystemCredentials = systemCredentialFields.length > 0;
const hasUserCredentials = userCredentialFields.length > 0;
const hasAttemptedAutoSelect = useRef(false);
const hasAttemptedUserAutoSelect = useRef(false);
const isLoadingProviders = useMemo(
() =>
@@ -111,6 +113,49 @@ export function CredentialsGroupedView({
isLoadingProviders,
]);
// Auto-select user credentials when there is exactly one matching credential.
// This handles cases like MCP where the credential is optional but should
// still be pre-selected when only one credential matches the server URL.
useEffect(() => {
if (hasAttemptedUserAutoSelect.current) return;
if (!hasUserCredentials) return;
if (!allProviders) return;
for (const [key, schema] of userCredentialFields) {
const alreadySelected = inputCredentials?.[key];
if (alreadySelected) continue;
const providerNames = schema.credentials_provider || [];
const credentialTypes = schema.credentials_types || [];
const requiredScopes = schema.credentials_scopes;
const discriminatorValues = schema.discriminator_values;
const savedCredential = findSavedUserCredentialByProviderAndType(
providerNames,
credentialTypes,
requiredScopes,
allProviders,
discriminatorValues,
);
if (savedCredential) {
onCredentialChange(key, {
id: savedCredential.id,
provider: savedCredential.provider,
type: savedCredential.type as CredentialsType,
title: savedCredential.title,
});
}
}
hasAttemptedUserAutoSelect.current = true;
}, [
allProviders,
hasUserCredentials,
userCredentialFields,
inputCredentials,
onCredentialChange,
]);
return (
<div className="space-y-6">
{hasUserCredentials && (