auto migrate standalone components

src/app/modules/shows/dialog/archive-dialog/archive-dialog.component.spec.ts

@@ -8,8 +8,8 @@ describe('ArchiveDialogComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [ArchiveDialogComponent],
-    }).compileComponents();
+    imports: [ArchiveDialogComponent],
+}).compileComponents();
 
     fixture = TestBed.createComponent(ArchiveDialogComponent);
     component = fixture.componentInstance;

src/app/modules/shows/dialog/archive-dialog/archive-dialog.component.ts

@@ -1,10 +1,19 @@
 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';
 
 @Component({
-  selector: 'app-archive-dialog',
-  templateUrl: './archive-dialog.component.html',
-  styleUrls: ['./archive-dialog.component.less'],
-  standalone: false,
+    selector: 'app-archive-dialog',
+    templateUrl: './archive-dialog.component.html',
+    styleUrls: ['./archive-dialog.component.less'],
+    imports: [
+        CdkScrollable,
+        MatDialogContent,
+        MatDialogActions,
+        MatButton,
+        MatDialogClose,
+    ],
 })
 export class ArchiveDialogComponent {
 }

src/app/modules/shows/edit/edit.component.ts

@@ -3,18 +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} from '@angular/forms';
+import { FormControl, FormGroup, Validators, ReactiveFormsModule } 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 Timestamp = firebase.firestore.Timestamp;
 
 @Component({
-  selector: 'app-edit',
-  templateUrl: './edit.component.html',
-  styleUrls: ['./edit.component.less'],
-  standalone: false,
+    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[]>;

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

@@ -8,8 +8,8 @@ describe('FilterComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [FilterComponent],
-    }).compileComponents();
+    imports: [FilterComponent],
+}).compileComponents();
   });
 
   beforeEach(() => {

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

@@ -1,7 +1,7 @@
 import {Component, Input} from '@angular/core';
-import {KeyValue} from '@angular/common';
+import { KeyValue, NgFor } from '@angular/common';
 import {ActivatedRoute, Router} from '@angular/router';
-import {UntypedFormBuilder, UntypedFormGroup} from '@angular/forms';
+import { UntypedFormBuilder, UntypedFormGroup, ReactiveFormsModule } from '@angular/forms';
 import {FilterValues} from './filter-values';
 import {Show} from '../../services/show';
 import {ShowService} from '../../services/show.service';
@@ -10,12 +10,25 @@ 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';
 
 @Component({
-  selector: 'app-filter',
-  templateUrl: './filter.component.html',
-  styleUrls: ['./filter.component.less'],
-  standalone: false,
+    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/';

src/app/modules/shows/list/list-item/list-item.component.spec.ts

@@ -9,8 +9,8 @@ describe('ListItemComponent', () => {
   beforeEach(
     waitForAsync(() => {
       void TestBed.configureTestingModule({
-        declarations: [ListItemComponent],
-      }).compileComponents();
+    imports: [ListItemComponent],
+}).compileComponents();
     }),
   );
 

src/app/modules/shows/list/list-item/list-item.component.ts

@@ -1,11 +1,19 @@
 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';
 
 @Component({
-  selector: 'app-list-item',
-  templateUrl: './list-item.component.html',
-  styleUrls: ['./list-item.component.less'],
-  standalone: false,
+    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;

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

@@ -9,8 +9,8 @@ describe('ListComponent', () => {
   beforeEach(
     waitForAsync(() => {
       void TestBed.configureTestingModule({
-        declarations: [ListComponent],
-      }).compileComponents();
+    imports: [ListComponent],
+}).compileComponents();
     }),
   );
 

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

@@ -4,15 +4,33 @@ import {Show} from '../services/show';
 import {fade} from '../../../animations';
 import {ShowService} from '../services/show.service';
 import {FilterValues} from './filter/filter-values';
-import {ActivatedRoute} 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';
 
 @Component({
-  selector: 'app-list',
-  templateUrl: './list.component.html',
-  styleUrls: ['./list.component.less'],
-  animations: [fade],
-  standalone: false,
+    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$();

src/app/modules/shows/new/new.component.spec.ts

@@ -9,8 +9,8 @@ describe('NewComponent', () => {
   beforeEach(
     waitForAsync(() => {
       void TestBed.configureTestingModule({
-        declarations: [NewComponent],
-      }).compileComponents();
+    imports: [NewComponent],
+}).compileComponents();
     }),
   );
 

src/app/modules/shows/new/new.component.ts

@@ -3,15 +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} from '@angular/forms';
+import { UntypedFormControl, UntypedFormGroup, Validators, ReactiveFormsModule } 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';
 
 @Component({
-  selector: 'app-new',
-  templateUrl: './new.component.html',
-  styleUrls: ['./new.component.less'],
-  standalone: false,
+    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[]>;

src/app/modules/shows/show/show.component.spec.ts

@@ -9,8 +9,8 @@ describe('ShowComponent', () => {
   beforeEach(
     waitForAsync(() => {
       void TestBed.configureTestingModule({
-        declarations: [ShowComponent],
-      }).compileComponents();
+    imports: [ShowComponent],
+}).compileComponents();
     }),
   );
 

src/app/modules/shows/show/show.component.ts

@@ -25,20 +25,60 @@ import {
   faUser,
   faUsers,
 } from '@fortawesome/free-solid-svg-icons';
-import {CdkDragDrop, moveItemInArray} from '@angular/cdk/drag-drop';
+import { CdkDragDrop, moveItemInArray, CdkDropList, CdkDrag } 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';
 
 @Component({
-  selector: 'app-show',
-  templateUrl: './show.component.html',
-  styleUrls: ['./show.component.less'],
-  animations: [fade],
-  standalone: false,
+    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;

src/app/modules/shows/show/song/song.component.spec.ts

@@ -9,8 +9,8 @@ describe('SongComponent', () => {
   beforeEach(
     waitForAsync(() => {
       void TestBed.configureTestingModule({
-        declarations: [SongComponent],
-      }).compileComponents();
+    imports: [SongComponent],
+}).compileComponents();
     }),
   );
 

src/app/modules/shows/show/song/song.component.ts

@@ -2,19 +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} from '@angular/forms';
-import {ChordMode} from '../../../../widget-modules/components/song-text/song-text.component';
+import { UntypedFormControl, ReactiveFormsModule } 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';
 
 @Component({
-  selector: 'app-song',
-  templateUrl: './song.component.html',
-  styleUrls: ['./song.component.less'],
-  animations: [fade],
-  standalone: false,
+    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;

src/app/modules/shows/shows.module.ts

@@ -3,15 +3,15 @@ import {CommonModule} from '@angular/common';
 
 import {ShowsRoutingModule} from './shows-routing.module';
 import {NewComponent} from './new/new.component';
-import {CardModule} from '../../widget-modules/components/card/card.module';
+
 import {MatFormFieldModule} from '@angular/material/form-field';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {MatInputModule} from '@angular/material/input';
 import {ListComponent} from './list/list.component';
 import {ListItemComponent} from './list/list-item/list-item.component';
-import {ListHeaderModule} from '../../widget-modules/components/list-header/list-header.module';
+
 import {MatCheckboxModule} from '@angular/material/checkbox';
-import {ButtonRowModule} from '../../widget-modules/components/button-row/button-row.module';
+
 import {MatButtonModule} from '@angular/material/button';
 import {MatDatepickerModule} from '@angular/material/datepicker';
 import {MatSelectModule} from '@angular/material/select';
@@ -19,14 +19,14 @@ import {MatNativeDateModule} from '@angular/material/core';
 import {ShowComponent} from './show/show.component';
 import {SongComponent} from './show/song/song.component';
 import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
-import {MenuButtonModule} from '../../widget-modules/components/menu-button/menu-button.module';
+
 import {NgxMatSelectSearchModule} from 'ngx-mat-select-search';
-import {ButtonModule} from '../../widget-modules/components/button/button.module';
-import {OwnerModule} from '../../services/user/owner.module';
-import {UserNameModule} from '../../services/user/user-name/user-name.module';
+
+
+
 import {MatMenuModule} from '@angular/material/menu';
 import {DragDropModule} from '@angular/cdk/drag-drop';
-import {RoleModule} from '../../services/user/role.module';
+
 import {MatTooltipModule} from '@angular/material/tooltip';
 import {FilterComponent} from './list/filter/filter.component';
 import {EditComponent} from './edit/edit.component';
@@ -38,38 +38,30 @@ import {ShowTypePipe} from '../../widget-modules/pipes/show-type-translater/show
 import {SortByPipe} from '../../widget-modules/pipes/sort-by/sort-by.pipe';
 
 @NgModule({
-  declarations: [NewComponent, ListComponent, ListItemComponent, ShowComponent, SongComponent, FilterComponent, EditComponent, ArchiveDialogComponent],
-  imports: [
+    imports: [
     CommonModule,
     ShowsRoutingModule,
-    CardModule,
     MatFormFieldModule,
     ReactiveFormsModule,
     MatInputModule,
-    ListHeaderModule,
     MatCheckboxModule,
-    ButtonRowModule,
     MatButtonModule,
     MatDatepickerModule,
     MatNativeDateModule,
     MatSelectModule,
     ShowTypePipe,
     FontAwesomeModule,
-    MenuButtonModule,
     FormsModule,
     SongTextComponent,
     NgxMatSelectSearchModule,
     AddSongComponent,
-    ButtonModule,
-    OwnerModule,
-    UserNameModule,
     MatMenuModule,
     DragDropModule,
-    RoleModule,
     SortByPipe,
     MatTooltipModule,
     MatDialogModule,
-  ],
-  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    NewComponent, ListComponent, ListItemComponent, ShowComponent, SongComponent, FilterComponent, EditComponent, ArchiveDialogComponent,
+],
+    schemas: [CUSTOM_ELEMENTS_SCHEMA],
 })
 export class ShowsModule {}