From 0f55f62be06642b25ea13c9fb942a30a60ba48dd Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Fri, 5 Apr 2024 13:42:10 +0200 Subject: [PATCH] map up the onSubmit, state and provider --- .../src/apps/app/app-auth.controller.ts | 17 +++++++++++---- .../src/packages/core/auth/index.ts | 2 ++ .../auth/modals/umb-app-auth-modal.element.ts | 5 +++-- .../auth/modals/umb-app-auth-modal.token.ts | 21 ++++++++++++++++--- .../src/packages/core/auth/types.ts | 5 +++++ 5 files changed, 41 insertions(+), 9 deletions(-) create mode 100644 src/Umbraco.Web.UI.Client/src/packages/core/auth/types.ts diff --git a/src/Umbraco.Web.UI.Client/src/apps/app/app-auth.controller.ts b/src/Umbraco.Web.UI.Client/src/apps/app/app-auth.controller.ts index 0c2eac7678..d0335524f1 100644 --- a/src/Umbraco.Web.UI.Client/src/apps/app/app-auth.controller.ts +++ b/src/Umbraco.Web.UI.Client/src/apps/app/app-auth.controller.ts @@ -1,4 +1,9 @@ -import { UMB_AUTH_CONTEXT, UMB_MODAL_APP_AUTH, UMB_STORAGE_REDIRECT_URL } from '@umbraco-cms/backoffice/auth'; +import { + UMB_AUTH_CONTEXT, + UMB_MODAL_APP_AUTH, + UMB_STORAGE_REDIRECT_URL, + type UmbUserLoginState, +} from '@umbraco-cms/backoffice/auth'; import { UmbControllerBase } from '@umbraco-cms/backoffice/class-api'; import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api'; import { firstValueFrom } from '@umbraco-cms/backoffice/external/rxjs'; @@ -41,7 +46,7 @@ export class UmbAppAuthController extends UmbControllerBase { * Starts the authorization flow. * It will check which providers are available and either redirect directly to the provider or show a provider selection screen. */ - async makeAuthorizationRequest(): Promise { + async makeAuthorizationRequest(userLoginState: UmbUserLoginState = 'loggingIn'): Promise { if (!this.#authContext) { throw new Error('[Fatal] Auth context is not available'); } @@ -67,7 +72,11 @@ export class UmbAppAuthController extends UmbControllerBase { // Show the provider selection screen const modalManager = await this.getContext(UMB_MODAL_MANAGER_CONTEXT); const selected = await modalManager - .open(this._host, UMB_MODAL_APP_AUTH) + .open(this._host, UMB_MODAL_APP_AUTH, { + data: { + userLoginState, + }, + }) .onSubmit() .catch(() => undefined); @@ -75,7 +84,7 @@ export class UmbAppAuthController extends UmbControllerBase { return false; } - this.#authContext.makeAuthorizationRequest(selected.providerName); + this.#authContext.makeAuthorizationRequest(selected.providerName, selected.loginHint); } } diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/auth/index.ts b/src/Umbraco.Web.UI.Client/src/packages/core/auth/index.ts index e05fbbb7ed..2f5cf6b67d 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/auth/index.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/auth/index.ts @@ -5,3 +5,5 @@ export * from './auth.context.token.js'; export * from './modals/index.js'; export * from './models/openApiConfiguration.js'; export * from './components/index.js'; + +export type * from './types.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/umb-app-auth-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/umb-app-auth-modal.element.ts index 5acc1ebe77..7cba576d77 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/umb-app-auth-modal.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/umb-app-auth-modal.element.ts @@ -1,12 +1,13 @@ import { UmbModalBaseElement } from '../../modal/index.js'; -import type { UmbModalAppAuthValue } from './umb-app-auth-modal.token.js'; +import type { UmbModalAppAuthConfig, UmbModalAppAuthValue } from './umb-app-auth-modal.token.js'; import { css, customElement, html } from '@umbraco-cms/backoffice/external/lit'; import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; @customElement('umb-app-auth-modal') -export class UmbAppAuthModalElement extends UmbModalBaseElement { +export class UmbAppAuthModalElement extends UmbModalBaseElement { get props() { return { + userLoginState: this.data?.userLoginState ?? 'loggingIn', onSubmit: this.onSubmit, }; } diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/umb-app-auth-modal.token.ts b/src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/umb-app-auth-modal.token.ts index 20ce925dd9..9b763e4c36 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/umb-app-auth-modal.token.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/auth/modals/umb-app-auth-modal.token.ts @@ -1,10 +1,25 @@ +import type { UmbUserLoginState } from '../types.js'; import { UmbModalToken } from '@umbraco-cms/backoffice/modal'; -export type UmbModalAppAuthValue = { - providerName?: string; +export type UmbModalAppAuthConfig = { + userLoginState: UmbUserLoginState; }; -export const UMB_MODAL_APP_AUTH = new UmbModalToken('Umb.Modal.AppAuth', { +export type UmbModalAppAuthValue = { + /** + * The name of the provider that the user has selected to authenticate with. + * @required + */ + providerName?: string; + + /** + * The login hint that the user has provided to the provider. + * @optional + */ + loginHint?: string; +}; + +export const UMB_MODAL_APP_AUTH = new UmbModalToken('Umb.Modal.AppAuth', { modal: { type: 'dialog', }, diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/auth/types.ts b/src/Umbraco.Web.UI.Client/src/packages/core/auth/types.ts new file mode 100644 index 0000000000..d1933d0607 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/core/auth/types.ts @@ -0,0 +1,5 @@ +/** + * User login state that can be used to determine the current state of the user. + * @example 'loggedIn' + */ +export type UmbUserLoginState = 'loggingIn' | 'loggedOut' | 'timedOut';