fix(igx-ts): update auth template

Hristo313 · Hristo313 · commit 92110a6539c6 · 2026-03-24T16:36:48.000+02:00
diff --git a/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/providers/base-oidc-provider.ts b/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/providers/base-oidc-provider.ts
@@ -1,22 +1,23 @@
 import { OidcSecurityService } from 'angular-auth-oidc-client';
 import { firstValueFrom } from 'rxjs';
 import { ExternalLogin } from '../models/login';
+import { ExternalAuthConfig } from '../services/external-auth-configs';
 import { AuthProvider } from './auth-provider';
 
 /** Base provider for OpenID Connect (OIDC) https://openid.net/connect/ */
 export abstract class BaseOidcProvider implements AuthProvider {
   constructor(
     protected oidcSecurityService: OidcSecurityService,
-    protected configId: string) { }
+    protected externalStsConfig: ExternalAuthConfig) { }
 
   public login() {
-    this.oidcSecurityService.authorize(this.configId);
+    this.oidcSecurityService.authorize(this.externalStsConfig.configId);
   }
 
   public async getUserInfo(): Promise<ExternalLogin> {
     const result = await firstValueFrom(this.oidcSecurityService.userData$);
     const configData = result.allUserData?.find(
-      d => d.configId === this.configId
+      d => d.configId === this.externalStsConfig.configId
     );
     if (configData?.userData) {
       return this.formatUserData(configData.userData);
@@ -25,7 +26,7 @@ export abstract class BaseOidcProvider implements AuthProvider {
   }
 
   public logout() {
-    this.oidcSecurityService.logoff(this.configId);
+    this.oidcSecurityService.logoff(this.externalStsConfig.configId);
   }
 
   /** Format received user data per provider claims */
diff --git a/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/providers/google-provider.ts b/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/providers/google-provider.ts
@@ -9,7 +9,7 @@ export class GoogleProvider extends BaseOidcProvider {
    * https://developers.google.com/+/web/api/rest/openidconnect/getOpenIdConnect
    */
   protected async formatUserData(userData: { [key: string]: any; }): Promise<ExternalLogin> {
-    const token = await firstValueFrom(this.oidcSecurityService.getAccessToken(this.configId));
+    const token = await firstValueFrom(this.oidcSecurityService.getAccessToken(this.externalStsConfig.configId));
     return {
       id: userData['sub'],
       name: userData['name'],
diff --git a/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/providers/microsoft-provider.ts b/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/providers/microsoft-provider.ts
@@ -10,7 +10,7 @@ export class MicrosoftProvider extends BaseOidcProvider {
    * https://docs.microsoft.com/en-us/azure/active-directory/develop/id-tokens#payload-claims
    */
   protected async formatUserData(userData: { [key: string]: any; }): Promise<ExternalLogin> {
-    const token = await firstValueFrom(this.oidcSecurityService.getAccessToken(this.configId));
+    const token = await firstValueFrom(this.oidcSecurityService.getAccessToken(this.externalStsConfig.configId));
     return {
       id: userData['oid'],
       name: userData['name'],
diff --git a/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/providers/providers.spec.ts b/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/providers/providers.spec.ts
@@ -130,19 +130,19 @@ describe('Providers', () => {
   describe('Google Provider', () => {
 
     it('Should properly initialize', () => {
-      const provider = new GoogleProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG.configId);
+      const provider = new GoogleProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG);
       expect(provider).toBeDefined();
     });
 
     it('Should properly call login', () => {
-      const provider = new GoogleProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG.configId);
+      const provider = new GoogleProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG);
       vi.spyOn(MOCK_OIDC_SECURITY, 'authorize');
       provider.login();
       expect(MOCK_OIDC_SECURITY.authorize).toHaveBeenCalledWith(MOCK_EXTERNAL_AUTH_CONFIG.configId);
     });
 
     it(`Should properly call 'formatUserData'`, async () => {
-      const provider = new GoogleProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG.configId);
+      const provider = new GoogleProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG);
       const mockObj = {
         sub: 'test-id',
         name: 'test-name',
@@ -165,7 +165,7 @@ describe('Providers', () => {
     });
 
     it('Should properly call getUserInfo', async () => {
-      const provider = new GoogleProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG.configId);
+      const provider = new GoogleProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG);
       const mockUserData = { sub: 'test-id', name: 'test-name', email: 'test@example.com' };
       MOCK_OIDC_SECURITY.userData$ = of({
         allUserData: [{ configId: MOCK_EXTERNAL_AUTH_CONFIG.configId, userData: mockUserData }]
@@ -177,7 +177,7 @@ describe('Providers', () => {
     });
 
     it('Should properly call logout', () => {
-      const provider = new GoogleProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG.configId);
+      const provider = new GoogleProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG);
       vi.spyOn(MOCK_OIDC_SECURITY, 'logoff');
       provider.logout();
       expect(MOCK_OIDC_SECURITY.logoff).toHaveBeenCalledWith(MOCK_EXTERNAL_AUTH_CONFIG.configId);
@@ -187,19 +187,19 @@ describe('Providers', () => {
   describe('Microsoft Provider', () => {
 
     it('Should properly initialize', () => {
-      const provider = new MicrosoftProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG.configId);
+      const provider = new MicrosoftProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG);
       expect(provider).toBeDefined();
     });
 
     it('Should properly call login', () => {
-      const provider = new MicrosoftProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG.configId);
+      const provider = new MicrosoftProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG);
       vi.spyOn(MOCK_OIDC_SECURITY, 'authorize');
       provider.login();
       expect(MOCK_OIDC_SECURITY.authorize).toHaveBeenCalledWith(MOCK_EXTERNAL_AUTH_CONFIG.configId);
     });
 
     it('Should properly call getUserInfo', async () => {
-      const provider = new MicrosoftProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG.configId);
+      const provider = new MicrosoftProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG);
       const mockUserData = { oid: 'test-id', name: 'test-name', email: 'test@example.com' };
       MOCK_OIDC_SECURITY.userData$ = of({
         allUserData: [{ configId: MOCK_EXTERNAL_AUTH_CONFIG.configId, userData: mockUserData }]
@@ -211,7 +211,7 @@ describe('Providers', () => {
     });
 
     it(`Should properly call 'formatUserData'`, async () => {
-      const provider = new MicrosoftProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG.configId);
+      const provider = new MicrosoftProvider(MOCK_OIDC_SECURITY, MOCK_EXTERNAL_AUTH_CONFIG);
       const mockObj = {
         oid: 'test-id',
         name: 'test-name',
diff --git a/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/services/external-auth-configs.ts b/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/services/external-auth-configs.ts
@@ -4,8 +4,16 @@ export enum ExternalAuthProvider {
   Microsoft = 'Microsoft'
 }
 
-/** Configuration for Facebook-based external authentication. */
 export interface ExternalAuthConfig {
+  configId?: string;
+  stsServer: string;
   client_id: string;
+  scope: string;
+  provider: ExternalAuthProvider;
   redirect_url: string;
+  response_type: string;
+  post_logout_redirect_uri: string;
+  post_login_route: string;
+  auto_userinfo: boolean;
+  max_id_token_iat_offset_allowed_in_seconds: number;
 }
diff --git a/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/services/external-auth.ts b/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/services/external-auth.ts
@@ -43,17 +43,31 @@ export class ExternalAuth {
   }
 
   public addGoogle(clientID: string) {
+    const googleConfig: ExternalAuthConfig = {
+      configId: ExternalAuthProvider.Google,
+      provider: ExternalAuthProvider.Google,
+      stsServer: 'https://accounts.google.com',
+      client_id: clientID,
+      scope: 'openid email profile',
+      redirect_url: this.getAbsoluteUrl(ExternalAuthRedirectUrl.Google),
+      response_type: 'id_token token',
+      post_logout_redirect_uri: '/',
+      post_login_route: 'redirect',
+      auto_userinfo: false,
+      max_id_token_iat_offset_allowed_in_seconds: 30
+    };
+
     this.providers.set(
       ExternalAuthProvider.Google,
-      new GoogleProvider(this.oidcSecurityService, clientID)
+      new GoogleProvider(this.oidcSecurityService, googleConfig)
     );
   }
 
   public addFacebook(clientID: string) {
     const fbConfig: ExternalAuthConfig = {
       client_id: clientID,
       redirect_url: ExternalAuthRedirectUrl.Facebook
-    };
+    } as ExternalAuthConfig;
 
     this.providers.set(
       ExternalAuthProvider.Facebook,
@@ -62,9 +76,23 @@ export class ExternalAuth {
   }
 
   public addMicrosoft(clientID: string) {
+    const msConfig: ExternalAuthConfig = {
+      configId: ExternalAuthProvider.Microsoft,
+      provider: ExternalAuthProvider.Microsoft,
+      stsServer: 'https://login.microsoftonline.com/consumers/v2.0/',
+      client_id: clientID,
+      scope: 'openid email profile',
+      redirect_url: this.getAbsoluteUrl(ExternalAuthRedirectUrl.Microsoft),
+      response_type: 'id_token token',
+      post_logout_redirect_uri: '/',
+      post_login_route: '',
+      auto_userinfo: false,
+      max_id_token_iat_offset_allowed_in_seconds: 1000
+    };
+
     this.providers.set(
       ExternalAuthProvider.Microsoft,
-      new MicrosoftProvider(this.oidcSecurityService, clientID)
+      new MicrosoftProvider(this.oidcSecurityService, msConfig)
     );
   }
 
diff --git a/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/services/services.spec.ts b/packages/igx-templates/igx-ts/projects/side-nav-auth/files/src/app/authentication/services/services.spec.ts
@@ -109,10 +109,25 @@ describe('Services', () => {
 
     it(`Should properly call 'addGoogle'`, () => {
       const providersSpy = vi.spyOn((extAuthServ as any).providers, 'set');
+      const getAbsoluteUrlSpy = vi.spyOn(extAuthServ as any, 'getAbsoluteUrl').mockReturnValue('testUrl');
+      const configParams = {
+        configId: ExternalAuthProvider.Google,
+        provider: ExternalAuthProvider.Google,
+        stsServer: 'https://accounts.google.com',
+        client_id: 'test',
+        scope: 'openid email profile',
+        redirect_url: 'testUrl',
+        response_type: 'id_token token',
+        post_logout_redirect_uri: '/',
+        post_login_route: 'redirect',
+        auto_userinfo: false,
+        max_id_token_iat_offset_allowed_in_seconds: 30
+      };
       extAuthServ.addGoogle('test');
       expect(providersSpy).toHaveBeenCalled();
       expect(providersSpy).toHaveBeenCalledWith('Google',
-        new GoogleProvider(MOCK_OIDC_SECURITY, ExternalAuthProvider.Google));
+        new GoogleProvider(MOCK_OIDC_SECURITY, configParams));
+      expect(getAbsoluteUrlSpy).toHaveBeenCalled();
     });
 
     it(`Should properly call 'addFacebook'`, () => {
@@ -129,10 +144,25 @@ describe('Services', () => {
 
     it(`Should properly call 'addMicrosoft'`, () => {
       const providersSpy = vi.spyOn((extAuthServ as any).providers, 'set');
+      const getAbsoluteUrlSpy = vi.spyOn(extAuthServ as any, 'getAbsoluteUrl').mockReturnValue('testUrl');
+      const configParams = {
+        configId: ExternalAuthProvider.Microsoft,
+        provider: ExternalAuthProvider.Microsoft,
+        stsServer: 'https://login.microsoftonline.com/consumers/v2.0/',
+        client_id: 'test',
+        scope: 'openid email profile',
+        redirect_url: 'testUrl',
+        response_type: 'id_token token',
+        post_logout_redirect_uri: '/',
+        post_login_route: '',
+        auto_userinfo: false,
+        max_id_token_iat_offset_allowed_in_seconds: 1000
+      } as any;
       extAuthServ.addMicrosoft('test');
       expect(providersSpy).toHaveBeenCalled();
       expect(providersSpy).toHaveBeenCalledWith('Microsoft',
-        new MicrosoftProvider(MOCK_OIDC_SECURITY, ExternalAuthProvider.Microsoft));
+        new MicrosoftProvider(MOCK_OIDC_SECURITY, configParams));
+      expect(getAbsoluteUrlSpy).toHaveBeenCalled();
     });
 
     it(`Should properly call 'getUserInfo'`, async () => {
