linting

src/app/widget-modules/components/add-song/add-song.component.ts

@@ -1,5 +1,5 @@
 import {ChangeDetectionStrategy, Component, Input, inject} from '@angular/core';
-import {ReactiveFormsModule, UntypedFormControl} from '@angular/forms';
+import {FormControl, ReactiveFormsModule} from '@angular/forms';
 import {filterSong} from '../../../services/filter.helper';
 import {MatFormField, MatLabel, MatOption, MatSelect, MatSelectChange} from '@angular/material/select';
 import {Song} from '../../../modules/songs/services/song';
@@ -25,7 +25,7 @@ export class AddSongComponent {
   @Input() public showSongs: ShowSong[] | null = null;
   @Input() public show: Show | null = null;
   @Input() public addedLive = false;
-  public filteredSongsControl = new UntypedFormControl();
+  public filteredSongsControl = new FormControl<string>('', {nonNullable: true});
 
   public filteredSongs(): Song[] {
     if (!this.songs) return [];
@@ -44,7 +44,7 @@ export class AddSongComponent {
         return 0;
       });
 
-    const filterValue = this.filteredSongsControl.value as string;
+    const filterValue = this.filteredSongsControl.value;
     return filterValue ? songs.filter(_ => filterSong(_, filterValue)) : songs;
   }
 

src/app/widget-modules/components/application-frame/navigation/filter/filter.component.ts

@@ -1,4 +1,5 @@
-import {Component, inject} from '@angular/core';
+import {Component, DestroyRef, inject} from '@angular/core';
+import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
 import {ActivatedRoute, Params, Router} from '@angular/router';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 
@@ -10,13 +11,14 @@ import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 })
 export class FilterComponent {
   private router = inject(Router);
+  private destroyRef = inject(DestroyRef);
 
   public value = '';
 
   public constructor() {
     const activatedRoute = inject(ActivatedRoute);
 
-    activatedRoute.queryParams.subscribe((params: Params) => {
+    activatedRoute.queryParams.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((params: Params) => {
       const typedParams = params as {q: string};
       if (typedParams.q) this.value = typedParams.q;
     });

src/app/widget-modules/components/song-text/song-text.component.ts

@@ -1,4 +1,4 @@
-import {ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, OnInit, Output, QueryList, ViewChildren, inject} from '@angular/core';
+import {ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, OnDestroy, OnInit, Output, QueryList, ViewChildren, inject} from '@angular/core';
 import {TextRenderingService} from '../../../modules/songs/services/text-rendering.service';
 import {faGripLines} from '@fortawesome/free-solid-svg-icons';
 import {songSwitch} from './animation';
@@ -27,7 +27,7 @@ interface DisplaySegment {
   animations: [songSwitch],
   imports: [MatIconButton, FaIconComponent],
 })
-export class SongTextComponent implements OnInit {
+export class SongTextComponent implements OnInit, OnDestroy {
   private textRenderingService = inject(TextRenderingService);
   private elRef = inject<ElementRef<HTMLElement>>(ElementRef);
   private cRef = inject(ChangeDetectorRef);
@@ -47,6 +47,7 @@ export class SongTextComponent implements OnInit {
   private invalidChordIssuesByLine = new Map<number, ChordValidationIssue[]>();
   private iText = '';
   private iTranspose: TransposeMode | null = null;
+  private offsetIntervalId: ReturnType<typeof setInterval> | null = null;
 
   @Input()
   public set chordMode(value: ChordMode) {
@@ -73,7 +74,7 @@ export class SongTextComponent implements OnInit {
   }
 
   public ngOnInit(): void {
-    setInterval(() => {
+    this.offsetIntervalId = setInterval(() => {
       if (!this.fullscreen || this.index === -1 || !this.viewSections?.toArray()[this.index]) {
         this.offset = 0;
         this.cRef.markForCheck();
@@ -84,6 +85,12 @@ export class SongTextComponent implements OnInit {
     }, 100);
   }
 
+  public ngOnDestroy(): void {
+    if (this.offsetIntervalId) {
+      clearInterval(this.offsetIntervalId);
+    }
+  }
+
   public getLines(section: Section): Line[] {
     return section.lines.filter(_ => {
       if (_.type !== LineType.chord) {