Multi-tenant reverse-tunnel service ("ngrok for Claude Code" with E2E): a
host-agent dials OUT to an operator-run relay; external devices reach the host
THROUGH the relay, routed by per-tenant subdomain, forwarding ciphertext only
(the relay never sees plaintext). Lets a customer reach their own self-hosted
web-terminal from anywhere with zero networking setup.
Packages — all tsc-strict + vitest green (656 tests), cross-package integration verified:
- relay-contracts: frozen shared contracts (mux frame codec, data model,
capability token, E2E envelope, pairing) — the src/types.ts analog
- term-relay: native WS mux + stateless data plane (subdomain routing, ciphertext forward)
- agent: host-agent (pairing, per-host Ed25519 + mTLS dial-out, forwards to 127.0.0.1:3000)
- control-plane: accounts/hosts registry, pairing-code flow, routing table, provisioning
- relay-e2e: browser<->agent E2E (X25519 ECDH through relay, AEAD, anti-replay, recoverable replay key)
- relay-auth: Passkey/WebAuthn, capability tokens, per-host certs, deny-by-default tenant isolation
- relay-web: browser login + Web Crypto E2E + client-side preview rendering
Security invariants INV1-15 enforced; cross-tenant isolation CI tripwire live
(.github/workflows/relay-tripwire.yml). Design + implementation-level plans in
docs/PLAN_RELAY_*.md and docs/EXPLORE_RELAY_SERVICE.md.
NOTE: generated autonomously per the reviewed plans. The security-critical
packages (relay-e2e, relay-auth) REQUIRE expert security audit before any real
deployment — passing tests prove self-consistency, not resistance to attackers.
Base app (src/, public/) unchanged; concurrent desktop work left uncommitted.
88 lines
2.6 KiB
TypeScript
88 lines
2.6 KiB
TypeScript
/**
|
|
* T9 (v0.10) — grid of `preview-client` cards (the manage-page moved CLIENT-SIDE under E2E).
|
|
*
|
|
* Renders one read-only, locally-decrypted preview per authorized host. A host the account can't
|
|
* reach → `loadReplay` rejects → the card shows "unavailable", never another tenant's screen
|
|
* (INV1). Disposes all preview clients on unmount so no xterms/sockets leak (EXPLORE §6 preview-cost
|
|
* discipline); `hostContentSecret` is never written to `localStorage`/`console`.
|
|
*/
|
|
import type { ApiClient } from './api-client'
|
|
import type { HostRecord } from './api-schemas'
|
|
import {
|
|
mountPreviewClient,
|
|
type PreviewClient,
|
|
type PreviewDeps,
|
|
type ReplaySource,
|
|
} from './preview-client'
|
|
|
|
const DEFAULT_DIMS = { cols: 80, rows: 24 } as const
|
|
|
|
export interface PreviewGridOpts {
|
|
readonly dims?: { cols: number; rows: number }
|
|
}
|
|
|
|
export function mountPreviewGrid(
|
|
root: HTMLElement,
|
|
api: ApiClient,
|
|
loadReplay: (
|
|
hostId: string,
|
|
) => Promise<{ replay: ReplaySource; hostContentSecret: Uint8Array }>,
|
|
deps: PreviewDeps,
|
|
opts: PreviewGridOpts = {},
|
|
): { dispose(): void } {
|
|
const dims = opts.dims ?? DEFAULT_DIMS
|
|
const clients: PreviewClient[] = []
|
|
let disposed = false
|
|
|
|
function unavailableCard(host: HostRecord): HTMLElement {
|
|
const card = document.createElement('div')
|
|
card.className = 'preview-card'
|
|
card.dataset['hostId'] = host.hostId
|
|
const msg = document.createElement('p')
|
|
msg.className = 'preview-unavailable'
|
|
msg.textContent = 'unavailable'
|
|
card.append(msg)
|
|
return card
|
|
}
|
|
|
|
async function build(): Promise<void> {
|
|
let hosts: readonly HostRecord[]
|
|
try {
|
|
hosts = await api.listHosts()
|
|
} catch {
|
|
const err = document.createElement('p')
|
|
err.className = 'preview-grid-error'
|
|
err.textContent = 'Could not load previews.'
|
|
root.append(err)
|
|
return
|
|
}
|
|
if (disposed) return
|
|
|
|
for (const host of hosts) {
|
|
const card = document.createElement('div')
|
|
card.className = 'preview-card'
|
|
card.dataset['hostId'] = host.hostId
|
|
root.append(card)
|
|
try {
|
|
const { replay, hostContentSecret } = await loadReplay(host.hostId)
|
|
if (disposed) return
|
|
const client = mountPreviewClient(card, replay, hostContentSecret, dims, deps)
|
|
clients.push(client)
|
|
await client.render()
|
|
} catch {
|
|
// A host the account can't reach (403) or a decrypt failure → "unavailable" (INV1).
|
|
card.replaceWith(unavailableCard(host))
|
|
}
|
|
}
|
|
}
|
|
|
|
void build()
|
|
|
|
return {
|
|
dispose(): void {
|
|
disposed = true
|
|
for (const c of clients) c.dispose() // no leaked xterms/sockets
|
|
},
|
|
}
|
|
}
|