From d54e70a366e5f3187a6b4f7e11ef87ba5f125c00 Mon Sep 17 00:00:00 2001
From: Warren <warren@momentry.ddns.net>
Date: Sun, 17 May 2026 01:30:42 +0800
Subject: [PATCH] feat: Add logout button for File Tree authentication
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Added logout functionality:
- Logout button in mode-bar (red button with 🚪 icon)
- logoutTree() function clears localStorage
- Removes tree_token, tree_user, tree_locked
- Resets tree data (_td, _tree_user)
- Closes tree panel
- Shows login modal again
- Displays toast: 'Tree logout ✓'

Button style:
- Background: #7f1d1d (dark red)
- Color: #fca5a5 (light red)
- Border: #dc2626 (red)
- Text: 🚪 Logout

Location:
- In mode-bar, after '✕ All' button
- Only visible when _locked=false (edit mode enabled)

Function flow:
1. Clear localStorage (tree_token, tree_user, tree_locked)
2. Reset global variables (_td, _tree_user)
3. Close tree panel (remove 'active' class)
4. Show TreeLoginModal for re-authentication
5. Display success toast

Files:
- src/page.html (added logoutTree button + function)
---
 src/page.html | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/src/page.html b/src/page.html
index 09651d4..561d1d3 100644
--- a/src/page.html
+++ b/src/page.html
@@ -498,6 +498,26 @@ function handleTreeKeyPress(e){
     }
 }
 
+function logoutTree(){
+    // Clear tree authentication data
+    localStorage.removeItem('tree_token');
+    localStorage.removeItem('tree_user');
+    localStorage.removeItem('tree_locked');
+    
+    // Reset tree data
+    _td=null;
+    _tree_user=null;
+    
+    // Close tree panel
+    document.getElementById("mb-tree-panel").classList.remove("active");
+    
+    // Show login modal
+    showTreeLoginModal();
+    
+    // Show toast
+    toast('Tree logout ✓');
+}
+
 function toggleTreePassword(){
     var pwdInput=document.getElementById('tree-password');
     var toggleBtn=pwdInput.parentElement.querySelector('button');
@@ -586,6 +606,7 @@ function loadTree(){
             h+="<button class=mb-new-folder-btn onclick=restoreTree() style='background:#1e3a5f;border-color:#3b82f6;color:#93c5fd'>↻ Restore</button>";
             h+="<button class=mb-new-folder-btn onclick=findDupes() style='background:#451a03;color:#fbbf24;border-color:#b45309'>🔍 Dupes</button>";
             h+="<button class=mb-new-folder-btn onclick=deleteAll() style='background:#451a03;color:#fbbf24;border-color:#b45309'>✕ All</button>";
+            h+="<button class=mb-new-folder-btn onclick=logoutTree() style='background:#7f1d1d;color:#fca5a5;border-color:#dc2626'>🚪 Logout</button>";
         }
         h+="<span style=color:#64748b;font-size:12px;align-self:center>"+d.nodes.length+" nodes</span></div>";