Add logout button to header
Adds a logout button in the top bar on authenticated pages. Posts to /api/auth/logout to clear the server session, then redirects to login. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -773,3 +773,19 @@ select {
|
|||||||
color: var(--offline, #888);
|
color: var(--offline, #888);
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Logout button in top bar */
|
||||||
|
.logout-btn {
|
||||||
|
background: none;
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||||
|
color: var(--text-secondary);
|
||||||
|
font-size: 0.75rem;
|
||||||
|
padding: 0.25rem 0.6rem;
|
||||||
|
border-radius: 4px;
|
||||||
|
cursor: pointer;
|
||||||
|
min-height: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logout-btn:active {
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|||||||
@@ -9,6 +9,7 @@ const NextSnap = {
|
|||||||
console.log(`NextSnap v${this.version} initializing...`);
|
console.log(`NextSnap v${this.version} initializing...`);
|
||||||
this.setupConnectivityMonitoring();
|
this.setupConnectivityMonitoring();
|
||||||
this.setupServiceWorkerMessaging();
|
this.setupServiceWorkerMessaging();
|
||||||
|
this.setupLogout();
|
||||||
this.checkHealth();
|
this.checkHealth();
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -79,6 +80,17 @@ const NextSnap = {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
|
setupLogout() {
|
||||||
|
const btn = document.getElementById('logoutBtn');
|
||||||
|
if (!btn) return;
|
||||||
|
btn.addEventListener('click', async () => {
|
||||||
|
try {
|
||||||
|
await fetch('/api/auth/logout', { method: 'POST' });
|
||||||
|
} catch (e) { /* offline - clear locally anyway */ }
|
||||||
|
window.location.href = '/login';
|
||||||
|
});
|
||||||
|
},
|
||||||
// Force service worker update
|
// Force service worker update
|
||||||
async updateServiceWorker() {
|
async updateServiceWorker() {
|
||||||
if ('serviceWorker' in navigator) {
|
if ('serviceWorker' in navigator) {
|
||||||
|
|||||||
@@ -1,9 +1,9 @@
|
|||||||
// NextSnap Service Worker
|
// NextSnap Service Worker
|
||||||
// Provides offline-first caching for the app shell
|
// Provides offline-first caching for the app shell
|
||||||
|
|
||||||
const CACHE_VERSION = 'nextsnap-v25';
|
const CACHE_VERSION = 'nextsnap-v27';
|
||||||
const APP_SHELL_CACHE = 'nextsnap-shell-v21';
|
const APP_SHELL_CACHE = 'nextsnap-shell-v23';
|
||||||
const RUNTIME_CACHE = 'nextsnap-runtime-v21';
|
const RUNTIME_CACHE = 'nextsnap-runtime-v23';
|
||||||
|
|
||||||
// Offline fallback page with bottom nav bar so user can navigate to cached pages
|
// Offline fallback page with bottom nav bar so user can navigate to cached pages
|
||||||
const OFFLINE_PAGE = `<!DOCTYPE html>
|
const OFFLINE_PAGE = `<!DOCTYPE html>
|
||||||
|
|||||||
@@ -29,6 +29,9 @@
|
|||||||
<div class="pending-count" id="pendingCount" style="display: none;">
|
<div class="pending-count" id="pendingCount" style="display: none;">
|
||||||
<span id="pendingCountValue">0</span>
|
<span id="pendingCountValue">0</span>
|
||||||
</div>
|
</div>
|
||||||
|
{% if show_nav %}
|
||||||
|
<button class="logout-btn" id="logoutBtn" title="Log out">Logout</button>
|
||||||
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|||||||
Reference in New Issue
Block a user