directly add song to show

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

@@ -64,6 +64,16 @@
       <app-button *appRole="['contributor']" [icon]="faEdit" routerLink="edit"
       >Bearbeiten
       </app-button>
+      <ng-container *appRole="['leader']">
+        <app-button [icon]="faFileCirclePlus" [matMenuTriggerFor]="menu">
+          Zu Veranstaltung hinzufügen
+        </app-button>
+        <mat-menu #menu="matMenu">
+          <app-button (click)="addSongToShow(show, song)" *ngFor="let show of privateShows$|async">
+            {{ show.date.toDate() | date: "dd.MM.yyyy" }} {{ show.showType | showType }}
+          </app-button>
+        </mat-menu>
+      </ng-container>
     </app-button-row>
   </app-card>
   <ng-container *ngIf="files$ | async as files">

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

@@ -8,7 +8,10 @@ import {FileDataService} from '../services/file-data.service';
 import {File} from '../services/file';
 import {UserService} from '../../../services/user/user.service';
 import {User} from '../../../services/user/user';
-import {faEdit, faTrash} from '@fortawesome/free-solid-svg-icons';
+import {faEdit, faFileCirclePlus, faTrash} from '@fortawesome/free-solid-svg-icons';
+import {ShowService} from '../../shows/services/show.service';
+import {Show} from '../../shows/services/show';
+import {ShowSongService} from '../../shows/services/show-song.service';
 
 @Component({
   selector: 'app-song',
@@ -21,13 +24,17 @@ export class SongComponent implements OnInit {
   public user$: Observable<User | null> | null = null;
   public faEdit = faEdit;
   public faDelete = faTrash;
+  public faFileCirclePlus = faFileCirclePlus;
+  public privateShows$ = this.showService.list$().pipe(map(show => show.filter(_ => !_.published)));
 
   public constructor(
     private activatedRoute: ActivatedRoute,
     private songService: SongService,
     private fileService: FileDataService,
     private userService: UserService,
-    private router: Router
+    private router: Router,
+    private showService: ShowService,
+    private showSongService: ShowSongService
   ) {
     this.user$ = userService.user$;
   }
@@ -57,4 +64,11 @@ export class SongComponent implements OnInit {
     await this.songService.delete(songId);
     await this.router.navigateByUrl('/songs');
   }
+
+  public async addSongToShow(show: Show, song: Song) {
+    if (!show) return;
+    const newId = await this.showSongService.new$(show?.id, song.id, false);
+    await this.showService.update$(show?.id, {order: [...show.order, newId ?? '']});
+    await this.router.navigateByUrl('/shows/' + show.id);
+  }
 }

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

@@ -13,6 +13,8 @@ import {RoleModule} from '../../../services/user/role.module';
 import {StatusTranslaterModule} from '../../../widget-modules/pipes/status-translater/status-translater.module';
 import {ButtonModule} from '../../../widget-modules/components/button/button.module';
 import {FileComponent} from './file/file.component';
+import {MatMenuModule} from '@angular/material/menu';
+import {ShowTypeTranslaterModule} from '../../../widget-modules/pipes/show-type-translater/show-type-translater.module';
 
 @NgModule({
   declarations: [SongComponent, FileComponent],
@@ -31,6 +33,8 @@ import {FileComponent} from './file/file.component';
     RoleModule,
     StatusTranslaterModule,
     ButtonModule,
+    MatMenuModule,
+    ShowTypeTranslaterModule,
   ],
 })
 export class SongModule {}