update angular version

src/app/modules/songs/services/file.service.ts

@@ -1,6 +1,6 @@
 import {Injectable} from '@angular/core';
-import {AngularFireStorage} from '@angular/fire/storage';
-import {Observable} from 'rxjs';
+import {AngularFireStorage} from '@angular/fire/compat/storage';
+import {firstValueFrom, Observable} from 'rxjs';
 import {FileDataService} from './file-data.service';
 
 @Injectable({
@@ -16,7 +16,7 @@ export class FileService {
 
   public async delete(path: string, songId: string, fileId: string): Promise<void> {
     const ref = this.storage.ref(path);
-    await ref.delete().toPromise();
+    await firstValueFrom(ref.delete());
     await this.fileDataService.delete(songId, fileId);
   }
 }

src/app/modules/songs/services/song-data.service.spec.ts

@@ -1,7 +1,7 @@
 import {TestBed, waitForAsync} from '@angular/core/testing';
 
 import {SongDataService} from './song-data.service';
-import {AngularFirestore} from '@angular/fire/firestore';
+import {AngularFirestore} from '@angular/fire/compat/firestore';
 import {of} from 'rxjs';
 
 describe('SongDataService', () => {

src/app/modules/songs/services/song.service.ts

@@ -1,10 +1,9 @@
 import {Injectable} from '@angular/core';
-import {Observable} from 'rxjs';
+import {firstValueFrom, Observable} from 'rxjs';
 import {Song} from './song';
 import {SongDataService} from './song-data.service';
-import {first} from 'rxjs/operators';
 import {UserService} from '../../../services/user/user.service';
-import firebase from 'firebase/app';
+import firebase from 'firebase/compat/app';
 import Timestamp = firebase.firestore.Timestamp;
 
 // declare let importCCLI: any;
@@ -27,7 +26,7 @@ export class SongService {
 
   public list$ = (): Observable<Song[]> => this.songDataService.list$(); //.pipe(tap(_ => (this.list = _)));
   public read$ = (songId: string): Observable<Song | null> => this.songDataService.read$(songId);
-  public read = (songId: string): Promise<Song | null> => this.read$(songId).pipe(first()).toPromise();
+  public read = (songId: string): Promise<Song | null> => firstValueFrom(this.read$(songId));
 
   public async update$(songId: string, data: Partial<Song>): Promise<void> {
     const song = await this.read(songId);

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

@@ -1,4 +1,4 @@
-import firebase from 'firebase/app';
+import firebase from 'firebase/compat/app';
 import Timestamp = firebase.firestore.Timestamp;
 
 export interface Song {

src/app/modules/songs/services/upload.service.ts

@@ -1,7 +1,7 @@
 import {Injectable} from '@angular/core';
 import {Upload} from './upload';
 import {FileDataService} from './file-data.service';
-import {AngularFireStorage} from '@angular/fire/storage';
+import {AngularFireStorage} from '@angular/fire/compat/storage';
 import {finalize} from 'rxjs/operators';
 import {FileBase} from './fileBase';
 import {FileServer} from './fileServer';

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

@@ -41,7 +41,7 @@
       <textarea
         (focus)="songtextFocus = true"
         (focusout)="songtextFocus = false"
-        [mat-autosize]="true"
+        [cdkTextareaAutosize]="true"
         formControlName="text"
         matInput
       ></textarea>
@@ -88,7 +88,7 @@
     <mat-form-field appearance="outline">
       <mat-label>Kommentar</mat-label>
       <textarea
-        [mat-autosize]="true"
+        [cdkTextareaAutosize]="true"
         formControlName="comment"
         matInput
       ></textarea>

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

@@ -1,6 +1,6 @@
 import {Component, Input} from '@angular/core';
 import {File} from '../../services/file';
-import {AngularFireStorage} from '@angular/fire/storage';
+import {AngularFireStorage} from '@angular/fire/compat/storage';
 import {Observable} from 'rxjs';
 
 @Component({