How to use @ngrx/effects - 10 common examples

it('should use provided flattening operator', () => {
    const sources$ = hot('  -a--b', genActions('ab'));
    const project = () => cold('v------(w|)', genActions('vw'));
    const error = () => createAction('e')();

    // Merge map starts project streams in parallel
    const expected$ = cold('-v--v---w--w', genActions('vw'));

    const output$ = sources$.pipe(act({ project, error, operator: mergeMap }));

    expect(output$).toBeObservable(expected$);
  });

it('should flatten projects with concatMap by default', () => {
    const sources$ = hot('  -a--b', genActions('ab'));
    const project = () => cold('v------(w|)', genActions('vw'));
    const error = () => createAction('e')();

    // Even thought source produced actions one right after another, operator
    // wait for the project to complete before handling second source action.
    const expected$ = cold('-v------(wv)---w', genActions('vw'));

    const output$ = sources$.pipe(act(project, error));

    expect(output$).toBeObservable(expected$);
  });

import {AppComponent} from './app.component';
import {AppEventBusEffects} from './app.event-bus.effects';
import {AppEventBusService} from './app.event-bus.service';
import {EventBusService} from './shared/event-bus.service';

@NgModule({
    bootstrap: [
        AppComponent
    ],
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule,
        StoreModule.forRoot(reducers),
        EffectsModule.forRoot([AppEventBusEffects]),
        !environment.production ? StoreDevtoolsModule.instrument({maxAge: 25}) : []
    ],
    providers: [
        EventBusService, // Should be first, since AppEventBusService depends on it
        AppEventBusService
    ]
})
export class AppModule {
}

// TODO: store/devtools disabled because of poor performance.
  //
  // Because devtools serializes state to JSON, if you have a large amount of data in your stores (~500 objects)
  // the time it takes to serialize and deserialize the object becomes significant. This is crippling to the
  // performance of the app.
  //
  // To re-enable the devtools, [fix this](https://github.com/ngrx/store-devtools/issues/57) and then pass
  // the option to use [Immutable compatible devtools](https://goo.gl/Wym3eT).
  //
  // StoreDevtoolsModule.instrumentStore(),

  EffectsModule.run(GameStateEffects),
  EffectsModule.run(CombatEffects),
  EffectsModule.run(SpritesEffects),
  EffectsModule.run(GameDataEffects),
  EffectsModule.run(AppEffects)
];

bootstrap: [ AppComponent ],
  declarations: [

    AppComponent,
    NewOperation,
    OperationsList,
    Currencies,
    CustomCurrencyPipe
  ],
  imports: [ // import Angular's modules
    NgbModule,
    BrowserModule,
    CommonModule,
    FormsModule,
    HttpModule,
    EffectsModule.run(CurrencyEffects),
    StoreModule.provideStore(reducer),


  ],
  providers: [CurrencyService]
})
export class AppModule {
  constructor() {}



}

'publisher with a version already cached in the store', () => {

        // use the default test Publisher: "testPublisher" with 1 as publisherVersion
        const cachedPublisherAndVersion = generateThirdWithVersion('testPublisher', new Set(['1']));
        const cachedI18n$ = hot('-a', {a: cachedPublisherAndVersion});
        storeMock.select.withArgs(selectI18nUpLoaded).and.returnValue(cachedI18n$);

        // The loaded Light Cards have the default publisher with '1' as publisher version
        function randomCardWith1AsPublisherVersion() {
            return getOneRandomCard({publisherVersion: '1'});
        }

        const lightCards = generateRandomArray(2, 7, randomCardWith1AsPublisherVersion);
        localAction$ = new Actions(hot('b', {b: new LoadLightCardsSuccess({lightCards: lightCards})}))
        underTest = new TranslateEffects(storeMock, localAction$, translateServMock, thirdServMock);

        // verification
        expect(underTest).toBeTruthy();

        const expectedEmittedActions = hot('-c', {c: new TranslationUpToDate()});
        expect(underTest.verifyTranslationNeeded).toBeObservable(expectedEmittedActions);

    });

useFactory: (): Observable => {
      if (typeof factoryOrSource === 'function') {
        return new Actions(defer(factoryOrSource));
      }

      return new Actions(factoryOrSource);
    },
  };

return this.organizationService.getAllServiceLimits().pipe(
        map(mapOfLimits =>
          Object.keys(mapOfLimits).reduce((acc, organizationId) => {
            acc.push(ServiceLimitsConverter.fromDto(organizationId, mapOfLimits[organizationId]));
            return acc;
          }, [])
        ),
        map(serviceLimits => new ServiceLimitsAction.GetAllSuccess({allServiceLimits: serviceLimits})),
        catchError(error => of(new ServiceLimitsAction.GetAllFailure({error: error})))
      );
    })
  );

  @Effect()
  public getAllFailure$: Observable = this.actions$.pipe(
    ofType(ServiceLimitsActionType.GET_ALL_FAILURE),
    tap(action => console.error(action.payload.error)),
    map(() => {
      const message = this.i18n({
        id: 'organization.serviceLimits.getAll.fail',
        value: 'Could not read information about your service levels and subscriptions',
      });
      return new NotificationsAction.Error({message});
    })
  );

  @Effect()
  public getServiceLimits$: Observable = this.actions$.pipe(
    ofType(ServiceLimitsActionType.GET_SERVICE_LIMITS),
    mergeMap(action => {
      return this.organizationService.getServiceLimits(action.payload.organizationId).pipe(
        map(dto => ServiceLimitsConverter.fromDto(action.payload.organizationId, dto)),

@Effect()
  loadAllCourses$ = this.actions$
    .pipe(
      ofType(CourseActionTypes.AllCoursesRequested),
      withLatestFrom(this.store.pipe(select(allCoursesLoaded))),
      filter(([action, allCoursesLoaded]) => !allCoursesLoaded),
      mergeMap(() => this.coursesService.findAllCourses()),
      map(courses => new AllCoursesLoaded({courses}))
    );


  @Effect()
  loadLessonsPage$ = this.actions$
    .pipe(
      ofType(CourseActionTypes.LessonsPageRequested),
      mergeMap(({payload}) =>
              this.coursesService.findLessons(payload.courseId,
                          payload.page.pageIndex, payload.page.pageSize)
                .pipe(
                  catchError(err => {
                    console.log('error loading a lessons page ', err);
                    this.store.dispatch(new LessonsPageCancelled());
                    return of([]);
                  })
                )

      ),
      map(lessons => new LessonsPageLoaded({lessons}))
    );

it('returns CheckAuthenticationStatus on LoadConfigSuccess', () => {
        const localActions$ = new Actions(hot('-a--', {a: new LoadConfigSuccess({config: {}})}));
        effects = new AuthenticationEffects(mockStore, localActions$, null, null, null);
        expect(effects).toBeTruthy();
        effects.checkAuthenticationWhenReady.subscribe((action: AuthenticationActions) => expect(action.type).toEqual(AuthenticationActionTypes.CheckAuthenticationStatus));

    });