@bcweed/authentication-lib 0.0.0

package/projects/authentication-lib/src/lib/auth.service.ts

@@ -0,0 +1,213 @@
+import { Injectable, Inject, PLATFORM_ID } from '@angular/core';
+import { isPlatformBrowser } from '@angular/common';
+import { OAuthService, OAuthErrorEvent, OAuthEvent, AuthConfig } from 'angular-oauth2-oidc';
+import { JwksValidationHandler } from 'angular-oauth2-oidc-jwks';
+import { Router } from '@angular/router';
+import { BehaviorSubject, combineLatest, map, Observable, ReplaySubject, Subject } from 'rxjs';
+import { AUTHENTICATION_LIB_CONFIG } from './authentication-lib.tokens';
+//import { authConfig } from './auth.config';
+export interface UserProfile {
+  sub: string;
+  name?: string;
+  email?: string;
+  preferred_username?: string;
+  given_name?: string;
+  family_name?: string;
+  fax?: string;
+  address?: string;
+  address2?: string;
+  city?: string;
+  region?: string;
+  country?: string;
+  phone_number?: string;
+  postal_code?: string;
+  [key: string]: any;
+}
+
+@Injectable({ providedIn: 'root' })
+export class AuthService {
+  constructor(@Inject(AUTHENTICATION_LIB_CONFIG) private readonly authConfig: AuthConfig,
+    private oauthService: OAuthService,
+    private router: Router,
+    @Inject(PLATFORM_ID) private platformId: object) {
+    if (isPlatformBrowser(this.platformId)) {
+      this.oauthService.configure(authConfig);
+      this.oauthService.tokenValidationHandler = new JwksValidationHandler();  // Auto-handles redirect back
+
+      this.oauthService.events
+        .subscribe(_ => {
+          this.isAuthenticatedSubject$.next(this.oauthService.hasValidAccessToken());
+        });
+      this.oauthService.events.subscribe(e => this.handleOAuthEvent(e));
+
+      this.oauthService.setupAutomaticSilentRefresh();   }
+    
+  }
+  private readonly profile$ = new BehaviorSubject<UserProfile | null>(null);
+  private profileLoading = false;
+  private profileIsLoaded = false;
+  private isAuthenticatedSubject$ = new BehaviorSubject<boolean>(false);
+  public isAuthenticated$ = this.isAuthenticatedSubject$.asObservable();
+
+  private isDoneLoadingSubject$ = new ReplaySubject<boolean>();
+  public isDoneLoading$ = this.isDoneLoadingSubject$.asObservable();
+
+  private eventsSubject$ = new Subject<OAuthEvent>;
+  public events$ = this.eventsSubject$.asObservable();
+  /**
+   * Publishes `true` if and only if (a) all the asynchronous initial
+   * login calls have completed or errored, and (b) the user ended up
+   * being authenticated.
+   *
+   * In essence, it combines:
+   *
+   * - the latest known state of whether the user is authorized
+   * - whether the ajax calls for initial log in have all been done
+   */
+  public isLoggedIn$: Observable<boolean> = combineLatest([
+    this.isAuthenticated$,
+    this.isDoneLoading$
+  ]).pipe(map(values => values.every(b => b)));
+
+  public runInitialLoginSequence(): Promise<void> {
+    return this.oauthService.loadDiscoveryDocument()
+      .then(() => this.oauthService.tryLoginCodeFlow())
+      .then(() => {
+        this.isDoneLoadingSubject$.next(true);
+        // remove query params
+        //this.router.navigate(['']);
+      })
+      .catch(() => this.isDoneLoadingSubject$.next(true));
+  }
+
+  public login(returnUrl: string): void {
+    // Triggers redirect to IdP with PKCE code challenge
+    this.oauthService.initCodeFlow(returnUrl);        // Authorization Code + PKCE
+  }
+
+  logout(): void {
+    this.oauthService.logOut();              // Optionally also call revocation endpoint
+  }
+  revokeTokenAndLogout(): void {
+    this.oauthService.revokeTokenAndLogout({
+      idTokenHint: this.oauthService.getIdToken(),
+      client_id: this.authConfig.clientId,
+      returnTo: this.authConfig.postLogoutRedirectUri
+    }, true);          // Optionally also call revocation endpoint
+  }
+
+  public state(): string | undefined {
+    return this.oauthService.state;
+  }
+  public hasRole(role: string) {
+    let claims: any = this.oauthService.getIdentityClaims();
+    if (claims && claims.role) {
+      let roles: string[] = claims.role;
+      roles = roles.map(role => role.toUpperCase());
+      return roles.includes(role.toLocaleUpperCase());
+    }
+    return false;
+  }
+  public refresh() {
+    this.oauthService.silentRefresh();
+  }
+
+  public hasValidToken() {
+    return this.oauthService.hasValidAccessToken();
+  }
+
+  public getFullname() {
+    let claims: any = this.oauthService.getIdentityClaims();
+    if (claims && claims.name) {
+      return claims.name;
+    }
+    return undefined;
+  }
+  get accessToken(): string {
+    return this.oauthService.getAccessToken();
+  } 
+
+  get identityClaims(): any {
+    return this.oauthService.getIdentityClaims();
+  }
+
+  get isLoggedIn(): boolean {
+    return !!this.accessToken;
+  }
+
+  get userProfile$() {
+    return this.profile$.asObservable();
+  }
+
+  /** Synchronous getter */
+  get snapshot(): UserProfile | null {
+    return this.profile$.value;
+  }
+
+  /** Clears profile on logout */
+  clearProfile() {
+    this.profile$.next(null);
+    this.profileIsLoaded = false;
+  }
+
+  /** Loads user profile from userinfo endpoint */
+  async loadProfile(): Promise<void> {
+    if (this.profileIsLoaded) return;
+    if (this.profileLoading) return;
+    if (!this.oauthService.hasValidAccessToken()) return;
+
+    this.profileLoading = true;
+
+    try {
+      const profile: any = await this.oauthService.loadUserProfile();
+      const info = profile?.info ?? null;
+      this.profile$.next(info);
+      this.profileIsLoaded = true;
+
+    } catch (err) {
+      console.warn('User profile load failed:', err);
+      // swallow error — do not let Angular ErrorHandler see it
+    } finally {
+      this.profileLoading = false;
+    }
+  }
+
+  /** Handles OAuth events */
+  private handleOAuthEvent(e: OAuthEvent) {
+    this.eventsSubject$.next(e);
+    switch (e.type) {
+      case 'token_received':
+        this.loadProfile();
+        break;
+
+      case 'discovery_document_loaded':
+        if (this.oauthService.hasValidAccessToken()) {
+          this.loadProfile();
+        }
+        break;
+      case 'user_profile_loaded':
+        // Some IdPs trigger this event automatically
+        // this.loadProfile();
+        break;
+
+      case 'logout':
+      case 'session_terminated':
+      case 'session_error':
+        this.clearProfile();
+        break;
+
+      case 'silent_refresh_error':
+      case 'silent_refresh_timeout':
+        console.log(e);
+        throw new Error(e.type);
+        break;
+
+      default:
+        // Swallow OAuth errors before Angular sees them
+        if (e instanceof OAuthErrorEvent) {
+          console.warn('OAuth error intercepted:', e);
+        }
+        break;
+    }
+  }
+}

package/projects/authentication-lib/src/lib/authentication-error/authentication-error.component.html

@@ -0,0 +1,7 @@
+<p>authentication-error works!</p>
+
+<button [routerLink]="['/auth/login']" [queryParams]="{ returnUrl: routeParams$ | async }">Retry Login</button>
+<br />
+<button [routerLink]="['/home']">Go Home</button>
+@if (routeParams$ | async) {
+}

package/projects/authentication-lib/src/lib/authentication-error/authentication-error.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AuthenticationErrorComponent } from './authentication-error.component';
+
+describe('AuthenticationErrorComponent', () => {
+  let component: AuthenticationErrorComponent;
+  let fixture: ComponentFixture<AuthenticationErrorComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [AuthenticationErrorComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(AuthenticationErrorComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/projects/authentication-lib/src/lib/authentication-error/authentication-error.component.ts

@@ -0,0 +1,32 @@
+import { CommonModule } from '@angular/common';
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, RouterModule } from '@angular/router';
+import { Observable } from 'rxjs';
+import { map, tap } from 'rxjs/operators';
+
+@Component({
+  selector: 'app-authentication-error',
+  imports: [CommonModule,RouterModule],
+  standalone: true,
+  templateUrl: './authentication-error.component.html',
+  styleUrl: './authentication-error.component.scss'
+})
+export class AuthenticationErrorComponent implements OnInit {
+  constructor(private activatedRoute: ActivatedRoute) { }
+  routeParams$: Observable<any> | undefined;
+  returnUrl: string | undefined;
+  ngOnInit(): void {
+
+    this.routeParams$ = this.activatedRoute.queryParams.pipe(
+      map(params => {
+        if (params['returnUrl']) {
+
+          return params['returnUrl'];
+        }
+        else {
+          return '/';
+        }
+      })
+    );
+  }
+}

package/projects/authentication-lib/src/lib/authentication-lib.module.ts

@@ -0,0 +1,26 @@
+import { NgModule, ModuleWithProviders, APP_INITIALIZER } from '@angular/core';
+import { AuthConfig } from 'angular-oauth2-oidc';
+import { AUTHENTICATION_LIB_CONFIG } from './authentication-lib.tokens';
+import { CommonModule } from '@angular/common';
+import { RouterModule } from '@angular/router';
+import { RouteHistoryService } from './route-history.service';
+
+@NgModule({
+  declarations: [],
+  imports: [
+    CommonModule,
+    RouterModule
+  ],
+  exports: [],
+  providers: [
+    {
+      provide: APP_INITIALIZER,
+      useFactory: (history: RouteHistoryService) => () => history.init(),
+      deps: [RouteHistoryService],
+      multi: true
+    },
+
+  ]
+})
+export class AuthenticationLibModule {
+}

package/projects/authentication-lib/src/lib/authentication-lib.tokens.ts

@@ -0,0 +1,4 @@
+import { InjectionToken } from '@angular/core';
+import { AuthConfig } from 'angular-oauth2-oidc';
+
+export const AUTHENTICATION_LIB_CONFIG = new InjectionToken<AuthConfig>('AUTHENTICATION_LIB_CONFIG');

package/projects/authentication-lib/src/lib/login/login.component.html

@@ -0,0 +1 @@
+<p>Redirecting!!!!</p>

package/projects/authentication-lib/src/lib/login/login.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LoginComponent } from './login.component';
+
+describe('LoginComponent', () => {
+  let component: LoginComponent;
+  let fixture: ComponentFixture<LoginComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [LoginComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(LoginComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/projects/authentication-lib/src/lib/login/login.component.ts

@@ -0,0 +1,28 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { AuthService } from '../auth.service';
+import { RouteHistoryService } from '../route-history.service';
+import { Injectable, Inject, PLATFORM_ID } from '@angular/core';
+import { isPlatformBrowser } from '@angular/common';
+
+@Component({
+  selector: 'app-login',
+  standalone: true,
+  imports: [],
+  templateUrl: './login.component.html',
+  styleUrl: './login.component.scss'
+})
+export class LoginComponent implements OnInit {
+
+  constructor(private activatedRoute: ActivatedRoute, private routeHistoryService: RouteHistoryService, private authService: AuthService,
+    @Inject(PLATFORM_ID) private platformId: object) { }
+  ngOnInit() {
+    debugger;
+    if (isPlatformBrowser(this.platformId)) {
+      const rt = this.activatedRoute;
+      const returnUrl = rt.snapshot.queryParams['returnUrl'] || this.routeHistoryService.getPreviousUrl() || '/';
+      this.authService.login(returnUrl);
+   }
+   }
+ 
+}

package/projects/authentication-lib/src/lib/login-menu/login-menu.component.html

@@ -0,0 +1,39 @@
+@if ((isAuthenticated$ | async) === true) {
+  <ul role="menu" [ngClass]="[isSmallMedia ? 'p-menubar-root-list-end-small' : 'p-menubar-root-list']">
+    <li role="menuitem" ptooltip="" class="p-element p-menubar-item">
+      <div class="p-menubar-item-content">
+        <a class="p-ripple p-element p-menubar-item-link" [routerLink]='["/auth/logout", ]' [state]='{ local: true }'>
+          <span class="p-menubar-item-icon pi pi-sign-out"></span>
+          <span class="p-menubar-item-label">Logout</span>
+        </a>
+      </div>
+    </li>
+    <li role="menuitem" ptooltip="" class="p-element p-menubar-item">
+      <div class="p-menubar-item-content">
+        <a class="p-ripple p-element p-menubar-item-link" [routerLink]='["/authentication/profile"]'>
+          <span class="p-menubar-item-icon pi pi-user"></span>
+          <span class="p-menubar-item-label">{{ (profile$ | async)?.given_name}} {{ (profile$ | async)?.family_name}}</span>
+        </a>
+      </div>
+    </li>
+  </ul>
+}
+@if ((isAuthenticated$ | async) !== true) {
+  <ul role="menu" [ngClass]="[isSmallMedia ? 'p-menubar-root-list-end-small' : 'p-menubar-root-list']">
+    <!--<li role="menuitem" ptooltip="" class="p-element p-menuitem">
+    <div class="p-menubar-item-content">
+      <a pripple="" class="p-ripple p-element p-menubar-item-link" [routerLink]='["/authentication/register"]'>
+        <span class="p-menubar-item-label">Register</span>
+      </a>
+    </div>
+  </li>-->
+  <li role="menuitem" ptooltip="" class="p-element p-menubar-item">
+    <div class="p-menubar-item-content">
+      <a pripple="" class="p-ripple p-element p-menubar-item-link" [routerLink]='["/auth/login"]'>
+        <span class="p-menubar-item-icon pi pi-sign-in"></span>
+        <span class="p-menubar-item-label">Login</span>
+      </a>
+    </div>
+  </li>
+</ul>
+}

package/projects/authentication-lib/src/lib/login-menu/login-menu.component.scss

@@ -0,0 +1,7 @@
+.p-menubar-item {
+  display: inline-block!important;
+}
+ 
+.p-menubar-root-list-end-small{
+
+}

package/projects/authentication-lib/src/lib/login-menu/login-menu.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LoginMenuComponent } from './login-menu.component';
+
+describe('LoginMenuComponent', () => {
+  let component: LoginMenuComponent;
+  let fixture: ComponentFixture<LoginMenuComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [LoginMenuComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(LoginMenuComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/projects/authentication-lib/src/lib/login-menu/login-menu.component.ts

@@ -0,0 +1,51 @@
+import { Component } from '@angular/core';
+import { from, Observable } from 'rxjs';
+import { CommonModule } from '@angular/common';
+import {RouterModule } from '@angular/router';
+import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
+import { MenuItem } from 'primeng/api';
+import { AuthService, UserProfile } from '../auth.service';
+
+@Component({
+  selector: 'app-login-menu',
+  standalone: true,
+  imports: [CommonModule, RouterModule], // Add them to the imports array
+  templateUrl: './login-menu.component.html',
+  styleUrl: './login-menu.component.scss'
+})
+export class LoginMenuComponent {
+
+  isExpanded = false;
+  isSmallMedia = false;
+  userRoles: string[] = [];
+  items: MenuItem[] | undefined;
+  public isAuthenticated?: boolean;
+  profile$: Observable<UserProfile | null>;
+  isAuthenticated$: Observable<boolean | null> | undefined;
+  constructor(private responsive: BreakpointObserver, private authService: AuthService) {
+    this.profile$ = this.authService.userProfile$;
+    this.isAuthenticated$ = this.authService.isAuthenticated$;
+  }
+  ngOnInit() {
+    this.responsive.observe([Breakpoints.Small, Breakpoints.XSmall])
+      .subscribe(result => {
+
+
+        if (result.matches) {
+          this.isSmallMedia = true;
+
+        }
+        else {
+          this.isSmallMedia = false;
+
+        }
+      });
+  }
+  collapse() {
+    this.isExpanded = false;
+  }
+
+  toggle() {
+    this.isExpanded = !this.isExpanded;
+  }
+}

package/projects/authentication-lib/src/lib/logout/logout.component.html

@@ -0,0 +1 @@
+<p>Redirecting!!!!</p>

package/projects/authentication-lib/src/lib/logout/logout.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LogoutComponent } from './logout.component';
+
+describe('LogoutComponent', () => {
+  let component: LogoutComponent;
+  let fixture: ComponentFixture<LogoutComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [LogoutComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(LogoutComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/projects/authentication-lib/src/lib/logout/logout.component.ts

@@ -0,0 +1,29 @@
+import { Component, OnInit, } from '@angular/core';
+import { AuthService } from '../auth.service';
+import { Injectable, Inject, PLATFORM_ID } from '@angular/core';
+import { isPlatformBrowser } from '@angular/common';
+
+@Component({
+  selector: 'app-logout',
+  standalone: true,
+  imports: [],
+  templateUrl: './logout.component.html',
+  styleUrl: './logout.component.scss'
+})
+export class LogoutComponent implements OnInit {
+
+  constructor(private authService: AuthService,
+    @Inject(PLATFORM_ID) private platformId: object) { }
+  ngOnInit() {
+    //this.authService.logout();
+    if (isPlatformBrowser(this.platformId)) {
+      this.authService.revokeTokenAndLogout();
+ }
+   
+    // Clear local storage
+    //localStorage.clear();
+    //sessionStorage.clear();
+    ////this.authService.revokeTokenAndLogout();
+  }
+
+}

package/projects/authentication-lib/src/lib/logout-callback/logout-callback.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LogoutCallbackComponent } from './logout-callback.component';
+
+describe('LogoutCallbackComponent', () => {
+  let component: LogoutCallbackComponent;
+  let fixture: ComponentFixture<LogoutCallbackComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [LogoutCallbackComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(LogoutCallbackComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/projects/authentication-lib/src/lib/logout-callback/logout-callback.component.ts

@@ -0,0 +1,27 @@
+
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { Injectable, Inject, PLATFORM_ID } from '@angular/core';
+import { isPlatformBrowser } from '@angular/common';
+
+@Component({
+  selector: 'app-logout-callback',
+  imports: [],
+  standalone:true,
+  templateUrl: './logout-callback.component.html',
+  styleUrl: './logout-callback.component.scss'
+})
+export class LogoutCallbackComponent implements OnInit {
+  constructor(private router: Router,
+    @Inject(PLATFORM_ID) private platformId: object) { }
+
+  ngOnInit(): void {
+    if (isPlatformBrowser(this.platformId)) {
+      localStorage.clear();
+      sessionStorage.clear();
+
+      this.router.navigate(['/home']);
+   }
+  
+  }
+}

package/projects/authentication-lib/src/lib/route-history.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { RouteHistoryService } from './route-history.service';
+
+describe('RouteHistoryService', () => {
+  let service: RouteHistoryService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(RouteHistoryService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

package/projects/authentication-lib/src/lib/route-history.service.ts

@@ -0,0 +1,31 @@
+import { Injectable } from '@angular/core';
+import { Router, NavigationEnd, ActivatedRoute } from '@angular/router';
+import { filter} from 'rxjs/operators';
+
+
+@Injectable({
+  providedIn: 'root'
+})
+export class RouteHistoryService {
+
+  private previousUrl: string | null = null;
+  private currentUrl: string | null = null;
+
+  constructor(private router: Router, private activatedRoute:ActivatedRoute) { }
+
+  init() {
+    this.currentUrl = this.router.url;
+
+    this.router.events
+      .pipe(filter(event => event instanceof NavigationEnd))
+      .subscribe((event: NavigationEnd) => {
+       this.previousUrl = this.currentUrl;
+       this.currentUrl = event.urlAfterRedirects;
+      });
+  }
+
+  getPreviousUrl(): string | null {
+    return this.previousUrl;
+  }
+
+}