Fixed most UI comments

UI/Web/src/app/_models/library/library.ts

@@ -14,7 +14,7 @@ export enum LibraryType {
 
 export const allLibraryTypes = [LibraryType.Manga, LibraryType.ComicVine, LibraryType.Comic, LibraryType.Book, LibraryType.LightNovel, LibraryType.Images];
 export const allKavitaPlusMetadataApplicableTypes = [LibraryType.Manga, LibraryType.LightNovel, LibraryType.ComicVine, LibraryType.Comic];
-export const allKavitaPlusEligibleTypes = [LibraryType.Manga, LibraryType.LightNovel];
+export const allKavitaPlusScrobbleEligibleTypes = [LibraryType.Manga, LibraryType.LightNovel];
 
 export interface Library {
     id: number;

UI/Web/src/app/_single-module/sort-button/sort-button.component.html

@@ -1,6 +1,6 @@
 <ng-container *transloco="let t">
-  <button class="btn btn-sm btn-icon" (click)="updateSortOrder()" style="height: 25px; padding-bottom: 0;" [disabled]="isDisabled()">
-    @if (currentAscending()) {
+  <button class="btn btn-sm btn-icon" (click)="updateSortOrder()" style="height: 25px; padding-bottom: 0;" [disabled]="disabled()">
+    @if (isAscending()) {
       <i class="fa fa-arrow-up" [title]="t('metadata-filter.ascending-alt')"></i>
     } @else {
       <i class="fa fa-arrow-down" [title]="t('metadata-filter.descending-alt')"></i>

UI/Web/src/app/_single-module/sort-button/sort-button.component.ts

@@ -1,4 +1,4 @@
-import {ChangeDetectionStrategy, Component, computed, EventEmitter, input, Output, signal} from '@angular/core';
+import {ChangeDetectionStrategy, Component, input, model} from '@angular/core';
 import {TranslocoDirective} from "@jsverse/transloco";
 
 @Component({
@@ -12,21 +12,10 @@ import {TranslocoDirective} from "@jsverse/transloco";
 })
 export class SortButtonComponent {
 
-  // input is replacement for @Input
   disabled = input<boolean>(false);
-  isAscending = input<boolean>(true);
-
-  // signal is for internal state, whenever component needs to update the state internally. Not needed for disabled since component doesn't internally modify
-  private isAscendingSignal = signal(this.isAscending());
-
-  // Computed signals for template
-  protected currentAscending = computed(() => this.isAscendingSignal());
-  protected isDisabled = computed(() => this.disabled());
-
-  @Output() update = new EventEmitter<boolean>();
+  isAscending = model<boolean>(true);
 
   updateSortOrder() {
-    this.isAscendingSignal.set(!this.isAscendingSignal());
-    this.update.emit(this.isAscendingSignal());
+    this.isAscending.set(!this.isAscending());
   }
 }

UI/Web/src/app/all-series/_components/all-series/all-series.component.ts

@@ -148,13 +148,9 @@ export class AllSeriesComponent implements OnInit {
       if (this.shouldRewriteTitle()) {
         const field = this.filter!.statements[0].field;
 
-        console.log('field', field);
-
         // This api returns value as string and number, it will complain without the casting
         (this.metadataService.getOptionsForFilterField<FilterField>(field, 'series') as Observable<Select2Option[]>).subscribe((opts: Select2Option[]) => {
-          console.log('opts:', opts);
 
-          // BUG: There is now a timing issue when navigating FROM a click. On refresh it works.
           const matchingOpts = opts.filter(m => `${m.value}` === `${this.filter!.statements[0].value}`);
           if (matchingOpts.length === 0) return;
 

UI/Web/src/app/cards/card-detail-layout/card-detail-layout.component.ts

@@ -154,7 +154,7 @@ export class CardDetailLayoutComponent<TFilter extends number, TSort extends num
 
   ngOnInit(): void {
     if (this.trackByIdentity === undefined) {
-      this.trackByIdentity = (_: number, item: any) => `${this.header}_${this.updateApplied}_${item?.libraryId}`;
+      this.trackByIdentity = (_: number, item: any) => `${this.header()}_${this.updateApplied}_${item?.id}`;
     }
 
     if (this.pagination === undefined) {

UI/Web/src/app/metadata-filter/_components/metadata-filter-row/metadata-filter-row.component.ts

@@ -312,7 +312,6 @@ export class MetadataFilterRowComponent<TFilter extends number = number, TSort e
 
   handleFieldChange(val: string) {
     const inputVal = parseInt(val, 10) as TFilter;
-    console.log('input', inputVal);inputVal
 
     const stringFields = this.filterUtilitiesService.getStringFields<TFilter>(this.entityType());
     const dropdownFields = this.filterUtilitiesService.getDropdownFields<TFilter>(this.entityType());

UI/Web/src/app/metadata-filter/metadata-filter.component.html

@@ -41,7 +41,7 @@
             </div>
             <div class="col-md-3 col-sm-9">
               <label for="sort-options" class="form-label">{{t('sort-by-label')}}</label>
-              <app-sort-button [disabled]="filterSettings().sortDisabled" (update)="updateSortOrder($event)" [isAscending]="isAscendingSort" />
+              <app-sort-button [disabled]="filterSettings().sortDisabled" (isAscendingChange)="updateSortOrder($event)" [isAscending]="isAscendingSort" />
               <select id="sort-options" class="form-select" formControlName="sortField" style="height: 38px;">
                 @for(field of sortFieldOptions(); track field.value) {
                   <option [value]="field.value">{{field.title}}</option>

UI/Web/src/app/sidenav/_modals/library-settings-modal/library-settings-modal.component.ts

@@ -21,8 +21,8 @@ import {
 import {ConfirmService} from 'src/app/shared/confirm.service';
 import {Breakpoint, UtilityService} from 'src/app/shared/_services/utility.service';
 import {
-  allKavitaPlusEligibleTypes,
   allKavitaPlusMetadataApplicableTypes,
+  allKavitaPlusScrobbleEligibleTypes,
   allLibraryTypes,
   Library,
   LibraryType
@@ -131,7 +131,7 @@ export class LibrarySettingsModalComponent implements OnInit {
 
   get IsKavitaPlusEligible() {
     const libType = parseInt(this.libraryForm.get('type')?.value + '', 10) as LibraryType;
-    return allKavitaPlusEligibleTypes.includes(libType);
+    return allKavitaPlusScrobbleEligibleTypes.includes(libType);
   }
 
   get IsMetadataDownloadEligible() {