Use track() with any rxjs map

[Muriele Trentini]

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report  
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ x ] Support request
[ ] Other... Please describe:

Current behavior

I'm using switchmap to load data from the server according to the current id in the route.

What I'd like to do is use the loadingFor track() method directly in the pipe with the switchMap (or any rxjs map for that matter).
But apparently the finalize is never being called and inProgess remains in "true" state even though the http call finished.

I can only get it to work if I nest subscriptions.

Minimal reproduction of the problem with instructions

  loader = loadingFor('item');

// this way it works:
    this.id$
      .pipe(
        untilDestroyed(this)
      ).subscribe(id => this.service.loadItem(id)
      .pipe(
        this.loader.item.track(),
        untilDestroyed(this))
      .subscribe()
    );

// I'd like to use it without having to nest subscriptions:
    this.id$
      .pipe(
        untilDestroyed(this),
        this.loader.item.track(),
        switchMap(id => this.service.loadItem(item)),
      ).subscribe()
    );

What is the motivation / use case for changing the behavior?

nested subscriptions are smelly

Environment

Angular version: 12.2.0

[Netanel Basal]

We have many examples here: https://github.com/ngneat/loadoff/blob/master/src/app/app.component.ts

[Muriele Trentini]

Since there is no example with track() and an rxjs pipe, I assume it cannot be done and I'm going with:

    this.loadingState$ = routeParam$(this.route, ROUTE_PARAM.id).pipe(
      untilDestroyed(this),
      switchMap(id => this.service.getItem(id)),
      toAsyncState()
    );

Thanks