Merge branch 'fix-display-order-authentication-methods_contribute-7.4…

…' into fix-display-order-authentication-methods_contribute-7.6 # Conflicts: # src/app/shared/log-in/log-in.component.html # src/app/shared/log-in/log-in.component.ts
alexandrevryghem · Oct 21, 2023 · b778c74 · b778c74
2 parents 0905a53 + f825593
commit b778c74
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 23 deletions.
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
@@ -1,5 +1,4 @@
-import { Component, Injector, Input, OnInit } from '@angular/core';
-
+import { Component, Injector, Input, OnInit, Type } from '@angular/core';
 import { rendersAuthMethodType } from '../methods/log-in.methods-decorator';
 import { AuthMethod } from '../../../core/auth/models/auth.method';
 
@@ -27,12 +26,9 @@ export class LogInContainerComponent implements OnInit {
    */
   public objectInjector: Injector;
 
-  /**
-   * Initialize instance variables
-   *
-   * @param {Injector} injector
-   */
-  constructor(private injector: Injector) {
+  constructor(
+    protected injector: Injector,
+  ) {
   }
 
   /**
@@ -51,8 +47,8 @@ export class LogInContainerComponent implements OnInit {
   /**
    * Find the correct component based on the AuthMethod's type
    */
-  getAuthMethodContent(): string {
-      return rendersAuthMethodType(this.authMethod.authMethodType);
+  getAuthMethodContent(): Type<Component> {
+    return rendersAuthMethodType(this.authMethod.authMethodType);
   }
 
 }
diff --git a/src/app/shared/log-in/log-in.component.html b/src/app/shared/log-in/log-in.component.html
@@ -1,11 +1,7 @@
 <ds-themed-loading *ngIf="(loading | async) || (isAuthenticated | async)" class="m-5"></ds-themed-loading>
 <div *ngIf="!(loading | async) && !(isAuthenticated | async)" class="px-4 py-3 mx-auto login-container">
   <ng-container *ngFor="let authMethod of getOrderedAuthMethods(authMethods | async); let last = last">
-    <div [class.d-none]="contentRef.innerText?.trim().length === 0">
-      <div #contentRef>
-        <ds-log-in-container [authMethod]="authMethod" [isStandalonePage]="isStandalonePage"></ds-log-in-container>
-      </div>
-      <div *ngIf="!last" class="dropdown-divider my-2"></div>
-    </div>
+    <ds-log-in-container [authMethod]="authMethod" [isStandalonePage]="isStandalonePage"></ds-log-in-container>
+    <div *ngIf="!last" class="dropdown-divider my-2"></div>
   </ng-container>
 </div>
diff --git a/src/app/shared/log-in/log-in.component.ts b/src/app/shared/log-in/log-in.component.ts
@@ -12,11 +12,8 @@ import { hasValue } from '../empty.util';
 import { AuthService } from '../../core/auth/auth.service';
 import { CoreState } from '../../core/core-state.model';
 import { AuthMethodType } from '../../core/auth/models/auth.method-type';
+import { rendersAuthMethodType } from './methods/log-in.methods-decorator';
 
-/**
- * /users/sign-in
- * @class LogInComponent
- */
 @Component({
   selector: 'ds-log-in',
   templateUrl: './log-in.component.html',
@@ -82,7 +79,9 @@ export class LogInComponent implements OnInit {
    */
   getOrderedAuthMethods(authMethods: AuthMethod[] | null): AuthMethod[] {
     if (hasValue(authMethods)) {
-      return [...authMethods].sort((method1: AuthMethod, method2: AuthMethod) => method1.position - method2.position);
+      return [...authMethods]
+        .filter((authMethod: AuthMethod) => rendersAuthMethodType(authMethod.authMethodType) !== undefined)
+        .sort((method1: AuthMethod, method2: AuthMethod) => method1.position - method2.position);
     } else {
       return [];
     }

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
@@ -1,6 +1,7 @@
+import { Component, Type } from '@angular/core';
 import { AuthMethodType } from '../../../core/auth/models/auth.method-type';
 
-const authMethodsMap = new Map();
+const authMethodsMap: Map<AuthMethodType, Type<Component>> = new Map();
 
 export function renderAuthMethodFor(authMethodType: AuthMethodType) {
   return function decorator(objectElement: any) {
@@ -11,6 +12,6 @@ export function renderAuthMethodFor(authMethodType: AuthMethodType) {
   };
 }
 
-export function rendersAuthMethodType(authMethodType: AuthMethodType) {
+export function rendersAuthMethodType(authMethodType: AuthMethodType): Type<Component> | undefined {
   return authMethodsMap.get(authMethodType);
 }