imng-kendo-ngrx-idle/fesm2022/imng-kendo-ngrx-idle.mjs

This library was generated with [Nx](https://nx.dev).

import * as i3 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i0 from '@angular/core';
import { InjectionToken, inject, Injectable, Component, NgModule } from '@angular/core';
import * as i2$1 from '@ngrx/effects';
import { Actions, createEffect, EffectsModule } from '@ngrx/effects';
import * as i1$1 from '@ngrx/store';
import { createAction, createFeature, createReducer, on, createSelector, Store, StoreModule } from '@ngrx/store';
import * as i2 from '@progress/kendo-angular-buttons';
import { ButtonsModule } from '@progress/kendo-angular-buttons';
import * as i1 from '@progress/kendo-angular-dialog';
import { DialogModule } from '@progress/kendo-angular-dialog';
import { switchMap, map, filter, tap } from 'rxjs/operators';
import { timer, BehaviorSubject, interval } from 'rxjs';
import { createPayloadAction } from 'imng-ngrx-utils';
import { oidcFeature } from 'imng-oidc-client';

const onSessionExtended = createAction('[Idle] Session Extended');
const onSessionTimingOut = createPayloadAction('[Idle] Session Timing Out');
const signOutRedirect = createAction('[Oidc] sign out redirect');

const IDLE_CONFIG = new InjectionToken('idle-config');

const IDLE_FEATURE_KEY = 'idle';
const initialState = {
    isTimingOut: false,
    timeoutSpanInMs: undefined,
};
const idleFeature = createFeature({
    name: IDLE_FEATURE_KEY,
    reducer: createReducer(initialState, on(onSessionTimingOut, (state, { payload }) => ({
        ...state,
        isTimingOut: true,
        timeoutSpanInMs: payload.autoLogoutInMs - payload.timeoutWarningInMs,
    })), on(onSessionExtended, signOutRedirect, (state) => ({
        ...state,
        isTimingOut: false,
        timeoutSpanInMs: undefined,
    })))
});

const getIsTimingOut = idleFeature.selectIsTimingOut;
const getTimeoutSpanInMs = idleFeature.selectTimeoutSpanInMs;
const selectLoggedInAndIsNotTimingOut = createSelector(oidcFeature.selectIsLoggedIn, idleFeature.selectIsTimingOut, (isLoggedIn, IsTimingOut) => isLoggedIn && !IsTimingOut);
const idleQuery = { getIsTimingOut, getTimeoutSpanInMs, selectLoggedInAndIsNotTimingOut };

class IdleEffects {
    constructor() {
        this.idleConfig = inject(IDLE_CONFIG);
        this.store = inject(Store);
        this.actions$ = inject(Actions);
        this.signOutRedirect$ = createEffect(() => {
            return this.getLoggedInActionPipe().pipe(switchMap(() => timer(this.idleConfig.autoLogoutInMs)), map(() => signOutRedirect()));
        });
        this.timingOut$ = createEffect(() => {
            return this.getLoggedInActionPipe().pipe(switchMap(() => timer(this.idleConfig.timeoutWarningInMs)), map(() => onSessionTimingOut(this.idleConfig)));
        });
    }
    getLoggedInActionPipe() {
        return this.actions$.pipe(switchMap(() => this.store
            .select(idleQuery.selectLoggedInAndIsNotTimingOut)
            .pipe(filter((val) => val))));
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: IdleEffects, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: IdleEffects, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: IdleEffects, decorators: [{
            type: Injectable,
            args: [{ providedIn: 'root' }]
        }] });

class IdleFacade {
    constructor() {
        this.store = inject(Store);
        this.isTimingOut$ = this.store.select(idleQuery.getIsTimingOut);
        this.timeOutSpanInMs$ = this.store.select(idleQuery.getTimeoutSpanInMs);
    }
    extendSession() {
        this.store.dispatch(onSessionExtended());
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: IdleFacade, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: IdleFacade, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: IdleFacade, decorators: [{
            type: Injectable,
            args: [{
                    providedIn: 'root',
                }]
        }] });

class IdleWarningComponent {
    constructor() {
        this.idleFacade = inject(IdleFacade);
        this.isSessionTimingOut$ = new BehaviorSubject(false);
    }
    ngOnInit() {
        let timeOutSpan = 0;
        const msInSec = 1000;
        this.timeoutSub = this.idleFacade.isTimingOut$
            .pipe(tap((value) => this.isSessionTimingOut$.next(value)))
            .subscribe();
        this.secondsRemaining$ = this.idleFacade.timeOutSpanInMs$.pipe(filter((t) => (t ?? 0) > 0), tap((t) => (timeOutSpan = t)), switchMap(() => interval(msInSec)), map(() => Math.floor(timeOutSpan / msInSec)), tap(() => (timeOutSpan -= msInSec)));
    }
    ngOnDestroy() {
        this.timeoutSub?.unsubscribe();
    }
    close() {
        this.isSessionTimingOut$.next(false);
    }
    extend() {
        this.idleFacade.extendSession();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: IdleWarningComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.4", type: IdleWarningComponent, isStandalone: false, selector: "imng-idle-warning", ngImport: i0, template: `@if (isSessionTimingOut$ | async) {
    <kendo-dialog
      title="Idle Session Warning"
      (close)="close()"
      [minWidth]="250"
      [width]="450">
      <p class="warn-msg">Do you wish to extend your session?</p>
      <p class="warn-msg">{{ secondsRemaining$ | async }} Seconds remaining</p>
      <kendo-dialog-actions>
        <button kendoButton (click)="close()">No</button>
        <button kendoButton (click)="extend()" [primary]="true">Yes</button>
      </kendo-dialog-actions>
    </kendo-dialog>
  }`, isInline: true, styles: [".warn-msg{margin:30px;text-align:center}\n"], dependencies: [{ kind: "component", type: i1.DialogComponent, selector: "kendo-dialog", inputs: ["actions", "actionsLayout", "autoFocusedElement", "title", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "animation", "themeColor"], outputs: ["action", "close"], exportAs: ["kendoDialog"] }, { kind: "component", type: i1.DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: IdleWarningComponent, decorators: [{
            type: Component,
            args: [{ selector: 'imng-idle-warning', template: `@if (isSessionTimingOut$ | async) {
    <kendo-dialog
      title="Idle Session Warning"
      (close)="close()"
      [minWidth]="250"
      [width]="450">
      <p class="warn-msg">Do you wish to extend your session?</p>
      <p class="warn-msg">{{ secondsRemaining$ | async }} Seconds remaining</p>
      <kendo-dialog-actions>
        <button kendoButton (click)="close()">No</button>
        <button kendoButton (click)="extend()" [primary]="true">Yes</button>
      </kendo-dialog-actions>
    </kendo-dialog>
  }`, standalone: false, styles: [".warn-msg{margin:30px;text-align:center}\n"] }]
        }] });

class ImngNgrxIdleModule {
    static forRoot(idleConfig) {
        return {
            ngModule: ImngNgrxIdleModule,
            providers: [{ provide: IDLE_CONFIG, useValue: idleConfig }, IdleFacade],
        };
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: ImngNgrxIdleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.4", ngImport: i0, type: ImngNgrxIdleModule, declarations: [IdleWarningComponent], imports: [CommonModule, i1$1.StoreFeatureModule, i2$1.EffectsFeatureModule, DialogModule,
            ButtonsModule], exports: [IdleWarningComponent] }); }
    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: ImngNgrxIdleModule, imports: [CommonModule,
            StoreModule.forFeature(idleFeature),
            EffectsModule.forFeature([IdleEffects]),
            DialogModule,
            ButtonsModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: ImngNgrxIdleModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [
                        CommonModule,
                        StoreModule.forFeature(idleFeature),
                        EffectsModule.forFeature([IdleEffects]),
                        DialogModule,
                        ButtonsModule,
                    ],
                    declarations: [IdleWarningComponent],
                    exports: [IdleWarningComponent],
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { IDLE_FEATURE_KEY, IdleFacade, IdleWarningComponent, ImngNgrxIdleModule, idleFeature, initialState };
//# sourceMappingURL=imng-kendo-ngrx-idle.mjs.map