feat(editor): SSO login button (#5615)

* feat(editor): SSO login button

* feat(editor): SSO login button

* feat(editor): SSO login button

packages/editor-ui/src/stores/settings.ts

@@ -15,14 +15,15 @@ import {
 	VALUE_SURVEY_MODAL_KEY,
 } from '@/constants';
 import {
+	ILdapConfig,
 	ILogLevel,
 	IN8nPromptResponse,
 	IN8nPrompts,
 	IN8nUISettings,
 	IN8nValueSurveyData,
 	ISettingsState,
+	UserManagementAuthenticationMethod,
 	WorkflowCallerPolicyDefaultOption,
-	ILdapConfig,
 } from '@/Interface';
 import { IDataObject, ITelemetrySettings } from 'n8n-workflow';
 import { defineStore } from 'pinia';
@@ -40,6 +41,7 @@ export const useSettingsStore = defineStore(STORES.SETTINGS, {
 			enabled: false,
 			showSetupOnFirstLoad: false,
 			smtpSetup: false,
+			authenticationMethod: UserManagementAuthenticationMethod.Email,
 		},
 		templatesEndpointHealthy: false,
 		api: {
@@ -169,13 +171,15 @@ export const useSettingsStore = defineStore(STORES.SETTINGS, {
 		workflowCallerPolicyDefaultOption(): WorkflowCallerPolicyDefaultOption {
 			return this.settings.workflowCallerPolicyDefaultOption;
 		},
+		isDefaultAuthenticationSaml(): boolean {
+			return this.userManagement.authenticationMethod === UserManagementAuthenticationMethod.Saml;
+		},
 	},
 	actions: {
 		setSettings(settings: IN8nUISettings): void {
 			this.settings = settings;
-			this.userManagement.enabled = settings.userManagement.enabled;
+			this.userManagement = settings.userManagement;
 			this.userManagement.showSetupOnFirstLoad = !!settings.userManagement.showSetupOnFirstLoad;
-			this.userManagement.smtpSetup = settings.userManagement.smtpSetup;
 			this.api = settings.publicApi;
 			this.onboardingCallPromptEnabled = settings.onboardingCallPromptEnabled;
 			this.ldap.loginEnabled = settings.sso.ldap.loginEnabled;

packages/editor-ui/src/stores/sso.ts

@@ -0,0 +1,42 @@
+import { computed, reactive } from 'vue';
+import { defineStore } from 'pinia';
+import { EnterpriseEditionFeature } from '@/constants';
+import { useRootStore } from '@/stores/n8nRootStore';
+import { useSettingsStore } from '@/stores/settings';
+import { initSSO } from '@/api/sso';
+
+export const useSSOStore = defineStore('sso', () => {
+	const rootStore = useRootStore();
+	const settingsStore = useSettingsStore();
+
+	const state = reactive({
+		loading: false,
+	});
+
+	const isLoading = computed(() => state.loading);
+
+	const setLoading = (loading: boolean) => {
+		state.loading = loading;
+	};
+
+	const isSamlLoginEnabled = computed(() => settingsStore.isSamlLoginEnabled);
+	const isEnterpriseSamlEnabled = computed(() =>
+		settingsStore.isEnterpriseFeatureEnabled(EnterpriseEditionFeature.Saml),
+	);
+	const isDefaultAuthenticationSaml = computed(() => settingsStore.isDefaultAuthenticationSaml);
+	const showSsoLoginButton = computed(
+		() =>
+			isSamlLoginEnabled.value &&
+			isEnterpriseSamlEnabled.value &&
+			isDefaultAuthenticationSaml.value,
+	);
+
+	const getSSORedirectUrl = () => initSSO(rootStore.getRestApiContext);
+
+	return {
+		isLoading,
+		setLoading,
+		showSsoLoginButton,
+		getSSORedirectUrl,
+	};
+});