Connect to the real Nexa backend, replacing the mock lock toggle

Adds the wire-protocol WebSocket client (ws-client.ts) and the REST
auth flow (backend-client.ts) against the now-live backend, using a
locally-generated ed25519 keypair (identity.ts) as a stand-in wallet
signer until real wallet-extension integration is built.

lock-state.ts's setLockState is now applyLockState, called only by
the WS client on an incoming lock_state message -- the backend is
the sole source of truth for lock state, so there's no other writer
anymore. The popup's dev mock controls are replaced with a live
connection-status + lock-state display.

Verified end-to-end against the real backend (nonce -> verify -> /me
-> ws lock_state) using the same tweetnacl/bs58 libs shipped in the
extension.

Co-Authored-By: Claude Sonnet 5 <[email protected]>
Claude-Session: https://claude.ai/code/session_01YXiHuScXrjxBh7yFGAPq3B
This commit is contained in:
2026-09-07 09:10:18 +02:00
co-authored by claude
parent 5643eebde7
commit 3b6054f2f0
14 changed files with 371 additions and 98 deletions
+29 -31
View File
@@ -19,6 +19,35 @@ header .subtitle {
opacity: 0.65;
}
.connection {
margin-bottom: 10px;
opacity: 0.75;
display: flex;
align-items: center;
gap: 6px;
}
.connection-dot {
width: 8px;
height: 8px;
border-radius: 50%;
display: inline-block;
background: currentColor;
}
.connection-connecting {
color: #ca8a04;
}
.connection-connected {
color: #16a34a;
}
.connection-disconnected,
.connection-auth-error {
color: #dc2626;
}
.status {
margin-bottom: 16px;
}
@@ -50,37 +79,6 @@ header .subtitle {
opacity: 0.65;
}
.dev-controls {
border-top: 1px solid rgba(128, 128, 128, 0.25);
padding-top: 12px;
}
.dev-controls h2 {
margin: 0 0 4px;
font-size: 12px;
text-transform: uppercase;
letter-spacing: 0.04em;
opacity: 0.65;
}
.dev-controls .hint {
margin: 0 0 10px;
opacity: 0.6;
}
.field {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
margin-bottom: 8px;
}
.field input[type='text'] {
flex: 1;
min-width: 0;
}
.thresholds-link {
display: block;
margin-top: 14px;