optimize remote #3

src/app/modules/presentation/remote/remote.component.ts

@@ -83,14 +83,13 @@ export class RemoteComponent implements OnDestroy {
     globalSettingsService: GlobalSettingsService,
     private cRef: ChangeDetectorRef
   ) {
-    const currentShowId$ = globalSettingsService.get$
-      .pipe(
-        filter((settings): settings is NonNullable<typeof settings> => !!settings),
-        map(_ => _.currentShow),
-        filter((showId): showId is string => !!showId),
-        distinctUntilChanged(),
-        takeUntil(this.destroy$)
-      );
+    const currentShowId$ = globalSettingsService.get$.pipe(
+      filter((settings): settings is NonNullable<typeof settings> => !!settings),
+      map(_ => _.currentShow),
+      filter((showId): showId is string => !!showId),
+      distinctUntilChanged(),
+      takeUntil(this.destroy$)
+    );
 
     const show$ = currentShowId$.pipe(
       switchMap(showId => this.showService.read$(showId)),

src/app/modules/shows/list/filter/filter.component.ts

@@ -5,8 +5,8 @@ import {ReactiveFormsModule, UntypedFormBuilder, UntypedFormGroup} from '@angula
 import {FilterValues} from './filter-values';
 import {Show} from '../../services/show';
 import {ShowService} from '../../services/show.service';
-import {distinctUntilChanged, map} from 'rxjs/operators';
-import {combineLatest, Observable} from 'rxjs';
+import {distinctUntilChanged, map, switchMap} from 'rxjs/operators';
+import {combineLatest, Observable, of} from 'rxjs';
 import {dynamicSort, onlyUnique} from '../../../../services/filter.helper';
 import {UserService} from '../../../../services/user/user.service';
 import {isEqual} from 'lodash';
@@ -66,21 +66,31 @@ export class FilterComponent {
   }
 
   public owners$ = (): Observable<{key: string; value: string}[]> => {
-    return combineLatest([
-      this.showService.list$().pipe(
-        map(shows => {
-          return shows.map(show => show.owner).filter(onlyUnique);
-        })
+    return this.showService.list$().pipe(
+      map(shows =>
+        shows
+          .map(show => show.owner)
+          .filter(onlyUnique)
+          .filter((ownerId): ownerId is string => !!ownerId)
       ),
-      this.userService.users$,
-    ]).pipe(
-      map(([owners, users]) => {
-        return owners
-          .map(ownerId => ({
-            key: ownerId,
-            value: users.find(user => user.id === ownerId)?.name,
-          }))
-          .sort(dynamicSort('value'));
+      switchMap(ownerIds => {
+        if (ownerIds.length === 0) {
+          return of([] as {key: string; value: string}[]);
+        }
+
+        return combineLatest(
+          ownerIds.map(ownerId =>
+            this.userService.getUserbyId$(ownerId).pipe(
+              map(user => ({
+                key: ownerId,
+                value: user?.name,
+              }))
+            )
+          )
+        );
+      }),
+      map(owners => {
+        return owners.sort(dynamicSort('value'));
       }),
       distinctUntilChanged(isEqual),
       map(_ => _ as {key: string; value: string}[])

src/app/modules/songs/song/new/new.component.ts

@@ -35,10 +35,13 @@ export class NewComponent implements OnInit, OnDestroy {
     this.form.reset();
 
     this.subs.push(
-      this.songService.list$().pipe(take(1)).subscribe(songs => {
-        const freeSongnumber = this.getFreeSongNumber(songs);
-        this.form.controls.number.setValue(freeSongnumber);
-      })
+      this.songService
+        .list$()
+        .pipe(take(1))
+        .subscribe(songs => {
+          const freeSongnumber = this.getFreeSongNumber(songs);
+          this.form.controls.number.setValue(freeSongnumber);
+        })
     );
   }