From ec02887d221c455f9f6fbbb93d6be6c9ce8f1a36 Mon Sep 17 00:00:00 2001
From: saopig1 <4x7sw862st@gmail.com>
Date: Wed, 6 May 2026 13:26:46 +0800
Subject: [PATCH] fix(web): post-review fixes for source tabs

- Reset per-platform fields on fetch failure (was leaving stale data
  for up to 5 minutes after the user logged out of NetEase).
- Extract availableSources getter on the store; deduplicate the daily/
  user availability computeds in Home.vue and Library.vue.
- Add comment explaining why recommendAvailable always seeds netease.
- Import Source type in SourceTabs.vue from the store instead of
  redeclaring locally, removing a future type-drift risk.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 web/src/components/SourceTabs.vue |  2 +-
 web/src/stores/player.ts          | 39 +++++++++++++++++--------------
 web/src/views/Home.vue            | 16 ++++---------
 web/src/views/Library.vue         |  7 +-----
 4 files changed, 27 insertions(+), 37 deletions(-)

diff --git a/web/src/components/SourceTabs.vue b/web/src/components/SourceTabs.vue
index 8d3b723..365cf9b 100644
--- a/web/src/components/SourceTabs.vue
+++ b/web/src/components/SourceTabs.vue
@@ -14,7 +14,7 @@
 </template>
 
 <script setup lang="ts">
-type Source = 'netease' | 'qq';
+import type { Source } from '../stores/player.js';
 
 const LABELS: Record<Source, string> = {
   netease: '网易云',
diff --git a/web/src/stores/player.ts b/web/src/stores/player.ts
index 83a259a..25d5cf0 100644
--- a/web/src/stores/player.ts
+++ b/web/src/stores/player.ts
@@ -94,6 +94,13 @@ export const usePlayerStore = defineStore('player', {
       if (this.isPaused) return Math.min(timing.serverElapsed, maxDuration);
       return Math.min(timing.serverElapsed + (Date.now() - timing.serverSyncTime) / 1000, maxDuration);
     },
+    /** Sources that are currently logged in. Order: netease before qq. */
+    availableSources(): Source[] {
+      const s: Source[] = [];
+      if (this.authStatus.netease) s.push('netease');
+      if (this.authStatus.qq) s.push('qq');
+      return s;
+    },
   },
 
   actions: {
@@ -401,24 +408,20 @@ export const usePlayerStore = defineStore('player', {
 
       const [neRecPL, neDaily, neUserPL, qqRecPL, qqDaily, qqUserPL, bili] = results;
 
-      if (neRecPL.status === 'fulfilled') {
-        this.recommendPlaylists.netease = neRecPL.value.data.playlists ?? [];
-      }
-      if (neDaily.status === 'fulfilled') {
-        this.dailySongs.netease = neDaily.value.data.songs ?? [];
-      }
-      if (neUserPL.status === 'fulfilled') {
-        this.userPlaylists.netease = neUserPL.value.data.playlists ?? [];
-      }
-      if (qqRecPL.status === 'fulfilled') {
-        this.recommendPlaylists.qq = qqRecPL.value.data.playlists ?? [];
-      }
-      if (qqDaily.status === 'fulfilled') {
-        this.dailySongs.qq = qqDaily.value.data.songs ?? [];
-      }
-      if (qqUserPL.status === 'fulfilled') {
-        this.userPlaylists.qq = qqUserPL.value.data.playlists ?? [];
-      }
+      this.recommendPlaylists.netease =
+        neRecPL.status === 'fulfilled' ? (neRecPL.value.data.playlists ?? []) : [];
+      this.dailySongs.netease =
+        neDaily.status === 'fulfilled' ? (neDaily.value.data.songs ?? []) : [];
+      this.userPlaylists.netease =
+        neUserPL.status === 'fulfilled' ? (neUserPL.value.data.playlists ?? []) : [];
+      this.recommendPlaylists.qq =
+        qqRecPL.status === 'fulfilled' ? (qqRecPL.value.data.playlists ?? []) : [];
+      this.dailySongs.qq =
+        qqDaily.status === 'fulfilled' ? (qqDaily.value.data.songs ?? []) : [];
+      this.userPlaylists.qq =
+        qqUserPL.status === 'fulfilled' ? (qqUserPL.value.data.playlists ?? []) : [];
+      // bilibili popular: keep previous value on failure (it's an anonymous endpoint
+      // unrelated to user auth state, and stale popular results are harmless)
       if (bili.status === 'fulfilled') {
         this.bilibiliPopular = bili.value.data.songs ?? [];
       }
diff --git a/web/src/views/Home.vue b/web/src/views/Home.vue
index 3ed7a1a..675b0d3 100644
--- a/web/src/views/Home.vue
+++ b/web/src/views/Home.vue
@@ -137,23 +137,15 @@ const USER_PLAYLIST_LIMIT = 20;
 const userPlaylistsExpanded = ref(false);
 
 // Available sources per section.
+// Recommend playlists work anonymously on netease, so it's always available;
+// QQ requires login. This intentionally differs from dailyAvailable/userAvailable.
 const recommendAvailable = computed<Source[]>(() => {
   const s: Source[] = ['netease'];
   if (store.authStatus.qq) s.push('qq');
   return s;
 });
-const dailyAvailable = computed<Source[]>(() => {
-  const s: Source[] = [];
-  if (store.authStatus.netease) s.push('netease');
-  if (store.authStatus.qq) s.push('qq');
-  return s;
-});
-const userAvailable = computed<Source[]>(() => {
-  const s: Source[] = [];
-  if (store.authStatus.netease) s.push('netease');
-  if (store.authStatus.qq) s.push('qq');
-  return s;
-});
+const dailyAvailable = computed<Source[]>(() => store.availableSources);
+const userAvailable = computed<Source[]>(() => store.availableSources);
 
 // Persisted active source per section.
 const recommendSource = ref<Source>(loadTabSource('home.recommend'));
diff --git a/web/src/views/Library.vue b/web/src/views/Library.vue
index 68da39f..e23d2e7 100644
--- a/web/src/views/Library.vue
+++ b/web/src/views/Library.vue
@@ -63,12 +63,7 @@ const store = usePlayerStore();
 const history = ref<Song[]>([]);
 const historyLoading = ref(true);
 
-const userAvailable = computed<Source[]>(() => {
-  const s: Source[] = [];
-  if (store.authStatus.netease) s.push('netease');
-  if (store.authStatus.qq) s.push('qq');
-  return s;
-});
+const userAvailable = computed<Source[]>(() => store.availableSources);
 
 const userSource = ref<Source>(loadTabSource('library.user'));
 watch(userSource, (v) => saveTabSource('library.user', v));