Ngx-painless-redux NPM

NgxPainlessRedux

Description

This is painless-redux adapter for Angular using @ngrx/store.

Install:

npm i painless-redux ngx-painless-redux @ngrx/store
Import NgxPainlessReduxModule to your app module next to StoreModule from @ngrx/store, then import actionSanitizer from painless-redux and add it as actionSanitizer for StoreDevtoolsModule.instrument param:

import { NgxPainlessReduxModule } from 'ngx-painless-redux';
import { actionSanitizer } from 'painless-redux';

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserModule,
    StoreModule.forRoot({}),
    StoreDevtoolsModule.instrument({
      actionSanitizer, // <-- here
    }),
    NgxPainlessReduxModule, // <-- here
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

Inherit from EntityStorageService:

import { Injectable } from '@angular/core';
import { EntityStorageService } from 'ngx-painless-redux';

export interface Entity1 {
  id: string;
  name: string;
  age: number;
}

@Injectable({ providedIn: 'root' })
export class Entity1Storage extends EntityStorageService<Entity1> {

  constructor() {
    super({ name: 'Entity1', pageSize: 2, maxPagesCount: 2 });
  }
}

or from WorkspaceStorageService:

import { Injectable } from '@angular/core';
import { WorkspaceStorageService } from 'ngx-painless-redux';

export interface Workspace1 {
  filter: number[];
}

@Injectable({ providedIn: 'root' })
export class Workspace1Storage extends WorkspaceStorageService<Workspace1> {

  constructor() {
    super({
      name: 'Workspace1', 
      initialValue: {
        filter: [1, 2, 3],
      },
    });
  }
}