Simplify Effects

[alvipeo]

ngrx 8.2.0, angular 8.2.0

I have these kind of effects all over the place:

loadPageBlocksApi$ = createEffect(() =>
    this.actions$.pipe(
      ofType(loadPageBlocksApi),
      concatMap(action =>
        of(action).pipe(
          withLatestFrom(this.store.pipe(select(fromLangs.getCurrentLang)))
        )
      ),
      filter(([, currentLang]) => !!currentLang),
      map(([, currentLang]) => currentLang as Language),
      exhaustMap(currentLang => [
        of(fromInProgress.startWorkInProgress()),
        this.pageBlockSvc
          .getByCulture(currentLang.cultureName)
          .pipe(map(pageBlocks => addPageBlocks({ pageBlocks })))
      ]),
      concatAll(),
      catchError(() =>
        of(savingFailed({ errorMsg: "Could not load pages information" }))
      )
    )
  );

// another one, for example
upsertBasicInfo$ = createEffect(() =>
    this.actions$.pipe(
      ofType(storeBasicInfo),
      exhaustMap(action => [
        of(fromInProgress.startWorkInProgress()),
        this.pageBlockSvc
          .storeBasicInfo(action.pbInfo)
          .pipe(map(pageBlock => upsertPageBlock({ pageBlock })))
      ]),
      concatAll(),
      catchError(() =>
        of(savingFailed({ errorMsg: "Could not save page info" }))
      )
    )
  );

They're all first emit startWorkingProgress action to show global working UI state and then they actually do the work and emit resulting actions. But I was thinking if we could have some simplified method for it, like:

loadPageBlocksApi$ = createEffect(
  loadPageBlocksApi,                          // action type
  select(fromLangs.getCurrentLang),  // state selector (optional)
  (actionProps, stateSelectorResult) => { ... some pre-processing },
  [ one_or_more_actions_to_dispatch... ]                   // actions to dispatch (and their params are set based on the previous func results
);

then we wouldn't probably deal with all these RxJS multiple operators.

Well, just an idea - to create a simplified syntax for splitters and maybe aggregators.

[timdeschryver]

I think this case is too specific, but we're working on it:

• Custom RxJS operator for safe calling the service in the Effect #1224
• RFC: Add new Higher Order Effect - createApiEffect #1826

That being said, you can write your own higher order effect to handle state selectors and pre-processing.