fixed library scan using event listeners instead of store pattern

frontend/src/components/genre-details/genre-details.ts

@@ -4,10 +4,8 @@ import {
     property,
     state,
 } from 'lit/decorators.js';
-import { EventsOn } from '@runtime/runtime';
 import { library } from '@go/models';
 import { LibraryController } from '@store/controllers/library-controller';
-import { Events } from '../../events';
 import '@awesome.me/webawesome/dist/components/icon/icon.js';
 import '@components/track-list/track-list.js';
 
@@ -23,7 +21,9 @@ export class GenreDetails extends LitElement {
     private loading = true;
 
     private libraryCtrl = new LibraryController(this);
-    private cancelScanComplete?: () => void;
+
+    /** Tracks the store's cached array reference to detect refreshes. */
+    private lastTracksRef: library.Track[] | null = null;
 
     static override styles = css`
         :host {
@@ -151,15 +151,18 @@ export class GenreDetails extends LitElement {
     override connectedCallback() {
         super.connectedCallback();
         this.loadTracks();
-        this.cancelScanComplete = EventsOn(
-            Events.LibraryScanComplete,
-            () => this.loadTracks(),
-        );
     }
 
-    override disconnectedCallback() {
-        super.disconnectedCallback();
-        this.cancelScanComplete?.();
+    override updated() {
+        const cached = this.libraryCtrl.cachedTracks;
+
+        if (
+            cached !== null &&
+            cached !== this.lastTracksRef
+        ) {
+            this.lastTracksRef = cached;
+            this.loadTracks();
+        }
     }
 
     /* ================================================================