From 396bc9d2dabfec2aaba55eb92fdbaf90cec992a5 Mon Sep 17 00:00:00 2001 From: Alexandre Vryghem Date: Wed, 26 Jun 2024 19:18:15 +0200 Subject: [PATCH] 116131: Made the @renderAuthMethodFor themeable --- .../log-in-container.component.spec.ts | 3 +++ .../container/log-in-container.component.ts | 13 ++++++------- .../shared/log-in/log-in.component.spec.ts | 4 +++- .../methods/log-in.methods-decorator.ts | 19 ++++++++++++------- .../methods/oidc/log-in-oidc.component.ts | 6 +++--- .../password/log-in-password.component.ts | 8 ++++---- .../log-in-shibboleth.component.spec.ts | 4 +--- .../shibboleth/log-in-shibboleth.component.ts | 7 +++---- .../methods/oidc/log-in-oidc.component.html | 0 .../methods/oidc/log-in-oidc.component.ts | 14 ++++++++++++++ .../password/log-in-password.component.html | 0 .../password/log-in-password.component.scss | 0 .../password/log-in-password.component.ts | 18 ++++++++++++++++++ .../log-in-shibboleth.component.html | 0 .../log-in-shibboleth.component.scss | 0 .../shibboleth/log-in-shibboleth.component.ts | 16 ++++++++++++++++ src/themes/custom/entry-components.ts | 8 +++++++- 17 files changed, 90 insertions(+), 30 deletions(-) create mode 100644 src/themes/custom/app/shared/log-in/methods/oidc/log-in-oidc.component.html create mode 100644 src/themes/custom/app/shared/log-in/methods/oidc/log-in-oidc.component.ts create mode 100644 src/themes/custom/app/shared/log-in/methods/password/log-in-password.component.html create mode 100644 src/themes/custom/app/shared/log-in/methods/password/log-in-password.component.scss create mode 100644 src/themes/custom/app/shared/log-in/methods/password/log-in-password.component.ts create mode 100644 src/themes/custom/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.html create mode 100644 src/themes/custom/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.scss create mode 100644 src/themes/custom/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.ts diff --git a/src/app/shared/log-in/container/log-in-container.component.spec.ts b/src/app/shared/log-in/container/log-in-container.component.spec.ts index 29598e422ec..c8c4a0eb96a 100644 --- a/src/app/shared/log-in/container/log-in-container.component.spec.ts +++ b/src/app/shared/log-in/container/log-in-container.component.spec.ts @@ -13,6 +13,8 @@ import { AuthMethod } from '../../../core/auth/models/auth.method'; import { AuthServiceStub } from '../../testing/auth-service.stub'; import { createTestComponent } from '../../testing/utils.test'; import { HardRedirectService } from '../../../core/services/hard-redirect.service'; +import { ThemeService } from '../../theme-support/theme.service'; +import { getMockThemeService } from '../../mocks/theme-service.mock'; describe('LogInContainerComponent', () => { @@ -43,6 +45,7 @@ describe('LogInContainerComponent', () => { providers: [ { provide: AuthService, useClass: AuthServiceStub }, { provide: HardRedirectService, useValue: hardRedirectService }, + { provide: ThemeService, useValue: getMockThemeService() }, LogInContainerComponent ], schemas: [ diff --git a/src/app/shared/log-in/container/log-in-container.component.ts b/src/app/shared/log-in/container/log-in-container.component.ts index f6a08a1e1ec..1bdde5c9f11 100644 --- a/src/app/shared/log-in/container/log-in-container.component.ts +++ b/src/app/shared/log-in/container/log-in-container.component.ts @@ -2,6 +2,7 @@ import { Component, Injector, Input, OnInit } from '@angular/core'; import { rendersAuthMethodType } from '../methods/log-in.methods-decorator'; import { AuthMethod } from '../../../core/auth/models/auth.method'; +import { ThemeService } from '../../theme-support/theme.service'; /** * This component represents a component container for log-in methods available. @@ -27,12 +28,10 @@ export class LogInContainerComponent implements OnInit { */ public objectInjector: Injector; - /** - * Initialize instance variables - * - * @param {Injector} injector - */ - constructor(private injector: Injector) { + constructor( + private injector: Injector, + private themeService: ThemeService, + ) { } /** @@ -52,7 +51,7 @@ export class LogInContainerComponent implements OnInit { * Find the correct component based on the AuthMethod's type */ getAuthMethodContent(): string { - return rendersAuthMethodType(this.authMethod.authMethodType); + return rendersAuthMethodType(this.authMethod.authMethodType, this.themeService.getThemeName()); } } diff --git a/src/app/shared/log-in/log-in.component.spec.ts b/src/app/shared/log-in/log-in.component.spec.ts index 0a13e8b701e..c518b23bacb 100644 --- a/src/app/shared/log-in/log-in.component.spec.ts +++ b/src/app/shared/log-in/log-in.component.spec.ts @@ -21,6 +21,8 @@ import { RouterTestingModule } from '@angular/router/testing'; import { HardRedirectService } from '../../core/services/hard-redirect.service'; import { AuthorizationDataService } from '../../core/data/feature-authorization/authorization-data.service'; import { of } from 'rxjs'; +import { ThemeService } from '../theme-support/theme.service'; +import { getMockThemeService } from '../mocks/theme-service.mock'; describe('LogInComponent', () => { @@ -70,10 +72,10 @@ describe('LogInComponent', () => { providers: [ { provide: AuthService, useClass: AuthServiceStub }, { provide: NativeWindowService, useFactory: NativeWindowMockFactory }, - // { provide: Router, useValue: new RouterStub() }, { provide: ActivatedRoute, useValue: new ActivatedRouteStub() }, { provide: HardRedirectService, useValue: hardRedirectService }, { provide: AuthorizationDataService, useValue: authorizationService }, + { provide: ThemeService, useValue: getMockThemeService() }, provideMockStore({ initialState }), LogInComponent ], diff --git a/src/app/shared/log-in/methods/log-in.methods-decorator.ts b/src/app/shared/log-in/methods/log-in.methods-decorator.ts index 0614bdeb511..84e1ea77b61 100644 --- a/src/app/shared/log-in/methods/log-in.methods-decorator.ts +++ b/src/app/shared/log-in/methods/log-in.methods-decorator.ts @@ -1,16 +1,21 @@ import { AuthMethodType } from '../../../core/auth/models/auth.method-type'; +import { DEFAULT_THEME } from '../../object-collection/shared/listable-object/listable-object.decorator'; +import { hasNoValue } from '../../empty.util'; +import { getMatch } from '../../abstract-component-loader/dynamic-component-loader.utils'; + +export const DEFAULT_AUTH_METHOD_TYPE = AuthMethodType.Password; const authMethodsMap = new Map(); -export function renderAuthMethodFor(authMethodType: AuthMethodType) { - return function decorator(objectElement: any) { - if (!objectElement) { - return; +export function renderAuthMethodFor(authMethodType: AuthMethodType, theme = DEFAULT_THEME) { + return function decorator(component: any) { + if (hasNoValue(authMethodsMap.get(authMethodType))) { + authMethodsMap.set(authMethodType, new Map()); } - authMethodsMap.set(authMethodType, objectElement); + authMethodsMap.get(authMethodType).set(theme, component); }; } -export function rendersAuthMethodType(authMethodType: AuthMethodType) { - return authMethodsMap.get(authMethodType); +export function rendersAuthMethodType(authMethodType: AuthMethodType, theme: string) { + return getMatch(authMethodsMap, [authMethodType, theme], [DEFAULT_AUTH_METHOD_TYPE, DEFAULT_THEME]).match; } diff --git a/src/app/shared/log-in/methods/oidc/log-in-oidc.component.ts b/src/app/shared/log-in/methods/oidc/log-in-oidc.component.ts index 8253a1aabfa..8300ca109b2 100644 --- a/src/app/shared/log-in/methods/oidc/log-in-oidc.component.ts +++ b/src/app/shared/log-in/methods/oidc/log-in-oidc.component.ts @@ -60,9 +60,9 @@ export class LogInOidcComponent implements OnInit { @Inject('authMethodProvider') public injectedAuthMethodModel: AuthMethod, @Inject('isStandalonePage') public isStandalonePage: boolean, @Inject(NativeWindowService) protected _window: NativeWindowRef, - private authService: AuthService, - private hardRedirectService: HardRedirectService, - private store: Store + protected authService: AuthService, + protected hardRedirectService: HardRedirectService, + protected store: Store ) { this.authMethod = injectedAuthMethodModel; } diff --git a/src/app/shared/log-in/methods/password/log-in-password.component.ts b/src/app/shared/log-in/methods/password/log-in-password.component.ts index c72881d3bfc..535549bf91b 100644 --- a/src/app/shared/log-in/methods/password/log-in-password.component.ts +++ b/src/app/shared/log-in/methods/password/log-in-password.component.ts @@ -77,10 +77,10 @@ export class LogInPasswordComponent implements OnInit { constructor( @Inject('authMethodProvider') public injectedAuthMethodModel: AuthMethod, @Inject('isStandalonePage') public isStandalonePage: boolean, - private authService: AuthService, - private hardRedirectService: HardRedirectService, - private formBuilder: FormBuilder, - private store: Store + protected authService: AuthService, + protected hardRedirectService: HardRedirectService, + protected formBuilder: FormBuilder, + protected store: Store ) { this.authMethod = injectedAuthMethodModel; } diff --git a/src/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.spec.ts b/src/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.spec.ts index 075d33d98ef..c81087fb448 100644 --- a/src/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.spec.ts +++ b/src/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.spec.ts @@ -1,5 +1,5 @@ import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; -import { ActivatedRoute, Router } from '@angular/router'; +import { Router } from '@angular/router'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { provideMockStore } from '@ngrx/store/testing'; @@ -17,7 +17,6 @@ import { AuthMethodType } from '../../../../core/auth/models/auth.method-type'; import { LogInShibbolethComponent } from './log-in-shibboleth.component'; import { NativeWindowService } from '../../../../core/services/window.service'; import { RouterStub } from '../../../testing/router.stub'; -import { ActivatedRouteStub } from '../../../testing/active-router.stub'; import { NativeWindowMockFactory } from '../../../mocks/mock-native-window-ref'; import { HardRedirectService } from '../../../../core/services/hard-redirect.service'; @@ -74,7 +73,6 @@ describe('LogInShibbolethComponent', () => { { provide: 'isStandalonePage', useValue: true }, { provide: NativeWindowService, useFactory: NativeWindowMockFactory }, { provide: Router, useValue: new RouterStub() }, - { provide: ActivatedRoute, useValue: new ActivatedRouteStub() }, { provide: HardRedirectService, useValue: hardRedirectService }, provideMockStore({ initialState }), ], diff --git a/src/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.ts b/src/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.ts index b0704d5cb15..eb0470a5e05 100644 --- a/src/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.ts +++ b/src/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.ts @@ -64,10 +64,9 @@ export class LogInShibbolethComponent implements OnInit { @Inject('authMethodProvider') public injectedAuthMethodModel: AuthMethod, @Inject('isStandalonePage') public isStandalonePage: boolean, @Inject(NativeWindowService) protected _window: NativeWindowRef, - private route: RouteService, - private authService: AuthService, - private hardRedirectService: HardRedirectService, - private store: Store + protected authService: AuthService, + protected hardRedirectService: HardRedirectService, + protected store: Store ) { this.authMethod = injectedAuthMethodModel; } diff --git a/src/themes/custom/app/shared/log-in/methods/oidc/log-in-oidc.component.html b/src/themes/custom/app/shared/log-in/methods/oidc/log-in-oidc.component.html new file mode 100644 index 00000000000..e69de29bb2d diff --git a/src/themes/custom/app/shared/log-in/methods/oidc/log-in-oidc.component.ts b/src/themes/custom/app/shared/log-in/methods/oidc/log-in-oidc.component.ts new file mode 100644 index 00000000000..8fa50531256 --- /dev/null +++ b/src/themes/custom/app/shared/log-in/methods/oidc/log-in-oidc.component.ts @@ -0,0 +1,14 @@ +import { Component, } from '@angular/core'; + +import { AuthMethodType } from '../../../../../../../app/core/auth/models/auth.method-type'; +import { renderAuthMethodFor } from '../../../../../../../app/shared/log-in/methods/log-in.methods-decorator'; +import { LogInOidcComponent as BaseComponent } from '../../../../../../../app/shared/log-in/methods/oidc/log-in-oidc.component'; + +@Component({ + selector: 'ds-log-in-oidc', + // templateUrl: './log-in-oidc.component.html', + templateUrl: '../../../../../../../app/shared/log-in/methods/oidc/log-in-oidc.component.html', +}) +@renderAuthMethodFor(AuthMethodType.Oidc, 'custom') +export class LogInOidcComponent extends BaseComponent { +} diff --git a/src/themes/custom/app/shared/log-in/methods/password/log-in-password.component.html b/src/themes/custom/app/shared/log-in/methods/password/log-in-password.component.html new file mode 100644 index 00000000000..e69de29bb2d diff --git a/src/themes/custom/app/shared/log-in/methods/password/log-in-password.component.scss b/src/themes/custom/app/shared/log-in/methods/password/log-in-password.component.scss new file mode 100644 index 00000000000..e69de29bb2d diff --git a/src/themes/custom/app/shared/log-in/methods/password/log-in-password.component.ts b/src/themes/custom/app/shared/log-in/methods/password/log-in-password.component.ts new file mode 100644 index 00000000000..8425b8fd05e --- /dev/null +++ b/src/themes/custom/app/shared/log-in/methods/password/log-in-password.component.ts @@ -0,0 +1,18 @@ +import { Component } from '@angular/core'; + +import { AuthMethodType } from '../../../../../../../app/core/auth/models/auth.method-type'; +import { fadeOut } from '../../../../../../../app/shared/animations/fade'; +import { renderAuthMethodFor } from '../../../../../../../app/shared/log-in/methods/log-in.methods-decorator'; +import { LogInPasswordComponent as BaseComponent } from '../../../../../../../app/shared/log-in/methods/password/log-in-password.component'; + +@Component({ + selector: 'ds-log-in-password', + // templateUrl: './log-in-password.component.html', + templateUrl: '../../../../../../../app/shared/log-in/methods/password/log-in-password.component.html', + // styleUrls: ['./log-in-password.component.scss'], + styleUrls: ['../../../../../../../app/shared/log-in/methods/password/log-in-password.component.scss'], + animations: [fadeOut], +}) +@renderAuthMethodFor(AuthMethodType.Password, 'custom') +export class LogInPasswordComponent extends BaseComponent { +} diff --git a/src/themes/custom/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.html b/src/themes/custom/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.html new file mode 100644 index 00000000000..e69de29bb2d diff --git a/src/themes/custom/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.scss b/src/themes/custom/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.scss new file mode 100644 index 00000000000..e69de29bb2d diff --git a/src/themes/custom/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.ts b/src/themes/custom/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.ts new file mode 100644 index 00000000000..2bc33fa6db8 --- /dev/null +++ b/src/themes/custom/app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.ts @@ -0,0 +1,16 @@ +import { Component, } from '@angular/core'; + +import { AuthMethodType } from '../../../../../../../app/core/auth/models/auth.method-type'; +import { renderAuthMethodFor } from '../../../../../../../app/shared/log-in/methods/log-in.methods-decorator'; +import { LogInShibbolethComponent as BaseComponent } from '../../../../../../../app/shared/log-in/methods/shibboleth/log-in-shibboleth.component'; + +@Component({ + selector: 'ds-log-in-shibboleth', + // templateUrl: './log-in-shibboleth.component.html', + templateUrl: '../../../../../../../app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.html', + // styleUrls: ['./log-in-shibboleth.component.scss'], + styleUrls: ['../../../../../../../app/shared/log-in/methods/shibboleth/log-in-shibboleth.component.scss'], +}) +@renderAuthMethodFor(AuthMethodType.Shibboleth, 'custom') +export class LogInShibbolethComponent extends BaseComponent { +} diff --git a/src/themes/custom/entry-components.ts b/src/themes/custom/entry-components.ts index b518e4cc457..5f05d114ac6 100644 --- a/src/themes/custom/entry-components.ts +++ b/src/themes/custom/entry-components.ts @@ -1,5 +1,11 @@ import { PublicationComponent } from './app/item-page/simple/item-types/publication/publication.component'; +import { LogInOidcComponent } from './app/shared/log-in/methods/oidc/log-in-oidc.component'; +import { LogInPasswordComponent } from './app/shared/log-in/methods/password/log-in-password.component'; +import { LogInShibbolethComponent } from './app/shared/log-in/methods/shibboleth/log-in-shibboleth.component'; export const ENTRY_COMPONENTS = [ - PublicationComponent + PublicationComponent, + LogInOidcComponent, + LogInPasswordComponent, + LogInShibbolethComponent, ];