@presencelearning/auth

Angular library wrapping angular-auth-oidc-client with signal-based state, ready-to-use guards, an auth interceptor, and an OAuth callback route.

Features

• Signal-Based State — AuthService exposes isAuthenticated, currentUser, and accessToken as Angular signals. No subscriptions needed.
• Single-Call Setup — provideAuth() + withAuthInterceptor() configure everything in app.config.ts
• Smart Interceptor — Attaches Bearer tokens only to configured secureRoutes. Automatically logs out on 401.
• Route Guards — authGuard and createGroupsGuard() protect routes with minimal boilerplate
• OAuth Callback Route — createAuthCallbackRoute() returns a pre-wired Route object
• Impersonation — RFC 8693 token exchange via createStartImpersonationRoute() and createEndImpersonationRoute(). No consumer wiring required.
• SSR-Safe Storage — localStorage / sessionStorage wrappers that fall back gracefully in non-browser environments
• Token Utilities — Parse, validate, and inspect JWTs without a full OIDC round-trip

Installation

npm install @presencelearning/auth

Quick Start

1. Configure your app

app.config.ts

import { ApplicationConfig } from '@angular/core';
import { provideRouter } from '@angular/router';
import { provideHttpClient } from '@angular/common/http';
import { provideAuth, withAuthInterceptor } from '@presencelearning/auth';
import { routes } from './app.routes';

export const appConfig: ApplicationConfig = {
  providers: [
    provideRouter(routes),
    provideHttpClient(withAuthInterceptor()),
    provideAuth({
      issuerUrl: environment.auth.issuerUrl,
      clientId: environment.auth.clientId,
    }),
  ],
};

2. Add the callback route

app.routes.ts

import { Routes } from '@angular/router';
import { authGuard, createAuthCallbackRoute } from '@presencelearning/auth';

export const routes: Routes = [
  createAuthCallbackRoute(),
  {
    path: 'dashboard',
    canActivate: [authGuard],
    loadComponent: () => import('./dashboard/dashboard.component'),
  },
];

3. Use auth state in components

import { Component, inject } from '@angular/core';
import { AuthService } from '@presencelearning/auth';

@Component({
  template: `
    @if (auth.isAuthenticated()) {
      <p>Welcome, {{ auth.currentUser()?.name }}</p>
      <button (click)="auth.logout()">Log out</button>
    } @else {
      <button (click)="auth.login()">Log in</button>
    }
  `,
})
export class AppComponent {
  protected auth = inject(AuthService);
}

Requirements

• Angular 18+
• angular-auth-oidc-client ≥ 18
• RxJS 7+

Non-Goals

• No session polling — angular-auth-oidc-client handles silent token renewal via refresh tokens
• No cross-tab sync — Each tab runs its own OIDC check on load

---

Source: packages/auth