diff --git a/libs/designer-v2/src/lib/ui/panel/connectionsPanel/createConnection/createConnection.tsx b/libs/designer-v2/src/lib/ui/panel/connectionsPanel/createConnection/createConnection.tsx index 5e00d564d51..f28a8977930 100644 --- a/libs/designer-v2/src/lib/ui/panel/connectionsPanel/createConnection/createConnection.tsx +++ b/libs/designer-v2/src/lib/ui/panel/connectionsPanel/createConnection/createConnection.tsx @@ -115,6 +115,7 @@ export interface CreateConnectionProps { operationManifest?: OperationManifest; workflowKind?: string; workflowMetadata?: ConsumptionWorkflowMetadata; + enableManagedIdentityPicker?: boolean; } export const CreateConnection = (props: CreateConnectionProps) => { @@ -406,6 +407,15 @@ export const CreateConnection = (props: CreateConnectionProps) => { return output ?? {}; }, [enabledCapabilities, parametersByCapability]); + // Show MI picker only when explicitly enabled by the caller (e.g. MCP wizard) AND + // there are no visible parameters (form would be empty without it). + const isMultiAuthManagedIdentitySet = useMemo(() => { + if (!props.enableManagedIdentityPicker || !isMultiAuth) { + return false; + } + return Object.keys(capabilityEnabledParameters ?? {}).length === 0; + }, [props.enableManagedIdentityPicker, isMultiAuth, capabilityEnabledParameters]); + // Don't show name for simple connections const showNameInput = useMemo(() => { const isMcpClientConnection = connectorId?.toLowerCase().includes('mcpclient'); @@ -439,6 +449,9 @@ export const CreateConnection = (props: CreateConnectionProps) => { if (legacyManagedIdentitySelected && !selectedManagedIdentity) { return false; } + if (isMultiAuthManagedIdentitySet && !selectedManagedIdentity) { + return false; + } if (Object.keys(capabilityEnabledParameters ?? {}).length === 0) { return true; } @@ -451,6 +464,7 @@ export const CreateConnection = (props: CreateConnectionProps) => { resourceSelectorProps, legacyManagedIdentitySelected, selectedManagedIdentity, + isMultiAuthManagedIdentitySet, capabilityEnabledParameters, parameterValues, ]); @@ -497,7 +511,7 @@ export const CreateConnection = (props: CreateConnectionProps) => { } const alternativeParameterValues = legacyManagedIdentitySelected ? {} : undefined; - const identitySelected = legacyManagedIdentitySelected ? selectedManagedIdentity : undefined; + const identitySelected = legacyManagedIdentitySelected || isMultiAuthManagedIdentitySet ? selectedManagedIdentity : undefined; return createConnectionCallback?.( showNameInput ? connectionDisplayName : undefined, @@ -530,6 +544,7 @@ export const CreateConnection = (props: CreateConnectionProps) => { operationParameterValues, isUsingDynamicConnection, isDynamicConnectionOptionValidForConnector, + isMultiAuthManagedIdentitySet, ]); // INTL STRINGS @@ -919,6 +934,25 @@ export const CreateConnection = (props: CreateConnectionProps) => { /> )} + {/* Multi-auth Managed Identity Selection (for MCP custom connectors with MI parameter set) */} + {isMultiAuthManagedIdentitySet && ( +
+
+ )} + {/* OAuth tenant ID selection */} {showTenantIdSelection && ( { const { classes, @@ -68,6 +71,8 @@ export const CreateConnectionInternal = (props: { operationManifest, workflowKind, workflowMetadata, + connectionParameterSetsOverride, + enableManagedIdentityPicker, } = props; const dispatch = useDispatch(); @@ -320,7 +325,7 @@ export const CreateConnectionInternal = (props: { classes={classes} connector={connector} connectionParameterSets={getSupportedParameterSets( - connector.properties.connectionParameterSets, + connector.properties.connectionParameterSets ?? connectionParameterSetsOverride, operationType, connector.properties.capabilities )} @@ -345,6 +350,7 @@ export const CreateConnectionInternal = (props: { operationManifest={operationManifest} workflowKind={workflowKind} workflowMetadata={workflowMetadata} + enableManagedIdentityPicker={enableManagedIdentityPicker} /> ); }; diff --git a/libs/designer-v2/src/lib/ui/panel/connectionsPanel/createConnection/formInputs/legacyManagedIdentityPicker.tsx b/libs/designer-v2/src/lib/ui/panel/connectionsPanel/createConnection/formInputs/legacyManagedIdentityPicker.tsx index 44175422b2d..cf675e42d58 100644 --- a/libs/designer-v2/src/lib/ui/panel/connectionsPanel/createConnection/formInputs/legacyManagedIdentityPicker.tsx +++ b/libs/designer-v2/src/lib/ui/panel/connectionsPanel/createConnection/formInputs/legacyManagedIdentityPicker.tsx @@ -4,13 +4,14 @@ import { useEffect, useMemo, useRef } from 'react'; import { useIntl } from 'react-intl'; interface LegacyManagedIdentityDropdownProps { + id?: string; identity?: ManagedIdentity; onChange: (event: any, item?: IDropdownOption) => void; disabled?: boolean; } const LegacyManagedIdentityDropdown = (props: LegacyManagedIdentityDropdownProps) => { - const { identity, onChange, disabled } = props; + const { id, identity, onChange, disabled } = props; const intl = useIntl(); const dropdownOptions = useMemo(() => getIdentityDropdownOptions(identity, intl), [identity, intl]); @@ -29,6 +30,7 @@ const LegacyManagedIdentityDropdown = (props: LegacyManagedIdentityDropdownProps return ( { const intl = useIntl(); const dispatch = useDispatch(); @@ -603,6 +688,12 @@ export const McpToolWizard = () => { // Managed MCP servers use the default Azure connection flow const connectionMetadata = isManagedMcpServer ? undefined : { type: ConnectionType.Mcp, required: true }; + // For managed MCP servers (custom connectors), the connector from Azure API + // may not include connectionParameterSets (auth options). Provide MCP auth + // parameter sets as a fallback so users can select auth type (None, Basic, + // Managed Identity, etc.) when creating a connection. + const parameterSetsOverride = isManagedMcpServer ? mcpConnectionParameterSets : undefined; + return (
{ onConnectionCreated={handleConnectionCreated} onConnectionCancelled={handleConnectionCancelled} description=" " + connectionParameterSetsOverride={parameterSetsOverride} + enableManagedIdentityPicker={isManagedMcpServer} />
);