From ef3d659889a20a6a590c26585f723172e1a32911 Mon Sep 17 00:00:00 2001
From: bboysoul <bboysoulcn@gmail.com>
Date: Mon, 7 Sep 2026 12:58:15 +0800
Subject: [PATCH] fix: prevent accidental list restore

---
 frontend/src/App.vue       |  3 ++-
 frontend/src/style.test.ts | 10 ++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 82e1bf0..d5c9593 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -206,6 +206,7 @@ async function bootstrap() {
       navigationLoaded.value = true
       activeList.value = data.inbox_id || lists.value.find((item: TaskList) => item.is_inbox)?.id || lists.value[0]?.id || ''
       expandedFolders.value = new Set(folders.value.map((folder) => folder.id))
+      await loadArchivedLists()
       await loadAll()
     }
   } catch {
@@ -505,7 +506,7 @@ onMounted(bootstrap)
         <div v-for="list in lists.filter(l=>!l.folder_id&&!l.is_inbox)" :key="list.id" class="list-row" :class="{active:activeView==='tasks'&&activeList===list.id}"><button class="list-row-main" :title="list.name" :aria-label="list.name" @click="switchView('tasks',list.id)"><i/><span>{{list.name}}</span></button><span class="row-actions"><button aria-label="重命名清单" @click="renameEntity('lists',list)"><Pencil/></button><button aria-label="归档清单" @click="deleteEntity('lists',list)"><ArchiveRestore/></button></span></div>
         <template v-if="archivedLists.length">
           <div class="section-title"><span>已归档清单</span></div>
-          <div v-for="list in archivedLists" :key="list.id" class="list-row archived-row"><button class="list-row-main" :title="list.name" :aria-label="`恢复清单：${list.name}`" @click="restoreList(list)"><ArchiveRestore/><span>{{list.name}}</span></button><span class="row-actions"><button aria-label="恢复清单" @click="restoreList(list)"><ArchiveRestore/>恢复</button></span></div>
+          <div v-for="list in archivedLists" :key="list.id" class="list-row archived-row"><div class="list-row-main archived-row-label" :title="list.name" :aria-label="`已归档清单：${list.name}`"><ArchiveRestore/><span>{{list.name}}</span></div><span class="row-actions archived-actions"><button aria-label="恢复清单" @click="restoreList(list)"><ArchiveRestore/>恢复</button></span></div>
         </template>
       </div>
       <button class="settings" :class="{active:activeView==='settings'}" @click="switchView('settings')"><Settings />设置</button>
diff --git a/frontend/src/style.test.ts b/frontend/src/style.test.ts
index dd0da97..83a1598 100644
--- a/frontend/src/style.test.ts
+++ b/frontend/src/style.test.ts
@@ -128,6 +128,16 @@ describe('sidebar layout', () => {
     expect(app).toContain(':title="list.name" :aria-label="list.name"')
   })
 
+  it('only restores archived lists from the explicit restore action', () => {
+    expect(app).toContain('class="list-row-main archived-row-label"')
+    expect(app).not.toContain(':aria-label="`恢复清单：${list.name}`" @click="restoreList(list)"')
+    expect(app).toContain('aria-label="恢复清单" @click="restoreList(list)"')
+  })
+
+  it('loads archived lists during bootstrap so archived rows are visible after refresh', () => {
+    expect(app).toContain('expandedFolders.value = new Set(folders.value.map((folder) => folder.id))\n      await loadArchivedLists()\n      await loadAll()')
+  })
+
   it('styles archived rows through the new list-row-main structure', () => {
     expect(css).toContain('.archived-row .list-row-main>svg{color:#c9a45c}')
   })