question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

concatLatestFrom doesnt work with navigate when selecting more than one selector

See original GitHub issue

Current Behavior

When passing 2 selectors as an array to concatLatestFrom there is a type mismatch error

Expected Behavior

Expected this to work as in NgRx repository this works and there is even a test for it to verify it works see https://github.com/ngrx/platform/blob/0bb49409413b784b1cc55c2b59e67ed760041aa5/modules/effects/spec/concat_latest_from.spec.ts#L87

Steps to Reproduce

I have an open issue on stackoverflow with a code example found here https://stackoverflow.com/q/68894745/6603342 But the ghist of it is

 loadAllCases$ = createEffect(() => this._actions$.pipe(
    concatLatestFrom(() => [
      this.store.pipe(select(CaseSelectors.getAllCases)),
      this.store.pipe(select(CaseSelectors.getCasesLoaded))
    ]),
    navigation(this.caseLandingPage, {
      run: (snap, [loaded, cases]) => {
        if (loaded) {
          return CaseActions.loadAllSuccess();
        } else {
          return this._caseService.getAll().pipe(
            map(cases => CaseActions.loadAllSuccess(cases))
          );
        }
      },
      onError: (action, error) => {
        return CaseActions.loadAllFailed(error);
      }
    })
  ));

This will work fine if i use one selector or create a selector dedicated for combining the state i wish to extract, but not when passed as an array. Note that this will also work just fine if i swap navigate for map, switchmap etc. or zip my two selectors.

Failure Logs

The error this produces is

TS2345: Argument of type 'OperatorFunction<Action, [Action, Calendar[], boolean]>' is not assignable to parameter of type 'OperatorFunction<Action, ActionOrActionWithState<unknown, Action>>'.   Type '[Action, Calendar[], boolean]' is not assignable to type 'ActionOrActionWithState<unknown, Action>'.     Type '[Action, Calendar[], boolean]' is not assignable to type '[Action, unknown]'.       Source has 3 element(s) but target allows only 2.

Environment

"rxjs": "~6.6.0",
"@ngrx/effects": "~12.2.0",
"@ngrx/entity": "~12.2.0",
"@ngrx/router-store": "~12.2.0",
"@ngrx/store": "~12.2.0",

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:1
  • Comments:14 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
david-shortmancommented, Dec 12, 2021

I was able to reproduce locally. Will open a PR eventually.

1reaction
HarryPicommented, Aug 25, 2021

The above example would work fine if i would swap navigation for NgRx map or switchMap etc… the issue comes when using Nx data persistent type such as navigation. This will cause the application to fail to compile (if there is more than one selector) due to type incompatibility.

Read more comments on GitHub >

github_iconTop Results From Across the Web

concatLatestFrom with multiple selectors ngrx - Stack Overflow
Update. This appears to be Nx specific bug, and the navigation pipe it providers, i have oppened a bug related issue with the...
Read more >
NgRx – tips & tricks - Angular.love
1. withLatestFrom -> concatLatestFrom ... getCollectionBookIds selector will be subscribed regardless of whether ... Navigating with NgRx.
Read more >
Making your application feel faster by prefetching data with ...
Without the global Store, navigating between both views feels slow and thus it doesn't provide a good experience. This is because the data ......
Read more >
ngrx/store - Gitter
Hey guys I have a problem while building project with ngrx/effects : Error: ... then from there router.navigate to the Details component e.g....
Read more >
Announcing NgRx Version 12: New operator for Effects ...
Today we're happy to announce the version 12 release of the NgRx platform. This release contains new features, bug fixes, and some breaking ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found