RED-4718: use auth module from common-ui

apps/red-ui/src/app/app-routing.module.ts

@@ -1,6 +1,5 @@
 import { AuthErrorComponent } from '@components/auth-error/auth-error.component';
-import { AuthGuard } from './modules/auth/auth.guard';
-import { CompositeRouteGuard, CustomRouteReuseStrategy } from '@iqser/common-ui';
+import { AuthGuard, CompositeRouteGuard, CustomRouteReuseStrategy } from '@iqser/common-ui';
 import { RedRoleGuard } from './modules/auth/red-role.guard';
 import { BaseScreenComponent } from '@components/base-screen/base-screen.component';
 import { RouteReuseStrategy, RouterModule, Routes } from '@angular/router';

apps/red-ui/src/app/app.module.ts

@@ -8,8 +8,8 @@ import { BaseScreenComponent } from '@components/base-screen/base-screen.compone
 import { ApiPathInterceptor } from '@utils/api-path-interceptor';
 import { MissingTranslationHandler, TranslateCompiler, TranslateLoader, TranslateModule } from '@ngx-translate/core';
 import {
+    AuthModule as IqserAuthModule,
     BASE_HREF,
-    BaseUserService,
     CachingModule,
     CommonUiModule,
     HELP_DOCS,
@@ -59,7 +59,7 @@ import { PdfViewerModule } from './modules/pdf-viewer/pdf-viewer.module';
 import { LicenseService } from '@services/license.service';
 import { TenantIdInterceptor } from '@utils/tenant-id-interceptor';
 import { UI_CACHES } from '@utils/constants';
-import { AuthModule } from './modules/auth/auth.module';
+import { RedRoleGuard } from './modules/auth/red-role.guard';
 
 export function httpLoaderFactory(httpClient: HttpClient, configService: ConfigService): PruningTranslationLoader {
     return new PruningTranslationLoader(httpClient, '/assets/i18n/', `.json?version=${configService.values.FRONTEND_APP_VERSION}`);
@@ -86,11 +86,10 @@ export const appModuleFactory = (config: AppConfig) => {
                 configService: ConfigService,
                 configServiceFactory: () => new ConfigService(config),
             }),
-            AuthModule,
-            // AuthModule.forRoot({
-            //     existingUserService: UserService,
-            //     existingRoleGuard: RedRoleGuard,
-            // }),
+            IqserAuthModule.forRoot({
+                existingUserService: UserService,
+                existingRoleGuard: RedRoleGuard,
+            }),
             CachingModule.forRoot(UI_CACHES),
             PdfViewerModule,
             ToastrModule.forRoot({
@@ -160,10 +159,6 @@ export const appModuleFactory = (config: AppConfig) => {
                 provide: ErrorHandler,
                 useClass: GlobalErrorHandler,
             },
-            {
-                provide: BaseUserService,
-                useExisting: UserService,
-            },
             {
                 provide: HTTP_INTERCEPTORS,
                 multi: true,

apps/red-ui/src/app/modules/account/account-routing.module.ts

@@ -1,7 +1,6 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
-import { CompositeRouteGuard } from '@iqser/common-ui';
-import { AuthGuard } from '../auth/auth.guard';
+import { AuthGuard, CompositeRouteGuard } from '@iqser/common-ui';
 import { RedRoleGuard } from '../auth/red-role.guard';
 import { BaseAccountScreenComponent } from './base-account-screen/base-account-screen-component';
 

apps/red-ui/src/app/modules/admin/admin-routing.module.ts

@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core';
-import { AuthGuard } from '../auth/auth.guard';
-import { CompositeRouteGuard } from '@iqser/common-ui';
+import { AuthGuard, CompositeRouteGuard } from '@iqser/common-ui';
 import { RedRoleGuard } from '../auth/red-role.guard';
 import { EntitiesListingScreenComponent } from './screens/entities-listing/entities-listing-screen.component';
 import { PendingChangesGuard } from '@guards/can-deactivate.guard';

apps/red-ui/src/app/modules/admin/screens/watermark/watermark.module.ts

@@ -4,8 +4,7 @@ import { RouterModule } from '@angular/router';
 import { SharedModule } from '@shared/shared.module';
 import { WatermarkScreenComponent } from './watermark-screen/watermark-screen.component';
 import { WatermarksListingScreenComponent } from './watermarks-listing/watermarks-listing-screen.component';
-import { CompositeRouteGuard } from '@iqser/common-ui';
-import { AuthGuard } from '../../../auth/auth.guard';
+import { AuthGuard, CompositeRouteGuard } from '@iqser/common-ui';
 import { RedRoleGuard } from '../../../auth/red-role.guard';
 import { WATERMARK_ID } from '@red/domain';
 import { WatermarkExistsGuard } from '@guards/watermark-exists.guard';

apps/red-ui/src/app/modules/auth/auth.guard.ts

@@ -1,33 +0,0 @@
-import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, Router } from '@angular/router';
-import { KeycloakAuthGuard, KeycloakService } from 'keycloak-angular';
-import { UserService } from '@services/user.service';
-import { ConfigService } from '@services/config.service';
-
-@Injectable({
-    providedIn: 'root',
-})
-export class AuthGuard extends KeycloakAuthGuard {
-    constructor(
-        protected readonly _router: Router,
-        private readonly _userService: UserService,
-        protected readonly _keycloak: KeycloakService,
-        private readonly _configService: ConfigService,
-    ) {
-        super(_router, _keycloak);
-    }
-
-    async isAccessAllowed(route: ActivatedRouteSnapshot): Promise<boolean> {
-        if (!this.authenticated) {
-            const kcIdpHint = route.queryParamMap.get('kc_idp_hint');
-            await this._keycloak.login({
-                idpHint: kcIdpHint ?? this._configService.values.OAUTH_IDP_HINT,
-                redirectUri: window.location.href,
-            });
-            return false;
-        }
-
-        await this._userService.loadCurrentUser();
-        return true;
-    }
-}

apps/red-ui/src/app/modules/auth/auth.module.ts

@@ -1,55 +0,0 @@
-import { APP_INITIALIZER, NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { HttpClientModule } from '@angular/common/http';
-
-import { KeycloakAngularModule, KeycloakOptions, KeycloakService } from 'keycloak-angular';
-import { ConfigService } from '@services/config.service';
-import { BASE_HREF } from '@iqser/common-ui';
-
-function getKeycloakOptions(configService: ConfigService, baseUrl: string) {
-    let url: string = configService.values.OAUTH_URL;
-    url = url.replace(/\/$/, ''); // remove trailing slash
-    const realm = url.substring(url.lastIndexOf('/') + 1, url.length);
-    url = url.substr(0, url.lastIndexOf('/realms'));
-    const options: KeycloakOptions = {
-        config: {
-            url: url,
-            realm: realm,
-            clientId: configService.values.OAUTH_CLIENT_ID,
-        },
-        initOptions: {
-            checkLoginIframe: false,
-            onLoad: 'check-sso',
-            silentCheckSsoRedirectUri: window.location.origin + baseUrl + '/assets/oauth/silent-refresh.html',
-            flow: 'standard',
-        },
-        enableBearerInterceptor: true,
-    };
-    return options;
-}
-
-function configureAutomaticRedirectToLoginScreen(keyCloakService: KeycloakService) {
-    keyCloakService.getKeycloakInstance().onAuthRefreshError = async () => {
-        await keyCloakService.logout();
-    };
-}
-
-export function keycloakInitializer(keycloakService: KeycloakService, configService: ConfigService, baseUrl: string): () => Promise<void> {
-    return () =>
-        keycloakService
-            .init(getKeycloakOptions(configService, baseUrl))
-            .then(() => configureAutomaticRedirectToLoginScreen(keycloakService));
-}
-
-@NgModule({
-    imports: [CommonModule, HttpClientModule, KeycloakAngularModule],
-    providers: [
-        {
-            provide: APP_INITIALIZER,
-            useFactory: keycloakInitializer,
-            multi: true,
-            deps: [KeycloakService, ConfigService, BASE_HREF],
-        },
-    ],
-})
-export class AuthModule {}

libs/common-ui

@@ -1 +1 @@
-Subproject commit 34b7ebcef7aeb4d5dd4f475d1cc4ff19a78d729c
+Subproject commit 3906421aa0532346d55024d747ca54c3df025e48

package.json

@@ -45,8 +45,8 @@
     "dayjs": "^1.11.3",
     "file-saver": "^2.0.5",
     "jwt-decode": "^3.1.2",
-    "keycloak-angular": "10.0.0",
-    "keycloak-js": "18.0.0",
+    "keycloak-angular": "10.0.2",
+    "keycloak-js": "18.0.1",
     "lodash-es": "^4.17.21",
     "messageformat": "^2.3.0",
     "monaco-editor": "^0.33.0",

yarn.lock

@@ -6577,17 +6577,17 @@ karma-source-map-support@1.4.0:
   dependencies:
     source-map-support "^0.5.5"
 
-keycloak-angular@10.0.0:
-  version "10.0.0"
-  resolved "https://registry.yarnpkg.com/keycloak-angular/-/keycloak-angular-10.0.0.tgz#a8534d69d4846965607d0401f3eb546fad816eb9"
-  integrity sha512-zDvSYZZLJrOrlbHDexe6EI8irCsRA8oklJvWQK9uyJMGYvBwqlCIDv5L4PhuyuNrlTZ/v7F0hDncBy0LfLx1zQ==
+keycloak-angular@10.0.2:
+  version "10.0.2"
+  resolved "https://registry.yarnpkg.com/keycloak-angular/-/keycloak-angular-10.0.2.tgz#79fc4c68591b130cb59e366bb6a7631ad5b5d17b"
+  integrity sha512-gPYW/0jeLeMDG4X03mzeAqvpG8xcRk3Q7pwlfqp+q2PZddIPLjB0tXODtorC5DghARsv3OmClRLUS5KF/mSrgA==
   dependencies:
     tslib "^2.3.0"
 
-keycloak-js@18.0.0:
-  version "18.0.0"
-  resolved "https://registry.yarnpkg.com/keycloak-js/-/keycloak-js-18.0.0.tgz#0825d3e2818aacf9e13cdd41f7eeae6c6114db38"
-  integrity sha512-kaD6nrzgYX3NhgwQfVEZiAzaZXua3PSBIBWGWf8fgqPgUdiO8uvYaKV1Ebf43IAB5M8kvubW+2J+eBS+UnWsuw==
+keycloak-js@18.0.1:
+  version "18.0.1"
+  resolved "https://registry.yarnpkg.com/keycloak-js/-/keycloak-js-18.0.1.tgz#0c6dedfa8bbb266bac1b16a14b032d65c6afd2d2"
+  integrity sha512-IRXToYpbIrkyfLeNNJly2OjUCf11ncx2Sdsg257NVDwjOYE923osu47w8pfxEVWpTaS14/Y2QjbTHciuBK0RBQ==
   dependencies:
     base64-js "^1.5.1"
     js-sha256 "^0.9.0"