feat: session persistence, logout button, TURN HMAC fix; update docs
- Browser mode auto-rejoins saved network on reload (waste_last_network) - Logout button (⏻) in sidebar clears session; optionally clears identity keypair - TURN credentials now use HMAC-SHA1 of username (coturn use-auth-secret compatible) - README: deploy scripts documented, session persistence section, serve-web.sh noted - FUTURE.md: mark shipped items, add remaining work for daemon TURN + TUI rooms Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -49,9 +49,11 @@ details summary { color: var(--muted); font-size: 12px; cursor: pointer; }
|
||||
|
||||
/* ── sidebar ── */
|
||||
.sidebar { background: var(--surface); border-right: 1px solid var(--border); display: flex; flex-direction: column; overflow-y: auto; }
|
||||
.sidebar-identity { padding: 12px 12px 10px; border-bottom: 1px solid var(--border); }
|
||||
.sidebar-identity { padding: 12px 12px 10px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 6px; }
|
||||
.sidebar-identity .alias { display: block; font-weight: 600; font-size: 14px; }
|
||||
.sidebar-identity .peer-id { display: block; color: var(--muted); font-size: 10px; font-family: monospace; margin-top: 2px; }
|
||||
.sidebar-logout { background: none; color: var(--muted); font-size: 14px; padding: 2px 4px; flex-shrink: 0; margin-left: auto; }
|
||||
.sidebar-logout:hover { color: #e06060; background: none; }
|
||||
.sidebar-section { display: flex; flex-direction: column; padding: 8px 0; border-bottom: 1px solid var(--border); }
|
||||
.sidebar-section:last-child { border-bottom: none; flex: 1; }
|
||||
.sidebar-label { font-size: 10px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted); padding: 4px 12px 2px; }
|
||||
|
||||
@@ -32,7 +32,7 @@ export function Sidebar() {
|
||||
networks, activeNetworkId, activeRoom,
|
||||
connectedPeers, peerStatus,
|
||||
setActiveRoom, setActiveNetwork, messages, browseFiles, sendFileTo, adapterMode,
|
||||
customRooms, createRoom,
|
||||
customRooms, createRoom, logout,
|
||||
} = useWaste()
|
||||
const [addingRoom, setAddingRoom] = useState(false)
|
||||
const [newRoomName, setNewRoomName] = useState('')
|
||||
@@ -54,6 +54,11 @@ export function Sidebar() {
|
||||
const displayId = localPeer?.id ?? masterId ?? ''
|
||||
const card = displayId ? makeYawCard(displayId, displayAlias) : null
|
||||
|
||||
function handleLogout() {
|
||||
const clearId = window.confirm('Also clear your identity keypair? (Cannot be undone — export a backup first if you want to keep it.)')
|
||||
logout(clearId)
|
||||
}
|
||||
|
||||
function openDM(peerId: string) {
|
||||
setActiveRoom(`dm:${peerId}`)
|
||||
}
|
||||
@@ -64,14 +69,16 @@ export function Sidebar() {
|
||||
|
||||
return (
|
||||
<nav className="sidebar">
|
||||
<div
|
||||
className="sidebar-identity"
|
||||
title={card ?? undefined}
|
||||
onClick={() => card && navigator.clipboard?.writeText(card)}
|
||||
style={{ cursor: card ? 'pointer' : undefined }}
|
||||
>
|
||||
<span className="alias">{displayAlias || '…'}</span>
|
||||
<span className="peer-id">{displayId.slice(0, 16).replace(/(.{4})/g, '$1 ').trim()}</span>
|
||||
<div className="sidebar-identity">
|
||||
<div
|
||||
style={{ flex: 1, cursor: card ? 'pointer' : undefined }}
|
||||
title={card ?? undefined}
|
||||
onClick={() => card && navigator.clipboard?.writeText(card)}
|
||||
>
|
||||
<span className="alias">{displayAlias || '…'}</span>
|
||||
<span className="peer-id">{displayId.slice(0, 16).replace(/(.{4})/g, '$1 ').trim()}</span>
|
||||
</div>
|
||||
<button className="sidebar-logout" onClick={handleLogout} title="Leave network">⏻</button>
|
||||
</div>
|
||||
|
||||
<div className="sidebar-section">
|
||||
|
||||
@@ -61,16 +61,28 @@ export function Onboarding({ status }: Props) {
|
||||
if (inv) setInviteString(inv)
|
||||
}, [])
|
||||
|
||||
// Auto-rejoin when adapter is ready and we have saved session state
|
||||
useEffect(() => {
|
||||
if (adapterMode !== 'browser' || status !== 'connected') return
|
||||
const { network: n, netHash: nh } = parseInviteParams()
|
||||
if (n || nh) return // explicit invite — don't auto-join, show form
|
||||
const savedNetwork = localStorage.getItem('waste_last_network')
|
||||
if (savedNetwork) doJoin(savedNetwork, '')
|
||||
}, [adapterMode, status]) // eslint-disable-line react-hooks/exhaustive-deps
|
||||
|
||||
function joinNetwork(e: React.FormEvent) {
|
||||
e.preventDefault()
|
||||
const name = network.trim()
|
||||
const hash = netHash.trim()
|
||||
doJoin(network.trim(), netHash.trim())
|
||||
}
|
||||
|
||||
function doJoin(name: string, hash: string) {
|
||||
if (!name && !hash) return
|
||||
|
||||
// In browser mode: persist anchor URL choice and pass it via localStorage
|
||||
if (adapterMode === 'browser') {
|
||||
localStorage.setItem('waste_anchor_url', anchorUrl)
|
||||
if (nick.trim()) localStorage.setItem('waste_nick', nick.trim())
|
||||
if (name) localStorage.setItem('waste_last_network', name)
|
||||
else localStorage.removeItem('waste_last_network')
|
||||
}
|
||||
|
||||
if (hash.length === 64 && !name) {
|
||||
|
||||
@@ -69,6 +69,7 @@ interface WasteState {
|
||||
rejectOffer: (peerId: string, xid: string) => void
|
||||
cancelTransfer: (peerId: string, xid: string, direction: 'recv' | 'send') => void
|
||||
createRoom: (name: string) => void
|
||||
logout: (clearIdentity: boolean) => void
|
||||
handleEvent: (msg: IpcMessage) => void
|
||||
}
|
||||
|
||||
@@ -169,6 +170,17 @@ export const useWaste = create<WasteState>((set, get) => ({
|
||||
if (a instanceof BrowserAdapter) a.cancelTransfer(peerId, xid, direction)
|
||||
},
|
||||
|
||||
logout(clearIdentity) {
|
||||
const a = get().adapter
|
||||
if (a instanceof DaemonAdapter) a.disconnect()
|
||||
else if (a instanceof BrowserAdapter) a.disconnect()
|
||||
localStorage.removeItem('waste_last_network')
|
||||
localStorage.removeItem('waste_nick')
|
||||
localStorage.removeItem('waste_anchor_url')
|
||||
if (clearIdentity) localStorage.removeItem('waste_seed')
|
||||
window.location.reload()
|
||||
},
|
||||
|
||||
createRoom(name) {
|
||||
const netId = get().activeNetworkId
|
||||
if (!netId || !name.trim()) return
|
||||
|
||||
Reference in New Issue
Block a user