logout button

public/editor/editor.tsx

···
 import {
 	Globe,
 	Loader2,
-	Trash2
+	Trash2,
+	LogOut
 } from 'lucide-react'
 import Layout from '@public/layouts'
 import { useUserInfo } from './hooks/useUserInfo'
···
 		await fetchSites()
 	}
 
+	const handleLogout = async () => {
+		try {
+			const response = await fetch('/api/auth/logout', {
+				method: 'POST',
+				credentials: 'include'
+			})
+			const result = await response.json()
+			if (result.success) {
+				// Redirect to home page after successful logout
+				window.location.href = '/'
+			} else {
+				alert('Logout failed: ' + (result.error || 'Unknown error'))
+			}
+		} catch (err) {
+			alert('Logout failed: ' + (err instanceof Error ? err.message : 'Unknown error'))
+		}
+	}
+
 	if (loading) {
 		return (
 			<div className="w-full min-h-screen bg-background flex items-center justify-center">
···
 						<span className="text-sm text-muted-foreground">
 							{userInfo?.handle || 'Loading...'}
 						</span>
+						<Button
+							variant="ghost"
+							size="sm"
+							onClick={handleLogout}
+							className="h-8 px-2"
+						>
+							<LogOut className="w-4 h-4" />
+						</Button>
 					</div>
 				</div>
 			</header>

public/index.tsx

···
 
 function App() {
 	const [showForm, setShowForm] = useState(false)
+	const [checkingAuth, setCheckingAuth] = useState(true)
 	const inputRef = useRef<HTMLInputElement>(null)
 
 	useEffect(() => {
+		// Check authentication status on mount
+		const checkAuth = async () => {
+			try {
+				const response = await fetch('/api/auth/status', {
+					credentials: 'include'
+				})
+				const data = await response.json()
+				if (data.authenticated) {
+					// User is already authenticated, redirect to editor
+					window.location.href = '/editor'
+					return
+				}
+			} catch (error) {
+				console.error('Auth check failed:', error)
+			} finally {
+				setCheckingAuth(false)
+			}
+		}
+
+		checkAuth()
+	}, [])
+
+	useEffect(() => {
 		if (showForm) {
 			setTimeout(() => inputRef.current?.focus(), 500)
 		}
 	}, [showForm])
+
+	if (checkingAuth) {
+		return (
+			<div className="min-h-screen bg-background flex items-center justify-center">
+				<div className="w-8 h-8 border-2 border-primary border-t-transparent rounded-full animate-spin"></div>
+			</div>
+		)
+	}
 
 	return (
 		<>
···
 					<div className="max-w-4xl mx-auto text-center">
 						<div className="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-accent/10 border border-accent/20 mb-8">
 							<span className="w-2 h-2 bg-accent rounded-full animate-pulse"></span>
-							<span className="text-sm text-accent-foreground">
+							<span className="text-sm text-foreground">
 								Built on AT Protocol
 							</span>
 						</div>