feat: live toggle — views re-render when Library Only mode changes
All three explore components now subscribe to exploreSettings: - explore-view: re-runs the current search when toggled. In library-only mode this means instant local-only results; toggling off fires the full MB/LB pipeline. - explore-artist-details: re-runs loadAllData which branches on libraryOnly — switching modes live-swaps between the full API view and the library-only view. - explore-album-details: re-renders to pick up any mode-dependent display changes. All subscriptions are cleaned up in disconnectedCallback.
This commit is contained in:
@@ -11,6 +11,7 @@ import type {
|
||||
MBTrack,
|
||||
} from '@go/explore/Service';
|
||||
import { exploreCache } from '../../store/explore-cache';
|
||||
import { exploreSettings } from '../../store/explore-settings';
|
||||
import '@awesome.me/webawesome/dist/components/icon/icon.js';
|
||||
|
||||
/* ── Constants ── */
|
||||
@@ -385,11 +386,22 @@ export class ExploreAlbumDetails extends LitElement {
|
||||
|
||||
/* ── Lifecycle ── */
|
||||
|
||||
private unsubSettings?: () => void;
|
||||
|
||||
override connectedCallback() {
|
||||
super.connectedCallback();
|
||||
if (this.releaseGroupMBID) {
|
||||
void this.loadAllData();
|
||||
}
|
||||
|
||||
this.unsubSettings = exploreSettings.subscribe(() => {
|
||||
this.requestUpdate();
|
||||
});
|
||||
}
|
||||
|
||||
override disconnectedCallback() {
|
||||
super.disconnectedCallback();
|
||||
this.unsubSettings?.();
|
||||
}
|
||||
|
||||
/* ── Data Loading ── */
|
||||
|
||||
@@ -677,11 +677,26 @@ export class ExploreArtistDetails extends LitElement {
|
||||
|
||||
/* ── Lifecycle ── */
|
||||
|
||||
private unsubSettings?: () => void;
|
||||
|
||||
override connectedCallback() {
|
||||
super.connectedCallback();
|
||||
if (this.artistMBID) {
|
||||
void this.loadAllData();
|
||||
}
|
||||
|
||||
// Re-render when library-only mode toggles.
|
||||
this.unsubSettings = exploreSettings.subscribe(() => {
|
||||
this.requestUpdate();
|
||||
if (this.artistMBID) {
|
||||
void this.loadAllData();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
override disconnectedCallback() {
|
||||
super.disconnectedCallback();
|
||||
this.unsubSettings?.();
|
||||
}
|
||||
|
||||
/* ── Data Loading ── */
|
||||
|
||||
@@ -496,8 +496,23 @@ export class ExploreView extends LitElement {
|
||||
|
||||
/* ── Lifecycle ── */
|
||||
|
||||
private unsubSettings?: () => void;
|
||||
|
||||
override connectedCallback() {
|
||||
super.connectedCallback();
|
||||
// Re-render and re-search when library-only mode toggles.
|
||||
this.unsubSettings = exploreSettings.subscribe(() => {
|
||||
this.requestUpdate();
|
||||
// Re-run the current search with the new mode.
|
||||
if (this.searchQuery.trim().length >= MIN_QUERY_LENGTH) {
|
||||
void this.executeSearch();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
override disconnectedCallback() {
|
||||
super.disconnectedCallback();
|
||||
this.unsubSettings?.();
|
||||
if (this.debounceTimer !== null) {
|
||||
clearTimeout(this.debounceTimer);
|
||||
this.debounceTimer = null;
|
||||
|
||||
Reference in New Issue
Block a user