Merge pull request abpframework#5060 from abpframework/fix/4839

Added the ngxsStoragePluginOptions property to forRoot method options of CoreModule

Author: armanozak

npm/ng-packs/packages/core/src/lib/core.module.ts

@@ -4,7 +4,11 @@ import { APP_INITIALIZER, Injector, ModuleWithProviders, NgModule } from '@angul
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { RouterModule } from '@angular/router';
 import { NgxsRouterPluginModule } from '@ngxs/router-plugin';
-import { NgxsStoragePluginModule } from '@ngxs/storage-plugin';
+import {
+  NgxsStoragePluginModule,
+  NGXS_STORAGE_PLUGIN_OPTIONS,
+  StorageOption,
+} from '@ngxs/storage-plugin';
 import { NgxsModule, NGXS_PLUGINS } from '@ngxs/store';
 import { OAuthModule, OAuthStorage } from 'angular-oauth2-oidc';
 import { AbstractNgModelComponent } from './abstracts/ng-model.component';
@@ -118,7 +122,7 @@ export class BaseCoreModule {}
     LocalizationModule,
     NgxsModule.forFeature([ReplaceableComponentsState, ProfileState, SessionState, ConfigState]),
     NgxsRouterPluginModule.forRoot(),
-    NgxsStoragePluginModule.forRoot({ key: ['SessionState'] }),
+    NgxsStoragePluginModule.forRoot(),
     OAuthModule.forRoot(),
   ],
 })
@@ -216,7 +220,23 @@ export class CoreModule {
           useFactory: noop,
         },
         { provide: OAuthStorage, useFactory: storageFactory },
+        {
+          provide: NGXS_STORAGE_PLUGIN_OPTIONS,
+          useValue: {
+            storage: StorageOption.LocalStorage,
+            serialize: JSON.stringify,
+            deserialize: JSON.parse,
+            beforeSerialize: ngxsStoragePluginSerialize,
+            afterDeserialize: ngxsStoragePluginSerialize,
+            ...options.ngxsStoragePluginOptions,
+            key: [...(options.ngxsStoragePluginOptions?.key || []), 'SessionState'],
+          },
+        },
       ],
     };
   }
 }
+
+export function ngxsStoragePluginSerialize(data) {
+  return data;
+}

npm/ng-packs/packages/core/src/lib/models/common.ts

@@ -3,13 +3,15 @@ import { Router } from '@angular/router';
 import { Subject } from 'rxjs';
 import { eLayoutType } from '../enums/common';
 import { Config } from './config';
+import { NgxsStoragePluginOptions } from '@ngxs/storage-plugin';
 
 export namespace ABP {
   export interface Root {
     environment: Partial<Config.Environment>;
     skipGetAppConfiguration?: boolean;
     sendNullsAsQueryParam?: boolean;
     cultureNameLocaleFileMap?: Dictionary<string>;
+    ngxsStoragePluginOptions?: NgxsStoragePluginOptions & { key?: string[] };
   }
 
   export interface Test {

npm/ng-packs/packages/core/src/lib/strategies/auth-flow.strategy.ts

@@ -1,29 +1,29 @@
 import { Injector } from '@angular/core';
+import { Router } from '@angular/router';
 import { Store } from '@ngxs/store';
 import { AuthConfig, OAuthService } from 'angular-oauth2-oidc';
-import { ConfigState } from '../states/config.state';
-import { CORE_OPTIONS } from '../tokens/options.token';
-import { Router } from '@angular/router';
 import { Observable, of } from 'rxjs';
-import { RestService } from '../services/rest.service';
-import { switchMap } from 'rxjs/operators';
+import { switchMap, tap } from 'rxjs/operators';
 import { GetAppConfiguration } from '../actions/config.actions';
+import { RestOccurError } from '../actions/rest.actions';
+import { RestService } from '../services/rest.service';
+import { ConfigState } from '../states/config.state';
 
 export abstract class AuthFlowStrategy {
   abstract readonly isInternalAuth: boolean;
 
+  protected store: Store;
   protected oAuthService: OAuthService;
   protected oAuthConfig: AuthConfig;
   abstract checkIfInternalAuth(): boolean;
   abstract login(): void;
   abstract logout(): Observable<any>;
   abstract destroy(): void;
 
-  private catchError = err => {
-    // TODO: handle the error
-  };
+  private catchError = err => this.store.dispatch(new RestOccurError(err));
 
   constructor(protected injector: Injector) {
+    this.store = injector.get(Store);
     this.oAuthService = injector.get(OAuthService);
     this.oAuthConfig = injector.get(Store).selectSnapshot(ConfigState.getDeep('environment.oAuthConfig'));
   }
@@ -74,10 +74,9 @@ export class AuthPasswordFlowStrategy extends AuthFlowStrategy {
   }
 
   logout() {
-    const store = this.injector.get(Store);
     const rest = this.injector.get(RestService);
 
-    const issuer = store.selectSnapshot(ConfigState.getDeep('environment.oAuthConfig.issuer'));
+    const issuer = this.store.selectSnapshot(ConfigState.getDeep('environment.oAuthConfig.issuer'));
     return rest
       .request(
         {
@@ -88,10 +87,8 @@ export class AuthPasswordFlowStrategy extends AuthFlowStrategy {
         issuer,
       )
       .pipe(
-        switchMap(() => {
-          this.oAuthService.logOut();
-          return store.dispatch(new GetAppConfiguration());
-        }),
+        tap(() => this.oAuthService.logOut()),
+        switchMap(() =>  this.store.dispatch(new GetAppConfiguration())),
       );
   }
 

npm/ng-packs/packages/core/src/lib/tokens/options.token.ts

@@ -1,15 +1,12 @@
 import { InjectionToken } from '@angular/core';
-import { ABP } from '../models/common';
 import differentLocales from '../constants/different-locales';
+import { ABP } from '../models/common';
 
 export const CORE_OPTIONS = new InjectionToken<ABP.Root>('CORE_OPTIONS');
 
-export function coreOptionsFactory({
-  cultureNameLocaleFileMap: localeNameMap = {},
-  ...options
-}: ABP.Root) {
+export function coreOptionsFactory({ cultureNameLocaleFileMap = {}, ...options }: ABP.Root) {
   return {
     ...options,
-    cultureNameLocaleFileMap: { ...differentLocales, ...localeNameMap },
+    cultureNameLocaleFileMap: { ...differentLocales, ...cultureNameLocaleFileMap },
   } as ABP.Root;
 }