diff --git a/src/app/animations.ts b/src/app/animations.ts
index 5c055c3..2c35d09 100644
--- a/src/app/animations.ts
+++ b/src/app/animations.ts
@@ -25,7 +25,7 @@ export const fader = trigger('fader', [
           transform: 'scale(1) translateY(-10px)',
         }),
       ],
-      {optional: true},
+      {optional: true}
     ),
     // Animate the new page in
     query(
@@ -36,10 +36,10 @@ export const fader = trigger('fader', [
           style({
             opacity: 1,
             transform: 'scale(1) translateY(0)',
-          }),
+          })
         ),
       ],
-      {optional: true},
+      {optional: true}
     ),
   ]),
 ]);
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index cb3f48b..a46f4ba 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -60,5 +60,4 @@ const routes: Routes = [
   ],
   exports: [RouterModule],
 })
-export class AppRoutingModule {
-}
+export class AppRoutingModule {}
diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts
index b5f5332..e524937 100644
--- a/src/app/app.component.spec.ts
+++ b/src/app/app.component.spec.ts
@@ -3,13 +3,11 @@ import {RouterTestingModule} from '@angular/router/testing';
 import {AppComponent} from './app.component';
 
 describe('AppComponent', () => {
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [RouterTestingModule, AppComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [RouterTestingModule, AppComponent],
+    }).compileComponents();
+  }));
 
   it('should create the app', () => {
     const fixture = TestBed.createComponent(AppComponent);
diff --git a/src/app/modules/brand/brand.component.spec.ts b/src/app/modules/brand/brand.component.spec.ts
index f765998..3bd2bb0 100644
--- a/src/app/modules/brand/brand.component.spec.ts
+++ b/src/app/modules/brand/brand.component.spec.ts
@@ -6,13 +6,11 @@ describe('BrandComponent', () => {
   let component: BrandComponent;
   let fixture: ComponentFixture<BrandComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [BrandComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [BrandComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(BrandComponent);
diff --git a/src/app/modules/brand/brand.component.ts b/src/app/modules/brand/brand.component.ts
index 4ae67ea..3778882 100644
--- a/src/app/modules/brand/brand.component.ts
+++ b/src/app/modules/brand/brand.component.ts
@@ -1,11 +1,10 @@
 import {Component} from '@angular/core';
-import { LogoComponent } from '../../widget-modules/components/logo/logo.component';
+import {LogoComponent} from '../../widget-modules/components/logo/logo.component';
 
 @Component({
-    selector: 'app-brand',
-    templateUrl: './brand.component.html',
-    styleUrls: ['./brand.component.less'],
-    imports: [LogoComponent],
+  selector: 'app-brand',
+  templateUrl: './brand.component.html',
+  styleUrls: ['./brand.component.less'],
+  imports: [LogoComponent],
 })
-export class BrandComponent {
-}
+export class BrandComponent {}
diff --git a/src/app/modules/brand/brand.module.ts b/src/app/modules/brand/brand.module.ts
index 0fb064e..bf59a60 100644
--- a/src/app/modules/brand/brand.module.ts
+++ b/src/app/modules/brand/brand.module.ts
@@ -18,7 +18,6 @@ const routes: Routes = [
 ];
 
 @NgModule({
-    imports: [CommonModule, RouterModule.forChild(routes), BrandComponent, NewUserComponent],
+  imports: [CommonModule, RouterModule.forChild(routes), BrandComponent, NewUserComponent],
 })
-export class BrandModule {
-}
+export class BrandModule {}
diff --git a/src/app/modules/brand/new-user/new-user.component.spec.ts b/src/app/modules/brand/new-user/new-user.component.spec.ts
index f1e8a8c..73fccf8 100644
--- a/src/app/modules/brand/new-user/new-user.component.spec.ts
+++ b/src/app/modules/brand/new-user/new-user.component.spec.ts
@@ -6,13 +6,11 @@ describe('NewUserComponent', () => {
   let component: NewUserComponent;
   let fixture: ComponentFixture<NewUserComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [NewUserComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [NewUserComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(NewUserComponent);
diff --git a/src/app/modules/brand/new-user/new-user.component.ts b/src/app/modules/brand/new-user/new-user.component.ts
index 95b02d7..3226df8 100644
--- a/src/app/modules/brand/new-user/new-user.component.ts
+++ b/src/app/modules/brand/new-user/new-user.component.ts
@@ -2,18 +2,14 @@ import {Component} from '@angular/core';
 import {UserService} from '../../../services/user/user.service';
 import {Observable} from 'rxjs';
 import {User} from '../../../services/user/user';
-import { BrandComponent } from '../brand.component';
-import { NgIf, AsyncPipe } from '@angular/common';
+import {BrandComponent} from '../brand.component';
+import {AsyncPipe, NgIf} from '@angular/common';
 
 @Component({
-    selector: 'app-new-user',
-    templateUrl: './new-user.component.html',
-    styleUrls: ['./new-user.component.less'],
-    imports: [
-        BrandComponent,
-        NgIf,
-        AsyncPipe,
-    ],
+  selector: 'app-new-user',
+  templateUrl: './new-user.component.html',
+  styleUrls: ['./new-user.component.less'],
+  imports: [BrandComponent, NgIf, AsyncPipe],
 })
 export class NewUserComponent {
   public user$: Observable<User | null> | null = null;
diff --git a/src/app/modules/guest/guest-show.service.ts b/src/app/modules/guest/guest-show.service.ts
index c2ffddc..c31981b 100644
--- a/src/app/modules/guest/guest-show.service.ts
+++ b/src/app/modules/guest/guest-show.service.ts
@@ -10,9 +10,8 @@ import {ShowService} from '../shows/services/show.service';
 export class GuestShowService {
   public constructor(
     private showService: ShowService,
-    private guestShowDataService: GuestShowDataService,
-  ) {
-  }
+    private guestShowDataService: GuestShowDataService
+  ) {}
 
   public async share(show: Show, songs: Song[]): Promise<string> {
     const data = {
diff --git a/src/app/modules/guest/guest.component.spec.ts b/src/app/modules/guest/guest.component.spec.ts
index 4a2a784..c2be39d 100644
--- a/src/app/modules/guest/guest.component.spec.ts
+++ b/src/app/modules/guest/guest.component.spec.ts
@@ -6,13 +6,11 @@ describe('GuestComponent', () => {
   let component: GuestComponent;
   let fixture: ComponentFixture<GuestComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [GuestComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [GuestComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(GuestComponent);
diff --git a/src/app/modules/guest/guest.component.ts b/src/app/modules/guest/guest.component.ts
index 743dedf..1e70fcb 100644
--- a/src/app/modules/guest/guest.component.ts
+++ b/src/app/modules/guest/guest.component.ts
@@ -4,36 +4,28 @@ import {ActivatedRoute} from '@angular/router';
 import {map, switchMap} from 'rxjs/operators';
 import {Song} from '../songs/services/song';
 import {ConfigService} from '../../services/config.service';
-import { NgIf, NgFor, AsyncPipe, DatePipe } from '@angular/common';
-import { SongTextComponent } from '../../widget-modules/components/song-text/song-text.component';
-import { ShowTypePipe } from '../../widget-modules/pipes/show-type-translater/show-type.pipe';
+import {AsyncPipe, DatePipe, NgFor, NgIf} from '@angular/common';
+import {SongTextComponent} from '../../widget-modules/components/song-text/song-text.component';
+import {ShowTypePipe} from '../../widget-modules/pipes/show-type-translater/show-type.pipe';
 
 @Component({
-    selector: 'app-guest',
-    templateUrl: './guest.component.html',
-    styleUrls: ['./guest.component.less'],
-    imports: [
-        NgIf,
-        NgFor,
-        SongTextComponent,
-        AsyncPipe,
-        DatePipe,
-        ShowTypePipe,
-    ],
+  selector: 'app-guest',
+  templateUrl: './guest.component.html',
+  styleUrls: ['./guest.component.less'],
+  imports: [NgIf, NgFor, SongTextComponent, AsyncPipe, DatePipe, ShowTypePipe],
 })
 export class GuestComponent {
   public show$ = this.currentRoute.params.pipe(
     map(param => param.id as string),
-    switchMap(id => this.service.read$(id)),
+    switchMap(id => this.service.read$(id))
   );
   public config$ = this.configService.get$();
 
   public constructor(
     private currentRoute: ActivatedRoute,
     private service: GuestShowDataService,
-    private configService: ConfigService,
-  ) {
-  }
+    private configService: ConfigService
+  ) {}
 
   public trackBy = (index: number, show: Song) => show.id;
 }
diff --git a/src/app/modules/guest/guest.module.ts b/src/app/modules/guest/guest.module.ts
index 495381c..e562e05 100644
--- a/src/app/modules/guest/guest.module.ts
+++ b/src/app/modules/guest/guest.module.ts
@@ -6,18 +6,18 @@ import {SongTextComponent} from '../../widget-modules/components/song-text/song-
 import {ShowTypePipe} from '../../widget-modules/pipes/show-type-translater/show-type.pipe';
 
 @NgModule({
-    imports: [
-        CommonModule,
-        RouterModule.forChild([
-            {
-                path: ':id',
-                component: GuestComponent,
-            },
-        ]),
-        SongTextComponent,
-        ShowTypePipe,
-        GuestComponent,
-    ],
-    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  imports: [
+    CommonModule,
+    RouterModule.forChild([
+      {
+        path: ':id',
+        component: GuestComponent,
+      },
+    ]),
+    SongTextComponent,
+    ShowTypePipe,
+    GuestComponent,
+  ],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
 })
 export class GuestModule {}
diff --git a/src/app/modules/presentation/monitor/legal/legal.component.spec.ts b/src/app/modules/presentation/monitor/legal/legal.component.spec.ts
index a989f2f..3a3da68 100644
--- a/src/app/modules/presentation/monitor/legal/legal.component.spec.ts
+++ b/src/app/modules/presentation/monitor/legal/legal.component.spec.ts
@@ -6,13 +6,11 @@ describe('LegalComponent', () => {
   let component: LegalComponent;
   let fixture: ComponentFixture<LegalComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [LegalComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [LegalComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(LegalComponent);
diff --git a/src/app/modules/presentation/monitor/legal/legal.component.ts b/src/app/modules/presentation/monitor/legal/legal.component.ts
index b2c8823..c341c3f 100644
--- a/src/app/modules/presentation/monitor/legal/legal.component.ts
+++ b/src/app/modules/presentation/monitor/legal/legal.component.ts
@@ -1,13 +1,13 @@
 import {Component, Input} from '@angular/core';
 import {Song} from '../../../songs/services/song';
 import {Config} from '../../../../services/config';
-import { NgIf } from '@angular/common';
+import {NgIf} from '@angular/common';
 
 @Component({
-    selector: 'app-legal',
-    templateUrl: './legal.component.html',
-    styleUrls: ['./legal.component.less'],
-    imports: [NgIf],
+  selector: 'app-legal',
+  templateUrl: './legal.component.html',
+  styleUrls: ['./legal.component.less'],
+  imports: [NgIf],
 })
 export class LegalComponent {
   @Input() public song: Song | null = null;
diff --git a/src/app/modules/presentation/monitor/logo/logo.component.spec.ts b/src/app/modules/presentation/monitor/logo/logo.component.spec.ts
index 981b563..ee5e732 100644
--- a/src/app/modules/presentation/monitor/logo/logo.component.spec.ts
+++ b/src/app/modules/presentation/monitor/logo/logo.component.spec.ts
@@ -6,13 +6,11 @@ describe('LogoComponent', () => {
   let component: LogoComponent;
   let fixture: ComponentFixture<LogoComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [LogoComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [LogoComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(LogoComponent);
diff --git a/src/app/modules/presentation/monitor/logo/logo.component.ts b/src/app/modules/presentation/monitor/logo/logo.component.ts
index 9902d5c..e96f1f2 100644
--- a/src/app/modules/presentation/monitor/logo/logo.component.ts
+++ b/src/app/modules/presentation/monitor/logo/logo.component.ts
@@ -1,9 +1,8 @@
 import {Component} from '@angular/core';
 
 @Component({
-    selector: 'app-logo',
-    templateUrl: './logo.component.html',
-    styleUrls: ['./logo.component.less'],
+  selector: 'app-logo',
+  templateUrl: './logo.component.html',
+  styleUrls: ['./logo.component.less'],
 })
-export class LogoComponent {
-}
+export class LogoComponent {}
diff --git a/src/app/modules/presentation/monitor/monitor.component.html b/src/app/modules/presentation/monitor/monitor.component.html
index cced4b6..4ed07f8 100644
--- a/src/app/modules/presentation/monitor/monitor.component.html
+++ b/src/app/modules/presentation/monitor/monitor.component.html
@@ -34,8 +34,8 @@
     [fullscreen]="true"
     [header]="song.title"
     [index]="index??0"
-    [showSwitch]="false"
     [showComments]="false"
+    [showSwitch]="false"
     [text]="song.text"
     chordMode="hide"
   ></app-song-text>
diff --git a/src/app/modules/presentation/monitor/monitor.component.spec.ts b/src/app/modules/presentation/monitor/monitor.component.spec.ts
index b4ec1ce..ca061c2 100644
--- a/src/app/modules/presentation/monitor/monitor.component.spec.ts
+++ b/src/app/modules/presentation/monitor/monitor.component.spec.ts
@@ -6,13 +6,11 @@ describe('MonitorComponent', () => {
   let component: MonitorComponent;
   let fixture: ComponentFixture<MonitorComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [MonitorComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [MonitorComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(MonitorComponent);
diff --git a/src/app/modules/presentation/monitor/monitor.component.ts b/src/app/modules/presentation/monitor/monitor.component.ts
index c290983..d8a8ae8 100644
--- a/src/app/modules/presentation/monitor/monitor.component.ts
+++ b/src/app/modules/presentation/monitor/monitor.component.ts
@@ -10,29 +10,20 @@ import {ConfigService} from '../../../services/config.service';
 import {songSwitch} from '../../../widget-modules/components/song-text/animation';
 import {TextRenderingService} from '../../songs/services/text-rendering.service';
 import {PresentationBackground, Show} from '../../shows/services/show';
-import {GlobalSettings} from '../../../services/global-settings';
 import {ShowSongService} from '../../shows/services/show-song.service';
 import {openFullscreen} from '../../../services/fullscreen';
-import { NgIf, AsyncPipe, DatePipe } from '@angular/common';
-import { LogoComponent } from './logo/logo.component';
-import { SongTextComponent } from '../../../widget-modules/components/song-text/song-text.component';
-import { LegalComponent } from './legal/legal.component';
-import { ShowTypePipe } from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
+import {AsyncPipe, DatePipe, NgIf} from '@angular/common';
+import {LogoComponent} from './logo/logo.component';
+import {SongTextComponent} from '../../../widget-modules/components/song-text/song-text.component';
+import {LegalComponent} from './legal/legal.component';
+import {ShowTypePipe} from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
 
 @Component({
-    selector: 'app-monitor',
-    templateUrl: './monitor.component.html',
-    styleUrls: ['./monitor.component.less'],
-    animations: [songSwitch],
-    imports: [
-        NgIf,
-        LogoComponent,
-        SongTextComponent,
-        LegalComponent,
-        AsyncPipe,
-        DatePipe,
-        ShowTypePipe,
-    ],
+  selector: 'app-monitor',
+  templateUrl: './monitor.component.html',
+  styleUrls: ['./monitor.component.less'],
+  animations: [songSwitch],
+  imports: [NgIf, LogoComponent, SongTextComponent, LegalComponent, AsyncPipe, DatePipe, ShowTypePipe],
 })
 export class MonitorComponent implements OnInit {
   public song: Song | null = null;
@@ -54,7 +45,7 @@ export class MonitorComponent implements OnInit {
     private textRenderingService: TextRenderingService,
     private globalSettingsService: GlobalSettingsService,
     private configService: ConfigService,
-    private cRef: ChangeDetectorRef,
+    private cRef: ChangeDetectorRef
   ) {
     this.config$ = configService.get$();
   }
@@ -65,15 +56,15 @@ export class MonitorComponent implements OnInit {
       .pipe(
         debounceTime(100),
         filter(_ => !!_),
-        map(_ => _ as GlobalSettings),
+        map(_ => _),
         map(_ => _.currentShow),
         distinctUntilChanged(),
-        tap(_ => (this.currentShowId = _)),
+        tap(_ => (this.currentShowId = _))
       )
       .pipe(
         switchMap(_ => this.showService.read$(_)),
         filter(_ => !!_),
-        map(_ => _ as Show),
+        map(_ => _),
         tap<Show>(_ => {
           this.showType = _.showType;
           this.date = _.date.toDate();
@@ -90,7 +81,7 @@ export class MonitorComponent implements OnInit {
         }),
         switchMap((_: Show) => this.showSongService.read$(_.id, _.presentationSongId)),
         filter(_ => !!_),
-        map(_ => _ as Song),
+        map(_ => _ as Song)
       )
       .subscribe(_ => {
         this.song = _;
diff --git a/src/app/modules/presentation/presentation-routing.module.ts b/src/app/modules/presentation/presentation-routing.module.ts
index d7e06fd..4bc44f8 100644
--- a/src/app/modules/presentation/presentation-routing.module.ts
+++ b/src/app/modules/presentation/presentation-routing.module.ts
@@ -28,5 +28,4 @@ const routes: Routes = [
   imports: [RouterModule.forChild(routes)],
   exports: [RouterModule],
 })
-export class PresentationRoutingModule {
-}
+export class PresentationRoutingModule {}
diff --git a/src/app/modules/presentation/presentation.module.ts b/src/app/modules/presentation/presentation.module.ts
index 035f838..1b32063 100644
--- a/src/app/modules/presentation/presentation.module.ts
+++ b/src/app/modules/presentation/presentation.module.ts
@@ -22,8 +22,8 @@ import {SectionTypePipe} from '../../widget-modules/pipes/section-type-translato
 import {ShowTypePipe} from '../../widget-modules/pipes/show-type-translater/show-type.pipe';
 
 @NgModule({
-    exports: [RemoteComponent],
-    imports: [
+  exports: [RemoteComponent],
+  imports: [
     CommonModule,
     PresentationRoutingModule,
     MatFormFieldModule,
@@ -38,7 +38,11 @@ import {ShowTypePipe} from '../../widget-modules/pipes/show-type-translater/show
     AddSongComponent,
     ReactiveFormsModule,
     MatInputModule,
-    MonitorComponent, RemoteComponent, LegalComponent, LogoComponent, SelectComponent,
-],
+    MonitorComponent,
+    RemoteComponent,
+    LegalComponent,
+    LogoComponent,
+    SelectComponent,
+  ],
 })
 export class PresentationModule {}
diff --git a/src/app/modules/presentation/remote/remote.component.spec.ts b/src/app/modules/presentation/remote/remote.component.spec.ts
index e3a57fb..06adba8 100644
--- a/src/app/modules/presentation/remote/remote.component.spec.ts
+++ b/src/app/modules/presentation/remote/remote.component.spec.ts
@@ -6,13 +6,11 @@ describe('RemoteComponent', () => {
   let component: RemoteComponent;
   let fixture: ComponentFixture<RemoteComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [RemoteComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [RemoteComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(RemoteComponent);
diff --git a/src/app/modules/presentation/remote/remote.component.ts b/src/app/modules/presentation/remote/remote.component.ts
index e792fe5..ffbd8fe 100644
--- a/src/app/modules/presentation/remote/remote.component.ts
+++ b/src/app/modules/presentation/remote/remote.component.ts
@@ -11,22 +11,21 @@ import {debounceTime, filter, map} from 'rxjs/operators';
 import {fade} from '../../../animations';
 import {TextRenderingService} from '../../songs/services/text-rendering.service';
 import {Section} from '../../songs/services/section';
-import {GlobalSettings} from '../../../services/global-settings';
 import {LineType} from '../../songs/services/line-type';
-import { NgIf, NgFor, AsyncPipe, DatePipe } from '@angular/common';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
-import { MatFormField, MatLabel } from '@angular/material/form-field';
-import { MatInput } from '@angular/material/input';
-import { ReactiveFormsModule, FormsModule } from '@angular/forms';
-import { MatButton } from '@angular/material/button';
-import { RouterLink } from '@angular/router';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
-import { MatSelect } from '@angular/material/select';
-import { MatOption } from '@angular/material/core';
-import { MatSlider, MatSliderThumb } from '@angular/material/slider';
-import { AddSongComponent } from '../../../widget-modules/components/add-song/add-song.component';
-import { ShowTypePipe } from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
-import { SectionTypePipe } from '../../../widget-modules/pipes/section-type-translator/section-type.pipe';
+import {AsyncPipe, DatePipe, NgFor, NgIf} from '@angular/common';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
+import {MatFormField, MatLabel} from '@angular/material/form-field';
+import {MatInput} from '@angular/material/input';
+import {FormsModule, ReactiveFormsModule} from '@angular/forms';
+import {MatButton} from '@angular/material/button';
+import {RouterLink} from '@angular/router';
+import {FaIconComponent} from '@fortawesome/angular-fontawesome';
+import {MatSelect} from '@angular/material/select';
+import {MatOption} from '@angular/material/core';
+import {MatSlider, MatSliderThumb} from '@angular/material/slider';
+import {AddSongComponent} from '../../../widget-modules/components/add-song/add-song.component';
+import {ShowTypePipe} from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
+import {SectionTypePipe} from '../../../widget-modules/pipes/section-type-translator/section-type.pipe';
 
 export interface PresentationSong {
   id: string;
@@ -35,33 +34,33 @@ export interface PresentationSong {
 }
 
 @Component({
-    selector: 'app-remote',
-    templateUrl: './remote.component.html',
-    styleUrls: ['./remote.component.less'],
-    animations: [fade],
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    imports: [
-        NgIf,
-        CardComponent,
-        NgFor,
-        MatFormField,
-        MatLabel,
-        MatInput,
-        ReactiveFormsModule,
-        FormsModule,
-        MatButton,
-        RouterLink,
-        FaIconComponent,
-        MatSelect,
-        MatOption,
-        MatSlider,
-        MatSliderThumb,
-        AddSongComponent,
-        AsyncPipe,
-        DatePipe,
-        ShowTypePipe,
-        SectionTypePipe,
-    ],
+  selector: 'app-remote',
+  templateUrl: './remote.component.html',
+  styleUrls: ['./remote.component.less'],
+  animations: [fade],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [
+    NgIf,
+    CardComponent,
+    NgFor,
+    MatFormField,
+    MatLabel,
+    MatInput,
+    ReactiveFormsModule,
+    FormsModule,
+    MatButton,
+    RouterLink,
+    FaIconComponent,
+    MatSelect,
+    MatOption,
+    MatSlider,
+    MatSliderThumb,
+    AddSongComponent,
+    AsyncPipe,
+    DatePipe,
+    ShowTypePipe,
+    SectionTypePipe,
+  ],
 })
 export class RemoteComponent {
   public show: Show | null = null;
@@ -81,12 +80,12 @@ export class RemoteComponent {
     private songService: SongService,
     private textRenderingService: TextRenderingService,
     globalSettingsService: GlobalSettingsService,
-    private cRef: ChangeDetectorRef,
+    private cRef: ChangeDetectorRef
   ) {
     globalSettingsService.get$
       .pipe(
         filter(_ => !!_),
-        map(_ => _.currentShow),
+        map(_ => _.currentShow)
       )
       .subscribe(_ => {
         this.onShowChanged(_);
diff --git a/src/app/modules/presentation/select/select.component.ts b/src/app/modules/presentation/select/select.component.ts
index 727b8e3..b4f8e9f 100644
--- a/src/app/modules/presentation/select/select.component.ts
+++ b/src/app/modules/presentation/select/select.component.ts
@@ -5,27 +5,18 @@ import {Show} from '../../shows/services/show';
 import {GlobalSettingsService} from '../../../services/global-settings.service';
 import {Router} from '@angular/router';
 import {fade} from '../../../animations';
-import { NgIf, NgFor, AsyncPipe, DatePipe } from '@angular/common';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
-import { MatButton } from '@angular/material/button';
-import { UserNameComponent } from '../../../services/user/user-name/user-name.component';
-import { ShowTypePipe } from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
+import {AsyncPipe, DatePipe, NgFor, NgIf} from '@angular/common';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
+import {MatButton} from '@angular/material/button';
+import {UserNameComponent} from '../../../services/user/user-name/user-name.component';
+import {ShowTypePipe} from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
 
 @Component({
-    selector: 'app-select',
-    templateUrl: './select.component.html',
-    styleUrls: ['./select.component.less'],
-    animations: [fade],
-    imports: [
-        NgIf,
-        CardComponent,
-        NgFor,
-        MatButton,
-        UserNameComponent,
-        AsyncPipe,
-        DatePipe,
-        ShowTypePipe,
-    ],
+  selector: 'app-select',
+  templateUrl: './select.component.html',
+  styleUrls: ['./select.component.less'],
+  animations: [fade],
+  imports: [NgIf, CardComponent, NgFor, MatButton, UserNameComponent, AsyncPipe, DatePipe, ShowTypePipe],
 })
 export class SelectComponent implements OnInit {
   public visible = false;
@@ -33,8 +24,11 @@ export class SelectComponent implements OnInit {
     .list$(true)
     .pipe(map(_ => _.filter(_ => _.date.toDate() > new Date(new Date().setMonth(new Date().getMonth() - 1))).sort((a, b) => (b.date < a.date ? -1 : b.date > a.date ? 1 : 0))));
 
-  public constructor(private showService: ShowService, private globalSettingsService: GlobalSettingsService, private router: Router) {
-  }
+  public constructor(
+    private showService: ShowService,
+    private globalSettingsService: GlobalSettingsService,
+    private router: Router
+  ) {}
 
   public async selectShow(show: Show) {
     this.visible = false;
diff --git a/src/app/modules/presentation/services/presentation.service.ts b/src/app/modules/presentation/services/presentation.service.ts
index 79f68ad..da24451 100644
--- a/src/app/modules/presentation/services/presentation.service.ts
+++ b/src/app/modules/presentation/services/presentation.service.ts
@@ -3,5 +3,4 @@ import {Injectable} from '@angular/core';
 @Injectable({
   providedIn: 'root',
 })
-export class PresentationService {
-}
+export class PresentationService {}
diff --git a/src/app/modules/shows/dialog/archive-dialog/archive-dialog.component.spec.ts b/src/app/modules/shows/dialog/archive-dialog/archive-dialog.component.spec.ts
index ab85da3..e82f174 100644
--- a/src/app/modules/shows/dialog/archive-dialog/archive-dialog.component.spec.ts
+++ b/src/app/modules/shows/dialog/archive-dialog/archive-dialog.component.spec.ts
@@ -8,8 +8,8 @@ describe('ArchiveDialogComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-    imports: [ArchiveDialogComponent],
-}).compileComponents();
+      imports: [ArchiveDialogComponent],
+    }).compileComponents();
 
     fixture = TestBed.createComponent(ArchiveDialogComponent);
     component = fixture.componentInstance;
diff --git a/src/app/modules/shows/dialog/archive-dialog/archive-dialog.component.ts b/src/app/modules/shows/dialog/archive-dialog/archive-dialog.component.ts
index ae6e737..5861ae0 100644
--- a/src/app/modules/shows/dialog/archive-dialog/archive-dialog.component.ts
+++ b/src/app/modules/shows/dialog/archive-dialog/archive-dialog.component.ts
@@ -1,19 +1,11 @@
 import {Component} from '@angular/core';
-import { CdkScrollable } from '@angular/cdk/scrolling';
-import { MatDialogContent, MatDialogActions, MatDialogClose } from '@angular/material/dialog';
-import { MatButton } from '@angular/material/button';
+import {MatDialogActions, MatDialogClose, MatDialogContent} from '@angular/material/dialog';
+import {MatButton} from '@angular/material/button';
 
 @Component({
-    selector: 'app-archive-dialog',
-    templateUrl: './archive-dialog.component.html',
-    styleUrls: ['./archive-dialog.component.less'],
-    imports: [
-        CdkScrollable,
-        MatDialogContent,
-        MatDialogActions,
-        MatButton,
-        MatDialogClose,
-    ],
+  selector: 'app-archive-dialog',
+  templateUrl: './archive-dialog.component.html',
+  styleUrls: ['./archive-dialog.component.less'],
+  imports: [MatDialogContent, MatDialogActions, MatButton, MatDialogClose],
 })
-export class ArchiveDialogComponent {
-}
+export class ArchiveDialogComponent {}
diff --git a/src/app/modules/shows/edit/edit.component.ts b/src/app/modules/shows/edit/edit.component.ts
index 193b586..77961b6 100644
--- a/src/app/modules/shows/edit/edit.component.ts
+++ b/src/app/modules/shows/edit/edit.component.ts
@@ -3,45 +3,45 @@ import {ShowDataService} from '../services/show-data.service';
 import {Observable, take} from 'rxjs';
 import {Show} from '../services/show';
 import {ShowService} from '../services/show.service';
-import { FormControl, FormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
+import {FormControl, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
 import {ActivatedRoute, Router} from '@angular/router';
 import {faSave} from '@fortawesome/free-solid-svg-icons';
 import {map, switchMap} from 'rxjs/operators';
 import firebase from 'firebase/compat/app';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
-import { MatFormField, MatLabel, MatSuffix } from '@angular/material/form-field';
-import { MatSelect } from '@angular/material/select';
-import { MatOptgroup, MatOption } from '@angular/material/core';
-import { NgFor } from '@angular/common';
-import { MatInput } from '@angular/material/input';
-import { MatDatepickerInput, MatDatepickerToggle, MatDatepicker } from '@angular/material/datepicker';
-import { ButtonRowComponent } from '../../../widget-modules/components/button-row/button-row.component';
-import { ButtonComponent } from '../../../widget-modules/components/button/button.component';
-import { ShowTypePipe } from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
+import {MatFormField, MatLabel, MatSuffix} from '@angular/material/form-field';
+import {MatSelect} from '@angular/material/select';
+import {MatOptgroup, MatOption} from '@angular/material/core';
+import {NgFor} from '@angular/common';
+import {MatInput} from '@angular/material/input';
+import {MatDatepicker, MatDatepickerInput, MatDatepickerToggle} from '@angular/material/datepicker';
+import {ButtonRowComponent} from '../../../widget-modules/components/button-row/button-row.component';
+import {ButtonComponent} from '../../../widget-modules/components/button/button.component';
+import {ShowTypePipe} from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
 import Timestamp = firebase.firestore.Timestamp;
 
 @Component({
-    selector: 'app-edit',
-    templateUrl: './edit.component.html',
-    styleUrls: ['./edit.component.less'],
-    imports: [
-        CardComponent,
-        ReactiveFormsModule,
-        MatFormField,
-        MatLabel,
-        MatSelect,
-        MatOptgroup,
-        NgFor,
-        MatOption,
-        MatInput,
-        MatDatepickerInput,
-        MatDatepickerToggle,
-        MatSuffix,
-        MatDatepicker,
-        ButtonRowComponent,
-        ButtonComponent,
-        ShowTypePipe,
-    ],
+  selector: 'app-edit',
+  templateUrl: './edit.component.html',
+  styleUrls: ['./edit.component.less'],
+  imports: [
+    CardComponent,
+    ReactiveFormsModule,
+    MatFormField,
+    MatLabel,
+    MatSelect,
+    MatOptgroup,
+    NgFor,
+    MatOption,
+    MatInput,
+    MatDatepickerInput,
+    MatDatepickerToggle,
+    MatSuffix,
+    MatDatepicker,
+    ButtonRowComponent,
+    ButtonComponent,
+    ShowTypePipe,
+  ],
 })
 export class EditComponent implements OnInit {
   public shows$: Observable<Show[]>;
@@ -54,7 +54,12 @@ export class EditComponent implements OnInit {
   });
   public faSave = faSave;
 
-  public constructor(private showService: ShowService, showDataService: ShowDataService, private router: Router, private activatedRoute: ActivatedRoute) {
+  public constructor(
+    private showService: ShowService,
+    showDataService: ShowDataService,
+    private router: Router,
+    private activatedRoute: ActivatedRoute
+  ) {
     this.shows$ = showDataService.list$;
   }
 
@@ -66,7 +71,7 @@ export class EditComponent implements OnInit {
         map(param => param as {showId: string}),
         map(param => param.showId),
         switchMap((showId: string) => this.showService.read$(showId)),
-        take(1),
+        take(1)
       )
       .subscribe(show => {
         this.form.setValue({
@@ -83,13 +88,10 @@ export class EditComponent implements OnInit {
       return;
     }
 
-    await this.showService.update$(
-      this.form.value.id as string,
-      {
-        date: Timestamp.fromDate(this.form.value.date),
-        showType: this.form.value.showType,
-      } as Partial<Show>,
-    );
+    await this.showService.update$(this.form.value.id, {
+      date: Timestamp.fromDate(this.form.value.date),
+      showType: this.form.value.showType,
+    } as Partial<Show>);
     await this.router.navigateByUrl(`/shows/${this.form.value.id ?? ''}`);
   }
 }
diff --git a/src/app/modules/shows/list/filter/filter.component.spec.ts b/src/app/modules/shows/list/filter/filter.component.spec.ts
index 9ff4239..3f45ed4 100644
--- a/src/app/modules/shows/list/filter/filter.component.spec.ts
+++ b/src/app/modules/shows/list/filter/filter.component.spec.ts
@@ -8,8 +8,8 @@ describe('FilterComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-    imports: [FilterComponent],
-}).compileComponents();
+      imports: [FilterComponent],
+    }).compileComponents();
   });
 
   beforeEach(() => {
diff --git a/src/app/modules/shows/list/filter/filter.component.ts b/src/app/modules/shows/list/filter/filter.component.ts
index 6695b44..4374d1c 100644
--- a/src/app/modules/shows/list/filter/filter.component.ts
+++ b/src/app/modules/shows/list/filter/filter.component.ts
@@ -1,7 +1,7 @@
 import {Component, Input} from '@angular/core';
-import { KeyValue, NgFor } from '@angular/common';
+import {KeyValue, NgFor} from '@angular/common';
 import {ActivatedRoute, Router} from '@angular/router';
-import { UntypedFormBuilder, UntypedFormGroup, ReactiveFormsModule } from '@angular/forms';
+import {ReactiveFormsModule, UntypedFormBuilder, UntypedFormGroup} from '@angular/forms';
 import {FilterValues} from './filter-values';
 import {Show} from '../../services/show';
 import {ShowService} from '../../services/show.service';
@@ -10,25 +10,16 @@ import {combineLatest, Observable} from 'rxjs';
 import {dynamicSort, onlyUnique} from '../../../../services/filter.helper';
 import {UserService} from '../../../../services/user/user.service';
 import {isEqual} from 'lodash';
-import { MatFormField, MatLabel } from '@angular/material/form-field';
-import { MatSelect } from '@angular/material/select';
-import { MatOption, MatOptgroup } from '@angular/material/core';
-import { ShowTypePipe } from '../../../../widget-modules/pipes/show-type-translater/show-type.pipe';
+import {MatFormField, MatLabel} from '@angular/material/form-field';
+import {MatSelect} from '@angular/material/select';
+import {MatOptgroup, MatOption} from '@angular/material/core';
+import {ShowTypePipe} from '../../../../widget-modules/pipes/show-type-translater/show-type.pipe';
 
 @Component({
-    selector: 'app-filter',
-    templateUrl: './filter.component.html',
-    styleUrls: ['./filter.component.less'],
-    imports: [
-        ReactiveFormsModule,
-        MatFormField,
-        MatLabel,
-        MatSelect,
-        NgFor,
-        MatOption,
-        MatOptgroup,
-        ShowTypePipe,
-    ],
+  selector: 'app-filter',
+  templateUrl: './filter.component.html',
+  styleUrls: ['./filter.component.less'],
+  imports: [ReactiveFormsModule, MatFormField, MatLabel, MatSelect, NgFor, MatOption, MatOptgroup, ShowTypePipe],
 })
 export class FilterComponent {
   @Input() public route = '/shows/';
@@ -52,7 +43,7 @@ export class FilterComponent {
     private showService: ShowService,
     private userService: UserService,
     activatedRoute: ActivatedRoute,
-    fb: UntypedFormBuilder,
+    fb: UntypedFormBuilder
   ) {
     this.filterFormGroup = fb.group({
       time: 1,
@@ -77,7 +68,7 @@ export class FilterComponent {
       this.showService.list$().pipe(
         map(shows => {
           return shows.map(show => show.owner).filter(onlyUnique);
-        }),
+        })
       ),
       this.userService.users$,
     ]).pipe(
@@ -90,7 +81,7 @@ export class FilterComponent {
           .sort(dynamicSort('value'));
       }),
       distinctUntilChanged(isEqual),
-      map(_ => _ as {key: string; value: string}[]),
+      map(_ => _ as {key: string; value: string}[])
     );
   };
 
diff --git a/src/app/modules/shows/list/list-item/list-item.component.spec.ts b/src/app/modules/shows/list/list-item/list-item.component.spec.ts
index 0d9fc61..39f3c0b 100644
--- a/src/app/modules/shows/list/list-item/list-item.component.spec.ts
+++ b/src/app/modules/shows/list/list-item/list-item.component.spec.ts
@@ -6,13 +6,11 @@ describe('ListItemComponent', () => {
   let component: ListItemComponent;
   let fixture: ComponentFixture<ListItemComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [ListItemComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [ListItemComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(ListItemComponent);
diff --git a/src/app/modules/shows/list/list-item/list-item.component.ts b/src/app/modules/shows/list/list-item/list-item.component.ts
index fc82b53..c816e13 100644
--- a/src/app/modules/shows/list/list-item/list-item.component.ts
+++ b/src/app/modules/shows/list/list-item/list-item.component.ts
@@ -1,19 +1,14 @@
 import {Component, Input} from '@angular/core';
 import {Show} from '../../services/show';
-import { NgIf, DatePipe } from '@angular/common';
-import { UserNameComponent } from '../../../../services/user/user-name/user-name.component';
-import { ShowTypePipe } from '../../../../widget-modules/pipes/show-type-translater/show-type.pipe';
+import {DatePipe, NgIf} from '@angular/common';
+import {UserNameComponent} from '../../../../services/user/user-name/user-name.component';
+import {ShowTypePipe} from '../../../../widget-modules/pipes/show-type-translater/show-type.pipe';
 
 @Component({
-    selector: 'app-list-item',
-    templateUrl: './list-item.component.html',
-    styleUrls: ['./list-item.component.less'],
-    imports: [
-        NgIf,
-        UserNameComponent,
-        DatePipe,
-        ShowTypePipe,
-    ],
+  selector: 'app-list-item',
+  templateUrl: './list-item.component.html',
+  styleUrls: ['./list-item.component.less'],
+  imports: [NgIf, UserNameComponent, DatePipe, ShowTypePipe],
 })
 export class ListItemComponent {
   @Input() public show: Show | null = null;
diff --git a/src/app/modules/shows/list/list.component.spec.ts b/src/app/modules/shows/list/list.component.spec.ts
index 12ff705..bbde914 100644
--- a/src/app/modules/shows/list/list.component.spec.ts
+++ b/src/app/modules/shows/list/list.component.spec.ts
@@ -6,13 +6,11 @@ describe('ListComponent', () => {
   let component: ListComponent;
   let fixture: ComponentFixture<ListComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [ListComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [ListComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(ListComponent);
diff --git a/src/app/modules/shows/list/list.component.ts b/src/app/modules/shows/list/list.component.ts
index 7183ced..fd5c55e 100644
--- a/src/app/modules/shows/list/list.component.ts
+++ b/src/app/modules/shows/list/list.component.ts
@@ -4,33 +4,22 @@ import {Show} from '../services/show';
 import {fade} from '../../../animations';
 import {ShowService} from '../services/show.service';
 import {FilterValues} from './filter/filter-values';
-import { ActivatedRoute, RouterLink } from '@angular/router';
+import {ActivatedRoute, RouterLink} from '@angular/router';
 import {map} from 'rxjs/operators';
-import { RoleDirective } from '../../../services/user/role.directive';
-import { ListHeaderComponent } from '../../../widget-modules/components/list-header/list-header.component';
-import { NgIf, NgFor, AsyncPipe } from '@angular/common';
-import { FilterComponent } from './filter/filter.component';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
-import { ListItemComponent } from './list-item/list-item.component';
-import { SortByPipe } from '../../../widget-modules/pipes/sort-by/sort-by.pipe';
+import {RoleDirective} from '../../../services/user/role.directive';
+import {ListHeaderComponent} from '../../../widget-modules/components/list-header/list-header.component';
+import {AsyncPipe, NgFor, NgIf} from '@angular/common';
+import {FilterComponent} from './filter/filter.component';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
+import {ListItemComponent} from './list-item/list-item.component';
+import {SortByPipe} from '../../../widget-modules/pipes/sort-by/sort-by.pipe';
 
 @Component({
-    selector: 'app-list',
-    templateUrl: './list.component.html',
-    styleUrls: ['./list.component.less'],
-    animations: [fade],
-    imports: [
-        RoleDirective,
-        ListHeaderComponent,
-        NgIf,
-        FilterComponent,
-        CardComponent,
-        NgFor,
-        ListItemComponent,
-        RouterLink,
-        AsyncPipe,
-        SortByPipe,
-    ],
+  selector: 'app-list',
+  templateUrl: './list.component.html',
+  styleUrls: ['./list.component.less'],
+  animations: [fade],
+  imports: [RoleDirective, ListHeaderComponent, NgIf, FilterComponent, CardComponent, NgFor, ListItemComponent, RouterLink, AsyncPipe, SortByPipe],
 })
 export class ListComponent {
   public shows$ = this.showService.list$();
@@ -40,13 +29,13 @@ export class ListComponent {
       const filterValues = params as FilterValues;
       if (!filterValues?.time) return 1;
       return +filterValues.time;
-    }),
+    })
   );
   public owner$ = this.activatedRoute.queryParams.pipe(
     map(params => {
       const filterValues = params as FilterValues;
       return filterValues?.owner;
-    }),
+    })
   );
 
   public publicShows$ = combineLatest([this.shows$, this.lastMonths$, this.owner$]).pipe(
@@ -57,15 +46,14 @@ export class ListComponent {
           d.setMonth(d.getMonth() - lastMonths);
           return f.published && f.date.toDate() >= d;
         })
-        .filter(show => !owner || show.owner === owner),
-    ),
+        .filter(show => !owner || show.owner === owner)
+    )
   );
 
   public constructor(
     private showService: ShowService,
-    private activatedRoute: ActivatedRoute,
-  ) {
-  }
+    private activatedRoute: ActivatedRoute
+  ) {}
 
   public trackBy = (index: number, show: unknown) => (show as Show).id;
 }
diff --git a/src/app/modules/shows/new/new.component.spec.ts b/src/app/modules/shows/new/new.component.spec.ts
index 19bae0c..81db59f 100644
--- a/src/app/modules/shows/new/new.component.spec.ts
+++ b/src/app/modules/shows/new/new.component.spec.ts
@@ -6,13 +6,11 @@ describe('NewComponent', () => {
   let component: NewComponent;
   let fixture: ComponentFixture<NewComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [NewComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [NewComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(NewComponent);
diff --git a/src/app/modules/shows/new/new.component.ts b/src/app/modules/shows/new/new.component.ts
index 9acf9b5..d5357b2 100644
--- a/src/app/modules/shows/new/new.component.ts
+++ b/src/app/modules/shows/new/new.component.ts
@@ -3,42 +3,42 @@ import {ShowDataService} from '../services/show-data.service';
 import {Observable} from 'rxjs';
 import {Show} from '../services/show';
 import {ShowService} from '../services/show.service';
-import { UntypedFormControl, UntypedFormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
+import {ReactiveFormsModule, UntypedFormControl, UntypedFormGroup, Validators} from '@angular/forms';
 import {Router} from '@angular/router';
 import {faSave} from '@fortawesome/free-solid-svg-icons';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
-import { MatFormField, MatLabel, MatSuffix } from '@angular/material/form-field';
-import { MatSelect } from '@angular/material/select';
-import { MatOptgroup, MatOption } from '@angular/material/core';
-import { NgFor } from '@angular/common';
-import { MatInput } from '@angular/material/input';
-import { MatDatepickerInput, MatDatepickerToggle, MatDatepicker } from '@angular/material/datepicker';
-import { ButtonRowComponent } from '../../../widget-modules/components/button-row/button-row.component';
-import { ButtonComponent } from '../../../widget-modules/components/button/button.component';
-import { ShowTypePipe } from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
+import {MatFormField, MatLabel, MatSuffix} from '@angular/material/form-field';
+import {MatSelect} from '@angular/material/select';
+import {MatOptgroup, MatOption} from '@angular/material/core';
+import {NgFor} from '@angular/common';
+import {MatInput} from '@angular/material/input';
+import {MatDatepicker, MatDatepickerInput, MatDatepickerToggle} from '@angular/material/datepicker';
+import {ButtonRowComponent} from '../../../widget-modules/components/button-row/button-row.component';
+import {ButtonComponent} from '../../../widget-modules/components/button/button.component';
+import {ShowTypePipe} from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
 
 @Component({
-    selector: 'app-new',
-    templateUrl: './new.component.html',
-    styleUrls: ['./new.component.less'],
-    imports: [
-        CardComponent,
-        ReactiveFormsModule,
-        MatFormField,
-        MatLabel,
-        MatSelect,
-        MatOptgroup,
-        NgFor,
-        MatOption,
-        MatInput,
-        MatDatepickerInput,
-        MatDatepickerToggle,
-        MatSuffix,
-        MatDatepicker,
-        ButtonRowComponent,
-        ButtonComponent,
-        ShowTypePipe,
-    ],
+  selector: 'app-new',
+  templateUrl: './new.component.html',
+  styleUrls: ['./new.component.less'],
+  imports: [
+    CardComponent,
+    ReactiveFormsModule,
+    MatFormField,
+    MatLabel,
+    MatSelect,
+    MatOptgroup,
+    NgFor,
+    MatOption,
+    MatInput,
+    MatDatepickerInput,
+    MatDatepickerToggle,
+    MatSuffix,
+    MatDatepicker,
+    ButtonRowComponent,
+    ButtonComponent,
+    ShowTypePipe,
+  ],
 })
 export class NewComponent implements OnInit {
   public shows$: Observable<Show[]>;
@@ -53,7 +53,7 @@ export class NewComponent implements OnInit {
   public constructor(
     private showService: ShowService,
     showDataService: ShowDataService,
-    private router: Router,
+    private router: Router
   ) {
     this.shows$ = showDataService.list$;
   }
diff --git a/src/app/modules/shows/services/docx.service.ts b/src/app/modules/shows/services/docx.service.ts
index 78fece9..552c3eb 100644
--- a/src/app/modules/shows/services/docx.service.ts
+++ b/src/app/modules/shows/services/docx.service.ts
@@ -4,7 +4,6 @@ import {ShowService} from './show.service';
 import {ShowTypePipe} from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
 import {ShowSongService} from './show-song.service';
 import {Song} from '../../songs/services/song';
-import {SongService} from '../../songs/services/song.service';
 import {ShowSong} from './show-song';
 import {Show} from './show';
 import {ChordMode} from '../../../widget-modules/components/song-text/song-text.component';
@@ -32,7 +31,7 @@ export class DocxService {
     private showSongService: ShowSongService,
     private textRenderingService: TextRenderingService,
     private userService: UserService,
-    private configService: ConfigService,
+    private configService: ConfigService
   ) {}
 
   public async create(showId: string, options: DownloadOptions = {}): Promise<void> {
diff --git a/src/app/modules/shows/services/show-song-data.service.ts b/src/app/modules/shows/services/show-song-data.service.ts
index ca44484..5304fa0 100644
--- a/src/app/modules/shows/services/show-song-data.service.ts
+++ b/src/app/modules/shows/services/show-song-data.service.ts
@@ -11,8 +11,7 @@ export class ShowSongDataService {
   private collection = 'shows';
   private subCollection = 'songs';
 
-  public constructor(private dbService: DbService) {
-  }
+  public constructor(private dbService: DbService) {}
 
   public list$ = (showId: string, queryFn?: QueryFn): Observable<ShowSong[]> => this.dbService.col$(`${this.collection}/${showId}/${this.subCollection}`, queryFn);
   public read$ = (showId: string, songId: string): Observable<ShowSong | null> => this.dbService.doc$(`${this.collection}/${showId}/${this.subCollection}/${songId}`);
diff --git a/src/app/modules/shows/services/show-song.service.ts b/src/app/modules/shows/services/show-song.service.ts
index b95ed39..fa654ce 100644
--- a/src/app/modules/shows/services/show-song.service.ts
+++ b/src/app/modules/shows/services/show-song.service.ts
@@ -14,9 +14,8 @@ export class ShowSongService {
     private showSongDataService: ShowSongDataService,
     private songDataService: SongDataService,
     private userService: UserService,
-    private showService: ShowService,
-  ) {
-  }
+    private showService: ShowService
+  ) {}
 
   public async new$(showId: string, songId: string, addedLive = false): Promise<string | null> {
     const song = await firstValueFrom(this.songDataService.read$(songId));
diff --git a/src/app/modules/shows/services/show.service.spec.ts b/src/app/modules/shows/services/show.service.spec.ts
index e55fc24..9b4825e 100644
--- a/src/app/modules/shows/services/show.service.spec.ts
+++ b/src/app/modules/shows/services/show.service.spec.ts
@@ -9,7 +9,7 @@ describe('ShowService', () => {
     () =>
       void TestBed.configureTestingModule({
         providers: [{provide: ShowDataService, useValue: mockShowDataService}],
-      }),
+      })
   );
 
   ShowService.SHOW_TYPE_PUBLIC.forEach(type => {
diff --git a/src/app/modules/shows/services/show.service.ts b/src/app/modules/shows/services/show.service.ts
index f3c4871..86b1dda 100644
--- a/src/app/modules/shows/services/show.service.ts
+++ b/src/app/modules/shows/services/show.service.ts
@@ -15,7 +15,10 @@ export class ShowService {
   public static SHOW_TYPE_PRIVATE = ['home-group', 'prayer-group', 'misc-private'];
   private user: User | null = null;
 
-  public constructor(private showDataService: ShowDataService, private userService: UserService) {
+  public constructor(
+    private showDataService: ShowDataService,
+    private userService: UserService
+  ) {
     userService.user$.subscribe(_ => (this.user = _));
   }
 
@@ -25,14 +28,14 @@ export class ShowService {
     return this.userService.user$.pipe(
       switchMap(
         () => this.showDataService.list$,
-        (user: User | null, shows: Show[]) => ({user, shows}),
+        (user: User | null, shows: Show[]) => ({user, shows})
       ),
       map(s =>
         s.shows
           .sort((a, b) => a.date.toMillis() - b.date.toMillis())
           .filter(_ => !_.archived)
-          .filter(show => show.published || (show.owner === s.user?.id && !publishedOnly)),
-      ),
+          .filter(show => show.published || (show.owner === s.user?.id && !publishedOnly))
+      )
     );
   }
 
diff --git a/src/app/modules/shows/show/show.component.html b/src/app/modules/shows/show/show.component.html
index 2f3805b..a353cb9 100644
--- a/src/app/modules/shows/show/show.component.html
+++ b/src/app/modules/shows/show/show.component.html
@@ -23,7 +23,8 @@
                          matTooltip="Swiper umschalten"></app-menu-button>
       </div>
     </div>
-    <div (cdkDropListDropped)="drop($event, show)" *ngIf="showSongs && !useSwiper" [cdkDropListDisabled]="show.published || showText"
+    <div (cdkDropListDropped)="drop($event, show)" *ngIf="showSongs && !useSwiper"
+         [cdkDropListDisabled]="show.published || showText"
          [style.cursor]="!(show.published || showText) ? 'drag' : 'inherit'"
          [style.font-size]="textSize + 'em'"
          cdkDropList
@@ -52,7 +53,9 @@
           [showText]="true"
           [show]="show"
         ></app-song>
-        <div class="next-song" *ngIf="getNextSong(orderedShowSongs(show), i) as next">{{next}}<fa-icon [icon]="faNextSong"></fa-icon></div>
+        <div *ngIf="getNextSong(orderedShowSongs(show), i) as next" class="next-song">{{ next }}
+          <fa-icon [icon]="faNextSong"></fa-icon>
+        </div>
       </swiper-slide>
     </swiper-container>
 
diff --git a/src/app/modules/shows/show/show.component.spec.ts b/src/app/modules/shows/show/show.component.spec.ts
index 58c42c4..6a36df9 100644
--- a/src/app/modules/shows/show/show.component.spec.ts
+++ b/src/app/modules/shows/show/show.component.spec.ts
@@ -6,13 +6,11 @@ describe('ShowComponent', () => {
   let component: ShowComponent;
   let fixture: ComponentFixture<ShowComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [ShowComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [ShowComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(ShowComponent);
diff --git a/src/app/modules/shows/show/show.component.ts b/src/app/modules/shows/show/show.component.ts
index 4145c71..e1c9951 100644
--- a/src/app/modules/shows/show/show.component.ts
+++ b/src/app/modules/shows/show/show.component.ts
@@ -25,60 +25,60 @@ import {
   faUser,
   faUsers,
 } from '@fortawesome/free-solid-svg-icons';
-import { CdkDragDrop, moveItemInArray, CdkDropList, CdkDrag } from '@angular/cdk/drag-drop';
+import {CdkDrag, CdkDragDrop, CdkDropList, moveItemInArray} from '@angular/cdk/drag-drop';
 import {fade} from '../../../animations';
 import {MatDialog} from '@angular/material/dialog';
 import {ArchiveDialogComponent} from '../dialog/archive-dialog/archive-dialog.component';
 import {closeFullscreen, openFullscreen} from '../../../services/fullscreen';
 import {GuestShowService} from '../../guest/guest-show.service';
 import {ShareDialogComponent} from '../dialog/share-dialog/share-dialog.component';
-import { NgIf, NgFor, AsyncPipe, DatePipe } from '@angular/common';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
-import { UserNameComponent } from '../../../services/user/user-name/user-name.component';
-import { MatCheckbox } from '@angular/material/checkbox';
-import { ReactiveFormsModule, FormsModule } from '@angular/forms';
-import { MenuButtonComponent } from '../../../widget-modules/components/menu-button/menu-button.component';
-import { MatTooltip } from '@angular/material/tooltip';
-import { SongComponent } from './song/song.component';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
-import { AddSongComponent } from '../../../widget-modules/components/add-song/add-song.component';
-import { ButtonRowComponent } from '../../../widget-modules/components/button-row/button-row.component';
-import { RoleDirective } from '../../../services/user/role.directive';
-import { OwnerDirective } from '../../../services/user/owner.directive';
-import { ButtonComponent } from '../../../widget-modules/components/button/button.component';
-import { MatMenuTrigger, MatMenu } from '@angular/material/menu';
-import { ShowTypePipe } from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
+import {AsyncPipe, DatePipe, NgFor, NgIf} from '@angular/common';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
+import {UserNameComponent} from '../../../services/user/user-name/user-name.component';
+import {MatCheckbox} from '@angular/material/checkbox';
+import {FormsModule, ReactiveFormsModule} from '@angular/forms';
+import {MenuButtonComponent} from '../../../widget-modules/components/menu-button/menu-button.component';
+import {MatTooltip} from '@angular/material/tooltip';
+import {SongComponent} from './song/song.component';
+import {FaIconComponent} from '@fortawesome/angular-fontawesome';
+import {AddSongComponent} from '../../../widget-modules/components/add-song/add-song.component';
+import {ButtonRowComponent} from '../../../widget-modules/components/button-row/button-row.component';
+import {RoleDirective} from '../../../services/user/role.directive';
+import {OwnerDirective} from '../../../services/user/owner.directive';
+import {ButtonComponent} from '../../../widget-modules/components/button/button.component';
+import {MatMenu, MatMenuTrigger} from '@angular/material/menu';
+import {ShowTypePipe} from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
 
 @Component({
-    selector: 'app-show',
-    templateUrl: './show.component.html',
-    styleUrls: ['./show.component.less'],
-    animations: [fade],
-    imports: [
-        NgIf,
-        CardComponent,
-        UserNameComponent,
-        MatCheckbox,
-        ReactiveFormsModule,
-        FormsModule,
-        MenuButtonComponent,
-        MatTooltip,
-        CdkDropList,
-        NgFor,
-        CdkDrag,
-        SongComponent,
-        FaIconComponent,
-        AddSongComponent,
-        ButtonRowComponent,
-        RoleDirective,
-        OwnerDirective,
-        ButtonComponent,
-        MatMenuTrigger,
-        MatMenu,
-        AsyncPipe,
-        DatePipe,
-        ShowTypePipe,
-    ],
+  selector: 'app-show',
+  templateUrl: './show.component.html',
+  styleUrls: ['./show.component.less'],
+  animations: [fade],
+  imports: [
+    NgIf,
+    CardComponent,
+    UserNameComponent,
+    MatCheckbox,
+    ReactiveFormsModule,
+    FormsModule,
+    MenuButtonComponent,
+    MatTooltip,
+    CdkDropList,
+    NgFor,
+    CdkDrag,
+    SongComponent,
+    FaIconComponent,
+    AddSongComponent,
+    ButtonRowComponent,
+    RoleDirective,
+    OwnerDirective,
+    ButtonComponent,
+    MatMenuTrigger,
+    MatMenu,
+    AsyncPipe,
+    DatePipe,
+    ShowTypePipe,
+  ],
 })
 export class ShowComponent implements OnInit, OnDestroy {
   public show$: Observable<Show | null> | null = null;
@@ -114,16 +114,15 @@ export class ShowComponent implements OnInit, OnDestroy {
     private router: Router,
     private cRef: ChangeDetectorRef,
     public dialog: MatDialog,
-    private guestShowService: GuestShowService,
-  ) {
-  }
+    private guestShowService: GuestShowService
+  ) {}
 
   public ngOnInit(): void {
     this.show$ = this.activatedRoute.params.pipe(
       map(param => param as {showId: string}),
       map(param => param.showId),
       tap((_: string) => (this.showId = _)),
-      switchMap((showId: string) => this.showService.read$(showId)),
+      switchMap((showId: string) => this.showService.read$(showId))
     );
     this.subs.push(
       this.activatedRoute.params
@@ -131,7 +130,7 @@ export class ShowComponent implements OnInit, OnDestroy {
           map(param => param as {showId: string}),
           map(param => param.showId),
           switchMap(showId => this.showSongService.list$(showId)),
-          filter(_ => !!_ && _.length > 0),
+          filter(_ => !!_ && _.length > 0)
         )
         .subscribe(_ => {
           this.showSongs = _;
@@ -143,7 +142,7 @@ export class ShowComponent implements OnInit, OnDestroy {
         .subscribe(_ => {
           this.songs = _;
           this.cRef.markForCheck();
-        }),
+        })
     );
   }
 
diff --git a/src/app/modules/shows/show/song/song.component.spec.ts b/src/app/modules/shows/show/song/song.component.spec.ts
index f775ec8..08e9435 100644
--- a/src/app/modules/shows/show/song/song.component.spec.ts
+++ b/src/app/modules/shows/show/song/song.component.spec.ts
@@ -6,13 +6,11 @@ describe('SongComponent', () => {
   let component: SongComponent;
   let fixture: ComponentFixture<SongComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [SongComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [SongComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(SongComponent);
diff --git a/src/app/modules/shows/show/song/song.component.ts b/src/app/modules/shows/show/song/song.component.ts
index c26d334..cd5d5fa 100644
--- a/src/app/modules/shows/show/song/song.component.ts
+++ b/src/app/modules/shows/show/song/song.component.ts
@@ -2,43 +2,43 @@ import {Component, Input, OnInit, ViewChild} from '@angular/core';
 import {ShowSongService} from '../../services/show-song.service';
 import {ShowSong} from '../../services/show-song';
 import {getScale} from '../../../songs/services/key.helper';
-import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms';
-import { ChordMode, SongTextComponent } from '../../../../widget-modules/components/song-text/song-text.component';
+import {ReactiveFormsModule, UntypedFormControl} from '@angular/forms';
+import {ChordMode, SongTextComponent} from '../../../../widget-modules/components/song-text/song-text.component';
 import {Show} from '../../services/show';
 import {faEraser, faPenToSquare, faSave, faTrash} from '@fortawesome/free-solid-svg-icons';
 import {fade} from '../../../../animations';
 import {MatSelect} from '@angular/material/select';
-import { NgIf, NgFor } from '@angular/common';
-import { MatFormField, MatLabel } from '@angular/material/form-field';
-import { MatOption } from '@angular/material/core';
-import { MenuButtonComponent } from '../../../../widget-modules/components/menu-button/menu-button.component';
-import { MatTooltip } from '@angular/material/tooltip';
-import { MatInput } from '@angular/material/input';
-import { CdkTextareaAutosize } from '@angular/cdk/text-field';
-import { ButtonRowComponent } from '../../../../widget-modules/components/button-row/button-row.component';
-import { ButtonComponent } from '../../../../widget-modules/components/button/button.component';
+import {NgFor, NgIf} from '@angular/common';
+import {MatFormField, MatLabel} from '@angular/material/form-field';
+import {MatOption} from '@angular/material/core';
+import {MenuButtonComponent} from '../../../../widget-modules/components/menu-button/menu-button.component';
+import {MatTooltip} from '@angular/material/tooltip';
+import {MatInput} from '@angular/material/input';
+import {CdkTextareaAutosize} from '@angular/cdk/text-field';
+import {ButtonRowComponent} from '../../../../widget-modules/components/button-row/button-row.component';
+import {ButtonComponent} from '../../../../widget-modules/components/button/button.component';
 
 @Component({
-    selector: 'app-song',
-    templateUrl: './song.component.html',
-    styleUrls: ['./song.component.less'],
-    animations: [fade],
-    imports: [
-        NgIf,
-        MatFormField,
-        MatSelect,
-        ReactiveFormsModule,
-        NgFor,
-        MatOption,
-        MenuButtonComponent,
-        MatTooltip,
-        MatLabel,
-        MatInput,
-        CdkTextareaAutosize,
-        ButtonRowComponent,
-        ButtonComponent,
-        SongTextComponent,
-    ],
+  selector: 'app-song',
+  templateUrl: './song.component.html',
+  styleUrls: ['./song.component.less'],
+  animations: [fade],
+  imports: [
+    NgIf,
+    MatFormField,
+    MatSelect,
+    ReactiveFormsModule,
+    NgFor,
+    MatOption,
+    MenuButtonComponent,
+    MatTooltip,
+    MatLabel,
+    MatInput,
+    CdkTextareaAutosize,
+    ButtonRowComponent,
+    ButtonComponent,
+    SongTextComponent,
+  ],
 })
 export class SongComponent implements OnInit {
   @Input() public show: Show | null = null;
@@ -57,8 +57,7 @@ export class SongComponent implements OnInit {
   public editSongControl = new UntypedFormControl();
   @ViewChild('option') private keyOptions: MatSelect;
 
-  public constructor(private showSongService: ShowSongService) {
-  }
+  public constructor(private showSongService: ShowSongService) {}
 
   @Input()
   public set showSong(song: ShowSong) {
diff --git a/src/app/modules/shows/shows-routing.module.ts b/src/app/modules/shows/shows-routing.module.ts
index 3185bff..000e20b 100644
--- a/src/app/modules/shows/shows-routing.module.ts
+++ b/src/app/modules/shows/shows-routing.module.ts
@@ -29,5 +29,4 @@ const routes: Routes = [
   imports: [RouterModule.forChild(routes)],
   exports: [RouterModule],
 })
-export class ShowsRoutingModule {
-}
+export class ShowsRoutingModule {}
diff --git a/src/app/modules/shows/shows.module.ts b/src/app/modules/shows/shows.module.ts
index cbe19ad..9f3b8e6 100644
--- a/src/app/modules/shows/shows.module.ts
+++ b/src/app/modules/shows/shows.module.ts
@@ -22,8 +22,6 @@ import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
 
 import {NgxMatSelectSearchModule} from 'ngx-mat-select-search';
 
-
-
 import {MatMenuModule} from '@angular/material/menu';
 import {DragDropModule} from '@angular/cdk/drag-drop';
 
@@ -38,7 +36,7 @@ import {ShowTypePipe} from '../../widget-modules/pipes/show-type-translater/show
 import {SortByPipe} from '../../widget-modules/pipes/sort-by/sort-by.pipe';
 
 @NgModule({
-    imports: [
+  imports: [
     CommonModule,
     ShowsRoutingModule,
     MatFormFieldModule,
@@ -60,8 +58,15 @@ import {SortByPipe} from '../../widget-modules/pipes/sort-by/sort-by.pipe';
     SortByPipe,
     MatTooltipModule,
     MatDialogModule,
-    NewComponent, ListComponent, ListItemComponent, ShowComponent, SongComponent, FilterComponent, EditComponent, ArchiveDialogComponent,
-],
-    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    NewComponent,
+    ListComponent,
+    ListItemComponent,
+    ShowComponent,
+    SongComponent,
+    FilterComponent,
+    EditComponent,
+    ArchiveDialogComponent,
+  ],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
 })
 export class ShowsModule {}
diff --git a/src/app/modules/songs/services/file-data.service.ts b/src/app/modules/songs/services/file-data.service.ts
index d9dec51..7c4b2c2 100644
--- a/src/app/modules/songs/services/file-data.service.ts
+++ b/src/app/modules/songs/services/file-data.service.ts
@@ -8,8 +8,7 @@ import {DbService} from '../../../services/db.service';
   providedIn: 'root',
 })
 export class FileDataService {
-  public constructor(private db: DbService) {
-  }
+  public constructor(private db: DbService) {}
 
   public async set(songId: string, file: FileServer): Promise<string> {
     const songRef = this.db.doc('songs/' + songId);
diff --git a/src/app/modules/songs/services/file.service.ts b/src/app/modules/songs/services/file.service.ts
index bcda14c..350d72a 100644
--- a/src/app/modules/songs/services/file.service.ts
+++ b/src/app/modules/songs/services/file.service.ts
@@ -7,8 +7,10 @@ import {FileDataService} from './file-data.service';
   providedIn: 'root',
 })
 export class FileService {
-  public constructor(private storage: AngularFireStorage, private fileDataService: FileDataService) {
-  }
+  public constructor(
+    private storage: AngularFireStorage,
+    private fileDataService: FileDataService
+  ) {}
 
   public getDownloadUrl(path: string): Observable<string> {
     const ref = this.storage.ref(path);
diff --git a/src/app/modules/songs/services/song-data.service.spec.ts b/src/app/modules/songs/services/song-data.service.spec.ts
index 71e5421..f505de9 100644
--- a/src/app/modules/songs/services/song-data.service.spec.ts
+++ b/src/app/modules/songs/services/song-data.service.spec.ts
@@ -19,7 +19,7 @@ describe('SongDataService', () => {
     () =>
       void TestBed.configureTestingModule({
         providers: [{provide: AngularFirestore, useValue: mockAngularFirestore}],
-      }),
+      })
   );
 
   it('should be created', () => {
@@ -27,13 +27,10 @@ describe('SongDataService', () => {
     void expect(service).toBeTruthy();
   });
 
-  it(
-    'should list songs',
-    waitForAsync(() => {
-      const service: SongDataService = TestBed.inject(SongDataService);
-      service.list$().subscribe(s => {
-        void expect(s[0].title).toEqual('title1');
-      });
-    }),
-  );
+  it('should list songs', waitForAsync(() => {
+    const service: SongDataService = TestBed.inject(SongDataService);
+    service.list$().subscribe(s => {
+      void expect(s[0].title).toEqual('title1');
+    });
+  }));
 });
diff --git a/src/app/modules/songs/services/song-data.service.ts b/src/app/modules/songs/services/song-data.service.ts
index 11445b0..4d092a9 100644
--- a/src/app/modules/songs/services/song-data.service.ts
+++ b/src/app/modules/songs/services/song-data.service.ts
@@ -14,6 +14,7 @@ export class SongDataService {
   public constructor(private dbService: DbService) {
     this.dbService.col$<Song>(this.collection).subscribe(_ => this.list$.next(_));
   }
+
   // public list$ = (): Observable<Song[]> => this.dbService.col$(this.collection);
 
   //public read$ = (songId: string): Observable<Song | null> => this.dbService.doc$(this.collection + '/' + songId);
diff --git a/src/app/modules/songs/services/song-list.resolver.ts b/src/app/modules/songs/services/song-list.resolver.ts
index 0724e81..e068e83 100644
--- a/src/app/modules/songs/services/song-list.resolver.ts
+++ b/src/app/modules/songs/services/song-list.resolver.ts
@@ -9,8 +9,7 @@ import {filter} from 'rxjs/operators';
   providedIn: 'root',
 })
 export class SongListResolver {
-  public constructor(private songService: SongService) {
-  }
+  public constructor(private songService: SongService) {}
 
   public resolve(): Observable<Song[]> {
     return this.songService.list$().pipe(filter(_ => _.length > 0));
diff --git a/src/app/modules/songs/services/song.service.spec.ts b/src/app/modules/songs/services/song.service.spec.ts
index de6fd1b..8d2c56f 100644
--- a/src/app/modules/songs/services/song.service.spec.ts
+++ b/src/app/modules/songs/services/song.service.spec.ts
@@ -15,7 +15,7 @@ describe('SongService', () => {
     () =>
       void TestBed.configureTestingModule({
         providers: [{provide: SongDataService, useValue: mockSongDataService}],
-      }),
+      })
   );
 
   it('should be created', () => {
@@ -23,13 +23,10 @@ describe('SongService', () => {
     void expect(service).toBeTruthy();
   });
 
-  it(
-    'should list songs',
-    waitForAsync(() => {
-      const service: SongService = TestBed.inject(SongService);
-      service.list$().subscribe(s => {
-        void expect(s[0].title).toEqual('title1');
-      });
-    }),
-  );
+  it('should list songs', waitForAsync(() => {
+    const service: SongService = TestBed.inject(SongService);
+    service.list$().subscribe(s => {
+      void expect(s[0].title).toEqual('title1');
+    });
+  }));
 });
diff --git a/src/app/modules/songs/services/song.service.ts b/src/app/modules/songs/services/song.service.ts
index 724a8c8..f139de9 100644
--- a/src/app/modules/songs/services/song.service.ts
+++ b/src/app/modules/songs/services/song.service.ts
@@ -27,7 +27,7 @@ export class SongService {
 
   public constructor(
     private songDataService: SongDataService,
-    private userService: UserService,
+    private userService: UserService
   ) {
     // importCCLI = (songs: Song[]) => this.updateFromCLI(songs);
   }
diff --git a/src/app/modules/songs/services/upload.service.ts b/src/app/modules/songs/services/upload.service.ts
index ee1a8f8..c25c29b 100644
--- a/src/app/modules/songs/services/upload.service.ts
+++ b/src/app/modules/songs/services/upload.service.ts
@@ -10,7 +10,10 @@ import {FileServer} from './fileServer';
   providedIn: 'root',
 })
 export class UploadService extends FileBase {
-  public constructor(private fileDataService: FileDataService, private angularFireStorage: AngularFireStorage) {
+  public constructor(
+    private fileDataService: FileDataService,
+    private angularFireStorage: AngularFireStorage
+  ) {
     super();
   }
 
diff --git a/src/app/modules/songs/song-list/filter/filter.component.spec.ts b/src/app/modules/songs/song-list/filter/filter.component.spec.ts
index a568676..cea3993 100644
--- a/src/app/modules/songs/song-list/filter/filter.component.spec.ts
+++ b/src/app/modules/songs/song-list/filter/filter.component.spec.ts
@@ -6,13 +6,11 @@ describe('FilterComponent', () => {
   let component: FilterComponent;
   let fixture: ComponentFixture<FilterComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [FilterComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [FilterComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(FilterComponent);
diff --git a/src/app/modules/songs/song-list/filter/filter.component.ts b/src/app/modules/songs/song-list/filter/filter.component.ts
index 0da2687..db8b951 100644
--- a/src/app/modules/songs/song-list/filter/filter.component.ts
+++ b/src/app/modules/songs/song-list/filter/filter.component.ts
@@ -1,35 +1,24 @@
 import {Component, Input} from '@angular/core';
 import {ActivatedRoute, Router} from '@angular/router';
-import { UntypedFormBuilder, UntypedFormGroup, ReactiveFormsModule } from '@angular/forms';
+import {ReactiveFormsModule, UntypedFormBuilder, UntypedFormGroup} from '@angular/forms';
 import {SongService} from '../../services/song.service';
 import {FilterValues} from './filter-values';
 import {Song} from '../../services/song';
 import {KEYS} from '../../services/key.helper';
-import { MatFormField, MatLabel } from '@angular/material/form-field';
-import { MatInput } from '@angular/material/input';
-import { MatSelect } from '@angular/material/select';
-import { MatOption } from '@angular/material/core';
-import { NgFor } from '@angular/common';
-import { LegalTypePipe } from '../../../../widget-modules/pipes/legal-type-translator/legal-type.pipe';
-import { KeyPipe } from '../../../../widget-modules/pipes/key-translator/key.pipe';
-import { SongTypePipe } from '../../../../widget-modules/pipes/song-type-translater/song-type.pipe';
+import {MatFormField, MatLabel} from '@angular/material/form-field';
+import {MatInput} from '@angular/material/input';
+import {MatSelect} from '@angular/material/select';
+import {MatOption} from '@angular/material/core';
+import {NgFor} from '@angular/common';
+import {LegalTypePipe} from '../../../../widget-modules/pipes/legal-type-translator/legal-type.pipe';
+import {KeyPipe} from '../../../../widget-modules/pipes/key-translator/key.pipe';
+import {SongTypePipe} from '../../../../widget-modules/pipes/song-type-translater/song-type.pipe';
 
 @Component({
-    selector: 'app-filter',
-    templateUrl: './filter.component.html',
-    styleUrls: ['./filter.component.less'],
-    imports: [
-        ReactiveFormsModule,
-        MatFormField,
-        MatLabel,
-        MatInput,
-        MatSelect,
-        MatOption,
-        NgFor,
-        LegalTypePipe,
-        KeyPipe,
-        SongTypePipe,
-    ],
+  selector: 'app-filter',
+  templateUrl: './filter.component.html',
+  styleUrls: ['./filter.component.less'],
+  imports: [ReactiveFormsModule, MatFormField, MatLabel, MatInput, MatSelect, MatOption, NgFor, LegalTypePipe, KeyPipe, SongTypePipe],
 })
 export class FilterComponent {
   public filterFormGroup: UntypedFormGroup;
@@ -39,7 +28,11 @@ export class FilterComponent {
   public legalType = SongService.LEGAL_TYPE;
   public keys = KEYS;
 
-  public constructor(private router: Router, activatedRoute: ActivatedRoute, fb: UntypedFormBuilder) {
+  public constructor(
+    private router: Router,
+    activatedRoute: ActivatedRoute,
+    fb: UntypedFormBuilder
+  ) {
     this.filterFormGroup = fb.group({
       q: '',
       type: '',
diff --git a/src/app/modules/songs/song-list/song-list.component.spec.ts b/src/app/modules/songs/song-list/song-list.component.spec.ts
index ddb2922..509d5e4 100644
--- a/src/app/modules/songs/song-list/song-list.component.spec.ts
+++ b/src/app/modules/songs/song-list/song-list.component.spec.ts
@@ -15,15 +15,13 @@ describe('SongListComponent', () => {
     list: () => of(songs),
   };
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [SongListComponent],
-    providers: [{ provide: SongService, useValue: mockSongService }],
-    schemas: [NO_ERRORS_SCHEMA],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [SongListComponent],
+      providers: [{provide: SongService, useValue: mockSongService}],
+      schemas: [NO_ERRORS_SCHEMA],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(SongListComponent);
diff --git a/src/app/modules/songs/song-list/song-list.component.ts b/src/app/modules/songs/song-list/song-list.component.ts
index 80040b1..b5e0f1b 100644
--- a/src/app/modules/songs/song-list/song-list.component.ts
+++ b/src/app/modules/songs/song-list/song-list.component.ts
@@ -4,35 +4,25 @@ import {Song} from '../services/song';
 import {map} from 'rxjs/operators';
 import {combineLatest, Observable} from 'rxjs';
 import {fade} from '../../../animations';
-import { ActivatedRoute, RouterLink } from '@angular/router';
+import {ActivatedRoute, RouterLink} from '@angular/router';
 import {filterSong} from '../../../services/filter.helper';
 import {FilterValues} from './filter/filter-values';
 import {ScrollService} from '../../../services/scroll.service';
 import {faBalanceScaleRight, faCheck, faPencilRuler} from '@fortawesome/free-solid-svg-icons';
-import { NgIf, NgFor, AsyncPipe } from '@angular/common';
-import { ListHeaderComponent } from '../../../widget-modules/components/list-header/list-header.component';
-import { FilterComponent } from './filter/filter.component';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
-import { RoleDirective } from '../../../services/user/role.directive';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
+import {AsyncPipe, NgFor, NgIf} from '@angular/common';
+import {ListHeaderComponent} from '../../../widget-modules/components/list-header/list-header.component';
+import {FilterComponent} from './filter/filter.component';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
+import {RoleDirective} from '../../../services/user/role.directive';
+import {FaIconComponent} from '@fortawesome/angular-fontawesome';
 
 @Component({
-    selector: 'app-songs',
-    templateUrl: './song-list.component.html',
-    styleUrls: ['./song-list.component.less'],
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    animations: [fade],
-    imports: [
-        NgIf,
-        ListHeaderComponent,
-        FilterComponent,
-        CardComponent,
-        NgFor,
-        RouterLink,
-        RoleDirective,
-        FaIconComponent,
-        AsyncPipe,
-    ],
+  selector: 'app-songs',
+  templateUrl: './song-list.component.html',
+  styleUrls: ['./song-list.component.less'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  animations: [fade],
+  imports: [NgIf, ListHeaderComponent, FilterComponent, CardComponent, NgFor, RouterLink, RoleDirective, FaIconComponent, AsyncPipe],
 })
 export class SongListComponent implements OnInit, OnDestroy {
   public anyFilterActive = false;
@@ -40,7 +30,7 @@ export class SongListComponent implements OnInit, OnDestroy {
     this.activatedRoute.queryParams.pipe(map(_ => _ as FilterValues)),
     this.activatedRoute.data.pipe(
       map(data => data.songList as Song[]),
-      map(songs => songs.sort((a, b) => a.number - b.number)),
+      map(songs => songs.sort((a, b) => a.number - b.number))
     ),
   ]).pipe(
     map(_ => {
@@ -48,14 +38,17 @@ export class SongListComponent implements OnInit, OnDestroy {
       const filter = _[0];
       this.anyFilterActive = this.checkIfFilterActive(filter);
       return songs.filter(song => this.filter(song, filter)).sort((a, b) => a.title?.localeCompare(b.title));
-    }),
+    })
   );
   public faLegal = faBalanceScaleRight;
   public faDraft = faPencilRuler;
   public faFinal = faCheck;
 
-  public constructor(private songService: SongService, private activatedRoute: ActivatedRoute, private scrollService: ScrollService) {
-  }
+  public constructor(
+    private songService: SongService,
+    private activatedRoute: ActivatedRoute,
+    private scrollService: ScrollService
+  ) {}
 
   public ngOnInit(): void {
     setTimeout(() => this.scrollService.restoreScrollPositionFor('songlist'), 100);
diff --git a/src/app/modules/songs/song/edit/edit-file/edit-file.component.spec.ts b/src/app/modules/songs/song/edit/edit-file/edit-file.component.spec.ts
index 4e578cc..28983d6 100644
--- a/src/app/modules/songs/song/edit/edit-file/edit-file.component.spec.ts
+++ b/src/app/modules/songs/song/edit/edit-file/edit-file.component.spec.ts
@@ -6,13 +6,11 @@ describe('EditFileComponent', () => {
   let component: EditFileComponent;
   let fixture: ComponentFixture<EditFileComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [EditFileComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [EditFileComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(EditFileComponent);
diff --git a/src/app/modules/songs/song/edit/edit-file/edit-file.component.ts b/src/app/modules/songs/song/edit/edit-file/edit-file.component.ts
index aa5b8e9..70dd65b 100644
--- a/src/app/modules/songs/song/edit/edit-file/edit-file.component.ts
+++ b/src/app/modules/songs/song/edit/edit-file/edit-file.component.ts
@@ -6,26 +6,17 @@ import {map, switchMap} from 'rxjs/operators';
 import {FileDataService} from '../../../services/file-data.service';
 import {Observable} from 'rxjs';
 import {File} from '../../../services/file';
-import { CardComponent } from '../../../../../widget-modules/components/card/card.component';
-import { NgIf, NgStyle, NgFor, AsyncPipe } from '@angular/common';
-import { MatIconButton } from '@angular/material/button';
-import { MatIcon } from '@angular/material/icon';
-import { FileComponent } from './file/file.component';
+import {CardComponent} from '../../../../../widget-modules/components/card/card.component';
+import {AsyncPipe, NgFor, NgIf, NgStyle} from '@angular/common';
+import {MatIconButton} from '@angular/material/button';
+import {MatIcon} from '@angular/material/icon';
+import {FileComponent} from './file/file.component';
 
 @Component({
-    selector: 'app-edit-file',
-    templateUrl: './edit-file.component.html',
-    styleUrls: ['./edit-file.component.less'],
-    imports: [
-        CardComponent,
-        NgIf,
-        NgStyle,
-        MatIconButton,
-        MatIcon,
-        NgFor,
-        FileComponent,
-        AsyncPipe,
-    ],
+  selector: 'app-edit-file',
+  templateUrl: './edit-file.component.html',
+  styleUrls: ['./edit-file.component.less'],
+  imports: [CardComponent, NgIf, NgStyle, MatIconButton, MatIcon, NgFor, FileComponent, AsyncPipe],
 })
 export class EditFileComponent {
   public selectedFiles: FileList | null = null;
@@ -33,11 +24,15 @@ export class EditFileComponent {
   public songId: string | null = null;
   public files$: Observable<File[]>;
 
-  public constructor(private activatedRoute: ActivatedRoute, private uploadService: UploadService, private fileService: FileDataService) {
+  public constructor(
+    private activatedRoute: ActivatedRoute,
+    private uploadService: UploadService,
+    private fileService: FileDataService
+  ) {
     this.activatedRoute.params
       .pipe(
         map(param => param as {songId: string}),
-        map(param => param.songId),
+        map(param => param.songId)
       )
       .subscribe(songId => {
         this.songId = songId;
@@ -46,7 +41,7 @@ export class EditFileComponent {
     this.files$ = this.activatedRoute.params.pipe(
       map(param => param as {songId: string}),
       map(param => param.songId),
-      switchMap(songId => this.fileService.read$(songId)),
+      switchMap(songId => this.fileService.read$(songId))
     );
   }
 
diff --git a/src/app/modules/songs/song/edit/edit-file/file/file.component.spec.ts b/src/app/modules/songs/song/edit/edit-file/file/file.component.spec.ts
index 0ed74e2..ceb111e 100644
--- a/src/app/modules/songs/song/edit/edit-file/file/file.component.spec.ts
+++ b/src/app/modules/songs/song/edit/edit-file/file/file.component.spec.ts
@@ -6,13 +6,11 @@ describe('FileComponent', () => {
   let component: FileComponent;
   let fixture: ComponentFixture<FileComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [FileComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [FileComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(FileComponent);
diff --git a/src/app/modules/songs/song/edit/edit-file/file/file.component.ts b/src/app/modules/songs/song/edit/edit-file/file/file.component.ts
index 9cc8543..b322982 100644
--- a/src/app/modules/songs/song/edit/edit-file/file/file.component.ts
+++ b/src/app/modules/songs/song/edit/edit-file/file/file.component.ts
@@ -3,19 +3,15 @@ import {Observable} from 'rxjs';
 import {File} from '../../../../services/file';
 import {faTrashAlt} from '@fortawesome/free-solid-svg-icons';
 import {FileService} from '../../../../services/file.service';
-import { MatIconButton } from '@angular/material/button';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
-import { AsyncPipe } from '@angular/common';
+import {MatIconButton} from '@angular/material/button';
+import {FaIconComponent} from '@fortawesome/angular-fontawesome';
+import {AsyncPipe} from '@angular/common';
 
 @Component({
-    selector: 'app-file',
-    templateUrl: './file.component.html',
-    styleUrls: ['./file.component.less'],
-    imports: [
-        MatIconButton,
-        FaIconComponent,
-        AsyncPipe,
-    ],
+  selector: 'app-file',
+  templateUrl: './file.component.html',
+  styleUrls: ['./file.component.less'],
+  imports: [MatIconButton, FaIconComponent, AsyncPipe],
 })
 export class FileComponent {
   public url$: Observable<string> | null = null;
@@ -25,8 +21,7 @@ export class FileComponent {
   private fileId: string | null = null;
   private path: string | null = null;
 
-  public constructor(private fileService: FileService) {
-  }
+  public constructor(private fileService: FileService) {}
 
   @Input()
   public set file(file: File) {
diff --git a/src/app/modules/songs/song/edit/edit-song.guard.ts b/src/app/modules/songs/song/edit/edit-song.guard.ts
index a21970d..765eaa1 100644
--- a/src/app/modules/songs/song/edit/edit-song.guard.ts
+++ b/src/app/modules/songs/song/edit/edit-song.guard.ts
@@ -11,7 +11,7 @@ export class EditSongGuard {
     component: EditComponent,
     currentRoute: ActivatedRouteSnapshot,
     currentState: RouterStateSnapshot,
-    nextState: RouterStateSnapshot,
+    nextState: RouterStateSnapshot
   ): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
     return component.editSongComponent ? component.editSongComponent.askForSave(nextState) : true;
   }
diff --git a/src/app/modules/songs/song/edit/edit-song/edit-song.component.spec.ts b/src/app/modules/songs/song/edit/edit-song/edit-song.component.spec.ts
index c84ef5b..37b5b22 100644
--- a/src/app/modules/songs/song/edit/edit-song/edit-song.component.spec.ts
+++ b/src/app/modules/songs/song/edit/edit-song/edit-song.component.spec.ts
@@ -6,13 +6,11 @@ describe('EditSongComponent', () => {
   let component: EditSongComponent;
   let fixture: ComponentFixture<EditSongComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [EditSongComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [EditSongComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(EditSongComponent);
diff --git a/src/app/modules/songs/song/edit/edit-song/edit-song.component.ts b/src/app/modules/songs/song/edit/edit-song/edit-song.component.ts
index f0fceae..a3b3eb2 100644
--- a/src/app/modules/songs/song/edit/edit-song/edit-song.component.ts
+++ b/src/app/modules/songs/song/edit/edit-song/edit-song.component.ts
@@ -1,64 +1,64 @@
 import {Component, OnInit} from '@angular/core';
 import {Song} from '../../../services/song';
-import { UntypedFormGroup, ReactiveFormsModule } from '@angular/forms';
+import {ReactiveFormsModule, UntypedFormGroup} from '@angular/forms';
 import {ActivatedRoute, Router, RouterStateSnapshot} from '@angular/router';
 import {SongService} from '../../../services/song.service';
 import {EditService} from '../edit.service';
 import {first, map, switchMap} from 'rxjs/operators';
 import {KEYS} from '../../../services/key.helper';
 import {COMMA, ENTER} from '@angular/cdk/keycodes';
-import { MatChipInputEvent, MatChipGrid, MatChipRow, MatChipInput } from '@angular/material/chips';
+import {MatChipGrid, MatChipInput, MatChipInputEvent, MatChipRow} from '@angular/material/chips';
 import {faExternalLinkAlt, faSave, faTimesCircle} from '@fortawesome/free-solid-svg-icons';
 import {MatDialog} from '@angular/material/dialog';
 import {SaveDialogComponent} from './save-dialog/save-dialog.component';
-import { NgIf, NgFor } from '@angular/common';
-import { CardComponent } from '../../../../../widget-modules/components/card/card.component';
-import { MatFormField, MatLabel, MatSuffix } from '@angular/material/form-field';
-import { MatInput } from '@angular/material/input';
-import { MatSelect } from '@angular/material/select';
-import { MatOption } from '@angular/material/core';
-import { CdkTextareaAutosize } from '@angular/cdk/text-field';
-import { SongTextComponent } from '../../../../../widget-modules/components/song-text/song-text.component';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
-import { MatTooltip } from '@angular/material/tooltip';
-import { ButtonRowComponent } from '../../../../../widget-modules/components/button-row/button-row.component';
-import { ButtonComponent } from '../../../../../widget-modules/components/button/button.component';
-import { SongTypePipe } from '../../../../../widget-modules/pipes/song-type-translater/song-type.pipe';
-import { LegalOwnerPipe } from '../../../../../widget-modules/pipes/legal-owner-translator/legal-owner.pipe';
-import { LegalTypePipe } from '../../../../../widget-modules/pipes/legal-type-translator/legal-type.pipe';
-import { KeyPipe } from '../../../../../widget-modules/pipes/key-translator/key.pipe';
-import { StatusPipe } from '../../../../../widget-modules/pipes/status-translater/status.pipe';
+import {NgFor, NgIf} from '@angular/common';
+import {CardComponent} from '../../../../../widget-modules/components/card/card.component';
+import {MatFormField, MatLabel, MatSuffix} from '@angular/material/form-field';
+import {MatInput} from '@angular/material/input';
+import {MatSelect} from '@angular/material/select';
+import {MatOption} from '@angular/material/core';
+import {CdkTextareaAutosize} from '@angular/cdk/text-field';
+import {SongTextComponent} from '../../../../../widget-modules/components/song-text/song-text.component';
+import {FaIconComponent} from '@fortawesome/angular-fontawesome';
+import {MatTooltip} from '@angular/material/tooltip';
+import {ButtonRowComponent} from '../../../../../widget-modules/components/button-row/button-row.component';
+import {ButtonComponent} from '../../../../../widget-modules/components/button/button.component';
+import {SongTypePipe} from '../../../../../widget-modules/pipes/song-type-translater/song-type.pipe';
+import {LegalOwnerPipe} from '../../../../../widget-modules/pipes/legal-owner-translator/legal-owner.pipe';
+import {LegalTypePipe} from '../../../../../widget-modules/pipes/legal-type-translator/legal-type.pipe';
+import {KeyPipe} from '../../../../../widget-modules/pipes/key-translator/key.pipe';
+import {StatusPipe} from '../../../../../widget-modules/pipes/status-translater/status.pipe';
 
 @Component({
-    selector: 'app-edit-song',
-    templateUrl: './edit-song.component.html',
-    styleUrls: ['./edit-song.component.less'],
-    imports: [
-        NgIf,
-        CardComponent,
-        ReactiveFormsModule,
-        MatFormField,
-        MatLabel,
-        MatInput,
-        MatSelect,
-        NgFor,
-        MatOption,
-        CdkTextareaAutosize,
-        SongTextComponent,
-        MatChipGrid,
-        MatChipRow,
-        FaIconComponent,
-        MatChipInput,
-        MatSuffix,
-        MatTooltip,
-        ButtonRowComponent,
-        ButtonComponent,
-        SongTypePipe,
-        LegalOwnerPipe,
-        LegalTypePipe,
-        KeyPipe,
-        StatusPipe,
-    ],
+  selector: 'app-edit-song',
+  templateUrl: './edit-song.component.html',
+  styleUrls: ['./edit-song.component.less'],
+  imports: [
+    NgIf,
+    CardComponent,
+    ReactiveFormsModule,
+    MatFormField,
+    MatLabel,
+    MatInput,
+    MatSelect,
+    NgFor,
+    MatOption,
+    CdkTextareaAutosize,
+    SongTextComponent,
+    MatChipGrid,
+    MatChipRow,
+    FaIconComponent,
+    MatChipInput,
+    MatSuffix,
+    MatTooltip,
+    ButtonRowComponent,
+    ButtonComponent,
+    SongTypePipe,
+    LegalOwnerPipe,
+    LegalTypePipe,
+    KeyPipe,
+    StatusPipe,
+  ],
 })
 export class EditSongComponent implements OnInit {
   public song: Song | null = null;
@@ -80,9 +80,8 @@ export class EditSongComponent implements OnInit {
     private songService: SongService,
     private editService: EditService,
     private router: Router,
-    public dialog: MatDialog,
-  ) {
-  }
+    public dialog: MatDialog
+  ) {}
 
   public ngOnInit(): void {
     this.activatedRoute.params
@@ -90,7 +89,7 @@ export class EditSongComponent implements OnInit {
         map(param => param as {songId: string}),
         map(param => param.songId),
         switchMap(songId => this.songService.read$(songId)),
-        first(),
+        first()
       )
       .subscribe(song => {
         this.song = song;
diff --git a/src/app/modules/songs/song/edit/edit-song/save-dialog/save-dialog.component.spec.ts b/src/app/modules/songs/song/edit/edit-song/save-dialog/save-dialog.component.spec.ts
index 498b2c2..b3ef5c8 100644
--- a/src/app/modules/songs/song/edit/edit-song/save-dialog/save-dialog.component.spec.ts
+++ b/src/app/modules/songs/song/edit/edit-song/save-dialog/save-dialog.component.spec.ts
@@ -6,13 +6,11 @@ describe('SaveDialogComponent', () => {
   let component: SaveDialogComponent;
   let fixture: ComponentFixture<SaveDialogComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    declarations: [SaveDialogComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      declarations: [SaveDialogComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(SaveDialogComponent);
diff --git a/src/app/modules/songs/song/edit/edit-song/save-dialog/save-dialog.component.ts b/src/app/modules/songs/song/edit/edit-song/save-dialog/save-dialog.component.ts
index d89ffef..81fa8de 100644
--- a/src/app/modules/songs/song/edit/edit-song/save-dialog/save-dialog.component.ts
+++ b/src/app/modules/songs/song/edit/edit-song/save-dialog/save-dialog.component.ts
@@ -4,7 +4,5 @@ import {Component} from '@angular/core';
   selector: 'app-save-dialog',
   templateUrl: './save-dialog.component.html',
   styleUrls: ['./save-dialog.component.less'],
-  standalone: false,
 })
-export class SaveDialogComponent {
-}
+export class SaveDialogComponent {}
diff --git a/src/app/modules/songs/song/edit/edit.component.spec.ts b/src/app/modules/songs/song/edit/edit.component.spec.ts
index 4a84ea0..aaba728 100644
--- a/src/app/modules/songs/song/edit/edit.component.spec.ts
+++ b/src/app/modules/songs/song/edit/edit.component.spec.ts
@@ -6,13 +6,11 @@ describe('EditComponent', () => {
   let component: EditComponent;
   let fixture: ComponentFixture<EditComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [EditComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [EditComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(EditComponent);
diff --git a/src/app/modules/songs/song/edit/edit.component.ts b/src/app/modules/songs/song/edit/edit.component.ts
index 2a3b285..39ae3ba 100644
--- a/src/app/modules/songs/song/edit/edit.component.ts
+++ b/src/app/modules/songs/song/edit/edit.component.ts
@@ -1,17 +1,13 @@
 import {Component, ViewChild} from '@angular/core';
 import {EditSongComponent} from './edit-song/edit-song.component';
-import { EditFileComponent } from './edit-file/edit-file.component';
-import { HistoryComponent } from './history/history.component';
+import {EditFileComponent} from './edit-file/edit-file.component';
+import {HistoryComponent} from './history/history.component';
 
 @Component({
-    selector: 'app-edit',
-    templateUrl: './edit.component.html',
-    styleUrls: ['./edit.component.less'],
-    imports: [
-        EditSongComponent,
-        EditFileComponent,
-        HistoryComponent,
-    ],
+  selector: 'app-edit',
+  templateUrl: './edit.component.html',
+  styleUrls: ['./edit.component.less'],
+  imports: [EditSongComponent, EditFileComponent, HistoryComponent],
 })
 export class EditComponent {
   @ViewChild(EditSongComponent) public editSongComponent: EditSongComponent | null = null;
diff --git a/src/app/modules/songs/song/edit/edit.module.ts b/src/app/modules/songs/song/edit/edit.module.ts
index 6c27036..c0a55a1 100644
--- a/src/app/modules/songs/song/edit/edit.module.ts
+++ b/src/app/modules/songs/song/edit/edit.module.ts
@@ -28,10 +28,10 @@ import {SongTypePipe} from '../../../../widget-modules/pipes/song-type-translate
 import {StatusPipe} from '../../../../widget-modules/pipes/status-translater/status.pipe';
 
 @NgModule({
-    declarations: [SaveDialogComponent],
-    exports: [EditComponent],
-    bootstrap: [SaveDialogComponent],
-    imports: [
+  declarations: [SaveDialogComponent],
+  exports: [EditComponent],
+  bootstrap: [SaveDialogComponent],
+  imports: [
     CommonModule,
     SongTypePipe,
     ReactiveFormsModule,
@@ -50,7 +50,11 @@ import {StatusPipe} from '../../../../widget-modules/pipes/status-translater/sta
     MatTooltipModule,
     MatDialogModule,
     SongTextComponent,
-    EditComponent, EditSongComponent, EditFileComponent, FileComponent, HistoryComponent,
-],
+    EditComponent,
+    EditSongComponent,
+    EditFileComponent,
+    FileComponent,
+    HistoryComponent,
+  ],
 })
 export class EditModule {}
diff --git a/src/app/modules/songs/song/edit/history/history.component.spec.ts b/src/app/modules/songs/song/edit/history/history.component.spec.ts
index 2654294..6b19451 100644
--- a/src/app/modules/songs/song/edit/history/history.component.spec.ts
+++ b/src/app/modules/songs/song/edit/history/history.component.spec.ts
@@ -6,13 +6,11 @@ describe('HistoryComponent', () => {
   let component: HistoryComponent;
   let fixture: ComponentFixture<HistoryComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [HistoryComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [HistoryComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(HistoryComponent);
diff --git a/src/app/modules/songs/song/edit/history/history.component.ts b/src/app/modules/songs/song/edit/history/history.component.ts
index d9bef34..6a3afd8 100644
--- a/src/app/modules/songs/song/edit/history/history.component.ts
+++ b/src/app/modules/songs/song/edit/history/history.component.ts
@@ -3,25 +3,22 @@ import {first, map, switchMap} from 'rxjs/operators';
 import {ActivatedRoute} from '@angular/router';
 import {SongService} from '../../../services/song.service';
 import {Song} from '../../../services/song';
-import { NgIf, NgFor, DatePipe } from '@angular/common';
-import { CardComponent } from '../../../../../widget-modules/components/card/card.component';
+import {DatePipe, NgFor, NgIf} from '@angular/common';
+import {CardComponent} from '../../../../../widget-modules/components/card/card.component';
 
 @Component({
-    selector: 'app-history',
-    templateUrl: './history.component.html',
-    styleUrls: ['./history.component.less'],
-    imports: [
-        NgIf,
-        CardComponent,
-        NgFor,
-        DatePipe,
-    ],
+  selector: 'app-history',
+  templateUrl: './history.component.html',
+  styleUrls: ['./history.component.less'],
+  imports: [NgIf, CardComponent, NgFor, DatePipe],
 })
 export class HistoryComponent implements OnInit {
   public song: Song | null = null;
 
-  public constructor(private activatedRoute: ActivatedRoute, private songService: SongService) {
-  }
+  public constructor(
+    private activatedRoute: ActivatedRoute,
+    private songService: SongService
+  ) {}
 
   public ngOnInit(): void {
     this.activatedRoute.params
@@ -29,7 +26,7 @@ export class HistoryComponent implements OnInit {
         map(param => param as {songId: string}),
         map(param => param.songId),
         switchMap(songId => this.songService.read$(songId)),
-        first(),
+        first()
       )
       .subscribe(song => {
         this.song = song;
diff --git a/src/app/modules/songs/song/file/file.component.spec.ts b/src/app/modules/songs/song/file/file.component.spec.ts
index 0ed74e2..ceb111e 100644
--- a/src/app/modules/songs/song/file/file.component.spec.ts
+++ b/src/app/modules/songs/song/file/file.component.spec.ts
@@ -6,13 +6,11 @@ describe('FileComponent', () => {
   let component: FileComponent;
   let fixture: ComponentFixture<FileComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [FileComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [FileComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(FileComponent);
diff --git a/src/app/modules/songs/song/file/file.component.ts b/src/app/modules/songs/song/file/file.component.ts
index 678009a..1122949 100644
--- a/src/app/modules/songs/song/file/file.component.ts
+++ b/src/app/modules/songs/song/file/file.component.ts
@@ -2,20 +2,19 @@ import {Component, Input} from '@angular/core';
 import {File} from '../../services/file';
 import {AngularFireStorage} from '@angular/fire/compat/storage';
 import {Observable} from 'rxjs';
-import { AsyncPipe } from '@angular/common';
+import {AsyncPipe} from '@angular/common';
 
 @Component({
-    selector: 'app-file',
-    templateUrl: './file.component.html',
-    styleUrls: ['./file.component.less'],
-    imports: [AsyncPipe],
+  selector: 'app-file',
+  templateUrl: './file.component.html',
+  styleUrls: ['./file.component.less'],
+  imports: [AsyncPipe],
 })
 export class FileComponent {
   public url$: Observable<string> | null = null;
   public name = '';
 
-  public constructor(private storage: AngularFireStorage) {
-  }
+  public constructor(private storage: AngularFireStorage) {}
 
   @Input()
   public set file(file: File) {
diff --git a/src/app/modules/songs/song/new/new.component.spec.ts b/src/app/modules/songs/song/new/new.component.spec.ts
index 19bae0c..81db59f 100644
--- a/src/app/modules/songs/song/new/new.component.spec.ts
+++ b/src/app/modules/songs/song/new/new.component.spec.ts
@@ -6,13 +6,11 @@ describe('NewComponent', () => {
   let component: NewComponent;
   let fixture: ComponentFixture<NewComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [NewComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [NewComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(NewComponent);
diff --git a/src/app/modules/songs/song/new/new.component.ts b/src/app/modules/songs/song/new/new.component.ts
index d3313b8..de07dbc 100644
--- a/src/app/modules/songs/song/new/new.component.ts
+++ b/src/app/modules/songs/song/new/new.component.ts
@@ -1,29 +1,21 @@
 import {Component, OnDestroy, OnInit} from '@angular/core';
 import {faSave} from '@fortawesome/free-solid-svg-icons';
-import { UntypedFormControl, UntypedFormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
+import {ReactiveFormsModule, UntypedFormControl, UntypedFormGroup, Validators} from '@angular/forms';
 import {SongService} from '../../services/song.service';
 import {Song} from '../../services/song';
 import {Router} from '@angular/router';
 import {Subscription} from 'rxjs';
-import { CardComponent } from '../../../../widget-modules/components/card/card.component';
-import { MatFormField, MatLabel } from '@angular/material/form-field';
-import { MatInput } from '@angular/material/input';
-import { ButtonRowComponent } from '../../../../widget-modules/components/button-row/button-row.component';
-import { ButtonComponent } from '../../../../widget-modules/components/button/button.component';
+import {CardComponent} from '../../../../widget-modules/components/card/card.component';
+import {MatFormField, MatLabel} from '@angular/material/form-field';
+import {MatInput} from '@angular/material/input';
+import {ButtonRowComponent} from '../../../../widget-modules/components/button-row/button-row.component';
+import {ButtonComponent} from '../../../../widget-modules/components/button/button.component';
 
 @Component({
-    selector: 'app-new',
-    templateUrl: './new.component.html',
-    styleUrls: ['./new.component.less'],
-    imports: [
-        CardComponent,
-        ReactiveFormsModule,
-        MatFormField,
-        MatLabel,
-        MatInput,
-        ButtonRowComponent,
-        ButtonComponent,
-    ],
+  selector: 'app-new',
+  templateUrl: './new.component.html',
+  styleUrls: ['./new.component.less'],
+  imports: [CardComponent, ReactiveFormsModule, MatFormField, MatLabel, MatInput, ButtonRowComponent, ButtonComponent],
 })
 export class NewComponent implements OnInit, OnDestroy {
   public faSave = faSave;
@@ -33,8 +25,10 @@ export class NewComponent implements OnInit, OnDestroy {
   });
   private subs: Subscription[] = [];
 
-  public constructor(private songService: SongService, private router: Router) {
-  }
+  public constructor(
+    private songService: SongService,
+    private router: Router
+  ) {}
 
   public ngOnInit(): void {
     this.form.reset();
@@ -43,7 +37,7 @@ export class NewComponent implements OnInit, OnDestroy {
       this.songService.list$().subscribe(songs => {
         const freeSongnumber = this.getFreeSongNumber(songs);
         this.form.controls.number.setValue(freeSongnumber);
-      }),
+      })
     );
   }
 
diff --git a/src/app/modules/songs/song/song.component.spec.ts b/src/app/modules/songs/song/song.component.spec.ts
index 14caf63..4d5a7b7 100644
--- a/src/app/modules/songs/song/song.component.spec.ts
+++ b/src/app/modules/songs/song/song.component.spec.ts
@@ -12,14 +12,12 @@ describe('SongComponent', () => {
     params: of({songId: '4711'}),
   };
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [SongComponent],
-    providers: [{ provide: ActivatedRoute, useValue: mockActivatedRoute }],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [SongComponent],
+      providers: [{provide: ActivatedRoute, useValue: mockActivatedRoute}],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(SongComponent);
diff --git a/src/app/modules/songs/song/song.component.ts b/src/app/modules/songs/song/song.component.ts
index 0386a6e..eccddcb 100644
--- a/src/app/modules/songs/song/song.component.ts
+++ b/src/app/modules/songs/song/song.component.ts
@@ -1,5 +1,5 @@
 import {Component, OnInit} from '@angular/core';
-import { ActivatedRoute, Router, RouterLink } from '@angular/router';
+import {ActivatedRoute, Router, RouterLink} from '@angular/router';
 import {SongService} from '../services/song.service';
 import {distinctUntilChanged, map, switchMap} from 'rxjs/operators';
 import {Song} from '../services/song';
@@ -12,45 +12,45 @@ import {faEdit, faFileCirclePlus, faTrash} from '@fortawesome/free-solid-svg-ico
 import {ShowService} from '../../shows/services/show.service';
 import {Show} from '../../shows/services/show';
 import {ShowSongService} from '../../shows/services/show-song.service';
-import { NgIf, NgFor, AsyncPipe, DatePipe } from '@angular/common';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
-import { RoleDirective } from '../../../services/user/role.directive';
-import { SongTextComponent } from '../../../widget-modules/components/song-text/song-text.component';
-import { MatChipListbox, MatChipOption } from '@angular/material/chips';
-import { ButtonRowComponent } from '../../../widget-modules/components/button-row/button-row.component';
-import { ButtonComponent } from '../../../widget-modules/components/button/button.component';
-import { MatMenuTrigger, MatMenu } from '@angular/material/menu';
-import { FileComponent } from './file/file.component';
-import { SongTypePipe } from '../../../widget-modules/pipes/song-type-translater/song-type.pipe';
-import { LegalOwnerPipe } from '../../../widget-modules/pipes/legal-owner-translator/legal-owner.pipe';
-import { StatusPipe } from '../../../widget-modules/pipes/status-translater/status.pipe';
-import { ShowTypePipe } from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
+import {AsyncPipe, DatePipe, NgFor, NgIf} from '@angular/common';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
+import {RoleDirective} from '../../../services/user/role.directive';
+import {SongTextComponent} from '../../../widget-modules/components/song-text/song-text.component';
+import {MatChipListbox, MatChipOption} from '@angular/material/chips';
+import {ButtonRowComponent} from '../../../widget-modules/components/button-row/button-row.component';
+import {ButtonComponent} from '../../../widget-modules/components/button/button.component';
+import {MatMenu, MatMenuTrigger} from '@angular/material/menu';
+import {FileComponent} from './file/file.component';
+import {SongTypePipe} from '../../../widget-modules/pipes/song-type-translater/song-type.pipe';
+import {LegalOwnerPipe} from '../../../widget-modules/pipes/legal-owner-translator/legal-owner.pipe';
+import {StatusPipe} from '../../../widget-modules/pipes/status-translater/status.pipe';
+import {ShowTypePipe} from '../../../widget-modules/pipes/show-type-translater/show-type.pipe';
 
 @Component({
-    selector: 'app-song',
-    templateUrl: './song.component.html',
-    styleUrls: ['./song.component.less'],
-    imports: [
-        NgIf,
-        CardComponent,
-        RoleDirective,
-        SongTextComponent,
-        MatChipListbox,
-        NgFor,
-        MatChipOption,
-        ButtonRowComponent,
-        ButtonComponent,
-        RouterLink,
-        MatMenuTrigger,
-        MatMenu,
-        FileComponent,
-        AsyncPipe,
-        DatePipe,
-        SongTypePipe,
-        LegalOwnerPipe,
-        StatusPipe,
-        ShowTypePipe,
-    ],
+  selector: 'app-song',
+  templateUrl: './song.component.html',
+  styleUrls: ['./song.component.less'],
+  imports: [
+    NgIf,
+    CardComponent,
+    RoleDirective,
+    SongTextComponent,
+    MatChipListbox,
+    NgFor,
+    MatChipOption,
+    ButtonRowComponent,
+    ButtonComponent,
+    RouterLink,
+    MatMenuTrigger,
+    MatMenu,
+    FileComponent,
+    AsyncPipe,
+    DatePipe,
+    SongTypePipe,
+    LegalOwnerPipe,
+    StatusPipe,
+    ShowTypePipe,
+  ],
 })
 export class SongComponent implements OnInit {
   public song$: Observable<Song | null> | null = null;
@@ -68,7 +68,7 @@ export class SongComponent implements OnInit {
     private userService: UserService,
     private router: Router,
     private showService: ShowService,
-    private showSongService: ShowSongService,
+    private showSongService: ShowSongService
   ) {
     this.user$ = userService.user$;
   }
@@ -77,13 +77,13 @@ export class SongComponent implements OnInit {
     this.song$ = this.activatedRoute.params.pipe(
       map(param => param as {songId: string}),
       map(param => param.songId),
-      switchMap(songId => this.songService.read$(songId)),
+      switchMap(songId => this.songService.read$(songId))
     );
 
     this.files$ = this.activatedRoute.params.pipe(
       map(param => param as {songId: string}),
       map(param => param.songId),
-      switchMap(songId => this.fileService.read$(songId)),
+      switchMap(songId => this.fileService.read$(songId))
     );
   }
 
@@ -111,6 +111,6 @@ export class SongComponent implements OnInit {
       map(([user, song]) => {
         return user.songUsage[song.id];
       }),
-      distinctUntilChanged(),
+      distinctUntilChanged()
     );
 }
diff --git a/src/app/modules/songs/songs-routing.module.ts b/src/app/modules/songs/songs-routing.module.ts
index 09bb200..b77d7bc 100644
--- a/src/app/modules/songs/songs-routing.module.ts
+++ b/src/app/modules/songs/songs-routing.module.ts
@@ -33,5 +33,4 @@ const routes: Routes = [
   imports: [RouterModule.forChild(routes)],
   exports: [RouterModule],
 })
-export class SongsRoutingModule {
-}
+export class SongsRoutingModule {}
diff --git a/src/app/modules/songs/songs.module.ts b/src/app/modules/songs/songs.module.ts
index 74a6cee..dcc31e6 100644
--- a/src/app/modules/songs/songs.module.ts
+++ b/src/app/modules/songs/songs.module.ts
@@ -3,13 +3,10 @@ import {CommonModule} from '@angular/common';
 
 import {SongsRoutingModule} from './songs-routing.module';
 
-
 import {EditModule} from './song/edit/edit.module';
 
-
 @NgModule({
   declarations: [],
   imports: [CommonModule, SongsRoutingModule, EditModule],
 })
-export class SongsModule {
-}
+export class SongsModule {}
diff --git a/src/app/modules/user/info/info.component.spec.ts b/src/app/modules/user/info/info.component.spec.ts
index 87b2981..89c1afe 100644
--- a/src/app/modules/user/info/info.component.spec.ts
+++ b/src/app/modules/user/info/info.component.spec.ts
@@ -6,13 +6,11 @@ describe('InfoComponent', () => {
   let component: InfoComponent;
   let fixture: ComponentFixture<InfoComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [InfoComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [InfoComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(InfoComponent);
diff --git a/src/app/modules/user/info/info.component.ts b/src/app/modules/user/info/info.component.ts
index e80dbbe..7570346 100644
--- a/src/app/modules/user/info/info.component.ts
+++ b/src/app/modules/user/info/info.component.ts
@@ -6,46 +6,45 @@ import {ChordMode} from '../../../widget-modules/components/song-text/song-text.
 import {faSignOutAlt} from '@fortawesome/free-solid-svg-icons';
 import {RolePipe} from './role.pipe';
 import {roles} from '../../../services/user/roles';
-import { NgIf, AsyncPipe } from '@angular/common';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
-import { MatFormField, MatLabel, MatHint } from '@angular/material/form-field';
-import { MatSelect } from '@angular/material/select';
-import { ReactiveFormsModule, FormsModule } from '@angular/forms';
-import { MatOption } from '@angular/material/core';
-import { ButtonRowComponent } from '../../../widget-modules/components/button-row/button-row.component';
-import { ButtonComponent } from '../../../widget-modules/components/button/button.component';
-import { RouterLink } from '@angular/router';
-import { RoleDirective } from '../../../services/user/role.directive';
-import { UsersComponent } from './users/users.component';
+import {AsyncPipe, NgIf} from '@angular/common';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
+import {MatFormField, MatHint, MatLabel} from '@angular/material/form-field';
+import {MatSelect} from '@angular/material/select';
+import {FormsModule, ReactiveFormsModule} from '@angular/forms';
+import {MatOption} from '@angular/material/core';
+import {ButtonRowComponent} from '../../../widget-modules/components/button-row/button-row.component';
+import {ButtonComponent} from '../../../widget-modules/components/button/button.component';
+import {RouterLink} from '@angular/router';
+import {RoleDirective} from '../../../services/user/role.directive';
+import {UsersComponent} from './users/users.component';
 
 @Component({
-    selector: 'app-info',
-    templateUrl: './info.component.html',
-    styleUrls: ['./info.component.less'],
-    imports: [
-        NgIf,
-        CardComponent,
-        MatFormField,
-        MatLabel,
-        MatSelect,
-        ReactiveFormsModule,
-        FormsModule,
-        MatOption,
-        MatHint,
-        ButtonRowComponent,
-        ButtonComponent,
-        RouterLink,
-        RoleDirective,
-        UsersComponent,
-        AsyncPipe,
-    ],
+  selector: 'app-info',
+  templateUrl: './info.component.html',
+  styleUrls: ['./info.component.less'],
+  imports: [
+    NgIf,
+    CardComponent,
+    MatFormField,
+    MatLabel,
+    MatSelect,
+    ReactiveFormsModule,
+    FormsModule,
+    MatOption,
+    MatHint,
+    ButtonRowComponent,
+    ButtonComponent,
+    RouterLink,
+    RoleDirective,
+    UsersComponent,
+    AsyncPipe,
+  ],
 })
 export class InfoComponent implements OnInit {
   public user$: Observable<User | null> | null = null;
   public faSignOut = faSignOutAlt;
 
-  public constructor(private userService: UserService) {
-  }
+  public constructor(private userService: UserService) {}
 
   public ngOnInit(): void {
     this.user$ = this.userService.user$;
diff --git a/src/app/modules/user/info/role.pipe.ts b/src/app/modules/user/info/role.pipe.ts
index 79de300..dee5031 100644
--- a/src/app/modules/user/info/role.pipe.ts
+++ b/src/app/modules/user/info/role.pipe.ts
@@ -1,7 +1,7 @@
 import {Pipe, PipeTransform} from '@angular/core';
 import {roles} from '../../../services/user/roles';
 
-@Pipe({ name: 'role', })
+@Pipe({name: 'role'})
 export class RolePipe implements PipeTransform {
   public transform(role: roles): string {
     switch (role) {
diff --git a/src/app/modules/user/info/users/user/user.component.spec.ts b/src/app/modules/user/info/users/user/user.component.spec.ts
index 77f9f95..c2b48b4 100644
--- a/src/app/modules/user/info/users/user/user.component.spec.ts
+++ b/src/app/modules/user/info/users/user/user.component.spec.ts
@@ -6,13 +6,11 @@ describe('UserComponent', () => {
   let component: UserComponent;
   let fixture: ComponentFixture<UserComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [UserComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [UserComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(UserComponent);
diff --git a/src/app/modules/user/info/users/user/user.component.ts b/src/app/modules/user/info/users/user/user.component.ts
index 78f2879..297ecea 100644
--- a/src/app/modules/user/info/users/user/user.component.ts
+++ b/src/app/modules/user/info/users/user/user.component.ts
@@ -3,34 +3,21 @@ import {User} from '../../../../../services/user/user';
 import {UserService} from '../../../../../services/user/user.service';
 import {ROLE_TYPES} from '../../../../../services/user/roles';
 import {faTimes} from '@fortawesome/free-solid-svg-icons';
-import { NgIf, NgFor } from '@angular/common';
-import { MatFormField, MatLabel } from '@angular/material/form-field';
-import { MatInput } from '@angular/material/input';
-import { ReactiveFormsModule, FormsModule } from '@angular/forms';
-import { MatSelect } from '@angular/material/select';
-import { MatOption } from '@angular/material/core';
-import { MatIconButton } from '@angular/material/button';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
-import { RolePipe } from '../../role.pipe';
+import {NgFor, NgIf} from '@angular/common';
+import {MatFormField, MatLabel} from '@angular/material/form-field';
+import {MatInput} from '@angular/material/input';
+import {FormsModule, ReactiveFormsModule} from '@angular/forms';
+import {MatSelect} from '@angular/material/select';
+import {MatOption} from '@angular/material/core';
+import {MatIconButton} from '@angular/material/button';
+import {FaIconComponent} from '@fortawesome/angular-fontawesome';
+import {RolePipe} from '../../role.pipe';
 
 @Component({
-    selector: 'app-user',
-    templateUrl: './user.component.html',
-    styleUrls: ['./user.component.less'],
-    imports: [
-        NgIf,
-        MatFormField,
-        MatLabel,
-        MatInput,
-        ReactiveFormsModule,
-        FormsModule,
-        MatSelect,
-        NgFor,
-        MatOption,
-        MatIconButton,
-        FaIconComponent,
-        RolePipe,
-    ],
+  selector: 'app-user',
+  templateUrl: './user.component.html',
+  styleUrls: ['./user.component.less'],
+  imports: [NgIf, MatFormField, MatLabel, MatInput, ReactiveFormsModule, FormsModule, MatSelect, NgFor, MatOption, MatIconButton, FaIconComponent, RolePipe],
 })
 export class UserComponent {
   public id = '';
@@ -40,8 +27,7 @@ export class UserComponent {
   public edit = false;
   public faClose = faTimes;
 
-  public constructor(private userService: UserService) {
-  }
+  public constructor(private userService: UserService) {}
 
   @Input()
   public set user(value: User) {
diff --git a/src/app/modules/user/info/users/users.component.spec.ts b/src/app/modules/user/info/users/users.component.spec.ts
index 5a09b00..27db533 100644
--- a/src/app/modules/user/info/users/users.component.spec.ts
+++ b/src/app/modules/user/info/users/users.component.spec.ts
@@ -6,13 +6,11 @@ describe('UsersComponent', () => {
   let component: UsersComponent;
   let fixture: ComponentFixture<UsersComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [UsersComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [UsersComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(UsersComponent);
diff --git a/src/app/modules/user/info/users/users.component.ts b/src/app/modules/user/info/users/users.component.ts
index 4f8f9dc..20fb64d 100644
--- a/src/app/modules/user/info/users/users.component.ts
+++ b/src/app/modules/user/info/users/users.component.ts
@@ -2,22 +2,16 @@ import {Component} from '@angular/core';
 import {UserService} from '../../../../services/user/user.service';
 import {Observable} from 'rxjs';
 import {User} from '../../../../services/user/user';
-import { CardComponent } from '../../../../widget-modules/components/card/card.component';
-import { NgFor, AsyncPipe } from '@angular/common';
-import { UserComponent } from './user/user.component';
-import { SortByPipe } from '../../../../widget-modules/pipes/sort-by/sort-by.pipe';
+import {CardComponent} from '../../../../widget-modules/components/card/card.component';
+import {AsyncPipe, NgFor} from '@angular/common';
+import {UserComponent} from './user/user.component';
+import {SortByPipe} from '../../../../widget-modules/pipes/sort-by/sort-by.pipe';
 
 @Component({
-    selector: 'app-users',
-    templateUrl: './users.component.html',
-    styleUrls: ['./users.component.less'],
-    imports: [
-        CardComponent,
-        NgFor,
-        UserComponent,
-        AsyncPipe,
-        SortByPipe,
-    ],
+  selector: 'app-users',
+  templateUrl: './users.component.html',
+  styleUrls: ['./users.component.less'],
+  imports: [CardComponent, NgFor, UserComponent, AsyncPipe, SortByPipe],
 })
 export class UsersComponent {
   public users$: Observable<User[]>;
diff --git a/src/app/modules/user/login/auth-message.pipe.ts b/src/app/modules/user/login/auth-message.pipe.ts
index c02304d..398d6e8 100644
--- a/src/app/modules/user/login/auth-message.pipe.ts
+++ b/src/app/modules/user/login/auth-message.pipe.ts
@@ -1,6 +1,6 @@
 import {Pipe, PipeTransform} from '@angular/core';
 
-@Pipe({ name: 'authMessage', })
+@Pipe({name: 'authMessage'})
 export class AuthMessagePipe implements PipeTransform {
   public transform(code: string): string {
     switch (code) {
diff --git a/src/app/modules/user/login/login.component.spec.ts b/src/app/modules/user/login/login.component.spec.ts
index 363a6f7..2e76aaf 100644
--- a/src/app/modules/user/login/login.component.spec.ts
+++ b/src/app/modules/user/login/login.component.spec.ts
@@ -6,13 +6,11 @@ describe('LoginComponent', () => {
   let component: LoginComponent;
   let fixture: ComponentFixture<LoginComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [LoginComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [LoginComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(LoginComponent);
diff --git a/src/app/modules/user/login/login.component.ts b/src/app/modules/user/login/login.component.ts
index 05329b1..9a94629 100644
--- a/src/app/modules/user/login/login.component.ts
+++ b/src/app/modules/user/login/login.component.ts
@@ -1,30 +1,20 @@
 import {Component, OnInit} from '@angular/core';
-import { UntypedFormControl, UntypedFormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
-import { Router, RouterLink } from '@angular/router';
+import {ReactiveFormsModule, UntypedFormControl, UntypedFormGroup, Validators} from '@angular/forms';
+import {Router, RouterLink} from '@angular/router';
 import {UserService} from '../../../services/user/user.service';
 import {faSignInAlt, faUserPlus} from '@fortawesome/free-solid-svg-icons';
-import { LogoComponent } from '../../../widget-modules/components/logo/logo.component';
-import { MatFormField, MatLabel } from '@angular/material/form-field';
-import { MatInput } from '@angular/material/input';
-import { NgIf } from '@angular/common';
-import { MatButton } from '@angular/material/button';
-import { AuthMessagePipe } from './auth-message.pipe';
+import {LogoComponent} from '../../../widget-modules/components/logo/logo.component';
+import {MatFormField, MatLabel} from '@angular/material/form-field';
+import {MatInput} from '@angular/material/input';
+import {NgIf} from '@angular/common';
+import {MatButton} from '@angular/material/button';
+import {AuthMessagePipe} from './auth-message.pipe';
 
 @Component({
-    selector: 'app-login',
-    templateUrl: './login.component.html',
-    styleUrls: ['./login.component.less'],
-    imports: [
-        LogoComponent,
-        ReactiveFormsModule,
-        MatFormField,
-        MatLabel,
-        MatInput,
-        NgIf,
-        MatButton,
-        RouterLink,
-        AuthMessagePipe,
-    ],
+  selector: 'app-login',
+  templateUrl: './login.component.html',
+  styleUrls: ['./login.component.less'],
+  imports: [LogoComponent, ReactiveFormsModule, MatFormField, MatLabel, MatInput, NgIf, MatButton, RouterLink, AuthMessagePipe],
 })
 export class LoginComponent implements OnInit {
   public form: UntypedFormGroup = new UntypedFormGroup({
@@ -35,8 +25,10 @@ export class LoginComponent implements OnInit {
   public faSignIn = faSignInAlt;
   public faNewUser = faUserPlus;
 
-  public constructor(private userService: UserService, private router: Router) {
-  }
+  public constructor(
+    private userService: UserService,
+    private router: Router
+  ) {}
 
   public ngOnInit(): void {
     this.form.reset;
diff --git a/src/app/modules/user/logout/logout.component.spec.ts b/src/app/modules/user/logout/logout.component.spec.ts
index e623438..67734ed 100644
--- a/src/app/modules/user/logout/logout.component.spec.ts
+++ b/src/app/modules/user/logout/logout.component.spec.ts
@@ -6,13 +6,11 @@ describe('LogoutComponent', () => {
   let component: LogoutComponent;
   let fixture: ComponentFixture<LogoutComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [LogoutComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [LogoutComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(LogoutComponent);
diff --git a/src/app/modules/user/logout/logout.component.ts b/src/app/modules/user/logout/logout.component.ts
index 63583f9..7fb297b 100644
--- a/src/app/modules/user/logout/logout.component.ts
+++ b/src/app/modules/user/logout/logout.component.ts
@@ -3,13 +3,15 @@ import {Router} from '@angular/router';
 import {UserService} from '../../../services/user/user.service';
 
 @Component({
-    selector: 'app-logout',
-    templateUrl: './logout.component.html',
-    styleUrls: ['./logout.component.less'],
+  selector: 'app-logout',
+  templateUrl: './logout.component.html',
+  styleUrls: ['./logout.component.less'],
 })
 export class LogoutComponent implements AfterViewInit {
-  public constructor(private userService: UserService, private router: Router) {
-  }
+  public constructor(
+    private userService: UserService,
+    private router: Router
+  ) {}
 
   public async ngAfterViewInit(): Promise<void> {
     await this.userService.logout();
diff --git a/src/app/modules/user/new/new.component.spec.ts b/src/app/modules/user/new/new.component.spec.ts
index 19bae0c..81db59f 100644
--- a/src/app/modules/user/new/new.component.spec.ts
+++ b/src/app/modules/user/new/new.component.spec.ts
@@ -6,13 +6,11 @@ describe('NewComponent', () => {
   let component: NewComponent;
   let fixture: ComponentFixture<NewComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [NewComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [NewComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(NewComponent);
diff --git a/src/app/modules/user/new/new.component.ts b/src/app/modules/user/new/new.component.ts
index 3b3ac89..8a64a60 100644
--- a/src/app/modules/user/new/new.component.ts
+++ b/src/app/modules/user/new/new.component.ts
@@ -1,26 +1,18 @@
 import {Component, OnInit} from '@angular/core';
-import { UntypedFormBuilder, UntypedFormControl, UntypedFormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
+import {ReactiveFormsModule, UntypedFormBuilder, UntypedFormControl, UntypedFormGroup, Validators} from '@angular/forms';
 import {UserService} from '../../../services/user/user.service';
 import {faUserPlus} from '@fortawesome/free-solid-svg-icons';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
-import { MatFormField, MatLabel } from '@angular/material/form-field';
-import { MatInput } from '@angular/material/input';
-import { ButtonRowComponent } from '../../../widget-modules/components/button-row/button-row.component';
-import { ButtonComponent } from '../../../widget-modules/components/button/button.component';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
+import {MatFormField, MatLabel} from '@angular/material/form-field';
+import {MatInput} from '@angular/material/input';
+import {ButtonRowComponent} from '../../../widget-modules/components/button-row/button-row.component';
+import {ButtonComponent} from '../../../widget-modules/components/button/button.component';
 
 @Component({
-    selector: 'app-new',
-    templateUrl: './new.component.html',
-    styleUrls: ['./new.component.less'],
-    imports: [
-        CardComponent,
-        ReactiveFormsModule,
-        MatFormField,
-        MatLabel,
-        MatInput,
-        ButtonRowComponent,
-        ButtonComponent,
-    ],
+  selector: 'app-new',
+  templateUrl: './new.component.html',
+  styleUrls: ['./new.component.less'],
+  imports: [CardComponent, ReactiveFormsModule, MatFormField, MatLabel, MatInput, ButtonRowComponent, ButtonComponent],
 })
 export class NewComponent implements OnInit {
   public form: UntypedFormGroup = this.fb.group({
@@ -30,8 +22,10 @@ export class NewComponent implements OnInit {
   });
   public faNewUser = faUserPlus;
 
-  public constructor(private fb: UntypedFormBuilder, private userService: UserService) {
-  }
+  public constructor(
+    private fb: UntypedFormBuilder,
+    private userService: UserService
+  ) {}
 
   public ngOnInit(): void {
     this.form.reset();
diff --git a/src/app/modules/user/password-send/password-send.component.spec.ts b/src/app/modules/user/password-send/password-send.component.spec.ts
index 8cc36bd..a8b0a1f 100644
--- a/src/app/modules/user/password-send/password-send.component.spec.ts
+++ b/src/app/modules/user/password-send/password-send.component.spec.ts
@@ -6,13 +6,11 @@ describe('PasswordSendComponent', () => {
   let component: PasswordSendComponent;
   let fixture: ComponentFixture<PasswordSendComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [PasswordSendComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [PasswordSendComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(PasswordSendComponent);
diff --git a/src/app/modules/user/password-send/password-send.component.ts b/src/app/modules/user/password-send/password-send.component.ts
index 5ca9aed..b602b82 100644
--- a/src/app/modules/user/password-send/password-send.component.ts
+++ b/src/app/modules/user/password-send/password-send.component.ts
@@ -1,11 +1,10 @@
 import {Component} from '@angular/core';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
 
 @Component({
-    selector: 'app-password-send',
-    templateUrl: './password-send.component.html',
-    styleUrls: ['./password-send.component.less'],
-    imports: [CardComponent],
+  selector: 'app-password-send',
+  templateUrl: './password-send.component.html',
+  styleUrls: ['./password-send.component.less'],
+  imports: [CardComponent],
 })
-export class PasswordSendComponent {
-}
+export class PasswordSendComponent {}
diff --git a/src/app/modules/user/password/password.component.spec.ts b/src/app/modules/user/password/password.component.spec.ts
index dd6df34..ab800dc 100644
--- a/src/app/modules/user/password/password.component.spec.ts
+++ b/src/app/modules/user/password/password.component.spec.ts
@@ -6,13 +6,11 @@ describe('PasswordComponent', () => {
   let component: PasswordComponent;
   let fixture: ComponentFixture<PasswordComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [PasswordComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [PasswordComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(PasswordComponent);
diff --git a/src/app/modules/user/password/password.component.ts b/src/app/modules/user/password/password.component.ts
index 63b557f..e20cf48 100644
--- a/src/app/modules/user/password/password.component.ts
+++ b/src/app/modules/user/password/password.component.ts
@@ -1,31 +1,21 @@
 import {Component, OnInit} from '@angular/core';
-import { UntypedFormControl, UntypedFormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
+import {ReactiveFormsModule, UntypedFormControl, UntypedFormGroup, Validators} from '@angular/forms';
 import {Router} from '@angular/router';
 import {UserService} from '../../../services/user/user.service';
 import {faWindowRestore} from '@fortawesome/free-solid-svg-icons';
-import { CardComponent } from '../../../widget-modules/components/card/card.component';
-import { MatFormField, MatLabel } from '@angular/material/form-field';
-import { MatInput } from '@angular/material/input';
-import { ButtonRowComponent } from '../../../widget-modules/components/button-row/button-row.component';
-import { ButtonComponent } from '../../../widget-modules/components/button/button.component';
-import { NgIf } from '@angular/common';
-import { AuthMessagePipe } from '../login/auth-message.pipe';
+import {CardComponent} from '../../../widget-modules/components/card/card.component';
+import {MatFormField, MatLabel} from '@angular/material/form-field';
+import {MatInput} from '@angular/material/input';
+import {ButtonRowComponent} from '../../../widget-modules/components/button-row/button-row.component';
+import {ButtonComponent} from '../../../widget-modules/components/button/button.component';
+import {NgIf} from '@angular/common';
+import {AuthMessagePipe} from '../login/auth-message.pipe';
 
 @Component({
-    selector: 'app-password',
-    templateUrl: './password.component.html',
-    styleUrls: ['./password.component.less'],
-    imports: [
-        CardComponent,
-        ReactiveFormsModule,
-        MatFormField,
-        MatLabel,
-        MatInput,
-        ButtonRowComponent,
-        ButtonComponent,
-        NgIf,
-        AuthMessagePipe,
-    ],
+  selector: 'app-password',
+  templateUrl: './password.component.html',
+  styleUrls: ['./password.component.less'],
+  imports: [CardComponent, ReactiveFormsModule, MatFormField, MatLabel, MatInput, ButtonRowComponent, ButtonComponent, NgIf, AuthMessagePipe],
 })
 export class PasswordComponent implements OnInit {
   public form: UntypedFormGroup = new UntypedFormGroup({
@@ -35,8 +25,10 @@ export class PasswordComponent implements OnInit {
   public errorMessage = '';
   public faNewPassword = faWindowRestore;
 
-  public constructor(public userService: UserService, private router: Router) {
-  }
+  public constructor(
+    public userService: UserService,
+    private router: Router
+  ) {}
 
   public ngOnInit(): void {
     this.form.reset();
diff --git a/src/app/modules/user/user.module.ts b/src/app/modules/user/user.module.ts
index 28ee523..6168dcd 100644
--- a/src/app/modules/user/user.module.ts
+++ b/src/app/modules/user/user.module.ts
@@ -20,12 +20,11 @@ import {UsersComponent} from './info/users/users.component';
 import {UserComponent} from './info/users/user/user.component';
 import {NewComponent} from './new/new.component';
 
-
 import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
 import {SortByPipe} from '../../widget-modules/pipes/sort-by/sort-by.pipe';
 
 @NgModule({
-    imports: [
+  imports: [
     CommonModule,
     UserRoutingModule,
     MatFormFieldModule,
@@ -36,7 +35,16 @@ import {SortByPipe} from '../../widget-modules/pipes/sort-by/sort-by.pipe';
     FormsModule,
     FontAwesomeModule,
     SortByPipe,
-    LoginComponent, AuthMessagePipe, InfoComponent, LogoutComponent, RolePipe, PasswordComponent, PasswordSendComponent, UsersComponent, UserComponent, NewComponent,
-],
+    LoginComponent,
+    AuthMessagePipe,
+    InfoComponent,
+    LogoutComponent,
+    RolePipe,
+    PasswordComponent,
+    PasswordSendComponent,
+    UsersComponent,
+    UserComponent,
+    NewComponent,
+  ],
 })
 export class UserModule {}
diff --git a/src/app/services/config.service.ts b/src/app/services/config.service.ts
index a58df05..a6896f6 100644
--- a/src/app/services/config.service.ts
+++ b/src/app/services/config.service.ts
@@ -7,10 +7,8 @@ import {Config} from './config';
   providedIn: 'root',
 })
 export class ConfigService {
-  public constructor(private db: DbService) {
-  }
+  public constructor(private db: DbService) {}
 
   public get$ = (): Observable<Config | null> => this.db.doc$<Config>('global/config');
   public get = (): Promise<Config | null> => firstValueFrom(this.get$());
-
 }
diff --git a/src/app/services/db.service.ts b/src/app/services/db.service.ts
index 0a3227e..cf70945 100644
--- a/src/app/services/db.service.ts
+++ b/src/app/services/db.service.ts
@@ -11,8 +11,7 @@ type DocumentPredicate<T> = string | AngularFirestoreDocument<T>;
   providedIn: 'root',
 })
 export class DbService {
-  public constructor(private afs: AngularFirestore) {
-  }
+  public constructor(private afs: AngularFirestore) {}
 
   public col<T>(ref: CollectionPredicate<T>, queryFn?: QueryFn): AngularFirestoreCollection<T> {
     return typeof ref === 'string' ? this.afs.collection<T>(ref, queryFn) : ref;
diff --git a/src/app/services/filter.helper.spec.ts b/src/app/services/filter.helper.spec.ts
index 1868da1..9196698 100644
--- a/src/app/services/filter.helper.spec.ts
+++ b/src/app/services/filter.helper.spec.ts
@@ -4,7 +4,7 @@ import {filterSong} from './filter.helper';
 describe('Filter Helper', () => {
   const song: Song = {
     title: 'Song Title',
-    text: 'This is a songtext, aa?bb!cc,dd.ee\'ff',
+    text: "This is a songtext, aa?bb!cc,dd.ee'ff",
     legalOwner: '',
     label: '',
     id: '',
diff --git a/src/app/services/filter.helper.ts b/src/app/services/filter.helper.ts
index e75c9d3..0916a4e 100644
--- a/src/app/services/filter.helper.ts
+++ b/src/app/services/filter.helper.ts
@@ -22,7 +22,7 @@ export function dynamicSort(property: string) {
     sortOrder = -1;
     property = property.substr(1);
   }
-  return function(a: unknown, b: unknown) {
+  return function (a: unknown, b: unknown) {
     /* next line works with strings and numbers,
      * and you may want to customize it to your needs
      */
diff --git a/src/app/services/global-settings.service.ts b/src/app/services/global-settings.service.ts
index 5f5a07a..f5ac13d 100644
--- a/src/app/services/global-settings.service.ts
+++ b/src/app/services/global-settings.service.ts
@@ -7,8 +7,7 @@ import {Observable} from 'rxjs';
   providedIn: 'root',
 })
 export class GlobalSettingsService {
-  public constructor(private db: DbService) {
-  }
+  public constructor(private db: DbService) {}
 
   public get get$(): Observable<GlobalSettings | null> {
     return this.db.doc$<GlobalSettings>('global/static');
diff --git a/src/app/services/user/owner.directive.ts b/src/app/services/user/owner.directive.ts
index 696160d..3289200 100644
--- a/src/app/services/user/owner.directive.ts
+++ b/src/app/services/user/owner.directive.ts
@@ -1,13 +1,17 @@
 import {Directive, ElementRef, Input, OnInit, TemplateRef, ViewContainerRef} from '@angular/core';
 import {UserService} from './user.service';
 
-@Directive({ selector: '[appOwner]', })
+@Directive({selector: '[appOwner]'})
 export class OwnerDirective implements OnInit {
   private currentUserId: string | null = null;
   private iAppOwner: string | null = null;
 
-  public constructor(private element: ElementRef, private templateRef: TemplateRef<unknown>, private viewContainer: ViewContainerRef, private userService: UserService) {
-  }
+  public constructor(
+    private element: ElementRef,
+    private templateRef: TemplateRef<unknown>,
+    private viewContainer: ViewContainerRef,
+    private userService: UserService
+  ) {}
 
   @Input()
   public set appOwner(value: string) {
diff --git a/src/app/services/user/role.directive.ts b/src/app/services/user/role.directive.ts
index 14979d4..28aea85 100644
--- a/src/app/services/user/role.directive.ts
+++ b/src/app/services/user/role.directive.ts
@@ -4,7 +4,7 @@ import {UserService} from './user.service';
 import {User} from './user';
 import {combineLatest} from 'rxjs';
 
-@Directive({ selector: '[appRole]', })
+@Directive({selector: '[appRole]'})
 export class RoleDirective implements OnInit {
   @Input() public appRole: roles[] = [];
   private currentUser: User | null = null;
@@ -16,9 +16,8 @@ export class RoleDirective implements OnInit {
     private templateRef: TemplateRef<unknown>,
     private viewContainer: ViewContainerRef,
     private userService: UserService,
-    private changeDetection: ChangeDetectorRef,
-  ) {
-  }
+    private changeDetection: ChangeDetectorRef
+  ) {}
 
   public ngOnInit(): void {
     combineLatest([this.userService.user$, this.userService.loggedIn$()]).subscribe(_ => {
diff --git a/src/app/services/user/user-name/user-name.component.spec.ts b/src/app/services/user/user-name/user-name.component.spec.ts
index fbdc14e..204203d 100644
--- a/src/app/services/user/user-name/user-name.component.spec.ts
+++ b/src/app/services/user/user-name/user-name.component.spec.ts
@@ -6,13 +6,11 @@ describe('UserNameComponent', () => {
   let component: UserNameComponent;
   let fixture: ComponentFixture<UserNameComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [UserNameComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [UserNameComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(UserNameComponent);
diff --git a/src/app/services/user/user-name/user-name.component.ts b/src/app/services/user/user-name/user-name.component.ts
index 70778c7..548b0eb 100644
--- a/src/app/services/user/user-name/user-name.component.ts
+++ b/src/app/services/user/user-name/user-name.component.ts
@@ -2,19 +2,18 @@ import {Component, Input} from '@angular/core';
 import {UserService} from '../user.service';
 import {map} from 'rxjs/operators';
 import {Observable} from 'rxjs';
-import { AsyncPipe } from '@angular/common';
+import {AsyncPipe} from '@angular/common';
 
 @Component({
-    selector: 'app-user-name',
-    templateUrl: './user-name.component.html',
-    styleUrls: ['./user-name.component.less'],
-    imports: [AsyncPipe],
+  selector: 'app-user-name',
+  templateUrl: './user-name.component.html',
+  styleUrls: ['./user-name.component.less'],
+  imports: [AsyncPipe],
 })
 export class UserNameComponent {
   public name$: Observable<string | null> | null = null;
 
-  public constructor(private userService: UserService) {
-  }
+  public constructor(private userService: UserService) {}
 
   @Input()
   public set userId(id: string) {
diff --git a/src/app/services/user/user.service.ts b/src/app/services/user/user.service.ts
index bcb681b..b39f902 100644
--- a/src/app/services/user/user.service.ts
+++ b/src/app/services/user/user.service.ts
@@ -22,14 +22,14 @@ export class UserService {
     private db: DbService,
     private router: Router,
     private showDataService: ShowDataService,
-    private showSongDataService: ShowSongDataService,
+    private showSongDataService: ShowSongDataService
   ) {
     this.afAuth.authState
       .pipe(
         filter(auth => !!auth),
         map(auth => auth?.uid ?? ''),
         tap(uid => this.iUserId$.next(uid)),
-        switchMap(uid => this.readUser$(uid)),
+        switchMap(uid => this.readUser$(uid))
       )
       .subscribe(_ => this.iUser$.next(_));
 
diff --git a/src/app/widget-modules/components/add-song/add-song.component.spec.ts b/src/app/widget-modules/components/add-song/add-song.component.spec.ts
index 9b0977d..0e4b9dc 100644
--- a/src/app/widget-modules/components/add-song/add-song.component.spec.ts
+++ b/src/app/widget-modules/components/add-song/add-song.component.spec.ts
@@ -6,13 +6,11 @@ describe('AddSongComponent', () => {
   let component: AddSongComponent;
   let fixture: ComponentFixture<AddSongComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [AddSongComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [AddSongComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(AddSongComponent);
diff --git a/src/app/widget-modules/components/application-frame/navigation/brand/brand.component.spec.ts b/src/app/widget-modules/components/application-frame/navigation/brand/brand.component.spec.ts
index f765998..3bd2bb0 100644
--- a/src/app/widget-modules/components/application-frame/navigation/brand/brand.component.spec.ts
+++ b/src/app/widget-modules/components/application-frame/navigation/brand/brand.component.spec.ts
@@ -6,13 +6,11 @@ describe('BrandComponent', () => {
   let component: BrandComponent;
   let fixture: ComponentFixture<BrandComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [BrandComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [BrandComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(BrandComponent);
diff --git a/src/app/widget-modules/components/application-frame/navigation/brand/brand.component.ts b/src/app/widget-modules/components/application-frame/navigation/brand/brand.component.ts
index c7e21a4..603d0b1 100644
--- a/src/app/widget-modules/components/application-frame/navigation/brand/brand.component.ts
+++ b/src/app/widget-modules/components/application-frame/navigation/brand/brand.component.ts
@@ -1,9 +1,8 @@
 import {Component} from '@angular/core';
 
 @Component({
-    selector: 'app-brand',
-    templateUrl: './brand.component.html',
-    styleUrls: ['./brand.component.less'],
+  selector: 'app-brand',
+  templateUrl: './brand.component.html',
+  styleUrls: ['./brand.component.less'],
 })
-export class BrandComponent {
-}
+export class BrandComponent {}
diff --git a/src/app/widget-modules/components/application-frame/navigation/filter/filter.component.spec.ts b/src/app/widget-modules/components/application-frame/navigation/filter/filter.component.spec.ts
index a568676..cea3993 100644
--- a/src/app/widget-modules/components/application-frame/navigation/filter/filter.component.spec.ts
+++ b/src/app/widget-modules/components/application-frame/navigation/filter/filter.component.spec.ts
@@ -6,13 +6,11 @@ describe('FilterComponent', () => {
   let component: FilterComponent;
   let fixture: ComponentFixture<FilterComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [FilterComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [FilterComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(FilterComponent);
diff --git a/src/app/widget-modules/components/application-frame/navigation/filter/filter.component.ts b/src/app/widget-modules/components/application-frame/navigation/filter/filter.component.ts
index ed847ad..89836a1 100644
--- a/src/app/widget-modules/components/application-frame/navigation/filter/filter.component.ts
+++ b/src/app/widget-modules/components/application-frame/navigation/filter/filter.component.ts
@@ -1,17 +1,20 @@
 import {Component} from '@angular/core';
 import {ActivatedRoute, Params, Router} from '@angular/router';
-import { ReactiveFormsModule, FormsModule } from '@angular/forms';
+import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 
 @Component({
-    selector: 'app-filter',
-    templateUrl: './filter.component.html',
-    styleUrls: ['./filter.component.less'],
-    imports: [ReactiveFormsModule, FormsModule],
+  selector: 'app-filter',
+  templateUrl: './filter.component.html',
+  styleUrls: ['./filter.component.less'],
+  imports: [ReactiveFormsModule, FormsModule],
 })
 export class FilterComponent {
   public value = '';
 
-  public constructor(private router: Router, activatedRoute: ActivatedRoute) {
+  public constructor(
+    private router: Router,
+    activatedRoute: ActivatedRoute
+  ) {
     activatedRoute.queryParams.subscribe((params: Params) => {
       const typedParams = params as {q: string};
       if (typedParams.q) this.value = typedParams.q;
diff --git a/src/app/widget-modules/components/application-frame/navigation/link/link.component.spec.ts b/src/app/widget-modules/components/application-frame/navigation/link/link.component.spec.ts
index 2849fca..ba287d6 100644
--- a/src/app/widget-modules/components/application-frame/navigation/link/link.component.spec.ts
+++ b/src/app/widget-modules/components/application-frame/navigation/link/link.component.spec.ts
@@ -6,13 +6,11 @@ describe('LinkComponent', () => {
   let component: LinkComponent;
   let fixture: ComponentFixture<LinkComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [LinkComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [LinkComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(LinkComponent);
diff --git a/src/app/widget-modules/components/application-frame/navigation/link/link.component.ts b/src/app/widget-modules/components/application-frame/navigation/link/link.component.ts
index 331872c..f309570 100644
--- a/src/app/widget-modules/components/application-frame/navigation/link/link.component.ts
+++ b/src/app/widget-modules/components/application-frame/navigation/link/link.component.ts
@@ -1,18 +1,14 @@
 import {Component, Input} from '@angular/core';
 import {IconProp} from '@fortawesome/fontawesome-svg-core';
 import {faCross} from '@fortawesome/free-solid-svg-icons';
-import { RouterLinkActive, RouterLink } from '@angular/router';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
+import {RouterLink, RouterLinkActive} from '@angular/router';
+import {FaIconComponent} from '@fortawesome/angular-fontawesome';
 
 @Component({
-    selector: 'app-link',
-    templateUrl: './link.component.html',
-    styleUrls: ['./link.component.less'],
-    imports: [
-        RouterLinkActive,
-        RouterLink,
-        FaIconComponent,
-    ],
+  selector: 'app-link',
+  templateUrl: './link.component.html',
+  styleUrls: ['./link.component.less'],
+  imports: [RouterLinkActive, RouterLink, FaIconComponent],
 })
 export class LinkComponent {
   @Input() public text: string | null = null;
diff --git a/src/app/widget-modules/components/application-frame/navigation/navigation.component.spec.ts b/src/app/widget-modules/components/application-frame/navigation/navigation.component.spec.ts
index 4d5f921..76e0f6a 100644
--- a/src/app/widget-modules/components/application-frame/navigation/navigation.component.spec.ts
+++ b/src/app/widget-modules/components/application-frame/navigation/navigation.component.spec.ts
@@ -6,13 +6,11 @@ describe('NavigationComponent', () => {
   let component: NavigationComponent;
   let fixture: ComponentFixture<NavigationComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [NavigationComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [NavigationComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(NavigationComponent);
diff --git a/src/app/widget-modules/components/application-frame/navigation/navigation.component.ts b/src/app/widget-modules/components/application-frame/navigation/navigation.component.ts
index e3faf14..98a1e66 100644
--- a/src/app/widget-modules/components/application-frame/navigation/navigation.component.ts
+++ b/src/app/widget-modules/components/application-frame/navigation/navigation.component.ts
@@ -2,25 +2,18 @@ import {Component} from '@angular/core';
 import {faChalkboard, faMusic, faPersonBooth, faUserCog} from '@fortawesome/free-solid-svg-icons';
 import {fromEvent, Observable} from 'rxjs';
 import {distinctUntilChanged, map, shareReplay, startWith} from 'rxjs/operators';
-import { BrandComponent } from './brand/brand.component';
-import { RouterLink } from '@angular/router';
-import { RoleDirective } from '../../../../services/user/role.directive';
-import { LinkComponent } from './link/link.component';
-import { FilterComponent } from './filter/filter.component';
-import { AsyncPipe } from '@angular/common';
+import {BrandComponent} from './brand/brand.component';
+import {RouterLink} from '@angular/router';
+import {RoleDirective} from '../../../../services/user/role.directive';
+import {LinkComponent} from './link/link.component';
+import {FilterComponent} from './filter/filter.component';
+import {AsyncPipe} from '@angular/common';
 
 @Component({
-    selector: 'app-navigation',
-    templateUrl: './navigation.component.html',
-    styleUrls: ['./navigation.component.less'],
-    imports: [
-        BrandComponent,
-        RouterLink,
-        RoleDirective,
-        LinkComponent,
-        FilterComponent,
-        AsyncPipe,
-    ],
+  selector: 'app-navigation',
+  templateUrl: './navigation.component.html',
+  styleUrls: ['./navigation.component.less'],
+  imports: [BrandComponent, RouterLink, RoleDirective, LinkComponent, FilterComponent, AsyncPipe],
 })
 export class NavigationComponent {
   public faSongs = faMusic;
@@ -32,7 +25,7 @@ export class NavigationComponent {
     map(() => window.scrollY),
     startWith(0),
     distinctUntilChanged(),
-    shareReplay(1),
+    shareReplay(1)
   );
 
   public isNavigationHidden = (scroll: number | null): boolean => (scroll ?? 0) > 60;
diff --git a/src/app/widget-modules/components/button-row/button-row.component.spec.ts b/src/app/widget-modules/components/button-row/button-row.component.spec.ts
index a9e9761..ff9c947 100644
--- a/src/app/widget-modules/components/button-row/button-row.component.spec.ts
+++ b/src/app/widget-modules/components/button-row/button-row.component.spec.ts
@@ -6,13 +6,11 @@ describe('ButtonRowComponent', () => {
   let component: ButtonRowComponent;
   let fixture: ComponentFixture<ButtonRowComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [ButtonRowComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [ButtonRowComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(ButtonRowComponent);
diff --git a/src/app/widget-modules/components/button-row/button-row.component.ts b/src/app/widget-modules/components/button-row/button-row.component.ts
index 6e86fdc..a0628ae 100644
--- a/src/app/widget-modules/components/button-row/button-row.component.ts
+++ b/src/app/widget-modules/components/button-row/button-row.component.ts
@@ -1,9 +1,8 @@
 import {Component} from '@angular/core';
 
 @Component({
-    selector: 'app-button-row',
-    templateUrl: './button-row.component.html',
-    styleUrls: ['./button-row.component.less'],
+  selector: 'app-button-row',
+  templateUrl: './button-row.component.html',
+  styleUrls: ['./button-row.component.less'],
 })
-export class ButtonRowComponent {
-}
+export class ButtonRowComponent {}
diff --git a/src/app/widget-modules/components/button/button.component.spec.ts b/src/app/widget-modules/components/button/button.component.spec.ts
index 38b03a0..ccf5534 100644
--- a/src/app/widget-modules/components/button/button.component.spec.ts
+++ b/src/app/widget-modules/components/button/button.component.spec.ts
@@ -6,13 +6,11 @@ describe('ButtonComponent', () => {
   let component: ButtonComponent;
   let fixture: ComponentFixture<ButtonComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [ButtonComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [ButtonComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(ButtonComponent);
diff --git a/src/app/widget-modules/components/button/button.component.ts b/src/app/widget-modules/components/button/button.component.ts
index 74ee1e4..f8acd4f 100644
--- a/src/app/widget-modules/components/button/button.component.ts
+++ b/src/app/widget-modules/components/button/button.component.ts
@@ -1,18 +1,14 @@
 import {Component, Input} from '@angular/core';
 import {IconProp} from '@fortawesome/fontawesome-svg-core';
-import { MatButton } from '@angular/material/button';
-import { NgIf } from '@angular/common';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
+import {MatButton} from '@angular/material/button';
+import {NgIf} from '@angular/common';
+import {FaIconComponent} from '@fortawesome/angular-fontawesome';
 
 @Component({
-    selector: 'app-button',
-    templateUrl: './button.component.html',
-    styleUrls: ['./button.component.less'],
-    imports: [
-        MatButton,
-        NgIf,
-        FaIconComponent,
-    ],
+  selector: 'app-button',
+  templateUrl: './button.component.html',
+  styleUrls: ['./button.component.less'],
+  imports: [MatButton, NgIf, FaIconComponent],
 })
 export class ButtonComponent {
   @Input() public icon: IconProp | null = null;
diff --git a/src/app/widget-modules/components/card/card.component.spec.ts b/src/app/widget-modules/components/card/card.component.spec.ts
index 0fef438..7dedae0 100644
--- a/src/app/widget-modules/components/card/card.component.spec.ts
+++ b/src/app/widget-modules/components/card/card.component.spec.ts
@@ -6,13 +6,11 @@ describe('CardComponent', () => {
   let component: CardComponent;
   let fixture: ComponentFixture<CardComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [CardComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [CardComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(CardComponent);
diff --git a/src/app/widget-modules/components/card/card.component.ts b/src/app/widget-modules/components/card/card.component.ts
index f9f855f..de403f1 100644
--- a/src/app/widget-modules/components/card/card.component.ts
+++ b/src/app/widget-modules/components/card/card.component.ts
@@ -1,20 +1,15 @@
 import {Component, Input} from '@angular/core';
 import {faTimes} from '@fortawesome/free-solid-svg-icons';
-import { NgIf } from '@angular/common';
-import { MatIconButton } from '@angular/material/button';
-import { RouterLink } from '@angular/router';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
+import {NgIf} from '@angular/common';
+import {MatIconButton} from '@angular/material/button';
+import {RouterLink} from '@angular/router';
+import {FaIconComponent} from '@fortawesome/angular-fontawesome';
 
 @Component({
-    selector: 'app-card',
-    templateUrl: './card.component.html',
-    styleUrls: ['./card.component.less'],
-    imports: [
-        NgIf,
-        MatIconButton,
-        RouterLink,
-        FaIconComponent,
-    ],
+  selector: 'app-card',
+  templateUrl: './card.component.html',
+  styleUrls: ['./card.component.less'],
+  imports: [NgIf, MatIconButton, RouterLink, FaIconComponent],
 })
 export class CardComponent {
   @Input() public padding = true;
diff --git a/src/app/widget-modules/components/list-header/list-header.component.spec.ts b/src/app/widget-modules/components/list-header/list-header.component.spec.ts
index a2f8e3d..e68cf79 100644
--- a/src/app/widget-modules/components/list-header/list-header.component.spec.ts
+++ b/src/app/widget-modules/components/list-header/list-header.component.spec.ts
@@ -6,13 +6,11 @@ describe('ListHeaderComponent', () => {
   let component: ListHeaderComponent;
   let fixture: ComponentFixture<ListHeaderComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [ListHeaderComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [ListHeaderComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(ListHeaderComponent);
diff --git a/src/app/widget-modules/components/list-header/list-header.component.ts b/src/app/widget-modules/components/list-header/list-header.component.ts
index b9b9bf6..45976c0 100644
--- a/src/app/widget-modules/components/list-header/list-header.component.ts
+++ b/src/app/widget-modules/components/list-header/list-header.component.ts
@@ -1,24 +1,18 @@
 import {Component, EventEmitter, Input, Output} from '@angular/core';
 import {faFilter, faPlus} from '@fortawesome/free-solid-svg-icons';
 import {fade} from '../../../animations';
-import { MatIconButton } from '@angular/material/button';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
-import { RouterLink } from '@angular/router';
-import { NgIf } from '@angular/common';
-import { CardComponent } from '../card/card.component';
+import {MatIconButton} from '@angular/material/button';
+import {FaIconComponent} from '@fortawesome/angular-fontawesome';
+import {RouterLink} from '@angular/router';
+import {NgIf} from '@angular/common';
+import {CardComponent} from '../card/card.component';
 
 @Component({
-    selector: 'app-list-header',
-    templateUrl: './list-header.component.html',
-    styleUrls: ['./list-header.component.less'],
-    animations: [fade],
-    imports: [
-        MatIconButton,
-        FaIconComponent,
-        RouterLink,
-        NgIf,
-        CardComponent,
-    ],
+  selector: 'app-list-header',
+  templateUrl: './list-header.component.html',
+  styleUrls: ['./list-header.component.less'],
+  animations: [fade],
+  imports: [MatIconButton, FaIconComponent, RouterLink, NgIf, CardComponent],
 })
 export class ListHeaderComponent {
   public faNew = faPlus;
diff --git a/src/app/widget-modules/components/logo/logo.component.spec.ts b/src/app/widget-modules/components/logo/logo.component.spec.ts
index 981b563..ee5e732 100644
--- a/src/app/widget-modules/components/logo/logo.component.spec.ts
+++ b/src/app/widget-modules/components/logo/logo.component.spec.ts
@@ -6,13 +6,11 @@ describe('LogoComponent', () => {
   let component: LogoComponent;
   let fixture: ComponentFixture<LogoComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [LogoComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [LogoComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(LogoComponent);
diff --git a/src/app/widget-modules/components/logo/logo.component.ts b/src/app/widget-modules/components/logo/logo.component.ts
index 9902d5c..e96f1f2 100644
--- a/src/app/widget-modules/components/logo/logo.component.ts
+++ b/src/app/widget-modules/components/logo/logo.component.ts
@@ -1,9 +1,8 @@
 import {Component} from '@angular/core';
 
 @Component({
-    selector: 'app-logo',
-    templateUrl: './logo.component.html',
-    styleUrls: ['./logo.component.less'],
+  selector: 'app-logo',
+  templateUrl: './logo.component.html',
+  styleUrls: ['./logo.component.less'],
 })
-export class LogoComponent {
-}
+export class LogoComponent {}
diff --git a/src/app/widget-modules/components/menu-button/menu-button.component.spec.ts b/src/app/widget-modules/components/menu-button/menu-button.component.spec.ts
index 2cf14a2..4347037 100644
--- a/src/app/widget-modules/components/menu-button/menu-button.component.spec.ts
+++ b/src/app/widget-modules/components/menu-button/menu-button.component.spec.ts
@@ -6,13 +6,11 @@ describe('MenuButtonComponent', () => {
   let component: MenuButtonComponent;
   let fixture: ComponentFixture<MenuButtonComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [MenuButtonComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [MenuButtonComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(MenuButtonComponent);
diff --git a/src/app/widget-modules/components/menu-button/menu-button.component.ts b/src/app/widget-modules/components/menu-button/menu-button.component.ts
index e79efaf..9f53270 100644
--- a/src/app/widget-modules/components/menu-button/menu-button.component.ts
+++ b/src/app/widget-modules/components/menu-button/menu-button.component.ts
@@ -1,14 +1,14 @@
 import {Component, Input} from '@angular/core';
 import {IconProp} from '@fortawesome/fontawesome-svg-core';
 import {faCross} from '@fortawesome/free-solid-svg-icons';
-import { MatButton } from '@angular/material/button';
-import { FaIconComponent } from '@fortawesome/angular-fontawesome';
+import {MatButton} from '@angular/material/button';
+import {FaIconComponent} from '@fortawesome/angular-fontawesome';
 
 @Component({
-    selector: 'app-menu-button',
-    templateUrl: './menu-button.component.html',
-    styleUrls: ['./menu-button.component.less'],
-    imports: [MatButton, FaIconComponent],
+  selector: 'app-menu-button',
+  templateUrl: './menu-button.component.html',
+  styleUrls: ['./menu-button.component.less'],
+  imports: [MatButton, FaIconComponent],
 })
 export class MenuButtonComponent {
   @Input() public icon: IconProp = faCross;
diff --git a/src/app/widget-modules/components/song-text/song-text.component.html b/src/app/widget-modules/components/song-text/song-text.component.html
index c42d1e2..024bb09 100644
--- a/src/app/widget-modules/components/song-text/song-text.component.html
+++ b/src/app/widget-modules/components/song-text/song-text.component.html
@@ -23,8 +23,8 @@
       <div
         *ngFor="let line of getLines(section)"
         [class.chord]="line.type === 0"
-        [class.disabled]="checkDisabled(i)"
         [class.comment]="isComment(line.text)"
+        [class.disabled]="checkDisabled(i)"
         class="line"
       >{{ transform(line.text) }}
       </div>
diff --git a/src/app/widget-modules/components/song-text/song-text.component.spec.ts b/src/app/widget-modules/components/song-text/song-text.component.spec.ts
index 5b13ae3..0ed4416 100644
--- a/src/app/widget-modules/components/song-text/song-text.component.spec.ts
+++ b/src/app/widget-modules/components/song-text/song-text.component.spec.ts
@@ -6,13 +6,11 @@ describe('SongTextComponent', () => {
   let component: SongTextComponent;
   let fixture: ComponentFixture<SongTextComponent>;
 
-  beforeEach(
-    waitForAsync(() => {
-      void TestBed.configureTestingModule({
-    imports: [SongTextComponent],
-}).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    void TestBed.configureTestingModule({
+      imports: [SongTextComponent],
+    }).compileComponents();
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(SongTextComponent);
diff --git a/src/app/widget-modules/directives/autofocus/autofocus.directive.ts b/src/app/widget-modules/directives/autofocus/autofocus.directive.ts
index cce35c9..55c9e84 100644
--- a/src/app/widget-modules/directives/autofocus/autofocus.directive.ts
+++ b/src/app/widget-modules/directives/autofocus/autofocus.directive.ts
@@ -1,11 +1,10 @@
 import {Directive, ElementRef, Input, OnInit} from '@angular/core';
 
-@Directive({ selector: '[appAutofocus]', })
+@Directive({selector: '[appAutofocus]'})
 export class AutofocusDirective implements OnInit {
   private focus = true;
 
-  public constructor(private el: ElementRef<HTMLElement>) {
-  }
+  public constructor(private el: ElementRef<HTMLElement>) {}
 
   @Input()
   public set autofocus(condition: boolean) {
diff --git a/src/app/widget-modules/guards/role.guard.ts b/src/app/widget-modules/guards/role.guard.ts
index dd33f60..811479d 100644
--- a/src/app/widget-modules/guards/role.guard.ts
+++ b/src/app/widget-modules/guards/role.guard.ts
@@ -8,8 +8,10 @@ import {map} from 'rxjs/operators';
   providedIn: 'root',
 })
 export class RoleGuard {
-  public constructor(private userService: UserService, private router: Router) {
-  }
+  public constructor(
+    private userService: UserService,
+    private router: Router
+  ) {}
 
   public canActivate(next: ActivatedRouteSnapshot): Observable<boolean | UrlTree> {
     const requiredRoles = next.data.requiredRoles as string[];
@@ -27,7 +29,7 @@ export class RoleGuard {
         const allowed = roles.some(s => requiredRoles.indexOf(s) !== -1);
 
         return allowed || this.router.createUrlTree(this.defaultRoute(roles));
-      }),
+      })
     );
   }
 
diff --git a/src/main.ts b/src/main.ts
index 3aea78b..ab55f8e 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,34 +1,42 @@
-import { enableProdMode, importProvidersFrom } from '@angular/core';
-import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
-
+import {enableProdMode, importProvidersFrom} from '@angular/core';
 
 import {environment} from './environments/environment';
-import { MAT_DATE_LOCALE } from '@angular/material/core';
-import { BrowserModule, bootstrapApplication } from '@angular/platform-browser';
-import { provideAnimations } from '@angular/platform-browser/animations';
-import { AppRoutingModule } from './app/app-routing.module';
-import { ServiceWorkerModule } from '@angular/service-worker';
-import { AngularFireModule } from '@angular/fire/compat';
-import { AngularFirestoreModule } from '@angular/fire/compat/firestore';
-import { AngularFireStorageModule } from '@angular/fire/compat/storage';
-import { AngularFireDatabaseModule } from '@angular/fire/compat/database';
-import { AngularFireAuthModule } from '@angular/fire/compat/auth';
-import { AngularFireAuthGuardModule } from '@angular/fire/compat/auth-guard';
-import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
-import { AppComponent } from './app/app.component';
+import {MAT_DATE_LOCALE} from '@angular/material/core';
+import {bootstrapApplication, BrowserModule} from '@angular/platform-browser';
+import {provideAnimations} from '@angular/platform-browser/animations';
+import {AppRoutingModule} from './app/app-routing.module';
+import {ServiceWorkerModule} from '@angular/service-worker';
+import {AngularFireModule} from '@angular/fire/compat';
+import {AngularFirestoreModule} from '@angular/fire/compat/firestore';
+import {AngularFireStorageModule} from '@angular/fire/compat/storage';
+import {AngularFireDatabaseModule} from '@angular/fire/compat/database';
+import {AngularFireAuthModule} from '@angular/fire/compat/auth';
+import {AngularFireAuthGuardModule} from '@angular/fire/compat/auth-guard';
+import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
+import {AppComponent} from './app/app.component';
 
 if (environment.production) {
   enableProdMode();
 }
 
 bootstrapApplication(AppComponent, {
-    providers: [
-        importProvidersFrom(BrowserModule, AppRoutingModule, ServiceWorkerModule.register('ngsw-worker.js', {
-            enabled: environment.production,
-        }), AngularFireModule.initializeApp(environment.firebase), AngularFirestoreModule.enablePersistence({ synchronizeTabs: true }), AngularFireStorageModule, AngularFireDatabaseModule, AngularFireAuthModule, AngularFireAuthGuardModule, FontAwesomeModule),
-        { provide: MAT_DATE_LOCALE, useValue: 'de-DE' },
-        provideAnimations(),
-        provideAnimations(),
-    ]
-})
-  .catch(err => console.error(err));
+  providers: [
+    importProvidersFrom(
+      BrowserModule,
+      AppRoutingModule,
+      ServiceWorkerModule.register('ngsw-worker.js', {
+        enabled: environment.production,
+      }),
+      AngularFireModule.initializeApp(environment.firebase),
+      AngularFirestoreModule.enablePersistence({synchronizeTabs: true}),
+      AngularFireStorageModule,
+      AngularFireDatabaseModule,
+      AngularFireAuthModule,
+      AngularFireAuthGuardModule,
+      FontAwesomeModule
+    ),
+    {provide: MAT_DATE_LOCALE, useValue: 'de-DE'},
+    provideAnimations(),
+    provideAnimations(),
+  ],
+}).catch(err => console.error(err));