set song count

src/app/modules/shows/services/show-data.service.ts

@@ -14,6 +14,7 @@ export class ShowDataService {
     this.dbService.col$<Show>(this.collection).subscribe(_ => this.list$.next(_));
   }
 
+  public listRaw$ = () => this.dbService.col$<Show>(this.collection);
   public list$ = new BehaviorSubject<Show[]>([]);
   public read$ = (showId: string): Observable<Show | null> => this.list$.pipe(map(_ => _.find(s => s.id === showId) || null));
 

src/app/modules/shows/services/show-song.service.ts

@@ -29,6 +29,7 @@ export class ShowSongService {
       chordMode: user.chordMode,
       addedLive,
     };
+    await this.userService.incSongCount(songId);
     return await this.showSongDataService.add(showId, data);
   }
 
@@ -38,13 +39,15 @@ export class ShowSongService {
   public list$ = (showId: string): Observable<ShowSong[]> => this.showSongDataService.list$(showId);
   public list = (showId: string): Promise<ShowSong[]> => firstValueFrom(this.list$(showId));
 
-  public async delete$(showId: string, songId: string, index: number): Promise<void> {
-    await this.showSongDataService.delete(showId, songId);
+  public async delete$(showId: string, showSongId: string, index: number): Promise<void> {
+    const showSong = await this.read(showId, showSongId);
+    await this.showSongDataService.delete(showId, showSongId);
     const show = await firstValueFrom(this.showService.read$(showId));
     if (!show) return;
     const order = show.order;
     order.splice(index, 1);
     await this.showService.update$(showId, {order});
+    await this.userService.decSongCount(showSong.songId);
   }
 
   public update$ = async (showId: string, songId: string, data: Partial<ShowSong>): Promise<void> => await this.showSongDataService.update$(showId, songId, data);

src/app/modules/songs/song/song.component.html

@@ -29,10 +29,10 @@
           <div *ngIf="song.label">Verlag: {{ song.label }}</div>
           <div *ngIf="song.origin">Quelle: {{ song.origin }}</div>
           <div *ngIf="song.origin">Quelle: {{ song.origin }}</div>
+          <div *ngIf="songCount$()|async as count">Wie oft verwendet: {{ count }}</div>
         </div>
       </div>
 
-      <!-- <div class="text">{{song.text}}</div>-->
       <app-song-text
         *ngIf="user$ | async as user"
         [chordMode]="user.chordMode"

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

@@ -1,9 +1,9 @@
 import {Component, OnInit} from '@angular/core';
 import {ActivatedRoute, Router} from '@angular/router';
 import {SongService} from '../services/song.service';
-import {map, switchMap} from 'rxjs/operators';
+import {distinctUntilChanged, map, switchMap} from 'rxjs/operators';
 import {Song} from '../services/song';
-import {Observable} from 'rxjs';
+import {combineLatest, Observable} from 'rxjs';
 import {FileDataService} from '../services/file-data.service';
 import {File} from '../services/file';
 import {UserService} from '../../../services/user/user.service';
@@ -71,4 +71,12 @@ export class SongComponent implements OnInit {
     await this.showService.update$(show?.id, {order: [...show.order, newId ?? '']});
     await this.router.navigateByUrl('/shows/' + show.id);
   }
+
+  public songCount$ = () =>
+    combineLatest([this.user$, this.song$]).pipe(
+      map(([user, song]) => {
+        return user.songUsage[song.id];
+      }),
+      distinctUntilChanged()
+    );
 }