Checkout the vt100 submodule in CI

- bound relay input and detach saturated output transports
- drain PTY output after child exit
- make terminal close lifecycle race-safe
- prune expired CC sessions and audit closure reasons
- require matching agent hello/auth identities
- validate terminal IDs and PTY dimensions

.cargo/config.toml

@@ -18,7 +18,7 @@ tw = "t --target=x86_64-pc-windows-msvc"
 
 
 check-all = "check --workspace --all-features --all-targets"
-clippy-all = "clippy --workspace --all-features --all-targets"
+clippy-all = "clippy --workspace --all-targets --all-features" # -- -D warnings
 test-all = "test --workspace --all-features --all-targets"
 fmt-all = "fmt --all"
 

.gitea/workflows/release.yml

@@ -18,6 +18,8 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v4
+        with:
+          submodules: recursive
 
       - name: Ensure toolchain and targets
         shell: pwsh

.github/CHECKPOINT_2026-04-11.md

@@ -1,100 +0,0 @@
-# Wakey Checkpoint (2026-04-11)
-
-## Snapshot
-
-This checkpoint captures the current state after control-plane migration, logging hardening, config ergonomics, and state storage upgrades.
-
-## What Is Done
-
-- Legacy router-hosted HTTP/static layer removed from `wakey` crate.
-- New `wakey-control-plane` crate is active for:
-  - enroll-token issuance
-  - agent enrollment
-  - connected-agent websocket registry
-  - command relay to agent
-- `wakey-agent` is active for outbound websocket execution and local command dispatch.
-
-## Logging + Telemetry
-
-- High-signal logs were added across:
-  - control-plane API relay path
-  - control-plane websocket lifecycle
-  - control-plane state lifecycle
-  - agent command lifecycle, session lifecycle, and enrollment
-- Correlated relay spans include command context (`agent_id`, `request_id`, `command`).
-- Control-plane telemetry is config-driven:
-  - optional OTLP endpoint
-  - optional JSON logs
-  - fallback local logs when OTLP endpoint is not set
-
-## Config Ergonomics
-
-### Control-plane
-
-- Config file support is wired (`/etc/wakey-control-plane/config.toml` by default).
-- `serve` can read defaults from config file and CLI can override.
-- New `init-config` command scaffolds a control-plane config file.
-
-### Agent
-
-- Existing `init-config` command scaffolds agent config.
-- Enrollment can optionally signal reload of running daemon.
-
-## State Storage Upgrade
-
-- Control-plane state backend moved from JSON snapshot to embedded `sled` DB.
-- Default state path changed to `/var/lib/wakey-control-plane/state.db`.
-- Legacy JSON migration support has been removed; sled is now the only supported
-  state format.
-- Enroll tokens include persisted expiry timestamps and are validated on enroll.
-- Periodic and explicit garbage collection remove expired tokens.
-
-## Operator Commands
-
-### Control-plane bootstrap
-
-```sh
-wakey-control-plane init-config
-wakey-control-plane serve --config-file /etc/wakey-control-plane/config.toml
-```
-
-### Issue enroll token (live daemon path)
-
-```sh
-wakey-control-plane issue-enroll-token --public-url https://cp.example.com
-```
-
-### Agent bootstrap
-
-```sh
-wakey-agent enroll --server-url https://cp.example.com --enroll-token <token>
-wakey-agent serve --config /etc/wakey-agent/config.toml
-```
-
-## Build Health
-
-- Last verified passing:
-  - `cargo check --workspace`
-  - `cargo clippy --workspace`
-
-## Test Coverage Added In This Pass
-
-- Unit tests in `wakey-control-plane/src/state/store.rs` now cover:
-  - expired-token garbage collection removes persisted stale tokens
-  - enroll rejects expired tokens and consumes stale entries
-  - state stats counters for agents and expired token totals
-
-## Known Tradeoffs / Follow-ups
-
-- Reload semantics with `sled` are now mostly no-op for in-memory state (data is durable in DB).
-- No dedicated state-inspection CLI command yet (suggestion: add `state-stats` command).
-- OTLP configuration is currently control-plane focused; agent parity can be added if needed.
-
-## Suggested Next Steps
-
-1. Add a control-plane `state-stats` command to print DB path, agent count, token count.
-2. Add symmetric telemetry config support in `wakey-agent` config file.
-3. Add integration tests for:
-   - enroll + relay over websocket
-   - legacy JSON-to-sled migration path
-   - init-config command behavior and overrides

.github/CHECKPOINT_2026-04-12.md

@@ -1,82 +0,0 @@
-# Wakey Checkpoint (2026-04-12)
-
-## Snapshot
-
-This checkpoint captures progress after adding audit persistence, alert evaluation and transitions, control-plane alert APIs, and websocket timing diagnostics across agent and control-plane.
-
-## Major Changes Landed
-
-- Control-plane audit system implemented with persistent sled-backed events.
-- Audit emission wired into:
-  - enroll accept/reject
-  - token issue/list/revoke
-  - command dispatch/result/error/timeout
-  - websocket auth accept/reject and disconnect
-- Audit query API added:
-  - `GET /api/v1/control/audit/events`
-- Active alert engine added with deterministic rules over audit + live session state.
-- Alert APIs added:
-  - `GET /api/v1/control/alerts`
-  - `GET /api/v1/control/alerts/history`
-  - `GET /api/v1/control/alerts/ws`
-- Alert transition persistence added (open/resolve transitions tracked across evaluations).
-- Route classes split explicitly in runtime:
-  - public routes (enroll/ws/health)
-  - control routes (`/api/v1/control/*`)
-- Caddy template added for edge policy and Cloudflare Access boundary:
-  - `deploy/Caddyfile.control-plane.example`
-
-## Reliability and Diagnostics Improvements
-
-- Agent websocket connect diagnostics now include:
-  - DNS resolution timing (`dns_resolve_ms`)
-  - websocket connect timing (`ws_connect_ms`)
-- Control-plane websocket lifecycle logs include:
-  - connect-to-hello timing
-  - connect-to-auth timing
-  - hello-to-auth timing
-- Slow connect warnings are now emitted when timing thresholds are exceeded.
-
-## Root-Cause Findings Captured
-
-- Long agent websocket connect delays were reproduced and traced to hostname resolution path.
-- Switching agent `server_url` hostname to direct IP made connect immediate.
-- This confirms app-level relay logic was not the source of the startup delay.
-
-## Verification Status
-
-- `cargo check --workspace` passing after all changes.
-- Added and passing tests include:
-  - audit event append/filter in state store
-  - alert transition open/resolve persistence
-  - alert evaluator rule checks (offline + timeout, auth/enroll rejection spikes)
-
-## Current API Surface for UI Start
-
-- Agents and command execution:
-  - `GET /api/v1/control/agents`
-  - `POST /api/v1/control/agents/{agent_id}/command`
-- Audits:
-  - `GET /api/v1/control/audit/events`
-- Alerts:
-  - `GET /api/v1/control/alerts`
-  - `GET /api/v1/control/alerts/history`
-  - websocket subscribe: `GET /api/v1/control/alerts/ws`
-
-## Remaining Plan Items (Most Significant)
-
-1. UI implementation (`/ui` app shell and pages) is still open.
-2. Alert dedupe/cooldown persistence and tuning are still basic and need hardening.
-3. Audit retention pruning policy and long-run storage controls are not finalized.
-4. Edge auth enforcement tests and deployment rehearsals remain to be added.
-5. Multi-day soak drills and failure-injection validation remain open.
-
-## Suggested Next Actions
-
-1. Build minimal UI shell with three views:
-   - agents/commands
-   - audit timeline
-   - alerts panel (active + history + websocket stream)
-2. Add periodic retention task for audit and alert transition trees.
-3. Add proxy-level integration tests that assert private endpoints are blocked without Access headers.
-4. Run a 48-72h soak with hostname vs IP connect-path metrics collected.

.github/REVIEW_CONTROL_PLANE_2026-04-12.md

@@ -1,14 +0,0 @@
-# Control Plane Review
-
-## Findings
-
-1. High: the admin/control API is effectively unauthenticated, so anyone who can reach the server can issue enroll tokens, list/revoke tokens, inspect audit/alerts, and send live commands to agents. In [`wakey-control-plane/src/runtime/mod.rs:61`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/runtime/mod.rs#L61) through [`wakey-control-plane/src/runtime/mod.rs:109`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/runtime/mod.rs#L109), `control_api_routes()` is merged straight into the app with no auth middleware despite the comment saying these routes are “admin-only.” The UI also calls those endpoints directly with plain `fetch` and no auth material in [`ui/src/api.ts:60`](c:/Users/Admin/Documents/realshit/wakey/ui/src/api.ts#L60) through [`ui/src/api.ts:123`](c:/Users/Admin/Documents/realshit/wakey/ui/src/api.ts#L123). This is a full remote-takeover issue for the control plane, not just a missing polish item.
-
-2. High: a second websocket connection for the same `agent_id` silently replaces the current session, but the old authenticated socket is left alive and can still submit `result`/`error` frames against pending requests. In [`wakey-control-plane/src/ws.rs:195`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/ws.rs#L195) through [`wakey-control-plane/src/ws.rs:200`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/ws.rs#L200), a successful auth simply overwrites `sessions[agent_id] = tx.clone()`. The previous socket is not closed or demoted. Later, any authenticated socket can satisfy pending requests in [`wakey-control-plane/src/ws.rs:229`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/ws.rs#L229) through [`wakey-control-plane/src/ws.rs:247`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/ws.rs#L247), while requests are correlated only by `request_id` created in [`wakey-control-plane/src/api/commands.rs:91`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/api/commands.rs#L91) through [`wakey-control-plane/src/api/commands.rs:97`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/api/commands.rs#L97). That creates a split-brain/race condition where a stale or malicious prior session for the same agent can inject or win replies.
-
-3. Medium: configured seed enroll tokens are reinserted into the database on every startup, so “one-time” tokens become reusable after a restart if they remain in config. In [`wakey-control-plane/src/state/store.rs:52`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/state/store.rs#L52) through [`wakey-control-plane/src/state/store.rs:68`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/state/store.rs#L68), `load_or_init()` blindly seeds `daemon.enroll_tokens` into sled every time the process starts. Enrollment consumes tokens in [`wakey-control-plane/src/state/store.rs:91`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/state/store.rs#L91) through [`wakey-control-plane/src/state/store.rs:109`](c:/Users/Admin/Documents/realshit/wakey/wakey-control-plane/src/state/store.rs#L109), but that consumption is undone on the next boot if the token still exists in config. That breaks the “short-lived/one-time” assumption and makes operational mistakes much more likely.
-
-## Residual Risks
-
-- The control-plane/UI surface is growing quickly and currently assumes a trusted environment in multiple places. Even after adding admin auth, I would expect more authz/session-boundary issues to surface.
-- The command relay path is conceptually good, but it needs stronger session ownership rules before it is trustworthy under reconnect races or duplicated agents.

.github/plan-auditAlertsUiEdgeAccessV1.prompt.md

@@ -1,57 +0,0 @@
-## Plan: Audit, Alerts, UI, and Safe Edge Exposure
-
-Recommended approach: ship in this order audit first, alerts second, UI third, then edge hardening and soak. This gives you observability truth before you build subscriptions and screens, and keeps risky control APIs private behind Cloudflare Access at Caddy.
-
-**Steps**
-1. Phase A: Lock trust boundaries and endpoint classes.
-2. Public Agent API stays exposed: /api/v1/agents/enroll, /api/v1/agent/ws, /healthz.
-3. Private Control API stays protected: /api/v1/control/* and /ui/*.
-4. Phase A: Define AuditEvent schema and retention defaults.
-5. Phase B: Add audit persistence in sled and emit at key points.
-6. Emit audit on token issue/list/revoke, ws auth/disconnect, command dispatch/result/timeout/error, and reload/config operations.
-7. Phase B: Add audit query API with filters and pagination.
-8. Phase C: Implement deterministic alert rules and evaluator loop.
-9. Start with offline agent threshold, timeout-rate threshold, auth-failure spike, token misuse attempts.
-10. Add dedupe and cooldown so alerts do not flap.
-11. Phase C: Add alert delivery APIs.
-12. Poll-first endpoint for active alerts and recent transitions, websocket stream optional after rules stabilize.
-13. Phase D: Build same-domain UI app shell at /ui with origin-relative API client.
-14. Phase D: Build pages: Agent Health, Command Runner, Audit Timeline, Alerts Panel.
-15. Phase E: Add Caddy deployment template with Cloudflare Access policy boundaries and websocket support.
-16. Phase E: Run end-to-end drills and 48-72h soak.
-
-**Relevant files**
-- [wakey-control-plane/src/runtime/mod.rs](wakey-control-plane/src/runtime/mod.rs)
-- [wakey-control-plane/src/api/commands.rs](wakey-control-plane/src/api/commands.rs)
-- [wakey-control-plane/src/api/control.rs](wakey-control-plane/src/api/control.rs)
-- [wakey-control-plane/src/ws.rs](wakey-control-plane/src/ws.rs)
-- [wakey-control-plane/src/state/store.rs](wakey-control-plane/src/state/store.rs)
-- [wakey-control-plane/src/state/types.rs](wakey-control-plane/src/state/types.rs)
-- [wakey-control-plane/src/config/types.rs](wakey-control-plane/src/config/types.rs)
-- [wakey-control-plane/src/config/resolve.rs](wakey-control-plane/src/config/resolve.rs)
-- [wakey-control-plane/src/cli.rs](wakey-control-plane/src/cli.rs)
-- [README.md](README.md)
-- [scripts/init/openwrt/wakey](scripts/init/openwrt/wakey)
-- [.github/plan-controlPlaneAppV1.prompt.md](.github/plan-controlPlaneAppV1.prompt.md)
-
-**Verification**
-1. Unit tests for audit append/query, pagination, retention pruning.
-2. Unit tests for alert rule evaluation, dedupe, cooldown.
-3. Contract tests for request_id correlation across command result and timeout/error audit records.
-4. Integration tests for ws auth/disconnect audit events and command timeout event emission.
-5. API tests for audit and alert endpoints.
-6. Edge security tests that unauthenticated /api/v1/control/* and /ui/* are denied.
-7. Soak tests for reconnect churn and audit growth stability.
-
-**Decisions captured**
-- Admin auth default: Cloudflare Access only, enforced at Caddy.
-- UI host: same domain path deployment.
-- Shell bridge: excluded from v1 due high risk and low break-glass value during hard router failures.
-- Alert delivery: poll-first in v1, websocket stream optional.
-
-**Caddy policy shape for this plan**
-1. Route /api/v1/agents/enroll and /api/v1/agent/ws to control-plane upstream without Cloudflare Access gate.
-2. Route /api/v1/control/* and /ui/* only when Cloudflare Access authentication is valid.
-3. Preserve websocket upgrade headers on /api/v1/agent/ws.
-4. Keep control-plane process bound to private interface or localhost behind Caddy.
-5. Deny direct exposure of /api/v1/control/* from origin network paths.

.github/plan-controlPlaneAppV1.prompt.md

@@ -1,32 +0,0 @@
-## Plan: Control Plane App v1
-
-Build an end-to-end, ops-ready v1 over 6+ weeks by reusing current wakey and wakey-core logic, keeping wakey-agent as outbound executor, and adding a dedicated control-plane server plus minimal operator UI.
-
-**Steps**
-1. Phase 1, contract baseline: finalize relay contract for command, result, error, request correlation, timeout, retry, and forward compatibility behavior.
-2. Phase 1, boundary lock: keep execution in wakey service functions and keep domain DTOs in wakey-core while removing legacy HTTP/static compatibility code.
-3. Phase 2, server skeleton: implement enrollment endpoint, agent registry, websocket acceptor, and request correlation map. Depends on step 1 and step 2.
-4. Phase 2, relay core: implement command submission to connected agents, request_id correlation, timeout paths, and structured relay errors. Depends on step 3.
-5. Phase 2, persistence and identity: durable agent records, enroll token lifecycle, and safe credential metadata. Parallel with step 4 after schema is stable.
-6. Phase 3, operator surface: add API for agent inventory, health, command execution, and recent outcomes; add minimal UI for core operations. Depends on step 4 and step 5.
-7. Phase 3, ops hardening: metrics, logs, audits, heartbeat liveness checks, and alert thresholds. Parallel with step 6.
-8. Phase 4, deployment pipeline: add server build and deploy artifacts, environment templates, and rollback workflow. Depends on step 6 and step 7.
-9. Phase 4, validation and soak: run enrollment-to-command end-to-end tests and disconnect/failure drills with multi-day soak. Depends on step 8.
-
-**Relevant files to reuse**
-- [wakey-agent/src/protocol.rs](wakey-agent/src/protocol.rs)
-- [wakey-agent/src/session.rs](wakey-agent/src/session.rs)
-- [wakey-agent/src/dispatch.rs](wakey-agent/src/dispatch.rs)
-- [src/service/mod.rs](src/service/mod.rs)
-- [wakey-core/src/model](wakey-core/src/model)
-- [scripts/package_rootfs.ps1](scripts/package_rootfs.ps1)
-- [.gitea/workflows/release.yml](.gitea/workflows/release.yml)
-
-**Verification**
-1. Contract tests for command and result serialization, request_id stability, and unknown frame tolerance.
-2. Relay integration tests for enrollment, websocket auth flow, correlation, and timeout handling.
-3. Security tests for token lifecycle and invalid credential rejection.
-4. API tests for registry and command execution behavior.
-5. Observability tests for heartbeat, reconnect counters, latency, and failure alerts.
-6. Deployment tests for build, release, rollback rehearsal, and staging smoke checks.
-7. On-device tests for enroll, procd lifecycle, reconnect, and remote command round trips.

.github/plan-observationStoreAndSyncV1.prompt.md

@@ -1,184 +0,0 @@
-# Plan: Observation Store And Sync V1
-
-## Summary
-
-Build device observation support in layers:
-
-1. Local router observations are captured by `wakey observe ...` from OpenWrt hotplug.
-2. `wakey-linux` stores current observed DHCP/neigh state locally.
-3. `wakey-agent` forwards compact observations to the control plane.
-4. The control plane stores observations per agent and later joins them to known devices through `device_identifiers`.
-
-This is separate from durable identity. Observations are facts an agent saw at a time; known devices are manual/user-approved identity records.
-
-## Network/API Boundary
-
-The control plane has two route classes:
-
-- Public agent routes: intended to be reachable by agents.
-- Protected control routes: intended to sit behind Cloudflare Access/admin auth.
-
-Observation upload belongs on the public agent route surface because routers/agents must call it:
-
-```text
-POST /api/v1/agents/observations
-```
-
-The endpoint must require normal agent authentication, using the same persistent `agent_id`/`agent_token` trust model as WebSocket auth. It must not be a Cloudflare Access-only admin endpoint.
-
-Admin/UI read APIs belong under protected control routes:
-
-```text
-GET /api/v1/control/observations
-GET /api/v1/control/devices
-```
-
-## Step 1: Local Observation Store
-
-Replace the narrow `/tmp/wakey_mac_names.json` cache with a local observation store owned by `wakey-linux`.
-
-Minimum local tables/state:
-
-```text
-observed_dhcp_clients:
-  mac
-  ip
-  hostname
-  first_seen_unix
-  last_seen_unix
-  last_action
-
-observed_neighbors:
-  key
-  mac
-  ip
-  first_seen_unix
-  last_seen_unix
-  last_action
-```
-
-Behavior:
-
-- Hotplug scripts stay minimal and call `wakey-agent observe ...`.
-- `wakey-agent observe ...` delegates to `wakey observe ...`.
-- `wakey observe dhcp ...` writes DHCP observations.
-- `wakey observe neigh ...` writes neighbor observations.
-- Existing `wakey leases` and `wakey inventory` still read live sources first, then enrich from the local observation store.
-- Do not make local queries depend exclusively on hotplug events yet.
-
-## Step 2: Control-Plane Observation Tables
-
-Add observation tables early so future API/UI work does not need another major state refactor.
-
-Control-plane schema:
-
-```text
-agent_device_observations:
-  observation_key TEXT PRIMARY KEY
-  agent_id TEXT NOT NULL
-  kind TEXT NOT NULL
-  mac TEXT
-  ip TEXT
-  hostname TEXT
-  first_seen_unix INTEGER NOT NULL
-  last_seen_unix INTEGER NOT NULL
-  last_action TEXT NOT NULL
-
-agent_device_observation_events:
-  event_id TEXT PRIMARY KEY
-  agent_id TEXT NOT NULL
-  kind TEXT NOT NULL
-  action TEXT NOT NULL
-  mac TEXT
-  ip TEXT
-  hostname TEXT
-  ts_unix INTEGER NOT NULL
-```
-
-Keep `agent_device_observation_events` optional in behavior if needed, but create it in schema early. Current-state rows are the primary path; event history is for debugging/audit.
-
-Indexes:
-
-```text
-agent_device_observations(agent_id)
-agent_device_observations(mac)
-agent_device_observations(ip)
-agent_device_observations(hostname)
-agent_device_observations(last_seen_unix)
-agent_device_observation_events(agent_id, ts_unix)
-agent_device_observation_events(mac)
-```
-
-## Step 3: Agent Upload
-
-Add agent upload payload:
-
-```json
-{
-  "observations": [
-    {
-      "kind": "dhcp",
-      "action": "update",
-      "mac": "04:7c:16:79:6d:ee",
-      "ip": "192.168.100.94",
-      "hostname": "lda",
-      "first_seen_unix": 1770000000,
-      "last_seen_unix": 1770000123
-    }
-  ]
-}
-```
-
-Rules:
-
-- Agent may send snapshots periodically and after local observe events.
-- Control plane upserts current-state rows by stable observation key.
-- Observation keys should be deterministic from `agent_id`, `kind`, and the best available identifier:
-  - DHCP with MAC: `agent:{agent_id}:dhcp:mac:{mac}`
-  - Neigh with MAC: `agent:{agent_id}:neigh:mac:{mac}`
-  - Neigh without MAC: `agent:{agent_id}:neigh:ip:{ip}`
-- Uploads must not create known devices automatically.
-
-## Step 4: Join Observations To Known Devices
-
-Known devices already have durable IDs and manual identifiers:
-
-```text
-known_devices
-device_identifiers
-```
-
-Join rule:
-
-```text
-agent_device_observations.mac
-  -> device_identifiers(kind = 'mac', value = mac)
-  -> known_devices.device_id
-```
-
-Unknown observations are rows that do not match any manual `device_identifiers` row.
-
-This enables:
-
-- same known device observed by multiple agents;
-- same known device with multiple MACs;
-- UI flow to attach an unknown observed MAC to an existing known device;
-- wake flows that choose agent-local observed IP/MAC context for a known device.
-
-## Step 5: UI/API Later
-
-After storage and upload exist:
-
-- show known devices with all matching observations grouped by agent;
-- show unknown observations;
-- add action: attach observation identifier to known device;
-- add action: create known device from observation;
-- add wake action from known device using a selected agent/observation.
-
-## Defaults
-
-- `wakey` remains the local router/debugging CLI.
-- `wakey-agent` is the sync bridge to the control plane.
-- `wakey-control-plane` is durable identity and multi-agent view.
-- Local observation store is not authoritative; live sources still matter.
-- Control-plane observations are not durable identity; only manual known-device identifiers are.

.github/plan-operatorUiV1.prompt.md

@@ -1,149 +0,0 @@
-## Plan: wakey UI v1 (Device-First)
-
-The Operator UI is not the end goal by itself.
-The goal is to make wakey excellent at its original purpose: quickly finding devices and waking them reliably.
-
-Agent, audit, and token features remain important, but they should support the device workflow rather than dominate the navigation and development effort.
-
-## Product North Star
-
-An operator should be able to do this in under 10 seconds:
-1. Open the UI.
-2. Search for a device by name, IP, or MAC.
-3. See whether it looks online/reachable.
-4. Trigger wake.
-5. See immediate command result and short follow-up status.
-
-## Scope Priorities
-
-1. P0: Device discovery and wake UX.
-2. P1: Fast troubleshooting context around wake results.
-3. P2: Fleet/agent/admin operations.
-
-This explicitly means pages and components for Agent, Audit, Alerts, and Tokens should be present but secondary in visual hierarchy and effort until P0 is complete.
-
-## IA Direction (v1)
-
-Primary top-level focus:
-1. Devices
-2. Wake Queue (or Recent Actions)
-
-Secondary top-level focus:
-1. Fleet Health
-2. Audit
-3. Alerts
-4. Access/Tokens
-
-If needed, keep current routes during transition, but adjust default landing and navigation emphasis so Devices is the home workflow.
-
-## Phase Plan
-
-### Phase 1: Device-Centric Foundation
-
-1. Add a dedicated Devices page that merges existing status/leases/inventory signal into one operator list.
-2. Include searchable columns for name, IP, MAC, interface/dev, and recency indicators.
-3. Provide row-level wake action and bulk-safe interaction model (single-click row action, confirm for bulk).
-4. Define a compact "device confidence" heuristic from available data (for example: recent lease + reachable neighbor).
-5. Set the default route to Devices, with prominent search and wake controls above the fold.
-
-Acceptance criteria:
-1. Search by hostname, IP, and MAC all work from one input.
-2. Wake action reachable in one click from list row.
-3. Response feedback shown immediately with clear success/error text.
-
-### Phase 2: Wake Execution UX
-
-1. Build a focused wake panel with explicit target preview before send.
-2. Provide quick presets: "wake by selected device", "wake by MAC", "wake by query".
-3. Persist recent wake targets locally for operator speed.
-4. Add post-wake verification loop (short timed refresh of status indicators).
-5. Surface request correlation id and a copy action for incident sharing.
-
-Acceptance criteria:
-1. Operator can retry wake with one click.
-2. Operator can see last 20 wake attempts with outcome and timestamp.
-3. Error states differentiate validation, timeout, and execution failure.
-
-### Phase 3: Context Without Workflow Drift
-
-1. Keep Alerts and Audit accessible from device rows and wake outcomes.
-2. Add contextual deep links: device -> related alerts, device -> recent audit events.
-3. Improve filtering for alerts/audit with saved local filter presets.
-4. Add gentle live updates, keeping websocket optional with polling fallback.
-
-Acceptance criteria:
-1. From any failed wake, operator can jump to relevant audit entries in one step.
-2. Alerts page can be filtered by kind/severity/agent and linked back to impacted devices.
-
-### Phase 4: Fleet/Admin Hardening
-
-1. Keep Agents page for connectivity and control routing visibility.
-2. Keep Tokens page for enrollment lifecycle operations.
-3. Keep Dashboard but reframe metrics around "device availability" and "wake success" first.
-4. Add audit-friendly confirmation flows for destructive actions.
-
-Acceptance criteria:
-1. Admin flows do not block or slow P0 device workflows.
-2. All admin actions produce clear audit-visible outcomes.
-
-### Phase 5: Validation and Production Readiness
-
-1. Add smoke tests for P0 flow: find device -> wake -> observe result.
-2. Add contract checks for command payload/response shapes used by device and wake screens.
-3. Add scenario drills (offline agent, delayed command, websocket drop, expired token).
-4. Verify edge policy still protects control routes while preserving required public endpoints.
-
-Acceptance criteria:
-1. P0 flow remains usable during partial degradation.
-2. Build/typecheck/test gates stay green in CI.
-
-## Concrete UI Backlog (Ordered)
-
-1. Create DevicesPage with unified searchable table.
-2. Wire wake action directly from device row.
-3. Add Recent Wake Actions panel with outcomes.
-4. Add post-wake short verification refresh.
-5. Rework Dashboard cards to device-first metrics.
-6. Add deep links from wake result to audit and alerts context.
-7. Add empty/loading/error skeleton patterns tuned for device list scale.
-
-## Metrics of Success
-
-1. Time-to-wake median under 10 seconds for known target.
-2. Wake success rate visible per time window.
-3. Fewer operator clicks for common tasks (device lookup + wake).
-4. Reduced navigation to agent-centric pages for everyday usage.
-
-## Design and Interaction Principles
-
-1. Device-first information density over generic admin dashboards.
-2. Search and action bar always visible on desktop and mobile.
-3. Action feedback must be immediate and explicit.
-4. Keep advanced infrastructure details available but visually de-emphasized.
-
-## Architecture Decisions
-
-1. Keep same-domain /ui serving and origin-relative API requests.
-2. Keep route and API contracts stable while iterating UX aggressively.
-3. Treat websocket as progressive enhancement; polling fallback required.
-4. Preserve Cloudflare Access boundary for all control endpoints.
-
-## Relevant Files
-
-1. [ui/src/App.tsx](ui/src/App.tsx)
-2. [ui/src/pages/CommandsPage.tsx](ui/src/pages/CommandsPage.tsx)
-3. [ui/src/pages/DashboardPage.tsx](ui/src/pages/DashboardPage.tsx)
-4. [ui/src/api.ts](ui/src/api.ts)
-5. [wakey-control-plane/src/api/commands.rs](wakey-control-plane/src/api/commands.rs)
-6. [wakey-control-plane/src/api/audit.rs](wakey-control-plane/src/api/audit.rs)
-7. [wakey-control-plane/src/api/alerts.rs](wakey-control-plane/src/api/alerts.rs)
-8. [wakey-control-plane/src/api/control.rs](wakey-control-plane/src/api/control.rs)
-9. [wakey-control-plane/src/runtime/mod.rs](wakey-control-plane/src/runtime/mod.rs)
-10. [README.md](README.md)
-
-## Immediate Next Build Slice
-
-1. Implement DevicesPage and make it default route.
-2. Add row-level wake action with in-place result feedback.
-3. Add Recent Wake Actions section backed by local state first, then audit correlation.
-4. Rebalance navigation labels/order to make device workflows primary.

.github/plan-sqlxQueryMacros.prompt.md

@@ -1,69 +0,0 @@
-# Plan: SQLx Query Macro Adoption
-
-## Summary
-
-Move control-plane SQL from unchecked `sqlx::query(...)` calls toward `sqlx::query!` / `query_as!` where the SQL shape is static.
-
-This gives compile-time checking for table/column names and Rust value types. Dynamic filter builders can stay on `QueryBuilder`.
-
-## Offline Setup
-
-Normal builds should not need a live database:
-
-```text
-SQLX_OFFLINE=true
-```
-
-`.env` is ignored, so copy:
-
-```sh
-cp .env.example .env
-```
-
-SQLx query metadata should be generated into `.sqlx/` and committed.
-
-Prepare metadata with:
-
-```sh
-cargo install sqlx-cli --no-default-features --features sqlite
-./scripts/prepare_sqlx_sqlite.sh
-```
-
-The script:
-
-- creates a temporary SQLite database;
-- runs `wakey-control-plane/migrations`;
-- runs `cargo sqlx prepare --workspace -- -p wakey-control-plane --all-targets --all-features`;
-- writes `.sqlx/`.
-
-## Conversion Rules
-
-Use `query!` / `query_as!` for static SQL:
-
-- inserts;
-- deletes;
-- simple selects by primary key;
-- fixed update statements;
-- count queries.
-
-Keep non-macro SQL for genuinely dynamic SQL:
-
-- audit event filters built with `QueryBuilder`;
-- observation listing with optional filters, unless split into fixed branches;
-- any SQL where table/column names are intentionally generated.
-
-## Test/CI
-
-After query macros are introduced, CI should add:
-
-```sh
-cargo install sqlx-cli --no-default-features --features sqlite
-./scripts/prepare_sqlx_sqlite.sh
-cargo sqlx prepare --check --workspace -- --all-targets --all-features
-```
-
-Do not add the CI check until the first `.sqlx/` metadata is committed, otherwise it adds dependency install cost without catching anything.
-
-## Notes
-
-The SQLx docs say offline mode needs `cargo sqlx prepare` output checked into version control, and that `DATABASE_URL` takes precedence unless `SQLX_OFFLINE=true` is set. Keep `.env` local; commit `.env.example` and `.sqlx/`.

.github/workflows/ci.yml

@@ -11,6 +11,8 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
+        with:
+          submodules: recursive
 
       - uses: dtolnay/rust-toolchain@stable
         with:

.github/workflows/release.yml

@@ -16,6 +16,8 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v4
+        with:
+          submodules: recursive
 
       - uses: dtolnay/rust-toolchain@stable
         with:

.gitmodules

@@ -0,0 +1,3 @@
+[submodule "vendor/vt100"]
+	path = vendor/vt100
+	url = https://github.com/ldlda/vt100-rust-1

.serena/.gitignore

@@ -0,0 +1,2 @@
+/cache
+/project.local.yml

.serena/memories/completion_checklist.md

@@ -0,0 +1,12 @@
+# Completion Checklist
+
+Before handing back code changes, run the smallest checks covering the changed area:
+- Rust formatting: `cargo fmt`.
+- For control-plane SQLx/state/API work: `cargo test -p wakey-control-plane` and `SQLX_OFFLINE=true cargo test -p wakey-control-plane`.
+- For SQLx query macro changes: run `scripts/prepare_sqlx_sqlite.sh` and include the `.sqlx` metadata changes.
+- For wakey-linux/core inventory/observation work: `cargo test -p wakey-linux -p wakey-core`.
+- For agent session/config/protocol work: `cargo test -p wakey-agent`.
+- For UI work: `pnpm --dir ui typecheck` and `pnpm --dir ui build`; use `pnpm --dir ui format` when touching TS/TSX/CSS formatting.
+- Run relevant `cargo clippy -p <crate> --all-targets --all-features` when behavior or API shape changes.
+
+Always check `git status --short` and mention unrelated dirty files or generated metadata in the final summary.

.serena/memories/project_overview.md

@@ -0,0 +1,14 @@
+# Wakey Project Overview
+
+Wakey is a Wake-on-LAN and LAN observability workspace for Linux/OpenWrt routers. It includes:
+- `wakey-core`: shared model and parsing types for devices, neighbors, DHCP, interfaces, wake results.
+- `wakey-linux`: Linux/OpenWrt adapter layer for DHCP lease files, neighbor lookup, interface data, WoL sending, and local observation storage.
+- root `wakey` crate: service layer and operator CLI for inventory, leases, devs, wake, and observe.
+- `wakey-agent`: outbound router daemon. Enrolls with control plane, maintains authenticated websocket, executes relayed commands, syncs observations.
+- `wakey-control-plane`: Axum control plane, SQLx SQLite state, agent registry, command relay, known devices, observations, audit/alerts, fleet APIs, static UI hosting.
+- `ipjs`: typed wrappers around Linux `ip -j` data.
+- `ui`: React/Vite operator UI using shadcn/base-ui style components.
+
+Current persistence direction: control plane uses SQLx SQLite with migrations in `wakey-control-plane/migrations` and offline query metadata in `.sqlx` plus `wakey-control-plane/.sqlx`. Legacy sled import exists as explicit command.
+
+Current product direction: fleet-first device UI and backend. Known device identity is manual. Observations/inventory provide suggestions/current state but should not automatically promote or delete durable identifiers.

.serena/memories/style_and_conventions.md

@@ -0,0 +1,23 @@
+# Style And Conventions
+
+Rust:
+- Edition 2024.
+- Prefer explicit, small service/API functions over large abstractions.
+- Use `anyhow::Context` for fallible operations in application layers.
+- Use `tracing` for logs.
+- Shared domain types live in `wakey-core`; Linux/OpenWrt I/O in `wakey-linux`; root crate owns service/CLI behavior; agent/control-plane should reuse service/domain types where possible.
+- SQLx query macros are used in control-plane state. Regenerate `.sqlx` metadata after query string changes.
+- Device identity is manual: observations and inventory may suggest, but should not silently pin, merge, promote, or delete known identifiers.
+- Hotplug observation actions should stay event-shaped (`add`, `update`, `remove`). Do not store NUD state as the action. NUD belongs to live neighbor/inventory data.
+
+Frontend:
+- React + Vite + TypeScript.
+- Use existing component/style conventions; shadcn/base-ui/lucide are available.
+- Main operator UI is fleet-first: common path is find device, inspect current IP/MAC/agent, wake, copy, remember/merge.
+- Admin/debug pages stay available but should not dominate the primary nav.
+
+Editing:
+- Keep changes scoped.
+- Preserve user edits in dirty worktrees.
+- Use `apply_patch` for manual file edits.
+- Default to ASCII unless files already use non-ASCII for a reason.

.serena/memories/suggested_commands.md

@@ -0,0 +1,31 @@
+# Suggested Commands
+
+Rust formatting and checks:
+- `cargo fmt`
+- `cargo test -p wakey-control-plane`
+- `SQLX_OFFLINE=true cargo test -p wakey-control-plane`
+- `cargo test -p wakey-linux -p wakey-core`
+- `cargo test -p wakey-agent` (may need elevated permissions if tests bind local sockets)
+- `cargo clippy -p wakey-control-plane --all-targets --all-features`
+- `cargo clippy -p wakey-linux -p wakey-core --all-targets --all-features`
+
+SQLx metadata after query macro changes:
+- `scripts/prepare_sqlx_sqlite.sh`
+
+UI checks:
+- `pnpm --dir ui typecheck`
+- `pnpm --dir ui build`
+- `pnpm --dir ui format`
+
+Local run examples:
+- `cargo run -- inventory <query>`
+- `cargo run -- leases`
+- `cargo run -- devs`
+- `cargo run -- wake --mac aa:bb:cc:dd:ee:ff`
+- `cargo run -p wakey-agent -- serve --config /etc/wakey-agent/config.toml`
+- `cargo run -p wakey-control-plane -- serve --config-file /etc/wakey-control-plane/config.toml`
+
+Useful shell tools:
+- Prefer `rg` and `rg --files` for search.
+- Use `git status --short`, `git diff --stat`, and focused `git diff -- <path>` before edits.
+- Avoid destructive git commands unless explicitly requested.

.serena/project.yml

@@ -0,0 +1,155 @@
+# the name by which the project can be referenced within Serena
+project_name: "wakey"
+
+
+# list of languages for which language servers are started; choose from:
+#   al                  bash                clojure             cpp                 csharp
+#   csharp_omnisharp    dart                elixir              elm                 erlang
+#   fortran             fsharp              go                  groovy              haskell
+#   haxe                java                julia               kotlin              lua
+#   markdown
+#   matlab              nix                 pascal              perl                php
+#   php_phpactor        powershell          python              python_jedi         r
+#   rego                ruby                ruby_solargraph     rust                scala
+#   swift               terraform           toml                typescript          typescript_vts
+#   vue                 yaml                zig
+#   (This list may be outdated. For the current list, see values of Language enum here:
+#   https://github.com/oraios/serena/blob/main/src/solidlsp/ls_config.py
+#   For some languages, there are alternative language servers, e.g. csharp_omnisharp, ruby_solargraph.)
+# Note:
+#   - For C, use cpp
+#   - For JavaScript, use typescript
+#   - For Free Pascal/Lazarus, use pascal
+# Special requirements:
+#   Some languages require additional setup/installations.
+#   See here for details: https://oraios.github.io/serena/01-about/020_programming-languages.html#language-servers
+# When using multiple languages, the first language server that supports a given file will be used for that file.
+# The first language is the default language and the respective language server will be used as a fallback.
+# Note that when using the JetBrains backend, language servers are not used and this list is correspondingly ignored.
+languages:
+- rust
+- typescript
+
+# the encoding used by text files in the project
+# For a list of possible encodings, see https://docs.python.org/3.11/library/codecs.html#standard-encodings
+encoding: "utf-8"
+
+# line ending convention to use when writing source files.
+# Possible values: unset (use global setting), "lf", "crlf", or "native" (platform default)
+# This does not affect Serena's own files (e.g. memories and configuration files), which always use native line endings.
+line_ending:
+
+# The language backend to use for this project.
+# If not set, the global setting from serena_config.yml is used.
+# Valid values: LSP, JetBrains
+# Note: the backend is fixed at startup. If a project with a different backend
+# is activated post-init, an error will be returned.
+language_backend:
+
+# whether to use project's .gitignore files to ignore files
+ignore_all_files_in_gitignore: true
+
+# advanced configuration option allowing to configure language server-specific options.
+# Maps the language key to the options.
+# Have a look at the docstring of the constructors of the LS implementations within solidlsp (e.g., for C# or PHP) to see which options are available.
+# No documentation on options means no options are available.
+ls_specific_settings: {}
+
+# list of additional paths to ignore in this project.
+# Same syntax as gitignore, so you can use * and **.
+# Note: global ignored_paths from serena_config.yml are also applied additively.
+ignored_paths: []
+
+# whether the project is in read-only mode
+# If set to true, all editing tools will be disabled and attempts to use them will result in an error
+# Added on 2025-04-18
+read_only: false
+
+# list of tool names to exclude.
+# This extends the existing exclusions (e.g. from the global configuration)
+#
+# Below is the complete list of tools for convenience.
+# To make sure you have the latest list of tools, and to view their descriptions, 
+# execute `uv run scripts/print_tool_overview.py`.
+#
+#  * `activate_project`: Activates a project based on the project name or path.
+#  * `check_onboarding_performed`: Checks whether project onboarding was already performed.
+#  * `create_text_file`: Creates/overwrites a file in the project directory.
+#  * `delete_memory`: Delete a memory file. Should only happen if a user asks for it explicitly,
+#       for example by saying that the information retrieved from a memory file is no longer correct
+#       or no longer relevant for the project.
+#  * `edit_memory`: Replaces content matching a regular expression in a memory.
+#  * `execute_shell_command`: Executes a shell command.
+#  * `find_file`: Finds files in the given relative paths
+#  * `find_referencing_symbols`: Finds symbols that reference the given symbol using the language server backend
+#  * `find_symbol`: Performs a global (or local) search using the language server backend.
+#  * `get_current_config`: Prints the current configuration of the agent, including the active and available projects, tools, contexts, and modes.
+#  * `get_symbols_overview`: Gets an overview of the top-level symbols defined in a given file.
+#  * `initial_instructions`: Provides instructions Serena usage (i.e. the 'Serena Instructions Manual')
+#       for clients that do not read the initial instructions when the MCP server is connected.
+#  * `insert_after_symbol`: Inserts content after the end of the definition of a given symbol.
+#  * `insert_before_symbol`: Inserts content before the beginning of the definition of a given symbol.
+#  * `list_dir`: Lists files and directories in the given directory (optionally with recursion).
+#  * `list_memories`: List available memories. Any memory can be read using the `read_memory` tool.
+#  * `onboarding`: Performs onboarding (identifying the project structure and essential tasks, e.g. for testing or building).
+#  * `read_file`: Reads a file within the project directory.
+#  * `read_memory`: Read the content of a memory file. This tool should only be used if the information
+#       is relevant to the current task. You can infer whether the information
+#       is relevant from the memory file name.
+#       You should not read the same memory file multiple times in the same conversation.
+#  * `rename_memory`: Renames or moves a memory. Moving between project and global scope is supported
+#       (e.g., renaming "global/foo" to "bar" moves it from global to project scope).
+#  * `rename_symbol`: Renames a symbol throughout the codebase using language server refactoring capabilities.
+#       For JB, we use a separate tool.
+#  * `replace_content`: Replaces content in a file (optionally using regular expressions).
+#  * `replace_symbol_body`: Replaces the full definition of a symbol using the language server backend.
+#  * `safe_delete_symbol`:
+#  * `search_for_pattern`: Performs a search for a pattern in the project.
+#  * `write_memory`: Write some information (utf-8-encoded) about this project that can be useful for future tasks to a memory in md format.
+#       The memory name should be meaningful.
+excluded_tools: []
+
+# list of tools to include that would otherwise be disabled (particularly optional tools that are disabled by default).
+# This extends the existing inclusions (e.g. from the global configuration).
+included_optional_tools: []
+
+# fixed set of tools to use as the base tool set (if non-empty), replacing Serena's default set of tools.
+# This cannot be combined with non-empty excluded_tools or included_optional_tools.
+fixed_tools: []
+
+# list of mode names to that are always to be included in the set of active modes
+# The full set of modes to be activated is base_modes + default_modes.
+# If the setting is undefined, the base_modes from the global configuration (serena_config.yml) apply.
+# Otherwise, this setting overrides the global configuration.
+# Set this to [] to disable base modes for this project.
+# Set this to a list of mode names to always include the respective modes for this project.
+base_modes:
+
+# list of mode names that are to be activated by default.
+# The full set of modes to be activated is base_modes + default_modes.
+# If the setting is undefined, the default_modes from the global configuration (serena_config.yml) apply.
+# Otherwise, this overrides the setting from the global configuration (serena_config.yml).
+# This setting can, in turn, be overridden by CLI parameters (--mode).
+default_modes:
+
+# initial prompt for the project. It will always be given to the LLM upon activating the project
+# (contrary to the memories, which are loaded on demand).
+initial_prompt: ""
+
+# time budget (seconds) per tool call for the retrieval of additional symbol information
+# such as docstrings or parameter information.
+# This overrides the corresponding setting in the global configuration; see the documentation there.
+# If null or missing, use the setting from the global configuration.
+symbol_info_budget:
+
+# list of regex patterns which, when matched, mark a memory entry as read‑only.
+# Extends the list from the global configuration, merging the two lists.
+read_only_memory_patterns: []
+
+# list of regex patterns for memories to completely ignore.
+# Matching memories will not appear in list_memories or activate_project output
+# and cannot be accessed via read_memory or write_memory.
+# To access ignored memory files, use the read_file tool on the raw file path.
+# Extends the list from the global configuration, merging the two lists.
+# Example: ["_archive/.*", "_episodes/.*"]
+ignored_memory_patterns: []

.sqlx/query-09db61a070a351a6255e21d5949285ccb19fca7f8f29a6c18dddac5495257a45.json

@@ -0,0 +1,12 @@
+{
+  "db_name": "SQLite",
+  "query": "DELETE FROM agent_devices WHERE agent_id = ?1 AND device_key = ?2",
+  "describe": {
+    "columns": [],
+    "parameters": {
+      "Right": 2
+    },
+    "nullable": []
+  },
+  "hash": "09db61a070a351a6255e21d5949285ccb19fca7f8f29a6c18dddac5495257a45"
+}

.sqlx/query-0a7efadab5487c6ebbf159b4fdd842faac795fe24901756ae67303acc8343e19.json

@@ -1,12 +0,0 @@
-{
-  "db_name": "SQLite",
-  "query": "INSERT INTO agent_device_observation_events\n                     (event_id, agent_id, kind, action, mac, ip, hostname, ts_unix)\n                     VALUES (?1, ?2, ?3, ?4, ?5, ?6, ?7, ?8)",
-  "describe": {
-    "columns": [],
-    "parameters": {
-      "Right": 8
-    },
-    "nullable": []
-  },
-  "hash": "0a7efadab5487c6ebbf159b4fdd842faac795fe24901756ae67303acc8343e19"
-}

.sqlx/query-12e443ec0991c042cf527498b567bbbb6d02885f72eb3fa426c9493368f8a9e7.json

@@ -0,0 +1,32 @@
+{
+  "db_name": "SQLite",
+  "query": "SELECT agent_id as \"agent_id!\", device_key as \"device_key!\", fact_json as \"fact_json!\"\n             FROM agent_device_facts",
+  "describe": {
+    "columns": [
+      {
+        "name": "agent_id!",
+        "ordinal": 0,
+        "type_info": "Text"
+      },
+      {
+        "name": "device_key!",
+        "ordinal": 1,
+        "type_info": "Text"
+      },
+      {
+        "name": "fact_json!",
+        "ordinal": 2,
+        "type_info": "Text"
+      }
+    ],
+    "parameters": {
+      "Right": 0
+    },
+    "nullable": [
+      false,
+      false,
+      false
+    ]
+  },
+  "hash": "12e443ec0991c042cf527498b567bbbb6d02885f72eb3fa426c9493368f8a9e7"
+}

.sqlx/query-190ea5014566f84255a8655599e03695fb2f5ce9b720700f93d625c1ae2780e6.json

@@ -1,86 +0,0 @@
-{
-  "db_name": "SQLite",
-  "query": "SELECT observations.observation_key as \"observation_key!\",\n                        observations.agent_id as \"agent_id!\",\n                        observations.kind as \"kind!\",\n                        observations.mac,\n                        observations.ip,\n                        observations.hostname,\n                        observations.first_seen_unix,\n                        observations.last_seen_unix,\n                        observations.last_action as \"last_action!\",\n                        known_devices.device_id,\n                        known_devices.display_name,\n                        known_devices.pinned\n                 FROM agent_device_observations observations\n                 LEFT JOIN device_identifiers identifiers\n                   ON identifiers.identifier_key =\n                      CASE\n                        WHEN observations.mac IS NOT NULL THEN 'mac:' || observations.mac\n                        WHEN observations.ip IS NOT NULL THEN 'ip:' || observations.ip\n                      END\n                 LEFT JOIN known_devices ON known_devices.device_id = identifiers.device_id\n                 WHERE observations.agent_id = ?1\n                 ORDER BY observations.last_seen_unix DESC\n                 LIMIT ?2",
-  "describe": {
-    "columns": [
-      {
-        "name": "observation_key!",
-        "ordinal": 0,
-        "type_info": "Text"
-      },
-      {
-        "name": "agent_id!",
-        "ordinal": 1,
-        "type_info": "Text"
-      },
-      {
-        "name": "kind!",
-        "ordinal": 2,
-        "type_info": "Text"
-      },
-      {
-        "name": "mac",
-        "ordinal": 3,
-        "type_info": "Text"
-      },
-      {
-        "name": "ip",
-        "ordinal": 4,
-        "type_info": "Text"
-      },
-      {
-        "name": "hostname",
-        "ordinal": 5,
-        "type_info": "Text"
-      },
-      {
-        "name": "first_seen_unix",
-        "ordinal": 6,
-        "type_info": "Integer"
-      },
-      {
-        "name": "last_seen_unix",
-        "ordinal": 7,
-        "type_info": "Integer"
-      },
-      {
-        "name": "last_action!",
-        "ordinal": 8,
-        "type_info": "Text"
-      },
-      {
-        "name": "device_id",
-        "ordinal": 9,
-        "type_info": "Text"
-      },
-      {
-        "name": "display_name",
-        "ordinal": 10,
-        "type_info": "Text"
-      },
-      {
-        "name": "pinned",
-        "ordinal": 11,
-        "type_info": "Integer"
-      }
-    ],
-    "parameters": {
-      "Right": 2
-    },
-    "nullable": [
-      true,
-      false,
-      false,
-      true,
-      true,
-      true,
-      false,
-      false,
-      false,
-      true,
-      false,
-      false
-    ]
-  },
-  "hash": "190ea5014566f84255a8655599e03695fb2f5ce9b720700f93d625c1ae2780e6"
-}

.sqlx/query-2cd47bbce9b9ae2ebf39f31b12722bb8d19ef6d90ac634731932a4cefbde03b7.json

@@ -0,0 +1,12 @@
+{
+  "db_name": "SQLite",
+  "query": "DELETE FROM agent_device_hostnames WHERE agent_id = ?1 AND device_key = ?2",
+  "describe": {
+    "columns": [],
+    "parameters": {
+      "Right": 2
+    },
+    "nullable": []
+  },
+  "hash": "2cd47bbce9b9ae2ebf39f31b12722bb8d19ef6d90ac634731932a4cefbde03b7"
+}

.sqlx/query-305f50ab2691e12c74e8a222ef12a16f14a65edd7b7c5400a196fd57a9788dcf.json

@@ -1,68 +0,0 @@
-{
-  "db_name": "SQLite",
-  "query": "SELECT observation_key as \"observation_key!\", agent_id as \"agent_id!\",\n                        kind as \"kind!\", mac, ip, hostname,\n                        first_seen_unix, last_seen_unix, last_action as \"last_action!\"\n                 FROM agent_device_observations\n                 WHERE agent_id = ?1\n                 ORDER BY last_seen_unix DESC\n                 LIMIT ?2",
-  "describe": {
-    "columns": [
-      {
-        "name": "observation_key!",
-        "ordinal": 0,
-        "type_info": "Text"
-      },
-      {
-        "name": "agent_id!",
-        "ordinal": 1,
-        "type_info": "Text"
-      },
-      {
-        "name": "kind!",
-        "ordinal": 2,
-        "type_info": "Text"
-      },
-      {
-        "name": "mac",
-        "ordinal": 3,
-        "type_info": "Text"
-      },
-      {
-        "name": "ip",
-        "ordinal": 4,
-        "type_info": "Text"
-      },
-      {
-        "name": "hostname",
-        "ordinal": 5,
-        "type_info": "Text"
-      },
-      {
-        "name": "first_seen_unix",
-        "ordinal": 6,
-        "type_info": "Integer"
-      },
-      {
-        "name": "last_seen_unix",
-        "ordinal": 7,
-        "type_info": "Integer"
-      },
-      {
-        "name": "last_action!",
-        "ordinal": 8,
-        "type_info": "Text"
-      }
-    ],
-    "parameters": {
-      "Right": 2
-    },
-    "nullable": [
-      true,
-      false,
-      false,
-      true,
-      true,
-      true,
-      false,
-      false,
-      false
-    ]
-  },
-  "hash": "305f50ab2691e12c74e8a222ef12a16f14a65edd7b7c5400a196fd57a9788dcf"
-}

.sqlx/query-3b06698566cea17eed9d10a389ee12a95cee2db6c3d450dca7a3b2d08e8fed7b.json

@@ -1,26 +0,0 @@
-{
-  "db_name": "SQLite",
-  "query": "SELECT mac, ip\n         FROM agent_device_observations\n         WHERE observation_key = ?1",
-  "describe": {
-    "columns": [
-      {
-        "name": "mac",
-        "ordinal": 0,
-        "type_info": "Text"
-      },
-      {
-        "name": "ip",
-        "ordinal": 1,
-        "type_info": "Text"
-      }
-    ],
-    "parameters": {
-      "Right": 1
-    },
-    "nullable": [
-      true,
-      true
-    ]
-  },
-  "hash": "3b06698566cea17eed9d10a389ee12a95cee2db6c3d450dca7a3b2d08e8fed7b"
-}

.sqlx/query-3f24dfb51be2c3051dc8a8f732bd3e3fe9ca6b2649e1202d3725693b8011f269.json

@@ -0,0 +1,20 @@
+{
+  "db_name": "SQLite",
+  "query": "SELECT device_key FROM agent_devices WHERE agent_id = ?1",
+  "describe": {
+    "columns": [
+      {
+        "name": "device_key",
+        "ordinal": 0,
+        "type_info": "Text"
+      }
+    ],
+    "parameters": {
+      "Right": 1
+    },
+    "nullable": [
+      false
+    ]
+  },
+  "hash": "3f24dfb51be2c3051dc8a8f732bd3e3fe9ca6b2649e1202d3725693b8011f269"
+}

.sqlx/query-409e1e7aa2d9bc46030001e5c522d7c2812b4583dceadfe5c535a866ac76489c.json

@@ -1,86 +0,0 @@
-{
-  "db_name": "SQLite",
-  "query": "SELECT observations.observation_key as \"observation_key!\",\n                        observations.agent_id as \"agent_id!\",\n                        observations.kind as \"kind!\",\n                        observations.mac,\n                        observations.ip,\n                        observations.hostname,\n                        observations.first_seen_unix,\n                        observations.last_seen_unix,\n                        observations.last_action as \"last_action!\",\n                        known_devices.device_id,\n                        known_devices.display_name,\n                        known_devices.pinned\n                 FROM agent_device_observations observations\n                 LEFT JOIN device_identifiers identifiers\n                   ON identifiers.identifier_key =\n                      CASE\n                        WHEN observations.mac IS NOT NULL THEN 'mac:' || observations.mac\n                        WHEN observations.ip IS NOT NULL THEN 'ip:' || observations.ip\n                      END\n                 LEFT JOIN known_devices ON known_devices.device_id = identifiers.device_id\n                 ORDER BY observations.last_seen_unix DESC\n                 LIMIT ?1",
-  "describe": {
-    "columns": [
-      {
-        "name": "observation_key!",
-        "ordinal": 0,
-        "type_info": "Text"
-      },
-      {
-        "name": "agent_id!",
-        "ordinal": 1,
-        "type_info": "Text"
-      },
-      {
-        "name": "kind!",
-        "ordinal": 2,
-        "type_info": "Text"
-      },
-      {
-        "name": "mac",
-        "ordinal": 3,
-        "type_info": "Text"
-      },
-      {
-        "name": "ip",
-        "ordinal": 4,
-        "type_info": "Text"
-      },
-      {
-        "name": "hostname",
-        "ordinal": 5,
-        "type_info": "Text"
-      },
-      {
-        "name": "first_seen_unix",
-        "ordinal": 6,
-        "type_info": "Integer"
-      },
-      {
-        "name": "last_seen_unix",
-        "ordinal": 7,
-        "type_info": "Integer"
-      },
-      {
-        "name": "last_action!",
-        "ordinal": 8,
-        "type_info": "Text"
-      },
-      {
-        "name": "device_id",
-        "ordinal": 9,
-        "type_info": "Text"
-      },
-      {
-        "name": "display_name",
-        "ordinal": 10,
-        "type_info": "Text"
-      },
-      {
-        "name": "pinned",
-        "ordinal": 11,
-        "type_info": "Integer"
-      }
-    ],
-    "parameters": {
-      "Right": 1
-    },
-    "nullable": [
-      true,
-      false,
-      false,
-      true,
-      true,
-      true,
-      false,
-      false,
-      false,
-      true,
-      true,
-      true
-    ]
-  },
-  "hash": "409e1e7aa2d9bc46030001e5c522d7c2812b4583dceadfe5c535a866ac76489c"
-}

.sqlx/query-4188fb9a0dac2e19fb1f83e023eb1e8d93f6ca896cd78a53668080639fc048d9.json

@@ -0,0 +1,32 @@
+{
+  "db_name": "SQLite",
+  "query": "SELECT agent_id as \"agent_id!\", device_key as \"device_key!\", hostname as \"hostname!\"\n             FROM agent_device_hostnames\n             WHERE agent_id = ?1",
+  "describe": {
+    "columns": [
+      {
+        "name": "agent_id!",
+        "ordinal": 0,
+        "type_info": "Text"
+      },
+      {
+        "name": "device_key!",
+        "ordinal": 1,
+        "type_info": "Text"
+      },
+      {
+        "name": "hostname!",
+        "ordinal": 2,
+        "type_info": "Text"
+      }
+    ],
+    "parameters": {
+      "Right": 1
+    },
+    "nullable": [
+      false,
+      false,
+      false
+    ]
+  },
+  "hash": "4188fb9a0dac2e19fb1f83e023eb1e8d93f6ca896cd78a53668080639fc048d9"
+}

.sqlx/query-4dd5e580826b0f6980bb8c2adecdc81ff95992ec337f93263463c5a4e357dc72.json

@@ -0,0 +1,32 @@
+{
+  "db_name": "SQLite",
+  "query": "SELECT agent_id as \"agent_id!\", device_key as \"device_key!\", ip as \"ip!\"\n             FROM agent_device_ips",
+  "describe": {
+    "columns": [
+      {
+        "name": "agent_id!",
+        "ordinal": 0,
+        "type_info": "Text"
+      },
+      {
+        "name": "device_key!",
+        "ordinal": 1,
+        "type_info": "Text"
+      },
+      {
+        "name": "ip!",
+        "ordinal": 2,
+        "type_info": "Text"
+      }
+    ],
+    "parameters": {
+      "Right": 0
+    },
+    "nullable": [
+      false,
+      false,
+      false
+    ]
+  },
+  "hash": "4dd5e580826b0f6980bb8c2adecdc81ff95992ec337f93263463c5a4e357dc72"
+}

.sqlx/query-4f4329b0a47a00a3b881a1bc5cf8bb9855351714ff827ccff917b3e623191504.json

@@ -0,0 +1,12 @@
+{
+  "db_name": "SQLite",
+  "query": "DELETE FROM agent_device_macs WHERE agent_id = ?1 AND device_key = ?2",
+  "describe": {
+    "columns": [],
+    "parameters": {
+      "Right": 2
+    },
+    "nullable": []
+  },
+  "hash": "4f4329b0a47a00a3b881a1bc5cf8bb9855351714ff827ccff917b3e623191504"
+}

.sqlx/query-52d22161e936b39b57d119aab592426e88f60387ccba58888cc7d440012777ed.json

@@ -1,12 +0,0 @@
-{
-  "db_name": "SQLite",
-  "query": "INSERT INTO agent_device_observations\n                 (observation_key, agent_id, kind, mac, ip, hostname,\n                  first_seen_unix, last_seen_unix, last_action)\n                 VALUES (?1, ?2, ?3, ?4, ?5, ?6, ?7, ?8, ?9)\n                 ON CONFLICT(observation_key) DO UPDATE SET\n                   mac = excluded.mac,\n                   ip = excluded.ip,\n                   hostname = excluded.hostname,\n                   first_seen_unix = MIN(agent_device_observations.first_seen_unix, excluded.first_seen_unix),\n                   last_seen_unix = MAX(agent_device_observations.last_seen_unix, excluded.last_seen_unix),\n                   last_action = excluded.last_action",
-  "describe": {
-    "columns": [],
-    "parameters": {
-      "Right": 9
-    },
-    "nullable": []
-  },
-  "hash": "52d22161e936b39b57d119aab592426e88f60387ccba58888cc7d440012777ed"
-}

.sqlx/query-55340d50a29e0a2d324ed946b6fa6503fbd4ea0674bb7ec24e3426c5b0e5832f.json

@@ -0,0 +1,12 @@
+{
+  "db_name": "SQLite",
+  "query": "DELETE FROM agent_device_facts WHERE agent_id = ?1 AND device_key = ?2",
+  "describe": {
+    "columns": [],
+    "parameters": {
+      "Right": 2
+    },
+    "nullable": []
+  },
+  "hash": "55340d50a29e0a2d324ed946b6fa6503fbd4ea0674bb7ec24e3426c5b0e5832f"
+}

.sqlx/query-580f6bc100d373137db6f853b8babd7633c700dbfaf17ded507b704fd98e46a5.json

@@ -0,0 +1,32 @@
+{
+  "db_name": "SQLite",
+  "query": "SELECT agent_id as \"agent_id!\", device_key as \"device_key!\", mac as \"mac!\"\n             FROM agent_device_macs\n             WHERE agent_id = ?1",
+  "describe": {
+    "columns": [
+      {
+        "name": "agent_id!",
+        "ordinal": 0,
+        "type_info": "Text"
+      },
+      {
+        "name": "device_key!",
+        "ordinal": 1,
+        "type_info": "Text"
+      },
+      {
+        "name": "mac!",
+        "ordinal": 2,
+        "type_info": "Text"
+      }
+    ],
+    "parameters": {
+      "Right": 1
+    },
+    "nullable": [
+      false,
+      false,
+      false
+    ]
+  },
+  "hash": "580f6bc100d373137db6f853b8babd7633c700dbfaf17ded507b704fd98e46a5"
+}

.sqlx/query-5824c6cb841f7aaeb2a039f846effe17ba8038e35998b674136a19a4d42d8b88.json

@@ -0,0 +1,32 @@
+{
+  "db_name": "SQLite",
+  "query": "SELECT agent_id as \"agent_id!\", device_key as \"device_key!\", mac as \"mac!\"\n             FROM agent_device_macs",
+  "describe": {
+    "columns": [
+      {
+        "name": "agent_id!",
+        "ordinal": 0,
+        "type_info": "Text"
+      },
+      {
+        "name": "device_key!",
+        "ordinal": 1,
+        "type_info": "Text"
+      },
+      {
+        "name": "mac!",
+        "ordinal": 2,
+        "type_info": "Text"
+      }
+    ],
+    "parameters": {
+      "Right": 0
+    },
+    "nullable": [
+      false,
+      false,
+      false
+    ]
+  },
+  "hash": "5824c6cb841f7aaeb2a039f846effe17ba8038e35998b674136a19a4d42d8b88"
+}

.sqlx/query-5a0f37b5da194e432c795972d5b3bf67c2d2a00f379143d1ae5871ea790d1bf2.json

@@ -1,68 +0,0 @@
-{
-  "db_name": "SQLite",
-  "query": "SELECT observation_key as \"observation_key!\", agent_id as \"agent_id!\",\n                        kind as \"kind!\", mac, ip, hostname,\n                        first_seen_unix, last_seen_unix, last_action as \"last_action!\"\n                 FROM agent_device_observations\n                 ORDER BY last_seen_unix DESC\n                 LIMIT ?1",
-  "describe": {
-    "columns": [
-      {
-        "name": "observation_key!",
-        "ordinal": 0,
-        "type_info": "Text"
-      },
-      {
-        "name": "agent_id!",
-        "ordinal": 1,
-        "type_info": "Text"
-      },
-      {
-        "name": "kind!",
-        "ordinal": 2,
-        "type_info": "Text"
-      },
-      {
-        "name": "mac",
-        "ordinal": 3,
-        "type_info": "Text"
-      },
-      {
-        "name": "ip",
-        "ordinal": 4,
-        "type_info": "Text"
-      },
-      {
-        "name": "hostname",
-        "ordinal": 5,
-        "type_info": "Text"
-      },
-      {
-        "name": "first_seen_unix",
-        "ordinal": 6,
-        "type_info": "Integer"
-      },
-      {
-        "name": "last_seen_unix",
-        "ordinal": 7,
-        "type_info": "Integer"
-      },
-      {
-        "name": "last_action!",
-        "ordinal": 8,
-        "type_info": "Text"
-      }
-    ],
-    "parameters": {
-      "Right": 1
-    },
-    "nullable": [
-      true,
-      false,
-      false,
-      true,
-      true,
-      true,
-      false,
-      false,
-      false
-    ]
-  },
-  "hash": "5a0f37b5da194e432c795972d5b3bf67c2d2a00f379143d1ae5871ea790d1bf2"
-}

.sqlx/query-5f7e043ca389f1431c7b3478ea506b0c9bb706d32c06871d1267068dbe9cb746.json

@@ -1,50 +1,50 @@
 {
   "db_name": "SQLite",
-  "query": "SELECT mac, ip, hostname, first_seen_unix, last_seen_unix,\n                  last_action as \"last_action!\"\n           FROM agent_device_observations\n           WHERE observation_key = ?1",
+  "query": "SELECT agent_id, device_key, presence, display_name,\n                    first_seen_unix, last_seen_unix\n             FROM agent_devices\n             WHERE agent_id = ?1\n             ORDER BY device_key",
   "describe": {
     "columns": [
       {
-        "name": "mac",
+        "name": "agent_id",
         "ordinal": 0,
         "type_info": "Text"
       },
       {
-        "name": "ip",
+        "name": "device_key",
         "ordinal": 1,
         "type_info": "Text"
       },
       {
-        "name": "hostname",
+        "name": "presence",
         "ordinal": 2,
         "type_info": "Text"
       },
       {
-        "name": "first_seen_unix",
+        "name": "display_name",
         "ordinal": 3,
-        "type_info": "Integer"
+        "type_info": "Text"
       },
       {
-        "name": "last_seen_unix",
+        "name": "first_seen_unix",
         "ordinal": 4,
         "type_info": "Integer"
       },
       {
-        "name": "last_action!",
+        "name": "last_seen_unix",
         "ordinal": 5,
-        "type_info": "Text"
+        "type_info": "Integer"
       }
     ],
     "parameters": {
       "Right": 1
     },
     "nullable": [
-      true,
-      true,
-      true,
       false,
       false,
+      false,
+      true,
+      false,
       false
     ]
   },
-  "hash": "92775bf2e3b9f772d108bb8d0cd1aebbe01357ed70dc2af7b50ee348e668b319"
+  "hash": "5f7e043ca389f1431c7b3478ea506b0c9bb706d32c06871d1267068dbe9cb746"
 }

.sqlx/query-69601f4f2268a759f03a2d533a0a30dec5cf05797817fd8d2426714cd84d7ada.json

@@ -0,0 +1,12 @@
+{
+  "db_name": "SQLite",
+  "query": "INSERT INTO alert_transitions\n         (transition_key, transition_id, ts_unix, alert_id, kind, agent_id,\n          from_status, to_status, message, metadata_json)\n         VALUES (?1, ?2, ?3, ?4, ?5, ?6, ?7, ?8, ?9, ?10)",
+  "describe": {
+    "columns": [],
+    "parameters": {
+      "Right": 10
+    },
+    "nullable": []
+  },
+  "hash": "69601f4f2268a759f03a2d533a0a30dec5cf05797817fd8d2426714cd84d7ada"
+}

.sqlx/query-72aadefca9851a8becdd2dcce54b646aff095b64cef9837f5e8e4ea8dde71d02.json

@@ -0,0 +1,12 @@
+{
+  "db_name": "SQLite",
+  "query": "DELETE FROM device_identifiers WHERE device_id = ?1 AND identifier_key = ?2",
+  "describe": {
+    "columns": [],
+    "parameters": {
+      "Right": 2
+    },
+    "nullable": []
+  },
+  "hash": "72aadefca9851a8becdd2dcce54b646aff095b64cef9837f5e8e4ea8dde71d02"
+}

.sqlx/query-908d763909c76fb6170b818784e360372c02295523ef9970c91199db7d4f535a.json

@@ -1,86 +0,0 @@
-{
-  "db_name": "SQLite",
-  "query": "SELECT events.event_id as \"event_id!\",\n                    ('agent:' || events.agent_id || ':' || events.kind || ':' ||\n                        CASE\n                            WHEN events.mac IS NOT NULL THEN 'mac:' || events.mac\n                            WHEN events.ip IS NOT NULL THEN 'ip:' || events.ip\n                            ELSE ''\n                        END) as \"observation_key!\",\n                    events.agent_id as \"agent_id!\",\n                    events.kind as \"kind!\",\n                    events.action as \"action!\",\n                    events.mac,\n                    events.ip,\n                    events.hostname,\n                    events.ts_unix,\n                    known_devices.device_id,\n                    known_devices.display_name,\n                    known_devices.pinned\n             FROM agent_device_observation_events events\n             LEFT JOIN device_identifiers identifiers\n               ON identifiers.identifier_key =\n                  CASE\n                    WHEN events.mac IS NOT NULL THEN 'mac:' || events.mac\n                    WHEN events.ip IS NOT NULL THEN 'ip:' || events.ip\n                  END\n             LEFT JOIN known_devices ON known_devices.device_id = identifiers.device_id\n             WHERE (?1 IS NULL OR events.agent_id = ?1)\n               AND (?2 IS NULL OR events.kind = ?2)\n               AND (?3 IS NULL OR events.mac = ?3)\n               AND (?4 IS NULL OR events.ip = ?4)\n               AND (?5 IS NULL OR ('agent:' || events.agent_id || ':' || events.kind || ':' ||\n                    CASE\n                        WHEN events.mac IS NOT NULL THEN 'mac:' || events.mac\n                        WHEN events.ip IS NOT NULL THEN 'ip:' || events.ip\n                        ELSE ''\n                    END) = ?5)\n             ORDER BY events.ts_unix DESC\n             LIMIT ?6",
-  "describe": {
-    "columns": [
-      {
-        "name": "event_id!",
-        "ordinal": 0,
-        "type_info": "Text"
-      },
-      {
-        "name": "observation_key!",
-        "ordinal": 1,
-        "type_info": "Text"
-      },
-      {
-        "name": "agent_id!",
-        "ordinal": 2,
-        "type_info": "Text"
-      },
-      {
-        "name": "kind!",
-        "ordinal": 3,
-        "type_info": "Text"
-      },
-      {
-        "name": "action!",
-        "ordinal": 4,
-        "type_info": "Text"
-      },
-      {
-        "name": "mac",
-        "ordinal": 5,
-        "type_info": "Text"
-      },
-      {
-        "name": "ip",
-        "ordinal": 6,
-        "type_info": "Text"
-      },
-      {
-        "name": "hostname",
-        "ordinal": 7,
-        "type_info": "Text"
-      },
-      {
-        "name": "ts_unix",
-        "ordinal": 8,
-        "type_info": "Integer"
-      },
-      {
-        "name": "device_id",
-        "ordinal": 9,
-        "type_info": "Text"
-      },
-      {
-        "name": "display_name",
-        "ordinal": 10,
-        "type_info": "Text"
-      },
-      {
-        "name": "pinned",
-        "ordinal": 11,
-        "type_info": "Integer"
-      }
-    ],
-    "parameters": {
-      "Right": 6
-    },
-    "nullable": [
-      true,
-      true,
-      false,
-      false,
-      false,
-      true,
-      true,
-      true,
-      false,
-      true,
-      true,
-      true
-    ]
-  },
-  "hash": "908d763909c76fb6170b818784e360372c02295523ef9970c91199db7d4f535a"
-}

.sqlx/query-a29f58cb7dd1b1bc510a0d04ecd1dbc7250824ba089dbc36ed9ac2e6dc920fd7.json

@@ -0,0 +1,12 @@
+{
+  "db_name": "SQLite",
+  "query": "INSERT INTO agent_devices (agent_id, device_key, presence, display_name, first_seen_unix, last_seen_unix)\n                 VALUES (?1, ?2, ?3, ?4, ?5, ?6)\n                 ON CONFLICT (agent_id, device_key) DO UPDATE SET\n                    presence = excluded.presence,\n                    display_name = excluded.display_name,\n                    last_seen_unix = excluded.last_seen_unix",
+  "describe": {
+    "columns": [],
+    "parameters": {
+      "Right": 6
+    },
+    "nullable": []
+  },
+  "hash": "a29f58cb7dd1b1bc510a0d04ecd1dbc7250824ba089dbc36ed9ac2e6dc920fd7"
+}

.sqlx/query-c423e005d85659547302f506380ad217cc31329262a1c0254ef532653b3a37bb.json

@@ -0,0 +1,32 @@
+{
+  "db_name": "SQLite",
+  "query": "SELECT agent_id as \"agent_id!\", device_key as \"device_key!\", ip as \"ip!\"\n             FROM agent_device_ips\n             WHERE agent_id = ?1",
+  "describe": {
+    "columns": [
+      {
+        "name": "agent_id!",
+        "ordinal": 0,
+        "type_info": "Text"
+      },
+      {
+        "name": "device_key!",
+        "ordinal": 1,
+        "type_info": "Text"
+      },
+      {
+        "name": "ip!",
+        "ordinal": 2,
+        "type_info": "Text"
+      }
+    ],
+    "parameters": {
+      "Right": 1
+    },
+    "nullable": [
+      false,
+      false,
+      false
+    ]
+  },
+  "hash": "c423e005d85659547302f506380ad217cc31329262a1c0254ef532653b3a37bb"
+}

.sqlx/query-cd8585b9431d223962c376a2d463f0ca8128e7759c8694631f41db0cbd8eb221.json

@@ -0,0 +1,50 @@
+{
+  "db_name": "SQLite",
+  "query": "SELECT agent_id, device_key, presence, display_name,\n                    first_seen_unix, last_seen_unix\n             FROM agent_devices\n             ORDER BY agent_id, device_key",
+  "describe": {
+    "columns": [
+      {
+        "name": "agent_id",
+        "ordinal": 0,
+        "type_info": "Text"
+      },
+      {
+        "name": "device_key",
+        "ordinal": 1,
+        "type_info": "Text"
+      },
+      {
+        "name": "presence",
+        "ordinal": 2,
+        "type_info": "Text"
+      },
+      {
+        "name": "display_name",
+        "ordinal": 3,
+        "type_info": "Text"
+      },
+      {
+        "name": "first_seen_unix",
+        "ordinal": 4,
+        "type_info": "Integer"
+      },
+      {
+        "name": "last_seen_unix",
+        "ordinal": 5,
+        "type_info": "Integer"
+      }
+    ],
+    "parameters": {
+      "Right": 0
+    },
+    "nullable": [
+      false,
+      false,
+      false,
+      true,
+      false,
+      false
+    ]
+  },
+  "hash": "cd8585b9431d223962c376a2d463f0ca8128e7759c8694631f41db0cbd8eb221"
+}

.sqlx/query-d442949dce7a4b9a8af97dc34fc34608029564740ad327c525c7f1466bc18a11.json

@@ -0,0 +1,12 @@
+{
+  "db_name": "SQLite",
+  "query": "DELETE FROM agent_device_ips WHERE agent_id = ?1 AND device_key = ?2",
+  "describe": {
+    "columns": [],
+    "parameters": {
+      "Right": 2
+    },
+    "nullable": []
+  },
+  "hash": "d442949dce7a4b9a8af97dc34fc34608029564740ad327c525c7f1466bc18a11"
+}

.sqlx/query-dba637bf03d53bf3394ead0f01466f9a72fafc54f9ce239d2e5ac7f76b63b168.json

@@ -0,0 +1,32 @@
+{
+  "db_name": "SQLite",
+  "query": "SELECT agent_id as \"agent_id!\", device_key as \"device_key!\", hostname as \"hostname!\"\n             FROM agent_device_hostnames",
+  "describe": {
+    "columns": [
+      {
+        "name": "agent_id!",
+        "ordinal": 0,
+        "type_info": "Text"
+      },
+      {
+        "name": "device_key!",
+        "ordinal": 1,
+        "type_info": "Text"
+      },
+      {
+        "name": "hostname!",
+        "ordinal": 2,
+        "type_info": "Text"
+      }
+    ],
+    "parameters": {
+      "Right": 0
+    },
+    "nullable": [
+      false,
+      false,
+      false
+    ]
+  },
+  "hash": "dba637bf03d53bf3394ead0f01466f9a72fafc54f9ce239d2e5ac7f76b63b168"
+}

.sqlx/query-e6be4d9782f66f98ebe4d4b6ec6e93ea9efe8e4c7f1147e1ff68d41a311d57f9.json

@@ -0,0 +1,32 @@
+{
+  "db_name": "SQLite",
+  "query": "SELECT agent_id as \"agent_id!\", device_key as \"device_key!\", fact_json as \"fact_json!\"\n             FROM agent_device_facts\n             WHERE agent_id = ?1",
+  "describe": {
+    "columns": [
+      {
+        "name": "agent_id!",
+        "ordinal": 0,
+        "type_info": "Text"
+      },
+      {
+        "name": "device_key!",
+        "ordinal": 1,
+        "type_info": "Text"
+      },
+      {
+        "name": "fact_json!",
+        "ordinal": 2,
+        "type_info": "Text"
+      }
+    ],
+    "parameters": {
+      "Right": 1
+    },
+    "nullable": [
+      false,
+      false,
+      false
+    ]
+  },
+  "hash": "e6be4d9782f66f98ebe4d4b6ec6e93ea9efe8e4c7f1147e1ff68d41a311d57f9"
+}

.sqlx/query-f5a815d4d6e3d088aba3cd01607764d89afaae6108aad0d17e93b1bfc9f7e772.json

@@ -0,0 +1,20 @@
+{
+  "db_name": "SQLite",
+  "query": "SELECT COUNT(*) FROM enroll_tokens WHERE token = ?1",
+  "describe": {
+    "columns": [
+      {
+        "name": "COUNT(*)",
+        "ordinal": 0,
+        "type_info": "Integer"
+      }
+    ],
+    "parameters": {
+      "Right": 1
+    },
+    "nullable": [
+      false
+    ]
+  },
+  "hash": "f5a815d4d6e3d088aba3cd01607764d89afaae6108aad0d17e93b1bfc9f7e772"
+}

.sqlx/query-fa09ff199445b7bf689ef4426cbd20d89040230ffff977cc1b4c73b499b1b33f.json

@@ -0,0 +1,12 @@
+{
+  "db_name": "SQLite",
+  "query": "INSERT INTO active_alerts\n         (alert_id, kind, severity, status, agent_id, message, value, threshold,\n          last_seen_unix, metadata_json)\n         VALUES (?1, ?2, ?3, ?4, ?5, ?6, ?7, ?8, ?9, ?10)",
+  "describe": {
+    "columns": [],
+    "parameters": {
+      "Right": 10
+    },
+    "nullable": []
+  },
+  "hash": "fa09ff199445b7bf689ef4426cbd20d89040230ffff977cc1b4c73b499b1b33f"
+}

CONTEXT.md

@@ -0,0 +1,146 @@
+# Wakey
+
+Wakey models devices discovered on a local network and the control-plane view used to wake and manage them across agents.
+
+## Language
+
+**Device**:
+An operator-facing aggregate that represents one discovered network identity candidate.
+_Avoid_: Host, machine, route
+
+**Device Summary**:
+The derived names, MACs, IPs, and presence shown on a device aggregate.
+_Avoid_: Source of truth, route data
+
+**Endpoint**:
+One observed network contact point for a device, including the agent/source, optional MAC, optional IP, presence, and observation time.
+_Avoid_: Raw observation, route, IP row
+
+**Endpoint Source**:
+The typed origin of an endpoint, such as neighbor data, DHCP lease data, or a hotplug hook.
+_Avoid_: String kind, source label
+
+**Observation Fact**:
+Debug evidence copied from local observation inputs before it is interpreted into endpoints.
+_Avoid_: Endpoint, identifier, source of truth
+
+**Presence**:
+The current reachability interpretation for a device or endpoint.
+_Avoid_: Endpoint state, status
+
+**Wake Route**:
+An endpoint that has enough information and agent availability to attempt waking a device.
+_Avoid_: Device, endpoint when not wakeable
+
+**Known Device**:
+A device identity manually curated by the operator.
+_Avoid_: Auto-pinned device, saved observation
+
+**Identifier**:
+A manually approved MAC or IP value that links an observed device or endpoint to a known device.
+_Avoid_: Observation key, route id
+
+**Endpoint Key**:
+The typed identity of endpoint evidence, based on source and optional MAC/IP.
+_Avoid_: Stringly typed route id
+
+**Agent Endpoint Key**:
+An endpoint key scoped to the agent that observed it.
+_Avoid_: Concatenated agent/source/MAC/IP string
+
+**Agent**:
+A fleet member that observes local network state and sends device snapshots to the control plane.
+_Avoid_: Router when referring to the software actor
+
+**Agent Host**:
+The machine running an agent, including host identity and runtime metadata.
+_Avoid_: Device when referring to the agent machine
+
+**Agent Capability**:
+Something an agent host can observe or do on the network.
+_Avoid_: Router flag
+
+**Terminal Capability**:
+An explicitly enabled agent capability that allows the agent host to create remote PTY sessions.
+_Avoid_: Command runner, implicit root access
+
+**Terminal Session**:
+One operator attachment to one PTY process hosted by an agent.
+_Avoid_: Command, SSH session, stored shell
+
+**Terminal Relay**:
+The control plane's in-memory pairing of one operator terminal socket with one outbound agent terminal socket.
+_Avoid_: Terminal session storage, terminal emulator
+
+**Interface Telemetry**:
+Current operational measurements for a network interface visible to an agent.
+_Avoid_: Endpoint state, device presence
+
+## Relationships
+
+- A **Device** has zero or more **Endpoints**.
+- A **Device Summary** is derived from a **Device** and its **Endpoints**.
+- Local source rows are grouped into **Devices** by endpoint-derived **DeviceId**, not by exact **Endpoint Key**.
+- Within one complete local snapshot, MAC+IP endpoints may absorb IP-only endpoints with the same IP; this merge is not remembered across snapshots unless the operator creates an **Identifier**.
+- An **Endpoint** belongs to exactly one **Agent**.
+- An **Endpoint** has one **Endpoint Key**.
+- An **Agent Endpoint Key** combines an **Agent** with an **Endpoint Key**.
+- An **Endpoint** may have both MAC and IP, MAC only, or IP only.
+- An **Endpoint** has exactly one **Endpoint Source**.
+- An **Endpoint** has one **Presence**.
+- An **Endpoint** may name the network interface where it was observed.
+- An **Observation Fact** may explain why an **Endpoint** exists, but does not define identity or wakeability.
+- A **Wake Route** is derived from exactly one **Endpoint**.
+- A **Wake Route** may carry the interface from its source **Endpoint**.
+- A **Known Device** has zero or more **Identifiers**.
+- An **Identifier** can link observed **Devices** or **Endpoints** to one **Known Device**.
+- An **Agent** runs on one **Agent Host**.
+- An **Agent Capability** describes what an **Agent Host** can observe or do.
+- **Terminal Capability** is an **Agent Capability** and must be explicitly enabled before an agent can host a **Terminal Session**.
+- A **Terminal Session** owns one PTY and is independent of one-shot agent commands.
+- A **Terminal Relay** pairs exactly one operator socket with exactly one agent socket for a **Terminal Session**.
+- **Interface Telemetry** describes an **Agent Host** interface, not a **Device Endpoint**.
+
+## Example dialogue
+
+> **Dev:** "This **Device** has three IPs. Which one should the UI wake?"
+> **Domain expert:** "Do not infer that from the **Device** summary. Use the **Wake Routes** derived from its **Endpoints**."
+
+## Flagged ambiguities
+
+- "route" was used for both observed network contact points and wakeable paths — resolved: use **Endpoint** for observed contact points and **Wake Route** only when the endpoint can be used for wake.
+- "device" was used for both an identity aggregate and each MAC/IP pair — resolved: use **Device** for the aggregate and **Endpoint** for each observed MAC/IP/source/state tuple.
+- `Device.ips` and `Device.macs` are true summary values, but they are not authoritative for wake, freshness, or per-IP state decisions — resolved: use **Endpoint** for those decisions.
+- MAC-only and IP-only observations are still **Endpoints** — resolved: **Wake Routes** require a MAC and a connected **Agent**, while IP is optional route detail.
+- Endpoint-specific states such as "removed" or "stale" are not separate concepts yet — resolved: use **Presence** until a distinction appears that presence cannot express cleanly.
+- Endpoint origin is not a free string — resolved: use **Endpoint Source** for domain logic and reserve raw strings for debug facts only.
+- Local observation file rows map naturally to **Observation Facts** — resolved: keep them for debugging, but do not use them as the operational model.
+- Offline **Endpoints** remain part of the API model — resolved: UI may collapse them from the primary view, but the API should still expose them for details, copy, and debugging.
+- **Device Summary** IPs come only from concrete live-ish sources such as neighbor table rows and current DHCP lease rows — resolved: hotplug hook memory creates **Endpoints** and **Observation Facts**, but does not directly inflate summary IPs.
+- Router-ness is not a boolean domain concept — resolved: model **Agent Capabilities** and **Agent Host** metadata instead.
+- **Presence** ordering should treat **Unknown** as non-voting/no evidence, weaker than **Offline** — resolved: concrete offline evidence should not be overridden by unknown hook or DHCP ambiguity.
+- **Device** presence is derived from all **Endpoints**, not only summary-eligible endpoints.
+- Current DHCP leases are summary-eligible **Endpoints** with **Unknown** presence; they may support wake when a MAC is present, but they do not prove reachability.
+- DHCP hook events, including removal, indicate **Unknown** because they describe lease churn rather than reachability.
+- Neighbor table and neighbor hook events may indicate **Offline** when they report failed or removed reachability.
+- **Presence** and wakeability are separate: an **Offline** endpoint may still produce a **Wake Route** if it has a MAC and a connected **Agent**.
+- **Endpoint** does not store wakeability; wakeability is derived from endpoint data plus **Agent** runtime and capability context.
+- Preferred **Wake Routes** are ordered by connected agent, wakeability, having an IP, presence quality, recency, then source quality.
+- **Endpoint** evidence preserves source-specific rows; equivalent **Wake Routes** may ignore source when they target the same agent, MAC, and IP.
+- The control plane stores **Endpoints** as structured data so fleet search, identity matching, and wake route selection do not depend on parsing opaque device JSON.
+- Summary MAC/IP collections are derived from **Endpoints**; separate MAC/IP storage should be removed or represented as views rather than maintained as independent truth.
+- API arrays should be domain-sorted by default; UI may sort top-level fleet rows for presentation, but route ranking and recommended route selection are backend-owned.
+- The main fleet API embeds **Endpoints** in each **Device** response; a separate endpoint API is unnecessary until payload size or access patterns require it.
+- The control plane stores current per-agent endpoint snapshots, not endpoint event history.
+- Agent-local hook memory is retained by local last-seen age policy, not by control-plane acknowledgement; default retention is 7 days unless configured otherwise.
+- Live-source **Endpoints** use snapshot time as their observed time; hook-derived **Endpoints** use the hook row's recorded last-seen time.
+- **DeviceId**, **Endpoint Key**, and **Agent Endpoint Key** are typed concepts; string keys are boundary serialization only.
+- **DeviceId** is derived from a device's **Endpoints**: canonical MAC if any endpoint has a MAC, otherwise canonical IP, otherwise absent.
+- Hostnames are endpoint evidence/display data, not part of **Endpoint Key** identity.
+- Interface names are endpoint metadata, not part of **Endpoint Key** identity; multi-segment routers may require scoped endpoint identity later if the same source/MAC/IP has different meaning on different interfaces.
+- An **Endpoint Key** must contain at least one network address value: MAC, IP, or both. Facts without MAC or IP remain **Observation Facts** only.
+- **Identifiers** are source-independent ownership claims over MAC or permanent IP values, not claims over endpoint sources.
+- IP **Identifiers** are explicit operator claims; Wakey does not infer whether an IP is permanent, static, or reserved.
+- **Terminal Sessions** are not agent commands — resolved: command dispatch remains request/result, while terminals use dedicated streaming sockets.
+- **Terminal Relay** is ephemeral control-plane state — resolved: terminal bytes and scrollback are not stored or audited.
+- Terminal input, output, and terminal-generated control sequences are byte streams; only lifecycle and resize operations are structured terminal protocol messages.

Cargo.lock

@@ -97,6 +97,12 @@ version = "1.0.102"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "7f202df86484c868dbad7eaa557ef785d5c66295e41b460ef922eca0723b842c"
 
+[[package]]
+name = "arrayvec"
+version = "0.7.8"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "d3fb67a6e08acf24fdeccbac2cb6ac4305825bd1f117462e0e6f2f193345ad56"
+
 [[package]]
 name = "async-trait"
 version = "0.1.89"
@@ -233,12 +239,6 @@ version = "1.8.3"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "2af50177e190e07a26ab74f8b1efbfe2ef87da2116221318cb1c2e82baf7de06"
 
-[[package]]
-name = "bitflags"
-version = "1.3.2"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "bef38d45163c2f1dde094a7dfd33ccf595c92905c8f8f4fdc18d06fb1037718a"
-
 [[package]]
 name = "bitflags"
 version = "2.11.0"
@@ -475,24 +475,6 @@ version = "2.5.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "217698eaf96b4a3f0bc4f3662aaa55bdf913cd54d7204591faa790070c6d0853"
 
-[[package]]
-name = "crc32fast"
-version = "1.5.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9481c1c90cbf2ac953f07c8d4a58aa3945c425b7185c9154d67a65e4230da511"
-dependencies = [
- "cfg-if",
-]
-
-[[package]]
-name = "crossbeam-epoch"
-version = "0.9.18"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "5b82ac4a3c2ca9c3460964f020e1402edd5753411d7737aa39c3714ad1b5420e"
-dependencies = [
- "crossbeam-utils",
-]
-
 [[package]]
 name = "crossbeam-queue"
 version = "0.3.12"
@@ -514,10 +496,10 @@ version = "0.29.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "d8b9f2e4c67f833b660cdb0a3523065869fb35570177239812ed4c905aeff87b"
 dependencies = [
- "bitflags 2.11.0",
+ "bitflags",
  "crossterm_winapi",
  "document-features",
- "parking_lot 0.12.5",
+ "parking_lot",
  "rustix",
  "winapi",
 ]
@@ -747,16 +729,6 @@ dependencies = [
  "percent-encoding",
 ]
 
-[[package]]
-name = "fs2"
-version = "0.4.3"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9564fc758e15025b46aa6643b1b77d047d1a56a1aea6e01002ac0c7026876213"
-dependencies = [
- "libc",
- "winapi",
-]
-
 [[package]]
 name = "fs_extra"
 version = "1.3.0"
@@ -813,7 +785,7 @@ checksum = "1d930c203dd0b6ff06e0201a4a2fe9149b43c684fd4420555b26d21b1a02956f"
 dependencies = [
  "futures-core",
  "lock_api",
- "parking_lot 0.12.5",
+ "parking_lot",
 ]
 
 [[package]]
@@ -862,15 +834,6 @@ dependencies = [
  "slab",
 ]
 
-[[package]]
-name = "fxhash"
-version = "0.2.1"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "c31b6d751ae2c7f11320402d34e41349dd1016f8d5d45e48c4312bc8625af50c"
-dependencies = [
- "byteorder",
-]
-
 [[package]]
 name = "generic-array"
 version = "0.14.7"
@@ -1309,15 +1272,6 @@ dependencies = [
  "serde_core",
 ]
 
-[[package]]
-name = "instant"
-version = "0.1.13"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e0242819d153cba4b4b05a5a8f2a7e9bbf97b6055b2a002b395c96b5ff3c0222"
-dependencies = [
- "cfg-if",
-]
-
 [[package]]
 name = "ipnet"
 version = "2.12.0"
@@ -1470,7 +1424,7 @@ version = "0.1.16"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "e02f3bb43d335493c96bf3fd3a321600bf6bd07ed34bc64118e9293bdffea46c"
 dependencies = [
- "bitflags 2.11.0",
+ "bitflags",
  "libc",
  "plain",
  "redox_syscall 0.7.4",
@@ -1617,7 +1571,7 @@ version = "0.28.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "4ce3636fa715e988114552619582b530481fd5ef176a1e5c1bf024077c2c9445"
 dependencies = [
- "bitflags 2.11.0",
+ "bitflags",
  "libc",
  "log",
  "netlink-packet-core",
@@ -1656,7 +1610,7 @@ version = "0.30.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "74523f3a35e05aba87a1d978330aef40f67b0304ac79c1c00b294c9830543db6"
 dependencies = [
- "bitflags 2.11.0",
+ "bitflags",
  "cfg-if",
  "cfg_aliases",
  "libc",
@@ -1668,7 +1622,7 @@ version = "0.31.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "5d6d0705320c1e6ba1d912b5e37cf18071b6c2e9b7fa8215a1e8a7651966f5d3"
 dependencies = [
- "bitflags 2.11.0",
+ "bitflags",
  "cfg-if",
  "cfg_aliases",
  "libc",
@@ -1859,17 +1813,6 @@ version = "2.2.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "f38d5652c16fde515bb1ecef450ab0f6a219d619a7274976324d5e377f7dceba"
 
-[[package]]
-name = "parking_lot"
-version = "0.11.2"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "7d17b78036a60663b797adeaee46f5c9dfebb86948d1255007a1d6be0271ff99"
-dependencies = [
- "instant",
- "lock_api",
- "parking_lot_core 0.8.6",
-]
-
 [[package]]
 name = "parking_lot"
 version = "0.12.5"
@@ -1877,21 +1820,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "93857453250e3077bd71ff98b6a65ea6621a19bb0f559a85248955ac12c45a1a"
 dependencies = [
  "lock_api",
- "parking_lot_core 0.9.12",
+ "parking_lot_core",
-]
-
-[[package]]
-name = "parking_lot_core"
-version = "0.8.6"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "60a2cfe6f0ad2bfc16aefa463b497d5c7a5ecd44a23efa72aa342d90177356dc"
-dependencies = [
- "cfg-if",
- "instant",
- "libc",
- "redox_syscall 0.2.16",
- "smallvec",
- "winapi",
 ]
 
 [[package]]
@@ -2053,6 +1982,16 @@ dependencies = [
  "syn",
 ]
 
+[[package]]
+name = "pty-process"
+version = "0.5.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "71cec9e2670207c5ebb9e477763c74436af3b9091dd550b9fb3c1bec7f3ea266"
+dependencies = [
+ "rustix",
+ "tokio",
+]
+
 [[package]]
 name = "quinn"
 version = "0.11.9"
@@ -2189,22 +2128,13 @@ dependencies = [
  "getrandom 0.3.4",
 ]
 
-[[package]]
-name = "redox_syscall"
-version = "0.2.16"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "fb5a58c1855b4b6819d59012155603f0b22ad30cad752600aadfcb695265519a"
-dependencies = [
- "bitflags 1.3.2",
-]
-
 [[package]]
 name = "redox_syscall"
 version = "0.5.18"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "ed2bf2547551a7053d6fdfafda3f938979645c44812fbfcda098faae3f1a362d"
 dependencies = [
- "bitflags 2.11.0",
+ "bitflags",
 ]
 
 [[package]]
@@ -2213,7 +2143,7 @@ version = "0.7.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "f450ad9c3b1da563fb6948a8e0fb0fb9269711c9c73d9ea1de5058c79c8d643a"
 dependencies = [
- "bitflags 2.11.0",
+ "bitflags",
 ]
 
 [[package]]
@@ -2394,7 +2324,7 @@ version = "1.1.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "b6fe4565b9518b83ef4f91bb47ce29620ca828bd32cb7e408f0062e9930ba190"
 dependencies = [
- "bitflags 2.11.0",
+ "bitflags",
  "errno",
  "libc",
  "linux-raw-sys",
@@ -2557,7 +2487,7 @@ version = "3.7.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "b7f4bc775c73d9a02cde8bf7b2ec4c9d12743edf609006c7facc23998404cd1d"
 dependencies = [
- "bitflags 2.11.0",
+ "bitflags",
  "core-foundation",
  "core-foundation-sys",
  "libc",
@@ -2696,7 +2626,7 @@ dependencies = [
  "futures-util",
  "log",
  "once_cell",
- "parking_lot 0.12.5",
+ "parking_lot",
  "scc",
  "serial_test_derive",
 ]
@@ -2775,22 +2705,6 @@ version = "0.4.12"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "0c790de23124f9ab44544d7ac05d60440adc586479ce501c1d6d7da3cd8c9cf5"
 
-[[package]]
-name = "sled"
-version = "0.34.7"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "7f96b4737c2ce5987354855aed3797279def4ebf734436c6aa4552cf8e169935"
-dependencies = [
- "crc32fast",
- "crossbeam-epoch",
- "crossbeam-utils",
- "fs2",
- "fxhash",
- "libc",
- "log",
- "parking_lot 0.11.2",
-]
-
 [[package]]
 name = "smallvec"
 version = "1.15.1"
@@ -2923,7 +2837,7 @@ checksum = "aa003f0038df784eb8fecbbac13affe3da23b45194bd57dba231c8f48199c526"
 dependencies = [
  "atoi",
  "base64",
- "bitflags 2.11.0",
+ "bitflags",
  "byteorder",
  "bytes",
  "crc",
@@ -2966,7 +2880,7 @@ checksum = "db58fcd5a53cf07c184b154801ff91347e4c30d17a3562a635ff028ad5deda46"
 dependencies = [
  "atoi",
  "base64",
- "bitflags 2.11.0",
+ "bitflags",
  "byteorder",
  "crc",
  "dotenvy",
@@ -3399,7 +3313,7 @@ version = "0.6.8"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "d4e6559d53cc268e5031cd8429d05415bc4cb4aefc4aa5d6cc35fbf5b924a1f8"
 dependencies = [
- "bitflags 2.11.0",
+ "bitflags",
  "bytes",
  "futures-core",
  "futures-util",
@@ -3677,7 +3591,6 @@ checksum = "5ac8b6f42ead25368cf5b098aeb3dc8a1a2c05a3eee8a9a1a68c640edbfc79d9"
 dependencies = [
  "getrandom 0.4.2",
  "js-sys",
- "serde_core",
  "wasm-bindgen",
 ]
 
@@ -3699,9 +3612,19 @@ version = "0.9.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "0b928f33d975fc6ad9f86c8f283853ad26bdd5b10b7f1542aa2fa15e2289105a"
 
+[[package]]
+name = "vte"
+version = "0.15.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a5924018406ce0063cd67f8e008104968b74b563ee1b85dde3ed1f7cb87d3dbd"
+dependencies = [
+ "arrayvec",
+ "memchr",
+]
+
 [[package]]
 name = "wakey"
-version = "0.2.3"
+version = "0.3.2"
 dependencies = [
  "anyhow",
  "chrono",
@@ -3722,7 +3645,7 @@ dependencies = [
 
 [[package]]
 name = "wakey-agent"
-version = "0.2.3"
+version = "0.3.2"
 dependencies = [
  "anyhow",
  "clap",
@@ -3742,16 +3665,18 @@ dependencies = [
  "url",
  "wakey",
  "wakey-core",
+ "wakey-vt100",
 ]
 
 [[package]]
 name = "wakey-control-plane"
-version = "0.2.3"
+version = "0.3.2"
 dependencies = [
  "anyhow",
  "axum",
  "clap",
  "futures-util",
+ "macaddr",
  "nix 0.31.2",
  "opentelemetry",
  "opentelemetry-otlp",
@@ -3759,7 +3684,6 @@ dependencies = [
  "reqwest 0.13.2",
  "serde",
  "serde_json",
- "sled",
  "sqlx",
  "time",
  "tokio",
@@ -3770,14 +3694,16 @@ dependencies = [
  "tracing-subscriber",
  "uuid",
  "wakey-agent",
+ "wakey-core",
 ]
 
 [[package]]
 name = "wakey-core"
-version = "0.2.3"
+version = "0.3.2"
 dependencies = [
  "macaddr",
  "serde",
+ "serde_json",
  "serde_with",
  "strum",
  "thiserror 2.0.18",
@@ -3785,12 +3711,14 @@ dependencies = [
 
 [[package]]
 name = "wakey-linux"
-version = "0.2.3"
+version = "0.3.2"
 dependencies = [
  "anyhow",
  "futures",
  "lda-ipjs",
  "macaddr",
+ "nix 0.31.2",
+ "pty-process",
  "serde",
  "serde_json",
  "serial_test",
@@ -3798,6 +3726,15 @@ dependencies = [
  "wakey-core",
 ]
 
+[[package]]
+name = "wakey-vt100"
+version = "0.16.2-wakey.1"
+dependencies = [
+ "itoa",
+ "unicode-width",
+ "vte",
+]
+
 [[package]]
 name = "walkdir"
 version = "2.5.0"
@@ -3930,7 +3867,7 @@ version = "0.244.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "47b807c72e1bac69382b3a6fb3dbe8ea4c0ed87ff5629b8685ae6b9a611028fe"
 dependencies = [
- "bitflags 2.11.0",
+ "bitflags",
  "hashbrown 0.15.5",
  "indexmap 2.14.0",
  "semver",
@@ -4435,7 +4372,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "9d66ea20e9553b30172b5e831994e35fbde2d165325bec84fc43dbf6f4eb9cb2"
 dependencies = [
  "anyhow",
- "bitflags 2.11.0",
+ "bitflags",
  "indexmap 2.14.0",
  "log",
  "serde",

Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "wakey"
-version = "0.2.3"
+version = "0.3.2"
 edition = "2024"
 publish = ["gitea"]
 
@@ -31,6 +31,23 @@ strip = true
 
 [workspace]
 members = ["ipjs", "wakey-agent", "wakey-control-plane", "wakey-core", "wakey-linux"]
+exclude = ["vendor/vt100"]
+
+[workspace.dependencies]
+anyhow = "1"
+macaddr = { version = "1", features = ["serde", "serde_std"] }
+serde = { version = "1", features = ["derive"] }
+serde_json = "1"
+tokio = { version = "1", features = [
+    "fs",
+    "process",
+    "rt-multi-thread",
+    "io-util",
+    "macros",
+    "time",
+] }
+tracing = "0.1"
+uuid = { version = "1", features = ["v4"] }
 
 [dependencies.lda-ipjs]
 path = "ipjs"

README.md

@@ -146,7 +146,7 @@ Relative paths in config are resolved under `data_dir`.
 Legacy sled state can be imported explicitly:
 
 ```sh
-wakey-control-plane import-sled-state --from-sled-state /var/lib/wakey-control-plane/state.db --to-state-file /var/lib/wakey-control-plane/state.sqlite3
+wakey-control-plane migrate-sqlite-state --from /var/lib/wakey-control-plane/legacy.sqlite3 --to /var/lib/wakey-control-plane/state.sqlite3
 ```
 
 Enroll tokens are now expiring and revocable. Issuance returns `expires_at_unix`.

deploy/control-plane.Caddyfile

@@ -1,7 +1,7 @@
 # Caddy template for wakey-control-plane with Cloudflare Access.
 #
 # Security model:
-# - Public endpoints for agents: /healthz, /api/v1/agents/enroll, /api/v1/agent/ws
+# - Public endpoints for agents: health, enrollment, control WS, and scoped terminal relay WS
 # - Private admin surface: /ui/* and /api/v1/control/* (requires CF Access headers)
 #
 # Replace cp.example.com with your public control-plane domain.
@@ -10,7 +10,7 @@ wakey.ldlda.com {
     encode zstd gzip
 
     # Public agent-facing endpoints.
-    @public path /healthz /api/v1/agents/enroll /api/v1/agent/ws
+    @public path /healthz /api/v1/agents/enroll /api/v1/agent/ws /api/v1/agent/terminals/*
     handle @public {
         reverse_proxy 127.0.0.1:6767
     }

docs/adr/0001-core-endpoints-and-wake-routes.md

@@ -0,0 +1,149 @@
+# Core Endpoints and Wake Routes
+
+Wakey will model observed network contact points as **Endpoints** in `wakey-core`, and derive **Wake Routes** from those endpoints instead of reconstructing routes from flattened device summary MAC/IP arrays. `Device.ips` and `Device.macs` remain true summary fields for operator display and compatibility, but endpoint data is authoritative for wake, freshness, source, per-IP state, and route selection.
+
+**Status**: accepted
+
+## Context
+
+The previous model stored a `Device` aggregate with summary `macs`, `ips`, `presence`, and raw observation facts. The control plane then built fleet wake routes from combinations like first MAC plus first IP. That lost source, presence, interface, and MAC/IP-pair evidence, especially when hook memory contained removed IPs or when several sources described the same address differently.
+
+## Decision
+
+Add a typed `DeviceEndpoint` concept in `wakey-core`. A device snapshot sent by an agent contains devices with endpoints already attached. The control plane stores structured endpoint rows and derives fleet summaries and wake routes from those rows.
+
+Endpoint shape:
+
+```rust
+DeviceEndpoint {
+    key: EndpointKey,
+    hostname: Option<String>,
+    interface: Option<String>,
+    presence: Presence,
+    first_seen_unix: Option<u64>,
+    last_seen_unix: Option<u64>,
+}
+
+EndpointKey {
+    source: EndpointSource,
+    mac: Option<MacAddr>,
+    ip: Option<IpAddr>,
+}
+
+AgentEndpointKey {
+    agent_id: String,
+    endpoint: EndpointKey,
+}
+```
+
+`EndpointKey` must contain at least one of MAC or IP. Hostname and interface are endpoint evidence/metadata, not identity. `AgentEndpointKey` may use `serde(flatten)` for wire shape, but hash values are never durable storage keys. String keys are boundary serialization only.
+
+## Source and Presence Rules
+
+Endpoint sources are typed domain variants, not free strings:
+
+```text
+Neighbor
+DhcpLease
+HookNeighbor
+HookDhcp
+```
+
+Presence answers “is this reachable?”, not “can this be woken?” The presence order is:
+
+```text
+Unknown < Offline < LikelyOnline < Online
+```
+
+Source mapping:
+
+```text
+Neighbor reachable/permanent -> Online
+Neighbor stale -> LikelyOnline
+Neighbor failed/remove-like evidence -> Offline
+Other neighbor states -> Unknown
+
+Current DHCP lease -> Unknown
+Hook DHCP add/update/remove -> Unknown
+Hook neighbor add/update/old -> LikelyOnline
+Hook neighbor remove -> Offline
+```
+
+Current DHCP leases are summary-eligible and may support wake if they include a MAC, but they do not prove reachability. Hook memory creates endpoints and observation facts, but does not directly inflate summary IPs.
+
+## Summary, Presence, and UI
+
+`Device.ips` and `Device.macs` stay as summaries. Summary IPs come from concrete live-ish sources such as current neighbor rows and current DHCP lease rows. Hook-derived and offline IPs remain visible through endpoints but are collapsed out of primary UI summaries by default.
+
+`Device.presence` is derived from all endpoints, not only summary-eligible endpoints. This lets concrete offline evidence matter while allowing stronger live evidence to override it.
+
+The main fleet API embeds endpoints inside each fleet device. API responses expose all endpoints, including offline and unknown endpoints. The UI may collapse offline/unknown endpoints in the primary row, but details must expose them for copy/debug/history.
+
+## Wakeability and Wake Route Ordering
+
+Wakeability is derived, not stored on `DeviceEndpoint`.
+
+An endpoint is wakeable when:
+
+```text
+endpoint has a MAC
+agent is connected
+agent has wake capability
+endpoint source is allowed for wake route derivation
+```
+
+For now, a connected wakey-agent is assumed to have wake capability. Presence does not gate wakeability: an `Offline` endpoint may still produce a wake route, because waking powered-off devices is the core use case.
+
+Preferred wake route order:
+
+```text
+connected agent
+wakeable route
+has IP
+presence quality
+newest last_seen
+source quality
+```
+
+Presence quality for route ranking follows:
+
+```text
+Online > LikelyOnline > Offline > Unknown
+```
+
+Source quality follows:
+
+```text
+Neighbor > DhcpLease > HookNeighbor > HookDhcp
+```
+
+Equivalent wake routes may ignore endpoint source when they target the same agent, MAC, and IP. Endpoint evidence preserves source-specific rows; route grouping may deduplicate equivalent targets.
+
+## Device and Identity Rules
+
+`DeviceId` remains the typed observed identity enum:
+
+```rust
+DeviceId::Mac(MacAddr)
+DeviceId::Ip(IpAddr)
+```
+
+`DeviceId` is derived from endpoints: canonical MAC if any endpoint has a MAC, otherwise canonical IP, otherwise absent. Local source rows are grouped into devices by endpoint-derived `DeviceId`, not exact `EndpointKey`.
+
+Within a single complete local snapshot, a MAC+IP endpoint may absorb an IP-only endpoint with the same IP. This merge is not remembered across snapshots unless the operator creates a known-device identifier.
+
+Known-device identifiers are source-independent ownership claims over MAC or permanent IP values. Wakey does not infer whether an IP is permanent, static, or reserved; the UI should warn the operator when attaching an IP identifier.
+
+## Control Plane Storage
+
+The control plane stores current per-agent endpoint snapshots as structured columns, not opaque `Device` JSON and not endpoint event history. Summary MAC/IP collections are derived from endpoints; separate MAC/IP storage should be removed or represented as views rather than maintained as independent truth.
+
+Agent-local hook memory is retained by local last-seen age policy, not by control-plane acknowledgement. The default retention is 7 days unless configured otherwise. Live-source endpoints use snapshot time as their observed time; hook-derived endpoints use the hook row's recorded last-seen time.
+
+## Consequences
+
+- Wake route construction moves away from `macs.first()` / `ips.first()` guessing.
+- The agent/core layer owns source interpretation because it still has local context.
+- The control plane can search, filter, match known identifiers, and rank wake routes from structured endpoint rows.
+- UI can show clean summaries while keeping complete endpoint evidence in details.
+- This preserves “wake an offline machine by MAC” without pretending that offline means not wakeable.

docs/adr/0002-remote-terminal-sessions.md

@@ -0,0 +1,147 @@
+# Remote Terminal Sessions
+
+Wakey will provide opt-in remote terminal access by pairing a browser terminal WebSocket with a dedicated outbound agent terminal WebSocket. The existing agent WebSocket remains the control channel and does not carry terminal byte streams.
+
+**Status**: accepted
+
+## Context
+
+The control plane already maintains an authenticated outbound WebSocket from each connected agent. Its command protocol is intentionally request/result shaped: the control plane sends one command, the agent executes it, and one result completes the pending request.
+
+An interactive terminal has different semantics. It is long-lived, bidirectional, byte-oriented, and must handle window resizing, process exit, disconnect cleanup, and backpressure. Treating it as an ordinary command would either block the agent session loop or turn the main agent WebSocket into a general stream multiplexer. It would also allow terminal output to compete with heartbeats, snapshots, and wake commands.
+
+Agents commonly run behind NAT and must not expose an inbound listener. Terminal connections therefore remain agent-initiated and outbound.
+
+## Decision
+
+Use one dedicated agent WebSocket and one dedicated operator WebSocket for each terminal session. The control plane holds an in-memory terminal relay that pairs those sockets.
+
+Session establishment follows this sequence:
+
+1. An authenticated operator requests a terminal for a connected, terminal-capable agent.
+2. The control plane creates an ephemeral terminal ID plus short-lived, single-use attachment credentials.
+3. The control plane sends an open-terminal control message over the existing authenticated agent WebSocket.
+4. The agent opens a new outbound terminal WebSocket to the control plane and authenticates it for that terminal ID.
+5. The browser opens the corresponding protected operator terminal WebSocket.
+6. The control plane pairs the sockets and relays terminal frames while an operator is attached.
+
+The main agent WebSocket carries terminal creation and cancellation control only. It does not carry PTY input or output.
+
+## PTY Ownership
+
+The agent owns the PTY, shell process, process group, and all process cleanup. The control plane never spawns or emulates a shell.
+
+Use `pty-process` with its async feature as the initial PTY abstraction because it provides:
+
+- Tokio `AsyncRead` and `AsyncWrite` integration;
+- owned read and write halves for concurrent tasks;
+- terminal resizing;
+- child session-leader and controlling-terminal setup; and
+- a small implementation built on `rustix`.
+
+The PTY wrapper is cross-compiled for `armv7-unknown-linux-musleabihf` and its input, output, resize, and exit test has passed on the target router. That focused test remains part of the remote compatibility workflow. Wakey does not call `forkpty` or add its own unsafe PTY implementation.
+
+The executable, working directory, environment, UID, and GID are agent-controlled configuration. The browser cannot supply an arbitrary executable or process environment.
+
+## Wire Protocol
+
+WebSocket frame type separates terminal data from terminal control:
+
+- Binary frames carry raw PTY input and output bytes.
+- Text JSON frames carry lifecycle, error, and resize messages.
+
+The terminal control vocabulary is deliberately small:
+
+```text
+operator -> agent: resize, close
+control plane -> agent: snapshot
+agent -> operator: ready, exited, error
+```
+
+Initial terminal dimensions are part of session attachment. Resize carries rows and columns; pixel dimensions may be added later if a demonstrated program requires them.
+
+Terminal behavior such as Ctrl-C, Ctrl-Z, Ctrl-D, cursor keys, mouse reporting, bracketed paste, colors, and terminal-title changes remains in the byte stream. The control plane does not parse ANSI escape sequences. The browser terminal emulator renders output and owns connected-session scrollback. The agent also feeds PTY output into a `vt100` parser so it can reconstruct the current visible screen and terminal input modes after detachment. Agent PTYs advertise `TERM=xterm-256color` and `COLORTERM=truecolor` because xterm.js is the actual frontend; applications may therefore negotiate xterm mouse reporting without a Wakey-specific mouse protocol.
+
+WebSockets already provide ordered, reliable delivery, so terminal frames do not carry sequence numbers in the initial protocol.
+
+## Lifecycle and Cleanup
+
+Terminal sessions allow only one attached operator. Their lifetime belongs to the agent process, not to a browser route or a particular control-plane connection.
+
+When the operator socket disconnects, the session becomes detached. Navigation, browser closure, and network loss do not terminate the PTY. A protected operator request may discover the live session and obtain a fresh, single-use attachment credential. The control plane does not retain terminal output.
+
+The operator UI lists live sessions as tabs and stores only the active terminal ID in browser-tab-scoped `sessionStorage`. On reload it prefers that ID and briefly waits for the previous WebSocket to detach before requesting a fresh attachment credential. The stored ID is a navigation hint, not an ownership credential; another attached operator still locks the session at the control plane.
+
+After operator attachment, the control plane sends a `snapshot` request. The agent serializes up to 5,000 retained physical rows followed by its parsed current screen and input modes as terminal escape bytes, sends them before subsequent live output, and then signals the PTY's current foreground process group with `SIGWINCH`. Historical rows retain their terminal attributes and are replayed as ordinary terminal output so xterm builds its native scrollback; the final formatted state restores the exact live screen. The signal lets full-screen applications redraw without assuming that the original shell remains in the foreground. Signal failure is logged but never terminates the session.
+
+Wakey carries a small, read-only extension to `vt100` because its public API exposes only the active grid. A snapshot streams bounded history from the primary grid, redraws that grid with its saved cursor and attributes, and then reconstructs the alternate grid when a full-screen application is active. The parser is never resized or switched while taking a snapshot. Consequently, reconnecting during `btop` restores the application while preserving the hidden shell history and state that reappear when it exits.
+
+The agent keeps its terminal manager outside the control-WebSocket reconnect loop. If a dedicated terminal relay disconnects, the PTY continues draining output into the agent-owned terminal parser while waiting for replacement relay credentials. On every authenticated control connection, the agent reports its in-memory live terminal IDs and creation times. The control plane reconciles that inventory, adopts sessions missing from its volatile registry, and issues fresh relay credentials. This allows sessions to survive control-plane restart without persisting terminal state in SQLite.
+
+Closing a session must terminate the entire PTY process group, not only the shell process. Cleanup should send a hangup first, then escalate to termination and forced kill after bounded grace periods. Explicit operator close, absolute session timeout, agent process exit, and machine reboot close the session.
+
+An agent process restart or machine reboot still ends every terminal session because PTY file descriptors cannot be recovered by a new process. Surviving that boundary would require an external session host such as `tmux` or a separate terminal daemon and is not part of this design.
+
+The agent reports a normal exit status or terminating signal when available. The UI must distinguish an exited shell from a transport failure.
+
+## Backpressure and Resource Limits
+
+Terminal transport must not use unbounded queues.
+
+Every queue between PTY, agent socket, control-plane relay, and browser socket is bounded. The agent keeps draining and parsing the PTY while detached so a noisy child cannot stall the agent. Parsed state is bounded by the configured terminal dimensions and a 5,000-row scrollback limit. The control plane retains only a bounded queue of operator controls while an agent relay is reconnecting.
+
+When input/control and output are ready simultaneously, relay loops prioritize input and control. This keeps interrupt, resize, close, and snapshot traffic responsive while commands produce sustained output.
+
+The implementation also enforces:
+
+- maximum terminal frame size;
+- per-agent concurrent-session limits;
+- idle and absolute session timeouts;
+- bounded parsed terminal state;
+- bounded control-plane relay buffers; and
+- cleanup when any relay task exits unexpectedly.
+
+Exact limits are configuration and may be tuned from router testing. The bounded behavior is an architectural requirement.
+
+## Security and Audit
+
+Remote terminal access is root-equivalent on agents that run as root. It is therefore an explicit agent capability and is disabled by default.
+
+Operator terminal endpoints belong to the protected control API surface. Session identifiers are not credentials. Agent and operator attachment credentials are short-lived, scoped to one terminal session, and single-use. The operator WebSocket must enforce the same-origin/protected-control assumptions used when the session was created.
+
+Audit records include terminal request, open, ready, disconnect, close, timeout, and exit metadata. Wakey never stores or audits terminal input, terminal output, command history, or scrollback.
+
+Terminal capability and session state are separate from device inventory, known-device identity, wake routes, and the debug Command Runner.
+
+## Deferred Work
+
+Persistence across agent restart or machine reboot is not supported. A later design would need an external process owner, reconnectable local IPC, and explicit secret handling; persisted metadata alone cannot recover a PTY.
+
+File transfer, multi-operator attachment, terminal recording, shell-history storage, and arbitrary process launch are also deferred.
+
+## Alternatives Considered
+
+### Multiplex terminal bytes over the main agent WebSocket
+
+Rejected for the initial version. It requires refactoring the current request/result session into a general concurrent writer and stream router, adds head-of-line coupling with fleet traffic, and requires terminal-byte framing within a shared connection.
+
+### Model a terminal as a long-running agent command
+
+Rejected. Commands have one result and a timeout; terminals have continuous bidirectional traffic and independent lifecycle.
+
+### Accept an inbound connection on the agent
+
+Rejected. Agents run behind NAT and should not expose a new network service.
+
+### Use `portable-pty`
+
+Viable, but not selected initially. Its cross-platform abstraction is broader than the Linux agent requires and its reader/writer API would need blocking-task bridges. It remains a fallback if `pty-process` does not build or behave correctly on the target router.
+
+## Consequences
+
+- Each active terminal consumes two additional WebSockets and one PTY process on the agent.
+- Terminal traffic cannot delay main agent heartbeat, snapshot, or command messages.
+- Control-plane terminal state remains ephemeral; agents rebuild it from their in-memory live-session inventory after a control-plane restart.
+- The agent session protocol gains terminal-open control and capability advertisement but does not become a terminal-data multiplexer.
+- Browser and agent terminal transports can be tested independently before adding xterm.js.
+- Browser navigation and control-plane restart do not terminate an agent-owned PTY.

remote/.gitignore

@@ -1,3 +1,4 @@
 *
 !.gitignore
 !copy.ps1
+!wslfix.sh

remote/copy.ps1

@@ -7,6 +7,8 @@ param(
 
 $PASSWD = Get-DefaultPassword $PASSWD
 
+Write-Output $PSScriptRoot
+
 # idk what this does it works like that then thats how it is
 pscp.exe -l root -scp -pw $PASSWD -r 192.168.100.1:/etc/ldlda_help $PSScriptRoot
 pscp.exe -l root -scp -pw $PASSWD  192.168.100.1:/etc/rc.local $PSScriptRoot
@@ -23,5 +25,15 @@ New-Item -ItemType Directory -Force -Path $initDir | Out-Null
 $files = "update_wakey" , "wakey" , "update_tailscale" , "wireguard_setup", "lda-override"
 $remote = $files.ForEach({ "/etc/init.d/$_" })
 $remote | ForEach-Object {
-    pscp.exe -l root -scp -pw $PASSWD "192.168.100.1:$_" "$initDir\"
+    pscp.exe -l root -scp -pw $PASSWD "192.168.100.1:$_" "$initDir/"
+}
+
+$hotplugDir = Join-Path $PSScriptRoot 'hotplug.d'
+New-Item -ItemType Directory -Force -Path $hotplugDir | Out-Null
+
+$files = "dhcp/95-wakey", "neigh/95-wakey"
+
+$files | ForEach-Object {
+    New-Item -ItemType Directory -Force -Path (Split-Path "$hotplugDir/$_")
+    pscp.exe -l root -scp -pw $PASSWD "192.168.100.1:/etc/hotplug.d/$_" "$hotplugDir/$_"
 }

remote/wslfix.sh

@@ -0,0 +1,7 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+# sometimes it breaks, run to fix
+
+sudo sh -c 'echo :WSLInterop:M::MZ::/init:PF > /usr/lib/binfmt.d/WSLInterop.conf'
+sudo systemctl restart systemd-binfmt

scripts/hotplug/openwrt/dhcp/95-wakey

@@ -6,12 +6,27 @@ BIN="/root/.bin/wakey-agent"
 [ -n "$ACTION" ] || exit 0
 [ -n "$MACADDR" ] || exit 0
 
-if [ -n "$IPADDR" ] && [ -n "$HOSTNAME" ]; then
+run_wakey_agent() {
-    "$BIN" observe dhcp --action "$ACTION" --mac "$MACADDR" --ip "$IPADDR" --hostname "$HOSTNAME" >/dev/null 2>&1 || true
+    if [ -n "$WAKEY_AGENT_CONFIG" ]; then
-elif [ -n "$IPADDR" ]; then
+        set -- --config "$WAKEY_AGENT_CONFIG" "$@"
-    "$BIN" observe dhcp --action "$ACTION" --mac "$MACADDR" --ip "$IPADDR" >/dev/null 2>&1 || true
+    fi
-elif [ -n "$HOSTNAME" ]; then
+    if [ "$WAKEY_HOTPLUG_VERBOSE" = "1" ]; then
-    "$BIN" observe dhcp --action "$ACTION" --mac "$MACADDR" --hostname "$HOSTNAME" >/dev/null 2>&1 || true
+        set -- -v "$@"
-else
+    fi
-    "$BIN" observe dhcp --action "$ACTION" --mac "$MACADDR" >/dev/null 2>&1 || true
+    # [ "$WAKEY_HOTPLUG_LOG" = "1" ] &&
+    if  command -v logger >/dev/null 2>&1; then
+        "$BIN" "$@" 2>&1 | logger -t wakey-hotplug
+    else
+        "$BIN" "$@" >/dev/null 2>&1
+    fi
+}
+
+if [ -n "$IPADDR" ] && [ -n "$HOSTNAME" ]; then
+    run_wakey_agent observe dhcp --action "$ACTION" --mac "$MACADDR" --ip "$IPADDR" --hostname "$HOSTNAME" || true
+elif [ -n "$IPADDR" ]; then
+    run_wakey_agent observe dhcp --action "$ACTION" --mac "$MACADDR" --ip "$IPADDR" || true
+elif [ -n "$HOSTNAME" ]; then
+    run_wakey_agent observe dhcp --action "$ACTION" --mac "$MACADDR" --hostname "$HOSTNAME" || true
+else
+    run_wakey_agent observe dhcp --action "$ACTION" --mac "$MACADDR" || true
 fi

scripts/hotplug/openwrt/neigh/95-wakey

@@ -5,12 +5,27 @@ BIN="/root/.bin/wakey-agent"
 [ -n "$BIN" ] || exit 0
 [ -n "$ACTION" ] || exit 0
 
-if [ -n "$MACADDR" ] && [ -n "$IPADDR" ]; then
+run_wakey_agent() {
-    "$BIN" observe neigh --action "$ACTION" --mac "$MACADDR" --ip "$IPADDR" >/dev/null 2>&1 || true
+    if [ -n "$WAKEY_AGENT_CONFIG" ]; then
-elif [ -n "$MACADDR" ]; then
+        set -- --config "$WAKEY_AGENT_CONFIG" "$@"
-    "$BIN" observe neigh --action "$ACTION" --mac "$MACADDR" >/dev/null 2>&1 || true
+    fi
-elif [ -n "$IPADDR" ]; then
+    if [ "$WAKEY_HOTPLUG_VERBOSE" = "1" ]; then
-    "$BIN" observe neigh --action "$ACTION" --ip "$IPADDR" >/dev/null 2>&1 || true
+        set -- -v "$@"
-else
+    fi
-    "$BIN" observe neigh --action "$ACTION" >/dev/null 2>&1 || true
+    # [ "$WAKEY_HOTPLUG_LOG" = "1" ] &&
+    if command -v logger >/dev/null 2>&1; then
+        "$BIN" "$@" 2>&1 | logger -t wakey-hotplug
+    else
+        "$BIN" "$@" >/dev/null 2>&1
+    fi
+}
+
+if [ -n "$MACADDR" ] && [ -n "$IPADDR" ]; then
+    run_wakey_agent observe neigh --action "$ACTION" --mac "$MACADDR" --ip "$IPADDR" || true
+elif [ -n "$MACADDR" ]; then
+    run_wakey_agent observe neigh --action "$ACTION" --mac "$MACADDR" || true
+elif [ -n "$IPADDR" ]; then
+    run_wakey_agent observe neigh --action "$ACTION" --ip "$IPADDR" || true
+else
+    run_wakey_agent observe neigh --action "$ACTION" || true
 fi

scripts/init/openwrt/wakey

@@ -12,7 +12,7 @@ start_service() {
     procd_open_instance
     procd_set_param command "$BIN" serve --config "$CONFIG"
     procd_set_param file "$CONFIG"
-    procd_set_param env RUST_LOG=wakey_agent=debug,wakey=debug
+    # procd_set_param env RUST_LOG=wakey_agent=debug,wakey=debug
     procd_set_param respawn 5 1 0
     procd_set_param stdout 1
     procd_set_param stderr 1

scripts/publish.ps1

@@ -54,17 +54,21 @@ if ($Publish) {
         Write-Host 'No -Registry provided; defaulting publish target to registry: gitea'
     }
 
-    $publishOrder = @(
+    # Patched external crates are excluded from the workspace, so publish
-        'lda-ipjs',
+    # them by manifest path before workspace packages that depend on them.
-        'wakey-core',
+    $publishTargets = @(
-        'wakey-linux',
+        @{ Name = 'wakey-vt100'; Args = @('publish', '--manifest-path', 'vendor/vt100/Cargo.toml') },
-        'wakey',
+        @{ Name = 'lda-ipjs'; Args = @('publish', '-p', 'lda-ipjs') },
-        'wakey-agent',
+        @{ Name = 'wakey-core'; Args = @('publish', '-p', 'wakey-core') },
-        'wakey-control-plane'
+        @{ Name = 'wakey-linux'; Args = @('publish', '-p', 'wakey-linux') },
+        @{ Name = 'wakey'; Args = @('publish', '-p', 'wakey') },
+        @{ Name = 'wakey-agent'; Args = @('publish', '-p', 'wakey-agent') },
+        @{ Name = 'wakey-control-plane'; Args = @('publish', '-p', 'wakey-control-plane') }
     )
 
-    foreach ($pkg in $publishOrder) {
+    foreach ($target in $publishTargets) {
-        $pubArgs = @('publish', '-p', $pkg)
+        $pkg = $target.Name
+        $pubArgs = @($target.Args)
         if ($Registry) { $pubArgs += @('--registry', $Registry) }
 
         Write-Host ("publishing {0}..." -f $pkg)

scripts/update_wakey_cc_from_repo.sh

@@ -4,21 +4,30 @@
 # then packaging the same bundle format and installing it.
 #
 # Simplest use:
-#   sudo -E ./scripts/update_wakey_cc_from_repo.sh
+#   ./scripts/update_wakey_cc_from_repo.sh
 #
 # Env options:
+#   WAKEY_CC_REPO_DIR    Existing checkout to update/build instead of cloning
 #   WAKEY_CC_REPO_URL    Git URL (default: https://git.ldlda.com/lda/wakey.git)
 #   WAKEY_CC_REF         Git ref/branch/tag (default: main)
 #   WAKEY_CC_TARGET      Rust target triple (default from uname)
 #   WAKEY_CC_ROOT        Install root (default: current directory)
 #   WAKEY_CC_SERVICE     systemd unit name (default: wakey-cc.service)
+#   WAKEY_CC_USER        Owner for installed files/temp dirs (default: current user)
 #   WAKEY_CC_VERSION     Bundle version label (default: v0.0.0-local-<short_sha>)
 #   WAKEY_CC_NO_RESTART  If set, skip systemd restart
 #   WAKEY_CC_KEEP_TMP    If set, keep temp checkout/build dir for debugging
-#   SUDO                 Privilege escalation command/path (default: sudo when needed)
+#   SUDO                 Privilege escalation command/path for install steps (default: sudo)
 #
 # Requires: git, cargo, tar, pnpm, systemctl (optional for restart)
 
+# Common existing-checkout use:
+: <<'USE CASE'
+WAKEY_CC_REPO_DIR="$HOME/dev/wakey" \
+WAKEY_CC_USER=lda \
+WAKEY_CC_KEEP_TMP=1 \
+scripts/update_wakey_cc_from_repo.sh
+USE CASE
 set -eu
 
 log() { printf '[update_wakey_cc_from_repo] %s\n' "$*"; }
@@ -79,6 +88,28 @@ restore_label() {
     fi
 }
 
+chown_if_requested() {
+    [ -n "${OWNER:-}" ] || return 0
+    priv chown -R "$OWNER:$OWNER" "$@"
+}
+
+chmod_user_rw_if_requested() {
+    [ -n "${OWNER:-}" ] || return 0
+    priv chmod -R u+rwX "$@"
+}
+
+update_existing_repo() {
+    repo_dir=$1
+    ref=$2
+
+    [ -d "$repo_dir/.git" ] || fail "WAKEY_CC_REPO_DIR is not a git checkout: $repo_dir"
+
+    log "using existing checkout $repo_dir (ref: $ref)"
+    git -C "$repo_dir" fetch --prune origin "$ref" || fail 'git fetch failed'
+    git -C "$repo_dir" checkout "$ref" || fail "git checkout failed: $ref"
+    git -C "$repo_dir" pull --ff-only origin "$ref" || fail 'git pull --ff-only failed'
+}
+
 install_executable_force() {
     src=$1
     dst=$2
@@ -90,6 +121,7 @@ install_executable_force() {
     priv rm -f "$tmp"
     priv cp -f "$src" "$tmp"
     priv chmod 0755 "$tmp"
+    chown_if_requested "$tmp"
     if [ -e "$dst" ]; then
         priv mv -f "$dst" "$old" || true
     fi
@@ -99,13 +131,25 @@ install_executable_force() {
 }
 
 main() {
+    REPO_DIR="${WAKEY_CC_REPO_DIR:-}"
     REPO_URL="${WAKEY_CC_REPO_URL:-https://git.ldlda.com/lda/wakey.git}"
     REF="${WAKEY_CC_REF:-main}"
     TARGET="${WAKEY_CC_TARGET:-$(default_target)}"
     ROOT="${WAKEY_CC_ROOT:-$PWD}"
     SERVICE="${WAKEY_CC_SERVICE:-wakey-cc.service}"
+    if [ -n "${WAKEY_CC_USER:-}" ]; then
+        OWNER="$WAKEY_CC_USER"
+    elif [ "$(id -u)" -eq 0 ]; then
+        OWNER=
+    else
+        OWNER=$(id -un)
+    fi
     SUDO_BIN=$(sudo_cmd)
 
+    if [ -n "$OWNER" ] && ! id "$OWNER" >/dev/null 2>&1; then
+        fail "WAKEY_CC_USER does not exist: $OWNER"
+    fi
+
     require_cmd git
     require_cmd cargo
     require_cmd tar
@@ -114,19 +158,34 @@ main() {
     TMPBASE="${TMPDIR:-/tmp}"
     WORKDIR="$TMPBASE/wakey-cc-src.$$"
     STAGING="$TMPBASE/wakey-cc-stage.$$"
+    CLONED_WORKDIR=1
 
     cleanup() {
         if [ -z "${WAKEY_CC_KEEP_TMP:-}" ]; then
-            rm -rf "$WORKDIR" "$STAGING"
+            [ "$CLONED_WORKDIR" = "0" ] || rm -rf "$WORKDIR"
+            rm -rf "$STAGING"
         else
+            if [ "$CLONED_WORKDIR" != "0" ]; then
+                chown_if_requested "$WORKDIR"
+                chmod_user_rw_if_requested "$WORKDIR"
                 log "keeping temp dir: $WORKDIR"
             fi
+            chown_if_requested "$STAGING"
+            chmod_user_rw_if_requested "$STAGING"
+            log "keeping temp dir: $STAGING"
+        fi
     }
     trap cleanup EXIT INT TERM
 
+    if [ -n "$REPO_DIR" ]; then
+        WORKDIR=$REPO_DIR
+        CLONED_WORKDIR=0
+        update_existing_repo "$WORKDIR" "$REF"
+    else
         log "cloning $REPO_URL (ref: $REF)"
         git clone --depth 1 --branch "$REF" "$REPO_URL" "$WORKDIR" ||
             fail 'git clone failed'
+    fi
 
     cd "$WORKDIR"
 
@@ -165,6 +224,15 @@ main() {
     priv cp -a "$STAGING/ui" "$ROOT/"
     priv cp -a "$STAGING/scripts" "$ROOT/"
     priv cp -a "$STAGING/deploy" "$ROOT/"
+    chown_if_requested \
+        "$ROOT/bin/wakey-control-plane" \
+        "$ROOT/ui" \
+        "$ROOT/scripts" \
+        "$ROOT/deploy"
+    chmod_user_rw_if_requested \
+        "$ROOT/ui" \
+        "$ROOT/scripts" \
+        "$ROOT/deploy"
 
     if [ -z "${WAKEY_CC_NO_RESTART:-}" ] && command -v systemctl >/dev/null 2>&1; then
         if systemctl list-unit-files "$SERVICE" >/dev/null 2>&1; then

src/cli/mod.rs

@@ -46,7 +46,7 @@ pub struct LeasesArgs {
     )]
     pub include_state: bool,
     /// Print machine-readable JSON instead of a table.
-    #[arg(long)]
+    #[arg(long, short)]
     pub json: bool,
 }
 
@@ -70,7 +70,7 @@ pub struct WakeArgs {
     #[arg(long)]
     pub ip: Option<IpAddr>,
     /// Print machine-readable JSON instead of a table.
-    #[arg(long)]
+    #[arg(short, long)]
     pub json: bool,
 }
 
@@ -100,7 +100,7 @@ pub struct InventoryArgs {
     #[arg(long = "mac")]
     pub macs: Vec<macaddr::MacAddr>,
     /// Print machine-readable JSON instead of a table.
-    #[arg(long)]
+    #[arg(short, long)]
     pub json: bool,
 }
 
@@ -114,10 +114,10 @@ pub struct DevsArgs {
     /// Optional interface name to show.
     pub dev: Option<String>,
     /// Show only interfaces whose operstate is `up`.
-    #[arg(long)]
+    #[arg(short, long)]
     pub up: bool,
     /// Print machine-readable JSON instead of a table.
-    #[arg(long)]
+    #[arg(short, long)]
     pub json: bool,
 }
 

src/lib.rs

@@ -11,7 +11,10 @@ pub use service::{
     merge_devices, merge_devices_with_observations, resolve_devices, resolve_query,
     resolve_selector, resolve_wake_targets, wake_explicit, wake_from_query, wake_targets,
 };
-pub use wakey_linux::dhcp::{list_local_observations, observe_dhcp_event, observe_neighbor_event};
+pub use wakey_linux::observations::{
+    list_local_observations, observe_dhcp_event, observe_neighbor_event,
+    prune_stale_observations_from_path,
+};
 
 #[cfg(test)]
 mod tests {

src/service/inventory.rs

@@ -22,7 +22,7 @@ pub async fn resolve_devices(input: impl Into<String>) -> Result<Vec<Device>> {
 pub async fn inventory(query: InventoryQuery) -> Result<DeviceInventory> {
     let neighbors = wakey_linux::devices::query_neighbors(&query).await?;
     let leases = get_leases().await?;
-    let observations = match wakey_linux::dhcp::list_local_observations().await {
+    let observations = match wakey_linux::observations::list_local_observations().await {
         Ok(observations) => observations
             .into_iter()
             .filter_map(local_observation_to_fact)
@@ -77,7 +77,7 @@ pub fn merge_devices_with_observations(
         let key = row
             .mac
             .map(|m| m.to_string())
-            .unwrap_or_else(|| format!("ip:{}", row.ip));
+            .unwrap_or_else(|| format!("ip:{}", row.ip)); // key by mac or by FAILED ip
         by_key.entry(key).or_default().0.push(row);
     }
     for lease in leases {
@@ -99,7 +99,7 @@ pub fn merge_devices_with_observations(
             Device::from_parts_with_observations(neighbors, leases, observations)
         })
         .collect();
-
+    if !query.is_empty() {
         let mut texts = Vec::new();
         let mut devs = Vec::new();
         let mut ips = Vec::new();
@@ -123,6 +123,7 @@ pub fn merge_devices_with_observations(
             && (macs.is_empty() || device.macs.iter().any(|mac| macs.contains(mac)))
             && (nuds.is_empty() || device.neighbors.iter().any(|n| nuds.contains(&n.state)))
         });
+    }
     devices.sort_by(|a, b| {
         presence_rank(b.presence)
             .cmp(&presence_rank(a.presence))
@@ -132,7 +133,7 @@ pub fn merge_devices_with_observations(
 }
 
 pub fn local_observation_to_fact(
-    observation: wakey_linux::dhcp::LocalDeviceObservation,
+    observation: wakey_linux::observations::LocalDeviceObservation,
 ) -> Option<DeviceObservationFact> {
     let mac = match observation.mac.as_deref() {
         Some(raw) => match raw.parse() {
@@ -180,7 +181,7 @@ const fn presence_rank(presence: Presence) -> u8 {
 mod tests {
     use super::*;
     use std::net::{IpAddr, Ipv4Addr};
-    use wakey_core::{DeviceId, DhcpLease, InventoryQueryBuilder, NeighborState};
+    use wakey_core::{DeviceId, DhcpLease, EndpointSource, InventoryQueryBuilder, NeighborState};
 
     fn sample_neighbors() -> Vec<NeighborEntry> {
         vec![NeighborEntry {
@@ -278,11 +279,14 @@ mod tests {
             Some(DeviceId::Mac("aa:bb:cc:dd:ee:ff".parse().expect("mac")))
         );
         assert_eq!(out[0].observations.len(), 1);
+        assert_eq!(out[0].endpoints.len(), 1);
+        assert_eq!(out[0].endpoints[0].key.source, EndpointSource::HookDhcp);
+        assert!(out[0].ips.is_empty());
         assert_eq!(out[0].presence, Presence::Unknown);
     }
 
     #[test]
-    fn merge_devices_marks_remove_only_observation_offline() {
+    fn merge_devices_marks_neigh_remove_observation_offline() {
         let query = InventoryQueryBuilder::new().build();
         let out = merge_devices_with_observations(
             Vec::new(),
@@ -301,5 +305,56 @@ mod tests {
 
         assert_eq!(out.len(), 1);
         assert_eq!(out[0].presence, Presence::Offline);
+        assert_eq!(out[0].endpoints[0].key.source, EndpointSource::HookNeighbor);
+        assert!(out[0].ips.is_empty());
+    }
+
+    #[test]
+    fn merge_devices_keeps_dhcp_remove_observation_unknown() {
+        let query = InventoryQueryBuilder::new().build();
+        let out = merge_devices_with_observations(
+            Vec::new(),
+            Vec::new(),
+            vec![DeviceObservationFact {
+                kind: "dhcp".into(),
+                action: "remove".into(),
+                mac: Some("aa:bb:cc:dd:ee:ff".parse().expect("mac")),
+                ip: Some(IpAddr::V4(Ipv4Addr::new(192, 168, 1, 30))),
+                hostname: None,
+                first_seen_unix: Some(10),
+                last_seen_unix: Some(20),
+            }],
+            &query,
+        );
+
+        assert_eq!(out.len(), 1);
+        assert_eq!(out[0].presence, Presence::Unknown);
+        assert_eq!(out[0].endpoints[0].key.source, EndpointSource::HookDhcp);
+        assert!(out[0].ips.is_empty());
+    }
+
+    #[test]
+    fn merge_devices_uses_ip_id_for_ip_only_hook_endpoint_without_summary_ip() {
+        let query = InventoryQueryBuilder::new().build();
+        let ip = IpAddr::V4(Ipv4Addr::new(192, 168, 1, 31));
+        let out = merge_devices_with_observations(
+            Vec::new(),
+            Vec::new(),
+            vec![DeviceObservationFact {
+                kind: "neigh".into(),
+                action: "remove".into(),
+                mac: None,
+                ip: Some(ip),
+                hostname: None,
+                first_seen_unix: Some(10),
+                last_seen_unix: Some(20),
+            }],
+            &query,
+        );
+
+        assert_eq!(out.len(), 1);
+        assert_eq!(out[0].id, Some(DeviceId::Ip(ip)));
+        assert!(out[0].ips.is_empty());
+        assert_eq!(out[0].endpoints.len(), 1);
     }
 }

src/service/leases.rs

@@ -16,6 +16,8 @@ pub async fn get_leases_with_neighbor_state() -> Result<Vec<DhcpLeaseWithState>>
     let leases = wakey_linux::dhcp::read_dhcp_leases_with_names()
         .await
         .context("failed to read DHCP leases")?;
+    // this is only used in the wakey CLI
+    #[allow(deprecated)]
     Ok(wakey_linux::dhcp::enrich_leases_with_nud_state(leases).await)
 }
 

ui/.prettierignore

@@ -0,0 +1,3 @@
+package-lock.json
+pnpm-lock.yaml
+yarn.lock

ui/index.html

@@ -4,6 +4,20 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Wakey Operator UI</title>
+    <script>
+      (function () {
+        try {
+          var t = localStorage.getItem("wakey-ui-theme");
+          if (
+            t === "dark" ||
+            ((t === "system" || !t) &&
+              window.matchMedia("(prefers-color-scheme: dark)").matches)
+          ) {
+            document.documentElement.classList.add("dark");
+          }
+        } catch (_) {}
+      })();
+    </script>
   </head>
   <body>
     <div id="root"></div>

ui/package.json

@@ -15,14 +15,22 @@
     "@base-ui/react": "^1.4.0",
     "@fontsource-variable/inter": "^5.2.8",
     "@tailwindcss/vite": "^4.2.2",
+    "@xterm/addon-clipboard": "^0.2.0",
+    "@xterm/addon-fit": "^0.11.0",
+    "@xterm/addon-unicode-graphemes": "^0.4.0",
+    "@xterm/addon-unicode11": "^0.9.0",
+    "@xterm/addon-web-links": "^0.12.0",
+    "@xterm/xterm": "^6.0.0",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "lucide-react": "^1.8.0",
+    "next-themes": "^0.4.6",
     "react": "^18.3.1",
     "react-compiler-runtime": "^1.0.0",
     "react-dom": "^18.3.1",
     "react-router-dom": "^6.28.0",
     "shadcn": "^4.2.0",
+    "sonner": "^2.0.7",
     "tailwind-merge": "^3.5.0",
     "tailwindcss": "^4.2.2",
     "tw-animate-css": "^1.4.0"

ui/pnpm-workspace.yaml

@@ -0,0 +1,3 @@
+allowBuilds:
+  esbuild: false
+  msw: false

ui/src/App.tsx

@@ -1,5 +1,6 @@
-import { useEffect, useState } from "react";
+import { lazy, Suspense, useEffect, useState } from "react";
 import { Navigate, Route, Routes } from "react-router-dom";
+import { toast } from "sonner";
 
 import {
   type Agent,
@@ -13,6 +14,8 @@ import {
   revokeAgent,
   setAgentNickname,
 } from "@/api";
+import { Toaster } from "@/components/ui/sonner";
+import { Skeleton } from "@/components/ui/skeleton";
 import { AppLayout } from "@/layout/AppLayout";
 import { AgentsPage } from "@/pages/AgentsPage";
 import { AlertsPage } from "@/pages/AlertsPage";
@@ -20,9 +23,15 @@ import { AuditPage } from "@/pages/AuditPage";
 import { CommandsPage } from "@/pages/CommandsPage";
 import { DashboardPage } from "@/pages/DashboardPage";
 import { DevicesPage } from "@/pages/DevicesPage";
-import { ObservationsPage } from "@/pages/ObservationsPage";
 import { TokensPage } from "@/pages/TokensPage";
 
+const TerminalPage = lazy(() =>
+  import("@/pages/TerminalPage").then((module) => ({
+    default: module.TerminalPage,
+  })),
+);
+import { WakeToolsPage } from "@/pages/WakeToolsPage";
+
 type LoadState = "idle" | "loading" | "ready" | "error";
 
 export function App() {
@@ -33,11 +42,9 @@ export function App() {
   const [selectedAgentId, setSelectedAgentId] = useState("");
 
   const [state, setState] = useState<LoadState>("idle");
-  const [error, setError] = useState("");
 
   async function loadAll() {
     setState("loading");
-    setError("");
     try {
       const [nextAgents, nextAlerts, nextHistory, nextAudit] =
         await Promise.all([
@@ -65,13 +72,16 @@ export function App() {
       setState("ready");
     } catch (err) {
       setState("error");
-      setError(String(err));
+      toast.error("Failed to load data", { description: String(err) });
     }
   }
 
   async function onRevokeAgent(agentId: string): Promise<boolean> {
     const result = await revokeAgent(agentId);
     await loadAll();
+    if (result.revoked) {
+      toast.success(`Revoked ${agentId}`);
+    }
     return result.revoked;
   }
 
@@ -81,6 +91,11 @@ export function App() {
   ): Promise<boolean> {
     const result = await setAgentNickname(agentId, nickname);
     await loadAll();
+    if (result.updated) {
+      toast.success(`Nickname updated for ${agentId}`, {
+        description: nickname || "(cleared)",
+      });
+    }
     return result.updated;
   }
 
@@ -126,7 +141,6 @@ export function App() {
 
   return (
     <>
-      {error && <pre className="error">{error}</pre>}
       <Routes>
         <Route path="/" element={<AppLayout />}>
           <Route
@@ -137,6 +151,18 @@ export function App() {
                 selectedAgentId={selectedAgentId}
                 onSelectAgent={setSelectedAgentId}
                 onAfterWake={loadAll}
+                onRefresh={loadAll}
+              />
+            }
+          />
+          <Route
+            path="wake"
+            element={
+              <WakeToolsPage
+                agents={agents}
+                selectedAgentId={selectedAgentId}
+                onSelectAgent={setSelectedAgentId}
+                onAfterWake={loadAll}
               />
             }
           />
@@ -147,12 +173,12 @@ export function App() {
                 agents={agents}
                 alerts={alerts}
                 transitions={history}
+                audit={audit}
                 loading={state === "loading"}
                 onRefresh={loadAll}
               />
             }
           />
-          <Route path="observations" element={<ObservationsPage />} />
           <Route
             path="agents"
             element={
@@ -196,9 +222,27 @@ export function App() {
             }
           />
           <Route path="tokens" element={<TokensPage />} />
+          <Route
+            path="terminal"
+            element={
+              <Suspense
+                fallback={
+                  <Skeleton className="h-[calc(100dvh-2.5rem)] w-full" />
+                }
+              >
+                <TerminalPage
+                  agents={agents}
+                  selectedAgentId={selectedAgentId}
+                  onSelectAgent={setSelectedAgentId}
+                />
+              </Suspense>
+            }
+          />
+
           <Route path="*" element={<Navigate to="/" replace />} />
         </Route>
       </Routes>
+      <Toaster richColors position="bottom-right" />
     </>
   );
 }

ui/src/api.ts

@@ -2,6 +2,17 @@ export type Agent = {
   agent_id: string;
   connected: boolean;
   nickname?: string | null;
+  capabilities: "terminal"[];
+};
+
+export type TerminalSession = {
+  terminal_id: string;
+  agent_id: string;
+  created_at_unix: number;
+  agent_attached: boolean;
+  operator_attached: boolean;
+  websocket_url: string;
+  attachment_token?: string;
 };
 
 export type Alert = {
@@ -96,32 +107,6 @@ export type KnownDeviceSummary = {
   pinned: boolean;
 };
 
-export type AgentDeviceObservation = {
-  observation_key: string;
-  agent_id: string;
-  kind: string;
-  mac: string | null;
-  ip: string | null;
-  hostname: string | null;
-  first_seen_unix: number;
-  last_seen_unix: number;
-  last_action: string;
-  known_device: KnownDeviceSummary | null;
-};
-
-export type AgentDeviceObservationEvent = {
-  event_id: string;
-  observation_key: string;
-  agent_id: string;
-  kind: string;
-  action: string;
-  mac: string | null;
-  ip: string | null;
-  hostname: string | null;
-  ts_unix: number;
-  known_device: KnownDeviceSummary | null;
-};
-
 export type FleetDeviceAgent = {
   agent_id: string;
   nickname?: string | null;
@@ -129,6 +114,20 @@ export type FleetDeviceAgent = {
   last_seen_unix: number;
 };
 
+export type FleetDeviceEndpoint = {
+  agent_id: string;
+  nickname?: string | null;
+  connected: boolean;
+  source: string;
+  mac: string | null;
+  ip: string | null;
+  hostname: string | null;
+  interface: string | null;
+  presence: string;
+  first_seen_unix: number | null;
+  last_seen_unix: number | null;
+};
+
 export type FleetWakeRoute = {
   route_id: string;
   agent_id: string;
@@ -137,7 +136,9 @@ export type FleetWakeRoute = {
   mac: string | null;
   ip: string | null;
   hostname: string | null;
+  interface: string | null;
   source: string;
+  presence: string;
   last_seen_unix: number;
   wakeable: boolean;
 };
@@ -152,6 +153,7 @@ export type FleetDevice = {
   hostnames: string[];
   agents: FleetDeviceAgent[];
   sources: string[];
+  endpoints: FleetDeviceEndpoint[];
   first_seen_unix: number | null;
   last_seen_unix: number | null;
   presence: string;
@@ -179,6 +181,25 @@ export type WakeFleetDeviceResponse = {
   };
 };
 
+export interface APIErrorResponse {
+  error: {
+    code: string;
+    message: string;
+    details?: any;
+  };
+}
+
+export class APIError extends Error {
+  constructor(
+    message: string,
+    public code: string,
+    public details: any,
+  ) {
+    super(message);
+    this.name = "APIError";
+  }
+}
+
 async function request<T>(path: string, init?: RequestInit): Promise<T> {
   const res = await fetch(path, {
     ...init,
@@ -190,11 +211,22 @@ async function request<T>(path: string, init?: RequestInit): Promise<T> {
 
   if (!res.ok) {
     const raw = await res.text();
-    let detail = raw;
+    let parsed: APIErrorResponse | null = null;
     try {
-      detail = JSON.stringify(JSON.parse(raw), null, 2);
+      parsed = JSON.parse(raw);
-    } catch {}
+      // assume APIError
-    throw new Error(`${res.status} ${res.statusText}\n${detail}`);
+      if (parsed?.error?.details) {
+        parsed.error.details = JSON.stringify(parsed.error.details);
+      }
+    } catch {
+      // not JSON
+    }
+
+    throw new APIError(
+      `${res.status} ${res.statusText}\n${raw}`,
+      parsed?.error?.code ?? "unknown",
+      parsed?.error?.details ?? parsed?.error?.message ?? raw,
+    );
   }
 
   return res.json() as Promise<T>;
@@ -204,6 +236,44 @@ export function fetchAgents(): Promise<Agent[]> {
   return request<Agent[]>("/api/v1/control/agents");
 }
 
+export function createTerminal(
+  agentId: string,
+  rows: number,
+  cols: number,
+): Promise<TerminalSession> {
+  return request<TerminalSession>("/api/v1/control/terminals", {
+    method: "POST",
+    body: JSON.stringify({ agent_id: agentId, rows, cols }),
+  });
+}
+
+export function listTerminals(): Promise<TerminalSession[]> {
+  return request<TerminalSession[]>("/api/v1/control/terminals");
+}
+
+export function attachTerminal(
+  terminalId: string,
+  operatorId: string,
+): Promise<TerminalSession> {
+  return request<TerminalSession>(
+    `/api/v1/control/terminals/${encodeURIComponent(terminalId)}/attach`,
+    {
+      method: "POST",
+      body: JSON.stringify({ operator_id: operatorId }),
+    },
+  );
+}
+
+export async function closeTerminal(terminalId: string): Promise<void> {
+  const response = await fetch(
+    `/api/v1/control/terminals/${encodeURIComponent(terminalId)}`,
+    { method: "DELETE" },
+  );
+  if (!response.ok) {
+    throw new Error(`Failed to close terminal: ${response.status}`);
+  }
+}
+
 export function fetchAlerts(): Promise<Alert[]> {
   return request<Alert[]>("/api/v1/control/alerts");
 }
@@ -270,6 +340,7 @@ export function fetchFleetDevices(opts?: {
   presence?: string;
   known?: string;
   agentId?: string;
+  visibility?: "operator" | "all";
   limit?: number;
 }): Promise<FleetDevice[]> {
   const params = new URLSearchParams();
@@ -279,6 +350,7 @@ export function fetchFleetDevices(opts?: {
   }
   if (opts?.known && opts.known !== "all") params.set("known", opts.known);
   if (opts?.agentId) params.set("agent_id", opts.agentId);
+  if (opts?.visibility) params.set("visibility", opts.visibility);
   params.set("limit", String(opts?.limit ?? 500));
   return request<FleetDevice[]>(
     `/api/v1/control/fleet/devices?${params.toString()}`,
@@ -316,38 +388,6 @@ export function wakeFleetDevice(input: {
   });
 }
 
-export function fetchObservations(opts?: {
-  agentId?: string;
-  limit?: number;
-}): Promise<AgentDeviceObservation[]> {
-  const params = new URLSearchParams();
-  if (opts?.agentId) params.set("agent_id", opts.agentId);
-  params.set("limit", String(opts?.limit ?? 500));
-  return request<AgentDeviceObservation[]>(
-    `/api/v1/control/observations?${params.toString()}`,
-  );
-}
-
-export function fetchObservationHistory(opts?: {
-  agentId?: string;
-  kind?: string;
-  mac?: string;
-  ip?: string;
-  observationKey?: string;
-  limit?: number;
-}): Promise<AgentDeviceObservationEvent[]> {
-  const params = new URLSearchParams();
-  if (opts?.agentId) params.set("agent_id", opts.agentId);
-  if (opts?.kind) params.set("kind", opts.kind);
-  if (opts?.mac) params.set("mac", opts.mac);
-  if (opts?.ip) params.set("ip", opts.ip);
-  if (opts?.observationKey) params.set("observation_key", opts.observationKey);
-  params.set("limit", String(opts?.limit ?? 500));
-  return request<AgentDeviceObservationEvent[]>(
-    `/api/v1/control/observations/history?${params.toString()}`,
-  );
-}
-
 export function createKnownDevice(input: {
   display_name: string;
   pinned?: boolean;
@@ -365,19 +405,6 @@ export function createKnownDevice(input: {
   });
 }
 
-export function attachObservationIdentifier(
-  deviceId: string,
-  observationKey: string,
-): Promise<KnownDevice> {
-  return request<KnownDevice>(
-    `/api/v1/control/devices/${encodeURIComponent(deviceId)}/identifiers/from-observation`,
-    {
-      method: "POST",
-      body: JSON.stringify({ observation_key: observationKey }),
-    },
-  );
-}
-
 export function attachDeviceIdentifier(
   deviceId: string,
   identifier: { kind: string; value: string },
@@ -391,6 +418,16 @@ export function attachDeviceIdentifier(
   );
 }
 
+export function detachDeviceIdentifier(
+  deviceId: string,
+  identifierKey: string,
+): Promise<KnownDevice> {
+  return request<KnownDevice>(
+    `/api/v1/control/devices/${encodeURIComponent(deviceId)}/identifiers/${encodeURIComponent(identifierKey)}`,
+    { method: "DELETE" },
+  );
+}
+
 export function mergeKnownDevice(
   targetDeviceId: string,
   sourceDeviceId: string,

ui/src/components/AgentSelector.tsx

@@ -0,0 +1,89 @@
+import type { Agent } from "@/api";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+} from "@/components/ui/select";
+
+type Props = {
+  agents: Agent[];
+  value: string;
+  onChange: (agentId: string) => void;
+  disabled?: boolean;
+  className?: string;
+};
+
+export function displayAgentLabel(agent: Agent): string {
+  const nickname = agent.nickname?.trim();
+  return nickname ? nickname : agent.agent_id;
+}
+
+export function AgentSelector({
+  agents,
+  value,
+  onChange,
+  disabled,
+  className,
+}: Props) {
+  const selected = agents.find((a) => a.agent_id === value);
+
+  return (
+    <Select
+      value={value}
+      onValueChange={(v) => {
+        if (v) onChange(v);
+      }}
+      disabled={disabled}
+    >
+      <SelectTrigger className={className ?? "w-full min-w-0"}>
+        <span className="flex min-w-0 flex-1 items-center gap-2 text-start">
+          {selected ? (
+            <span
+              className={`size-2 shrink-0 rounded-full ${selected.connected ? "bg-emerald-500" : "bg-zinc-400"}`}
+              aria-hidden
+            />
+          ) : null}
+          <span className="min-w-0 truncate">
+            {value
+              ? selected
+                ? displayAgentLabel(selected)
+                : value
+              : "Select agent"}
+          </span>
+          {selected ? (
+            <span className="shrink-0 text-xs text-muted-foreground">
+              {selected.connected ? "connected" : "offline"}
+            </span>
+          ) : null}
+        </span>
+      </SelectTrigger>
+      <SelectContent
+        className="max-w-[min(92vw,30rem)]"
+        alignItemWithTrigger={false}
+      >
+        {agents.map((agent) => (
+          <SelectItem
+            key={agent.agent_id}
+            value={agent.agent_id}
+            className="pe-10"
+            disabled={!agent.connected}
+          >
+            <span className="flex min-w-0 flex-1 items-center gap-2">
+              <span
+                className={`size-2 shrink-0 rounded-full ${agent.connected ? "bg-emerald-500" : "bg-zinc-400"}`}
+                aria-hidden
+              />
+              <span className="min-w-0 truncate">
+                {displayAgentLabel(agent)}
+              </span>
+              <span className="shrink-0 text-xs text-muted-foreground">
+                {agent.connected ? "connected" : "offline"}
+              </span>
+            </span>
+          </SelectItem>
+        ))}
+      </SelectContent>
+    </Select>
+  );
+}

ui/src/components/ui/dialog.tsx

@@ -51,7 +51,7 @@ function DialogContent({
       <DialogPrimitive.Popup
         data-slot="dialog-content"
         className={cn(
-          "fixed top-1/2 start-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 rtl:translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
+          "fixed top-1/2 inset-s-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 rtl:translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
           className,
         )}
         {...props}
@@ -63,7 +63,7 @@ function DialogContent({
             render={
               <Button
                 variant="ghost"
-                className="absolute top-2 end-2"
+                className="absolute top-2 inset-e-2"
                 size="icon-sm"
               />
             }

ui/src/components/ui/skeleton.tsx

@@ -0,0 +1,13 @@
+import { cn } from "@/lib/utils";
+
+function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="skeleton"
+      className={cn("animate-pulse rounded-md bg-muted", className)}
+      {...props}
+    />
+  );
+}
+
+export { Skeleton };

ui/src/components/ui/sonner.tsx

@@ -0,0 +1,43 @@
+import { useTheme } from "next-themes";
+import { Toaster as Sonner, type ToasterProps } from "sonner";
+import {
+  CircleCheckIcon,
+  InfoIcon,
+  TriangleAlertIcon,
+  OctagonXIcon,
+  Loader2Icon,
+} from "lucide-react";
+
+const Toaster = ({ ...props }: ToasterProps) => {
+  const { theme = "system" } = useTheme();
+
+  return (
+    <Sonner
+      theme={theme as ToasterProps["theme"]}
+      className="toaster group"
+      icons={{
+        success: <CircleCheckIcon className="size-4" />,
+        info: <InfoIcon className="size-4" />,
+        warning: <TriangleAlertIcon className="size-4" />,
+        error: <OctagonXIcon className="size-4" />,
+        loading: <Loader2Icon className="size-4 animate-spin" />,
+      }}
+      style={
+        {
+          "--normal-bg": "var(--popover)",
+          "--normal-text": "var(--popover-foreground)",
+          "--normal-border": "var(--border)",
+          "--border-radius": "var(--radius)",
+        } as React.CSSProperties
+      }
+      toastOptions={{
+        classNames: {
+          toast: "cn-toast",
+        },
+      }}
+      {...props}
+    />
+  );
+};
+
+export { Toaster };

ui/src/components/ui/tooltip.tsx

@@ -0,0 +1,66 @@
+"use client";
+
+import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip";
+
+import { cn } from "@/lib/utils";
+
+function TooltipProvider({
+  delay = 0,
+  ...props
+}: TooltipPrimitive.Provider.Props) {
+  return (
+    <TooltipPrimitive.Provider
+      data-slot="tooltip-provider"
+      delay={delay}
+      {...props}
+    />
+  );
+}
+
+function Tooltip({ ...props }: TooltipPrimitive.Root.Props) {
+  return <TooltipPrimitive.Root data-slot="tooltip" {...props} />;
+}
+
+function TooltipTrigger({ ...props }: TooltipPrimitive.Trigger.Props) {
+  return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />;
+}
+
+function TooltipContent({
+  className,
+  side = "top",
+  sideOffset = 4,
+  align = "center",
+  alignOffset = 0,
+  children,
+  ...props
+}: TooltipPrimitive.Popup.Props &
+  Pick<
+    TooltipPrimitive.Positioner.Props,
+    "align" | "alignOffset" | "side" | "sideOffset"
+  >) {
+  return (
+    <TooltipPrimitive.Portal>
+      <TooltipPrimitive.Positioner
+        align={align}
+        alignOffset={alignOffset}
+        side={side}
+        sideOffset={sideOffset}
+        className="isolate z-50"
+      >
+        <TooltipPrimitive.Popup
+          data-slot="tooltip-content"
+          className={cn(
+            "z-50 inline-flex w-fit max-w-xs origin-(--transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pe-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-start-2 data-[side=inline-start]:slide-in-from-end-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
+            className,
+          )}
+          {...props}
+        >
+          {children}
+          <TooltipPrimitive.Arrow className="z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-inset-s-1 data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-inset-e-1 data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" />
+        </TooltipPrimitive.Popup>
+      </TooltipPrimitive.Positioner>
+    </TooltipPrimitive.Portal>
+  );
+}
+
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };

ui/src/layout/AppLayout.tsx

@@ -1,118 +1,252 @@
 import { useEffect, useState } from "react";
-import { NavLink, Outlet } from "react-router-dom";
+import { NavLink, Outlet, useLocation } from "react-router-dom";
-import { ChevronDown, Moon, Sun } from "lucide-react";
+import { useTheme } from "next-themes";
+import {
+  Moon,
+  Sun,
+  Monitor,
+  Zap,
+  BarChart3,
+  Bell,
+  Bot,
+  FileText,
+  Key,
+  Terminal,
+  SquareTerminal,
+  PanelLeftClose,
+  PanelLeft,
+} from "lucide-react";
 
 import { Button } from "@/components/ui/button";
 import {
-  DropdownMenu,
+  Tooltip,
-  DropdownMenuContent,
+  TooltipContent,
-  DropdownMenuItem,
+  TooltipTrigger,
-  DropdownMenuTrigger,
+} from "@/components/ui/tooltip";
-} from "@/components/ui/dropdown-menu";
 
-const navItems = [
+const SIDEBAR_KEY = "wakey-sidebar-collapsed";
-  ["/", "Devices"],
-  ["/dashboard", "Fleet Health"],
-] as const;
 
-const adminItems = [
+type NavSection = {
-  ["/agents", "Agents"],
+  label: string;
-  ["/tokens", "Tokens"],
+  items: readonly {
-  ["/alerts", "Alerts"],
+    to: string;
-  ["/observations", "Raw Observations"],
+    label: string;
-  ["/commands", "Command Runner"],
+    icon: React.ElementType;
-  ["/audit", "Audit"],
+    end?: boolean;
-] as const;
+  }[];
+};
 
-type Theme = "light" | "dark";
+const navSections: NavSection[] = [
+  {
+    label: "Operations",
+    items: [
+      { to: "/", label: "Devices", icon: Monitor, end: true },
+      { to: "/wake", label: "Wake Tools", icon: Zap },
+    ],
+  },
+  {
+    label: "Monitoring",
+    items: [
+      { to: "/dashboard", label: "Fleet Health", icon: BarChart3 },
+      { to: "/alerts", label: "Alerts", icon: Bell },
+    ],
+  },
+  {
+    label: "Admin",
+    items: [
+      { to: "/agents", label: "Agents", icon: Bot },
+      { to: "/audit", label: "Audit", icon: FileText },
+      { to: "/tokens", label: "Tokens", icon: Key },
+      { to: "/commands", label: "Commands", icon: Terminal },
+      { to: "/terminal", label: "Terminal", icon: SquareTerminal },
+    ],
+  },
+];
 
-const THEME_KEY = "wakey-ui-theme";
+function usePageTitle() {
-
+  const { pathname } = useLocation();
-function resolveInitialTheme(): Theme {
+  useEffect(() => {
-  const stored = window.localStorage.getItem(THEME_KEY);
+    const flat = navSections.flatMap((s) => s.items);
-  if (stored === "light" || stored === "dark") return stored;
+    const match = flat.find((item) =>
-
+      item.end
-  return window.matchMedia("(prefers-color-scheme: dark)").matches
+        ? pathname === "/ui" || pathname === "/ui/" || pathname === "/"
-    ? "dark"
+        : pathname.startsWith(item.to) && item.to !== "/",
-    : "light";
+    );
+    document.title = match ? `${match.label} — Wakey` : "Wakey Operator UI";
+  }, [pathname]);
 }
 
 export function AppLayout() {
-  const [theme, setTheme] = useState<Theme>(() => resolveInitialTheme());
+  const { resolvedTheme, setTheme } = useTheme();
+  const isDark = resolvedTheme === "dark";
+  const [collapsed, setCollapsed] = useState(() => {
+    return window.localStorage.getItem(SIDEBAR_KEY) === "true";
+  });
+
+  usePageTitle();
 
   useEffect(() => {
-    const root = document.documentElement;
+    window.localStorage.setItem(SIDEBAR_KEY, String(collapsed));
-    root.classList.toggle("dark", theme === "dark");
+  }, [collapsed]);
-    window.localStorage.setItem(THEME_KEY, theme);
-  }, [theme]);
 
   return (
-    <div className="mx-auto max-w-7xl p-4">
+    <div className="app-shell">
-      <header className="mb-4 flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between">
+      <aside
-        <div>
+        className={[
-          <h1 className="text-2xl font-semibold tracking-tight">Wakey</h1>
+          "sidebar",
-          <p className="mt-1 text-sm text-muted-foreground">
+          collapsed ? "sidebar--collapsed" : "",
-            Fleet devices, presence, and wake controls
+          "fixed inset-y-0 left-0 z-50 shadow-xl transition-all duration-100 ease-in-out",
-          </p>
+          "md:sticky md:top-0 md:z-30 md:shadow-none",
+          collapsed ? "-translate-x-full md:translate-x-0" : "translate-x-0",
+        ]
+          .filter(Boolean)
+          .join(" ")}
+        data-collapsed={collapsed}
+      >
+        <div className="sidebar-brand">
+          <div className="sidebar-logo">
+            <Zap className="size-5 text-primary" />
           </div>
-        <Button
+          {!collapsed && (
-          type="button"
+            <div className="sidebar-brand-text">
-          variant="outline"
+              <span className="text-sm font-semibold tracking-tight">
-          size="sm"
+                Wakey
-          className="fixed right-3 top-3 z-50 size-9 rounded-full p-0 sm:static sm:size-auto sm:rounded-md sm:px-3 sm:py-2"
+              </span>
-          aria-label={theme === "dark" ? "Switch to light" : "Switch to dark"}
+              <span className="text-[0.65rem] leading-none text-muted-foreground">
-          title={theme === "dark" ? "Switch to light" : "Switch to dark"}
+                Operator UI
-          onClick={() =>
+              </span>
-            setTheme((current) => (current === "dark" ? "light" : "dark"))
+            </div>
+          )}
+        </div>
+
+        <nav className="sidebar-nav">
+          {navSections.map((section) => (
+            <div key={section.label} className="sidebar-section">
+              {!collapsed && (
+                <div className="sidebar-section-label">{section.label}</div>
+              )}
+              {section.items.map((item) => {
+                const Icon = item.icon;
+                const link = (
+                  <NavLink
+                    key={item.to}
+                    to={item.to}
+                    end={item.end}
+                    className={({ isActive }) =>
+                      [
+                        "sidebar-link",
+                        isActive ? "sidebar-link--active" : "",
+                        collapsed ? "sidebar-link--collapsed" : "",
+                      ]
+                        .filter(Boolean)
+                        .join(" ")
                     }
                   >
-          {theme === "dark" ? (
+                    <Icon className="sidebar-link-icon" />
+                    {!collapsed && (
+                      <span className="sidebar-link-label">{item.label}</span>
+                    )}
+                  </NavLink>
+                );
+
+                if (collapsed) {
+                  return (
+                    <Tooltip key={item.to}>
+                      <TooltipTrigger>{link}</TooltipTrigger>
+                      <TooltipContent side="right">{item.label}</TooltipContent>
+                    </Tooltip>
+                  );
+                }
+                return link;
+              })}
+            </div>
+          ))}
+        </nav>
+
+        <div className="sidebar-footer">
+          <Tooltip>
+            <TooltipTrigger>
+              <Button
+                type="button"
+                variant="ghost"
+                size="sm"
+                className="sidebar-footer-btn"
+                aria-label={isDark ? "Switch to light" : "Switch to dark"}
+                onClick={() => setTheme(isDark ? "light" : "dark")}
+              >
+                {isDark ? (
                   <Sun className="size-4" aria-hidden />
                 ) : (
                   <Moon className="size-4" aria-hidden />
                 )}
-          <span className="hidden sm:inline">
+                {!collapsed && (
-            {theme === "dark" ? "Switch to light" : "Switch to dark"}
+                  <span className="sidebar-link-label">
+                    {isDark ? "Light mode" : "Dark mode"}
                   </span>
+                )}
               </Button>
-      </header>
+            </TooltipTrigger>
+            <TooltipContent side="right">
+              {isDark ? "Switch to light" : "Switch to dark"}
+            </TooltipContent>
+          </Tooltip>
 
-      <nav className="mb-3 flex flex-wrap items-center gap-2">
+          <Tooltip>
-        {navItems.map(([to, label]) => (
+            <TooltipTrigger>
-          <NavLink
+              <Button
-            key={to}
+                type="button"
-            to={to}
+                variant="ghost"
-            end={to === "/"}
+                size="sm"
-            className={({ isActive }) =>
+                className="sidebar-footer-btn"
-              [
+                aria-label={collapsed ? "Expand sidebar" : "Collapse sidebar"}
-                "rounded-md border px-3 py-1.5 text-sm transition-colors",
+                onClick={() => setCollapsed((c) => !c)}
-                isActive
-                  ? "border-primary/60 bg-primary/10 text-foreground"
-                  : "border-border bg-card text-muted-foreground hover:text-foreground",
-              ].join(" ")
-            }
               >
-            {label}
+                {collapsed ? (
-          </NavLink>
+                  <PanelLeft className="size-4" aria-hidden />
-        ))}
+                ) : (
-        <DropdownMenu>
+                  <PanelLeftClose className="size-4" aria-hidden />
-          <DropdownMenuTrigger className="inline-flex items-center gap-1 rounded-md border border-border bg-card px-3 py-1.5 text-sm text-muted-foreground hover:text-foreground">
+                )}
-            Admin / Debug
+                {!collapsed && (
-            <ChevronDown className="size-4" aria-hidden />
+                  <span className="sidebar-link-label">Collapse</span>
-          </DropdownMenuTrigger>
+                )}
-          <DropdownMenuContent className="w-48">
+              </Button>
-            {adminItems.map(([to, label]) => (
+            </TooltipTrigger>
-              <DropdownMenuItem key={to}>
+            <TooltipContent side="right">
-                <NavLink className="w-full" to={to}>
+              {collapsed ? "Expand" : "Collapse"}
-                  {label}
+            </TooltipContent>
-                </NavLink>
+          </Tooltip>
-              </DropdownMenuItem>
+        </div>
-            ))}
+      </aside>
-          </DropdownMenuContent>
-        </DropdownMenu>
-      </nav>
 
-      <main>
+      {/* Mobile backdrop */}
+      {!collapsed && (
+        <div
+          role="button"
+          tabIndex={0}
+          className="fixed inset-0 z-40 bg-black/20 md:hidden animate-in fade-in duration-200"
+          onClick={() => setCollapsed(true)}
+          onKeyDown={(e) => {
+            if (e.key === "Enter" || e.key === " ") setCollapsed(true);
+          }}
+          aria-label="Close menu"
+        />
+      )}
+
+      {/* Mobile floating button when sidebar is collapsed/hidden */}
+      {collapsed && (
+        <Button
+          type="button"
+          variant="ghost"
+          size="sm"
+          className="fixed bottom-3 left-3 z-40 md:hidden"
+          aria-label="Open menu"
+          onClick={() => setCollapsed(false)}
+        >
+          <PanelLeft className="size-4" aria-hidden />
+        </Button>
+      )}
+
+      <main className="app-main @container">
         <Outlet />
       </main>
     </div>

ui/src/main.tsx

@@ -1,13 +1,25 @@
 import React from "react";
 import { createRoot } from "react-dom/client";
 import { BrowserRouter } from "react-router-dom";
+import { ThemeProvider } from "next-themes";
+import { TooltipProvider } from "@/components/ui/tooltip";
 import { App } from "@/App";
+import "@xterm/xterm/css/xterm.css";
 import "./styles.css";
 
 createRoot(document.getElementById("root")!).render(
   <React.StrictMode>
     <BrowserRouter basename="/ui">
+      <ThemeProvider
+        attribute="class"
+        defaultTheme="system"
+        storageKey="wakey-ui-theme"
+        enableSystem
+      >
+        <TooltipProvider>
           <App />
+        </TooltipProvider>
+      </ThemeProvider>
     </BrowserRouter>
   </React.StrictMode>,
 );

ui/src/pages/AgentsPage.tsx

@@ -2,7 +2,11 @@ import type { Agent } from "@/api";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
+import { Badge } from "@/components/ui/badge";
 import { useState } from "react";
+import { toast } from "sonner";
+import { Bot, Inbox } from "lucide-react";
+import { displayAgentLabel } from "@/components/AgentSelector";
 
 type Props = {
   agents: Agent[];
@@ -23,29 +27,17 @@ export function AgentsPage({
   onSetAgentNickname,
 }: Props) {
   const [busy, setBusy] = useState(false);
-  const [status, setStatus] = useState("");
-  const [error, setError] = useState("");
   const [drafts, setDrafts] = useState<Record<string, string>>({});
 
-  function displayLabel(agent: Agent): string {
-    const nickname = agent.nickname?.trim();
-    return nickname ? nickname : agent.agent_id;
-  }
-
   async function onRevoke(agentId: string) {
     if (!window.confirm(`Revoke agent credentials for ${agentId}?`)) {
       return;
     }
     setBusy(true);
-    setStatus("");
-    setError("");
     try {
-      const revoked = await onRevokeAgent(agentId);
+      await onRevokeAgent(agentId);
-      setStatus(
-        revoked ? `Revoked ${agentId}` : `${agentId} was already absent`,
-      );
     } catch (err) {
-      setError(String(err));
+      toast.error("Revoke failed", { description: String(err) });
     } finally {
       setBusy(false);
     }
@@ -54,17 +46,10 @@ export function AgentsPage({
   async function onSaveNickname(agent: Agent) {
     const draft = drafts[agent.agent_id] ?? agent.nickname ?? "";
     setBusy(true);
-    setStatus("");
-    setError("");
     try {
-      const updated = await onSetAgentNickname(agent.agent_id, draft);
+      await onSetAgentNickname(agent.agent_id, draft);
-      setStatus(
-        updated
-          ? `Updated nickname for ${agent.agent_id}`
-          : `${agent.agent_id} not found`,
-      );
     } catch (err) {
-      setError(String(err));
+      toast.error("Failed to update nickname", { description: String(err) });
     } finally {
       setBusy(false);
     }
@@ -73,49 +58,49 @@ export function AgentsPage({
   return (
     <Card>
       <CardHeader>
-        <CardTitle>Agents</CardTitle>
+        <CardTitle className="flex items-center gap-2">
+          <Bot className="size-5 text-primary" />
+          Agents
+        </CardTitle>
       </CardHeader>
       <CardContent className="space-y-3">
         <div className="grid gap-2">
           {agents.map((agent) => (
             <div
-              className="flex items-start justify-between gap-3 rounded-md border bg-card px-3 py-2"
+              className={`rounded-lg border px-4 py-3 transition-colors ${
+                selectedAgentId === agent.agent_id
+                  ? "border-primary/40 bg-primary/5"
+                  : "bg-card"
+              }`}
               key={agent.agent_id}
             >
-              <Button
+              <div className="flex items-start justify-between gap-3">
-                variant={
+                <button
-                  selectedAgentId === agent.agent_id ? "secondary" : "outline"
+                  type="button"
-                }
+                  className="flex min-w-0 flex-1 flex-col items-start gap-1 text-left"
-                className="flex h-auto flex-1 items-center justify-between gap-3 px-3 py-2 text-left"
                   onClick={() => onSelectAgent(agent.agent_id)}
                   disabled={busy}
                 >
-                <span className="min-w-0 truncate">{displayLabel(agent)}</span>
+                  <span className="flex items-center gap-2">
-                <span className="text-xs text-muted-foreground">
+                    <span
-                  {agent.connected ? "connected" : "offline"}
+                      className={`size-2 shrink-0 rounded-full ${agent.connected ? "bg-emerald-500" : "bg-zinc-400"}`}
-                </span>
+                      aria-hidden
-              </Button>
-              <div className="grid min-w-52 gap-2">
-                <Input
-                  value={drafts[agent.agent_id] ?? agent.nickname ?? ""}
-                  onChange={(e) =>
-                    setDrafts((prev) => ({
-                      ...prev,
-                      [agent.agent_id]: e.target.value,
-                    }))
-                  }
-                  placeholder="nickname (optional)"
-                  disabled={busy}
                     />
-                <div className="flex items-center justify-end gap-2">
+                    <span className="text-sm font-medium">
-                  <Button
+                      {displayAgentLabel(agent)}
-                    variant="outline"
+                    </span>
-                    size="sm"
+                    <Badge
-                    onClick={() => void onSaveNickname(agent)}
+                      variant={agent.connected ? "secondary" : "outline"}
-                    disabled={busy}
+                      className="text-[0.6rem] px-1.5 py-0"
                     >
-                    Save Name
+                      {agent.connected ? "connected" : "offline"}
-                  </Button>
+                    </Badge>
+                  </span>
+                  <code className="text-[0.65rem] text-muted-foreground/70 font-mono truncate max-w-full">
+                    {agent.agent_id}
+                  </code>
+                </button>
+
                 <Button
                   variant="outline"
                   size="sm"
@@ -126,25 +111,43 @@ export function AgentsPage({
                   Revoke
                 </Button>
               </div>
+
+              <div className="mt-2 flex items-center gap-2">
+                <Input
+                  value={drafts[agent.agent_id] ?? agent.nickname ?? ""}
+                  onChange={(e) =>
+                    setDrafts((prev) => ({
+                      ...prev,
+                      [agent.agent_id]: e.target.value,
+                    }))
+                  }
+                  placeholder="nickname (optional)"
+                  disabled={busy}
+                  className="flex-1"
+                />
+                <Button
+                  variant="outline"
+                  size="sm"
+                  onClick={() => void onSaveNickname(agent)}
+                  disabled={busy}
+                >
+                  Save
+                </Button>
               </div>
             </div>
           ))}
           {!agents.length && (
-            <div className="px-1 py-2 text-sm text-muted-foreground">
+            <div className="flex flex-col items-center justify-center py-12 text-center">
+              <Inbox className="size-10 text-muted-foreground/30" />
+              <p className="mt-3 text-sm text-muted-foreground">
                 No agents enrolled
+              </p>
+              <p className="text-xs text-muted-foreground/70">
+                Issue a token and enroll an agent to get started
+              </p>
             </div>
           )}
         </div>
-        {status && (
-          <pre className="max-h-80 overflow-auto rounded-md border bg-muted/40 p-3 text-xs">
-            {status}
-          </pre>
-        )}
-        {error && (
-          <pre className="max-h-80 overflow-auto rounded-md border border-destructive/60 bg-destructive/10 p-3 text-xs text-destructive">
-            {error}
-          </pre>
-        )}
       </CardContent>
     </Card>
   );

ui/src/pages/AlertsPage.tsx

@@ -72,7 +72,10 @@ export function AlertsPage({ alerts, transitions, onRefresh }: Props) {
         </CardHeader>
         <CardContent className="space-y-3">
           <div className="grid gap-2 sm:grid-cols-3">
-            <label className="grid gap-1 text-sm text-muted-foreground">
+            <label
+              htmlFor="alert-severity"
+              className="grid gap-1 text-sm text-muted-foreground"
+            >
               Severity
               <Select
                 value={severity}
@@ -80,7 +83,7 @@ export function AlertsPage({ alerts, transitions, onRefresh }: Props) {
                   if (value) setSeverity(value);
                 }}
               >
-                <SelectTrigger className="w-full">
+                <SelectTrigger id="alert-severity" className="w-full">
                   <SelectValue placeholder="Severity" />
                 </SelectTrigger>
                 <SelectContent>
@@ -93,7 +96,10 @@ export function AlertsPage({ alerts, transitions, onRefresh }: Props) {
               </Select>
             </label>
 
-            <label className="grid gap-1 text-sm text-muted-foreground">
+            <label
+              htmlFor="alert-status"
+              className="grid gap-1 text-sm text-muted-foreground"
+            >
               Status
               <Select
                 value={status}
@@ -101,7 +107,7 @@ export function AlertsPage({ alerts, transitions, onRefresh }: Props) {
                   if (value) setStatus(value);
                 }}
               >
-                <SelectTrigger className="w-full">
+                <SelectTrigger id="alert-status" className="w-full">
                   <SelectValue placeholder="Status" />
                 </SelectTrigger>
                 <SelectContent>
@@ -114,7 +120,10 @@ export function AlertsPage({ alerts, transitions, onRefresh }: Props) {
               </Select>
             </label>
 
-            <label className="grid gap-1 text-sm text-muted-foreground">
+            <label
+              htmlFor="alert-kind"
+              className="grid gap-1 text-sm text-muted-foreground"
+            >
               Kind
               <Select
                 value={kind}
@@ -122,7 +131,7 @@ export function AlertsPage({ alerts, transitions, onRefresh }: Props) {
                   if (value) setKind(value);
                 }}
               >
-                <SelectTrigger className="w-full">
+                <SelectTrigger id="alert-kind" className="w-full">
                   <SelectValue placeholder="Kind" />
                 </SelectTrigger>
                 <SelectContent>
@@ -170,9 +179,13 @@ export function AlertsPage({ alerts, transitions, onRefresh }: Props) {
           </span>
         </CardHeader>
         <CardContent className="space-y-2">
-          <label className="grid gap-1 text-sm text-muted-foreground">
+          <label
+            htmlFor="alert-transition-search"
+            className="grid gap-1 text-sm text-muted-foreground"
+          >
             Search
             <Input
+              id="alert-transition-search"
               value={transitionQ}
               onChange={(e) => setTransitionQ(e.target.value)}
               placeholder="kind, status, message, agent"

ui/src/pages/AuditPage.tsx

@@ -70,7 +70,10 @@ export function AuditPage({ events, onRefresh }: Props) {
 
       <CardContent className="space-y-3">
         <div className="grid gap-2 sm:grid-cols-3">
-          <label className="grid gap-1 text-sm text-muted-foreground">
+          <label
+            htmlFor="audit-event-type"
+            className="grid gap-1 text-sm text-muted-foreground"
+          >
             Event type
             <Select
               value={eventType}
@@ -78,7 +81,7 @@ export function AuditPage({ events, onRefresh }: Props) {
                 if (value) setEventType(value);
               }}
             >
-              <SelectTrigger className="w-full">
+              <SelectTrigger id="audit-event-type" className="w-full">
                 <SelectValue placeholder="Event type" />
               </SelectTrigger>
               <SelectContent>
@@ -91,7 +94,10 @@ export function AuditPage({ events, onRefresh }: Props) {
             </Select>
           </label>
 
-          <label className="grid gap-1 text-sm text-muted-foreground">
+          <label
+            htmlFor="audit-outcome"
+            className="grid gap-1 text-sm text-muted-foreground"
+          >
             Outcome
             <Select
               value={outcome}
@@ -99,7 +105,7 @@ export function AuditPage({ events, onRefresh }: Props) {
                 if (value) setOutcome(value);
               }}
             >
-              <SelectTrigger className="w-full">
+              <SelectTrigger id="audit-outcome" className="w-full">
                 <SelectValue placeholder="Outcome" />
               </SelectTrigger>
               <SelectContent>
@@ -112,9 +118,13 @@ export function AuditPage({ events, onRefresh }: Props) {
             </Select>
           </label>
 
-          <label className="grid gap-1 text-sm text-muted-foreground">
+          <label
+            htmlFor="audit-search"
+            className="grid gap-1 text-sm text-muted-foreground"
+          >
             Search
             <Input
+              id="audit-search"
               value={needle}
               onChange={(e) => setNeedle(e.target.value)}
               placeholder="message, agent, actor"

ui/src/pages/CommandsPage.tsx

@@ -1,7 +1,15 @@
 import { useState } from "react";
+import { Terminal } from "lucide-react";
+import { toast } from "sonner";
 
 import { Button } from "@/components/ui/button";
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import {
   Select,
@@ -11,6 +19,7 @@ import {
   SelectValue,
 } from "@/components/ui/select";
 import { Textarea } from "@/components/ui/textarea";
+import { AgentSelector } from "@/components/AgentSelector";
 import { runCommand, type Agent, type CommandKind } from "@/api";
 
 type Props = {
@@ -26,11 +35,6 @@ export function CommandsPage({
   onSelectAgent,
   onAfterCommand,
 }: Props) {
-  function displayAgentLabel(agent: Agent): string {
-    const nickname = agent.nickname?.trim();
-    return nickname ? nickname : agent.agent_id;
-  }
-
   const [kind, setKind] = useState<CommandKind>("devs");
   const [query, setQuery] = useState("");
   const [output, setOutput] = useState("Select agent and run a command");
@@ -44,9 +48,11 @@ export function CommandsPage({
     try {
       const out = await runCommand(selectedAgentId, kind, query.trim());
       setOutput(JSON.stringify(out, null, 2));
+      toast.success(`Command "${kind}" completed`);
       if (onAfterCommand) await onAfterCommand();
     } catch (err) {
       setOutput(String(err));
+      toast.error("Command failed", { description: String(err) });
     } finally {
       setRunning(false);
     }
@@ -55,53 +61,38 @@ export function CommandsPage({
   return (
     <Card>
       <CardHeader>
-        <CardTitle>Command Runner</CardTitle>
+        <CardTitle className="flex items-center gap-2">
+          <Terminal className="size-5 text-primary" />
+          Command Runner
+        </CardTitle>
+        <CardDescription>
+          Debug tool: send raw commands to agents and inspect JSON responses
+        </CardDescription>
       </CardHeader>
       <CardContent>
         <form className="grid gap-3" onSubmit={submit}>
-          <label className="grid gap-1 text-sm text-muted-foreground">
+          <label
+            htmlFor="cmd-agent"
+            className="grid gap-1 text-sm text-muted-foreground"
+          >
             <span>Agent</span>
-            <Select
+            <AgentSelector
+              agents={agents}
               value={selectedAgentId}
-              onValueChange={(value) => {
+              onChange={onSelectAgent}
-                if (value) onSelectAgent(value);
-              }}
-            >
-              <SelectTrigger className="w-full">
-                <SelectValue placeholder="Select agent" />
-              </SelectTrigger>
-              <SelectContent>
-                {agents.map((agent) => (
-                  <SelectItem
-                    key={agent.agent_id}
-                    value={agent.agent_id}
-                    disabled={!agent.connected}
-                  >
-                    <span className="flex min-w-0 flex-1 items-center gap-2">
-                      <span
-                        className={`size-2 shrink-0 rounded-full ${agent.connected ? "bg-emerald-500" : "bg-zinc-400"}`}
-                        aria-hidden
             />
-                      <span className="min-w-0 truncate">
-                        {displayAgentLabel(agent)}
-                      </span>
-                      <span className="shrink-0 text-xs text-muted-foreground">
-                        {agent.connected ? "connected" : "offline"}
-                      </span>
-                    </span>
-                  </SelectItem>
-                ))}
-              </SelectContent>
-            </Select>
           </label>
 
-          <label className="grid gap-1 text-sm text-muted-foreground">
+          <label
+            htmlFor="cmd-kind"
+            className="grid gap-1 text-sm text-muted-foreground"
+          >
             <span>Command</span>
             <Select
               value={kind}
               onValueChange={(value) => setKind(value as CommandKind)}
             >
-              <SelectTrigger className="w-full">
+              <SelectTrigger id="cmd-kind" className="w-full">
                 <SelectValue placeholder="Pick command" />
               </SelectTrigger>
               <SelectContent>
@@ -113,9 +104,13 @@ export function CommandsPage({
             </Select>
           </label>
 
-          <label className="grid gap-1 text-sm text-muted-foreground">
+          <label
+            htmlFor="cmd-query"
+            className="grid gap-1 text-sm text-muted-foreground"
+          >
             <span>Query</span>
             <Input
+              id="cmd-query"
               value={query}
               onChange={(e) => setQuery(e.target.value)}
               placeholder="optional"

ui/src/pages/DashboardPage.tsx

@@ -1,4 +1,15 @@
-import type { Agent, Alert, AlertTransition } from "@/api";
+import { useEffect, useState } from "react";
+import { Link } from "react-router-dom";
+import { Activity, Bell, Bot, Key, RefreshCw, ArrowRight } from "lucide-react";
+
+import {
+  type Agent,
+  type Alert,
+  type AlertTransition,
+  type AuditEvent,
+  type EnrollTokenStatus,
+  fetchEnrollTokens,
+} from "@/api";
 import { Button } from "@/components/ui/button";
 import {
   Card,
@@ -7,66 +18,288 @@ import {
   CardHeader,
   CardTitle,
 } from "@/components/ui/card";
+import { Badge } from "@/components/ui/badge";
+import { Skeleton } from "@/components/ui/skeleton";
 
 type Props = {
   agents: Agent[];
   alerts: Alert[];
   transitions: AlertTransition[];
+  audit: AuditEvent[];
   loading: boolean;
   onRefresh: () => void;
 };
 
+function relativeTime(unixMs: number): string {
+  const diff = Date.now() - unixMs;
+  if (diff < 60_000) return "just now";
+  if (diff < 3_600_000) return `${Math.floor(diff / 60_000)}m ago`;
+  if (diff < 86_400_000) return `${Math.floor(diff / 3_600_000)}h ago`;
+  return `${Math.floor(diff / 86_400_000)}d ago`;
+}
+
+function severityColor(severity: string): string {
+  switch (severity.toLowerCase()) {
+    case "critical":
+      return "bg-red-500/15 text-red-600 dark:text-red-400 border-red-500/30";
+    case "warning":
+      return "bg-amber-500/15 text-amber-600 dark:text-amber-400 border-amber-500/30";
+    case "info":
+      return "bg-blue-500/15 text-blue-600 dark:text-blue-400 border-blue-500/30";
+    default:
+      return "";
+  }
+}
+
+function eventIcon(eventType: string): string {
+  if (eventType.includes("wake")) return "⚡";
+  if (eventType.includes("enroll")) return "🔑";
+  if (eventType.includes("command")) return "▶";
+  if (eventType.includes("connect")) return "🔗";
+  if (eventType.includes("disconnect")) return "⛓️‍💥";
+  return "•";
+}
+
 export function DashboardPage({
   agents,
   alerts,
   transitions,
+  audit,
   loading,
   onRefresh,
 }: Props) {
   const connected = agents.filter((a) => a.connected).length;
+  const total = agents.length;
+
+  const severityBuckets = alerts.reduce<Record<string, number>>((acc, a) => {
+    acc[a.severity] = (acc[a.severity] || 0) + 1;
+    return acc;
+  }, {});
+
+  const [tokens, setTokens] = useState<EnrollTokenStatus[]>([]);
+  useEffect(() => {
+    void fetchEnrollTokens()
+      .then(setTokens)
+      .catch(() => undefined);
+  }, []);
+  const activeTokens = tokens.filter((t) => !t.expired).length;
+
+  const recentAudit = audit.slice(0, 8);
+
+  if (loading && !agents.length) {
     return (
-    <section className="grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
+      <section className="grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
-      <Card>
+        {Array.from({ length: 4 }).map((_, i) => (
+          <Card key={i}>
             <CardHeader className="pb-2">
-          <CardDescription>Agents</CardDescription>
+              <Skeleton className="h-4 w-20" />
-          <CardTitle className="text-2xl">{agents.length}</CardTitle>
+              <Skeleton className="mt-2 h-8 w-12" />
-        </CardHeader>
-      </Card>
-      <Card>
-        <CardHeader className="pb-2">
-          <CardDescription>Connected</CardDescription>
-          <CardTitle className="text-2xl">{connected}</CardTitle>
-        </CardHeader>
-      </Card>
-      <Card>
-        <CardHeader className="pb-2">
-          <CardDescription>Active Alerts</CardDescription>
-          <CardTitle className="text-2xl">{alerts.length}</CardTitle>
-        </CardHeader>
-      </Card>
-      <Card>
-        <CardHeader className="pb-2">
-          <CardDescription>Transitions</CardDescription>
-          <CardTitle className="text-2xl">{transitions.length}</CardTitle>
             </CardHeader>
           </Card>
+        ))}
         <Card className="sm:col-span-2 lg:col-span-4">
-        <CardHeader className="flex flex-row items-start justify-between gap-3 space-y-0">
+          <CardHeader>
-          <CardTitle>Overview</CardTitle>
+            <Skeleton className="h-5 w-32" />
-          <Button
-            onClick={onRefresh}
-            disabled={loading}
-            variant="outline"
-            size="sm"
-          >
-            {loading ? "Refreshing..." : "Refresh"}
-          </Button>
           </CardHeader>
-        <CardContent>
+          <CardContent className="space-y-3">
-          <p className="text-sm text-muted-foreground">
+            {Array.from({ length: 4 }).map((_, i) => (
-            Use tabs to run commands, inspect audits, and monitor alerts in real
+              <Skeleton key={i} className="h-12 w-full" />
-            time.
+            ))}
-          </p>
+          </CardContent>
+        </Card>
+      </section>
+    );
+  }
+
+  return (
+    <section className="grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
+      {/* Fleet Status */}
+      <Card>
+        <CardHeader className="flex flex-row items-center justify-between gap-y-0 pb-2">
+          <CardDescription className="flex items-center gap-1.5">
+            <Bot className="size-3.5" />
+            Fleet Status
+          </CardDescription>
+          <Link
+            to="/agents"
+            className="text-xs text-muted-foreground hover:text-foreground transition-colors"
+          >
+            <ArrowRight className="size-3.5" />
+          </Link>
+        </CardHeader>
+        <CardContent>
+          <div className="text-2xl font-bold tabular-nums">
+            {connected}
+            <span className="text-base font-normal text-muted-foreground">
+              /{total}
+            </span>
+          </div>
+          <p className="mt-1 text-xs text-muted-foreground">
+            {connected === total
+              ? "All agents connected"
+              : `${total - connected} offline`}
+          </p>
+          {total > 0 && (
+            <div className="mt-2 flex h-1.5 overflow-hidden rounded-full bg-muted">
+              <div
+                className="h-full rounded-full bg-emerald-500 transition-all"
+                style={{ width: `${(connected / total) * 100}%` }}
+              />
+            </div>
+          )}
+        </CardContent>
+      </Card>
+
+      {/* Active Alerts */}
+      <Card>
+        <CardHeader className="flex flex-row items-center justify-between gap-y-0 pb-2">
+          <CardDescription className="flex items-center gap-1.5">
+            <Bell className="size-3.5" />
+            Active Alerts
+          </CardDescription>
+          <Link
+            to="/alerts"
+            className="text-xs text-muted-foreground hover:text-foreground transition-colors"
+          >
+            <ArrowRight className="size-3.5" />
+          </Link>
+        </CardHeader>
+        <CardContent>
+          <div className="text-2xl font-bold tabular-nums">{alerts.length}</div>
+          {Object.keys(severityBuckets).length > 0 ? (
+            <div className="mt-2 flex flex-wrap gap-1.5">
+              {Object.entries(severityBuckets)
+                .sort(([a], [b]) => a.localeCompare(b))
+                .map(([sev, count]) => (
+                  <Badge
+                    key={sev}
+                    variant="outline"
+                    className={`text-[0.65rem] ${severityColor(sev)}`}
+                  >
+                    {count} {sev}
+                  </Badge>
+                ))}
+            </div>
+          ) : (
+            <p className="mt-1 text-xs text-muted-foreground">All clear</p>
+          )}
+        </CardContent>
+      </Card>
+
+      {/* Transitions */}
+      <Card>
+        <CardHeader className="flex flex-row items-center justify-between gap-y-0 pb-2">
+          <CardDescription className="flex items-center gap-1.5">
+            <Activity className="size-3.5" />
+            Transitions
+          </CardDescription>
+        </CardHeader>
+        <CardContent>
+          <div className="text-2xl font-bold tabular-nums">
+            {transitions.length}
+          </div>
+          <p className="mt-1 text-xs text-muted-foreground">
+            Recent state changes
+          </p>
+        </CardContent>
+      </Card>
+
+      {/* Token Health */}
+      <Card>
+        <CardHeader className="flex flex-row items-center justify-between gap-y-0 pb-2">
+          <CardDescription className="flex items-center gap-1.5">
+            <Key className="size-3.5" />
+            Enroll Tokens
+          </CardDescription>
+          <Link
+            to="/tokens"
+            className="text-xs text-muted-foreground hover:text-foreground transition-colors"
+          >
+            <ArrowRight className="size-3.5" />
+          </Link>
+        </CardHeader>
+        <CardContent>
+          <div className="text-2xl font-bold tabular-nums">{activeTokens}</div>
+          <p className="mt-1 text-xs text-muted-foreground">
+            {activeTokens === 1 ? "active token" : "active tokens"}
+          </p>
+        </CardContent>
+      </Card>
+
+      {/* Recent Activity Feed */}
+      <Card className="sm:col-span-2 lg:col-span-4">
+        <CardHeader className="flex flex-row items-start justify-between gap-3 gap-y-0">
+          <div>
+            <CardTitle>Recent Activity</CardTitle>
+            <CardDescription className="mt-1">
+              Latest audit events across the fleet
+            </CardDescription>
+          </div>
+          <Button
+            onClick={onRefresh}
+            disabled={loading}
+            variant="outline"
+            size="sm"
+            className="gap-1.5"
+          >
+            <RefreshCw
+              className={`size-3.5 ${loading ? "animate-spin" : ""}`}
+            />
+            Refresh
+          </Button>
+        </CardHeader>
+        <CardContent>
+          {recentAudit.length > 0 ? (
+            <div className="grid gap-0">
+              {recentAudit.map((event, i) => (
+                <div
+                  key={event.event_id}
+                  className={`flex items-start gap-3 py-3 ${
+                    i < recentAudit.length - 1
+                      ? "border-b border-border/50"
+                      : ""
+                  }`}
+                >
+                  <span
+                    className="mt-0.5 flex size-7 shrink-0 items-center justify-center rounded-md bg-muted text-sm"
+                    aria-hidden
+                  >
+                    {eventIcon(event.event_type)}
+                  </span>
+                  <div className="min-w-0 flex-1">
+                    <div className="flex items-center gap-2">
+                      <span className="text-sm font-medium">
+                        {event.event_type.replace(/_/g, " ")}
+                      </span>
+                      <Badge
+                        variant={
+                          event.outcome === "success"
+                            ? "secondary"
+                            : "destructive"
+                        }
+                        className="text-[0.6rem] px-1.5 py-0"
+                      >
+                        {event.outcome}
+                      </Badge>
+                    </div>
+                    <p className="mt-0.5 truncate text-xs text-muted-foreground">
+                      {event.message}
+                    </p>
+                  </div>
+                  <span className="shrink-0 text-xs tabular-nums text-muted-foreground">
+                    {relativeTime(event.ts_unix * 1000)}
+                  </span>
+                </div>
+              ))}
+            </div>
+          ) : (
+            <div className="flex flex-col items-center justify-center py-8 text-center">
+              <Activity className="size-8 text-muted-foreground/40" />
+              <p className="mt-2 text-sm text-muted-foreground">
+                No recent activity
+              </p>
+            </div>
+          )}
         </CardContent>
       </Card>
     </section>

ui/src/pages/DevicesPage.tsx

@@ -1,37 +1,19 @@
 import { useEffect, useMemo, useState } from "react";
-import {
+import { Inbox, MoreHorizontal, RefreshCw, Search, Zap } from "lucide-react";
-  Check,
+import { toast } from "sonner";
-  Copy,
-  MoreHorizontal,
-  RefreshCw,
-  Search,
-  Zap,
-} from "lucide-react";
 
 import {
-  attachDeviceIdentifier,
-  createKnownDevice,
   fetchFleetDevices,
   fetchKnownDevices,
-  mergeKnownDevice,
   refreshFleetDevices,
   wakeFleetDevice,
   type Agent,
   type FleetDevice,
-  type FleetWakeRoute,
   type KnownDevice,
 } from "@/api";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -45,30 +27,34 @@ import {
   SelectItem,
   SelectTrigger,
 } from "@/components/ui/select";
-import { Separator } from "@/components/ui/separator";
+import { Skeleton } from "@/components/ui/skeleton";
+import {
+  FilterSelect,
+  MobileLabel,
+  PresenceBadge,
+} from "@/pages/fleet/FleetComponents";
+import { FleetDeviceDetailsDialog } from "@/pages/fleet/FleetDeviceDetailsDialog";
+import {
+  agentLabel,
+  formatSeen,
+  knownFilters,
+  presenceFilters,
+  presenceRank,
+  summarize,
+  type KnownFilter,
+  type SortDir,
+  type SortKey,
+} from "@/pages/fleet/utils";
 
 type Props = {
   agents: Agent[];
   selectedAgentId: string;
   onSelectAgent: (agentId: string) => void;
   onAfterWake?: () => Promise<void>;
+  onRefresh?: () => Promise<void>;
 };
 
-type SortKey = "name" | "presence" | "last_seen" | "agents" | "ip" | "mac";
+export function DevicesPage({ agents, onAfterWake, onRefresh }: Props) {
-type SortDir = "asc" | "desc";
-type KnownFilter = "all" | "known" | "unknown";
-
-const presenceFilters = [
-  "all",
-  "online",
-  "likely_online",
-  "unknown",
-  "offline",
-] as const;
-
-const knownFilters: KnownFilter[] = ["all", "known", "unknown"];
-
-export function DevicesPage({ agents, onAfterWake }: Props) {
   const [devices, setDevices] = useState<FleetDevice[]>([]);
   const [knownDevices, setKnownDevices] = useState<KnownDevice[]>([]);
   const [query, setQuery] = useState("");
@@ -82,14 +68,10 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
   const [loading, setLoading] = useState(false);
   const [refreshing, setRefreshing] = useState(false);
   const [wakeBusyKey, setWakeBusyKey] = useState("");
-  const [error, setError] = useState("");
-  const [status, setStatus] = useState("");
-  const [copied, setCopied] = useState("");
   const [details, setDetails] = useState<FleetDevice | null>(null);
 
   async function loadFleet() {
     setLoading(true);
-    setError("");
     try {
       const [nextDevices, nextKnownDevices] = await Promise.all([
         fetchFleetDevices({
@@ -97,6 +79,7 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
           presence,
           known,
           agentId: agentId === "all" ? "" : agentId,
+          visibility: "all",
           limit: 500,
         }),
         fetchKnownDevices(),
@@ -104,7 +87,7 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
       setDevices(nextDevices);
       setKnownDevices(nextKnownDevices);
     } catch (err) {
-      setError(String(err));
+      toast.error("Failed to load fleet", { description: String(err) });
     } finally {
       setLoading(false);
     }
@@ -112,19 +95,16 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
 
   async function refreshAllConnected() {
     setRefreshing(true);
-    setStatus("");
-    setError("");
     try {
       const result = await refreshFleetDevices();
       const failed = result.agents.filter((agent) => agent.status !== "ok");
-      setStatus(
+      const msg = failed.length
-        failed.length
+        ? `Refreshed ${result.total_accepted} devices; ${failed.length} agent(s) failed`
-          ? `Stored ${result.total_accepted} observations; ${failed.length} agent refresh failed`
+        : `Refreshed ${result.total_accepted} devices from ${result.agents.length} connected agents`;
-          : `Stored ${result.total_accepted} observations from ${result.agents.length} connected agents`,
+      toast.success(msg);
-      );
       await loadFleet();
     } catch (err) {
-      setError(String(err));
+      toast.error("Fleet refresh failed", { description: String(err) });
     } finally {
       setRefreshing(false);
     }
@@ -133,20 +113,17 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
   async function wakeDevice(device: FleetDevice, routeId?: string | null) {
     if (!device.recommended_route && !routeId) return;
     setWakeBusyKey(device.device_key);
-    setStatus("");
-    setError("");
     try {
       const result = await wakeFleetDevice({
         deviceKey: device.device_key,
         routeId,
       });
-      setStatus(
+      const msg = `Wake sent via ${agentLabel(result.route.agent_id, result.route.nickname)} (${result.route.mac ?? "no mac"})`;
-        `Wake sent via ${agentLabel(result.route.agent_id, result.route.nickname)} (${result.route.mac ?? "no mac"})`,
+      toast.success(msg);
-      );
       if (onAfterWake) await onAfterWake();
       await loadFleet();
     } catch (err) {
-      setError(String(err));
+      toast.error("Wake failed", { description: String(err) });
     } finally {
       setWakeBusyKey("");
     }
@@ -157,17 +134,16 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
     if (!text) return;
     try {
       await navigator.clipboard.writeText(text);
-      setCopied(label);
+      toast.success(`Copied ${label}`);
     } catch {
       const area = document.createElement("textarea");
       area.value = text;
-      area.style.position = "fixed";
+      area.style.cssText = "position:fixed;opacity:0";
-      area.style.opacity = "0";
       document.body.appendChild(area);
       area.select();
       document.execCommand("copy");
       document.body.removeChild(area);
-      setCopied(label);
+      toast.success(`Copied ${label}`);
     }
   }
 
@@ -182,15 +158,11 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [query]);
 
-  useEffect(() => {
-    if (!copied) return;
-    const timer = window.setTimeout(() => setCopied(""), 1400);
-    return () => window.clearTimeout(timer);
-  }, [copied]);
-
   const sortedDevices = useMemo(() => {
     const rows = [...devices];
     rows.sort((a, b) => {
+      // Pinned always float to top
+      if (a.pinned !== b.pinned) return a.pinned ? -1 : 1;
       const dir = sort.dir === "asc" ? 1 : -1;
       if (sort.key === "presence") {
         return dir * (presenceRank(a.presence) - presenceRank(b.presence));
@@ -221,7 +193,7 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
             <div>
               <CardTitle>Devices</CardTitle>
               <p className="mt-1 text-sm text-muted-foreground">
-                {devices.length} fleet rows from stored observations and known
+                {devices.length} fleet rows from agent snapshots and known
                 devices
               </p>
             </div>
@@ -229,7 +201,10 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
               <Button
                 variant="outline"
                 size="sm"
-                onClick={() => void loadFleet()}
+                onClick={() => {
+                  void loadFleet();
+                  if (onRefresh) void onRefresh();
+                }}
                 disabled={loading}
               >
                 <RefreshCw className="size-4" aria-hidden />
@@ -250,11 +225,15 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
         </CardHeader>
         <CardContent className="space-y-3">
           <div className="grid gap-2 lg:grid-cols-[minmax(16rem,1fr)_11rem_10rem_14rem_10rem]">
-            <label className="grid gap-1 text-sm text-muted-foreground">
+            <label
+              htmlFor="fleet-search"
+              className="grid gap-1 text-sm text-muted-foreground"
+            >
               <span>Search</span>
               <div className="relative">
                 <Search className="absolute left-2 top-2.5 size-4 text-muted-foreground" />
                 <Input
+                  id="fleet-search"
                   className="pl-8"
                   value={query}
                   onChange={(event) => setQuery(event.target.value)}
@@ -274,7 +253,10 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
               values={knownFilters}
               onChange={(value) => setKnown(value as KnownFilter)}
             />
-            <label className="grid gap-1 text-sm text-muted-foreground">
+            <label
+              htmlFor="fleet-agent"
+              className="grid gap-1 text-sm text-muted-foreground"
+            >
               <span>Agent</span>
               <Select
                 value={agentId}
@@ -320,23 +302,14 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
             />
           </div>
 
-          {status && (
+          {/* Skeleton loading */}
-            <div className="rounded-md border bg-muted/50 px-3 py-2 text-sm">
+          {loading && !devices.length ? (
-              {status}
+            <div className="grid gap-2">
+              {Array.from({ length: 5 }).map((_, i) => (
+                <Skeleton key={i} className="h-14 w-full rounded-md" />
+              ))}
             </div>
-          )}
+          ) : (
-          {error && (
-            <pre className="max-h-80 overflow-auto rounded-md border border-destructive/60 bg-destructive/10 p-3 text-xs text-destructive">
-              {error}
-            </pre>
-          )}
-          {copied && (
-            <div className="flex items-center gap-2 text-sm text-muted-foreground">
-              <Check className="size-4" aria-hidden />
-              Copied {copied}
-            </div>
-          )}
-
             <div className="grid gap-2">
               <div className="hidden grid-cols-[minmax(10rem,1.3fr)_8rem_minmax(9rem,1fr)_minmax(10rem,1fr)_minmax(10rem,1fr)_8rem_8rem] gap-2 rounded-md border bg-muted/60 px-3 py-2 text-sm font-medium xl:grid">
                 <span>Device</span>
@@ -358,15 +331,20 @@ export function DevicesPage({ agents, onAfterWake }: Props) {
                 />
               ))}
               {!sortedDevices.length && (
-              <div className="rounded-md border bg-card p-4 text-sm text-muted-foreground">
+                <div className="flex flex-col items-center justify-center rounded-md border bg-card py-12 text-center">
-                No devices match the current filters.
+                  <Inbox className="size-10 text-muted-foreground/30" />
+                  <p className="mt-3 text-sm text-muted-foreground">
+                    No devices match the current filters
+                  </p>
                 </div>
               )}
             </div>
+          )}
         </CardContent>
       </Card>
 
       <FleetDeviceDetailsDialog
+        key={details?.device_key ?? "__none"}
         device={details}
         knownDevices={knownDevices}
         open={Boolean(details)}
@@ -397,8 +375,19 @@ function FleetDeviceRow({
   onDetails: () => void;
   onCopy: (label: string, value: string) => void;
 }) {
+  const presenceBorder =
+    device.presence === "online"
+      ? "border-l-emerald-500/70"
+      : device.presence === "likely_online"
+        ? "border-l-sky-500/60"
+        : device.presence === "offline"
+          ? "border-l-muted-foreground/20"
+          : "";
+
   return (
-    <div className="grid gap-3 rounded-md border bg-card px-3 py-3 text-sm xl:grid-cols-[minmax(10rem,1.3fr)_8rem_minmax(9rem,1fr)_minmax(10rem,1fr)_minmax(10rem,1fr)_8rem_8rem] xl:items-center xl:gap-2">
+    <div
+      className={`grid gap-3 rounded-md border border-l-[3px] ${presenceBorder} bg-card px-3 py-3 text-sm xl:grid-cols-[minmax(10rem,1.3fr)_8rem_minmax(9rem,1fr)_minmax(10rem,1fr)_minmax(10rem,1fr)_8rem_8rem] xl:items-center xl:gap-2`}
+    >
       <button className="min-w-0 text-left" type="button" onClick={onDetails}>
         <div className="truncate font-medium">{device.display_name}</div>
         <div className="mt-1 flex flex-wrap gap-1">
@@ -471,372 +460,3 @@ function FleetDeviceRow({
     </div>
   );
 }
-
-function FleetDeviceDetailsDialog({
-  device,
-  knownDevices,
-  open,
-  busy,
-  onOpenChange,
-  onWake,
-  onCopy,
-  onChanged,
-}: {
-  device: FleetDevice | null;
-  knownDevices: KnownDevice[];
-  open: boolean;
-  busy: boolean;
-  onOpenChange: (open: boolean) => void;
-  onWake: (routeId?: string | null) => void;
-  onCopy: (label: string, value: string) => void;
-  onChanged: () => void;
-}) {
-  const [displayName, setDisplayName] = useState("");
-  const [targetDeviceId, setTargetDeviceId] = useState("");
-  const [routeId, setRouteId] = useState("");
-  const [error, setError] = useState("");
-
-  useEffect(() => {
-    setDisplayName(device?.display_name ?? "");
-    setTargetDeviceId("");
-    setRouteId(device?.recommended_route?.route_id ?? "");
-    setError("");
-  }, [device]);
-
-  if (!device) return null;
-
-  const currentDevice = device;
-  const identifiers = identifiersFor(currentDevice);
-  const otherKnownDevices = knownDevices.filter(
-    (known) => known.device_id !== currentDevice.known_device?.device_id,
-  );
-
-  async function createRemembered() {
-    setError("");
-    try {
-      await createKnownDevice({
-        display_name: displayName.trim() || currentDevice.display_name,
-        pinned: true,
-        identifiers,
-      });
-      onChanged();
-    } catch (err) {
-      setError(String(err));
-    }
-  }
-
-  async function attachToExisting() {
-    if (!targetDeviceId) return;
-    setError("");
-    try {
-      for (const identifier of identifiers) {
-        await attachDeviceIdentifier(targetDeviceId, identifier);
-      }
-      onChanged();
-    } catch (err) {
-      setError(String(err));
-    }
-  }
-
-  async function mergeIntoExisting() {
-    if (!targetDeviceId || !currentDevice.known_device) return;
-    setError("");
-    try {
-      await mergeKnownDevice(
-        targetDeviceId,
-        currentDevice.known_device.device_id,
-      );
-      onChanged();
-      onOpenChange(false);
-    } catch (err) {
-      setError(String(err));
-    }
-  }
-
-  const selectedRoute =
-    device.route_candidates.find((route) => route.route_id === routeId) ??
-    device.recommended_route;
-
-  return (
-    <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-h-[92vh] overflow-auto sm:max-w-3xl">
-        <DialogHeader>
-          <div className="flex min-w-0 items-start justify-between gap-3 pr-8">
-            <div className="min-w-0">
-              <DialogTitle className="truncate">
-                {device.display_name}
-              </DialogTitle>
-              <DialogDescription>
-                {device.known_device
-                  ? "Remembered fleet device"
-                  : "Observed fleet device"}
-              </DialogDescription>
-            </div>
-            <PresenceBadge presence={device.presence} />
-          </div>
-        </DialogHeader>
-
-        {error && (
-          <pre className="max-h-40 overflow-auto rounded-md border border-destructive/60 bg-destructive/10 p-3 text-xs text-destructive">
-            {error}
-          </pre>
-        )}
-
-        <div className="grid gap-3 md:grid-cols-2">
-          <DetailBlock label="IPs" values={device.ips} onCopy={onCopy} />
-          <DetailBlock label="MACs" values={device.macs} onCopy={onCopy} />
-          <DetailBlock
-            label="Hostnames"
-            values={device.hostnames}
-            onCopy={onCopy}
-          />
-          <DetailBlock
-            label="Agents"
-            values={device.agents.map((agent) =>
-              agentLabel(agent.agent_id, agent.nickname),
-            )}
-            onCopy={onCopy}
-          />
-        </div>
-
-        <Separator />
-
-        <div className="grid gap-2">
-          <div className="flex items-center justify-between gap-2">
-            <h3 className="text-sm font-medium">Wake route</h3>
-            <Button
-              size="sm"
-              onClick={() => onWake(selectedRoute?.route_id ?? null)}
-              disabled={busy || !selectedRoute?.wakeable}
-            >
-              <Zap className="size-4" aria-hidden />
-              {busy ? "Waking" : "Wake"}
-            </Button>
-          </div>
-          <Select
-            value={routeId}
-            onValueChange={(value) => setRouteId(value ?? "")}
-          >
-            <SelectTrigger>
-              <span>
-                {selectedRoute
-                  ? routeLabel(selectedRoute)
-                  : "No connected MAC-backed route"}
-              </span>
-            </SelectTrigger>
-            <SelectContent alignItemWithTrigger={false}>
-              {device.route_candidates.map((route) => (
-                <SelectItem key={route.route_id} value={route.route_id}>
-                  {routeLabel(route)}
-                </SelectItem>
-              ))}
-            </SelectContent>
-          </Select>
-        </div>
-
-        <Separator />
-
-        <div className="grid gap-3">
-          <h3 className="text-sm font-medium">Remember / merge</h3>
-          {!device.known_device && (
-            <div className="grid gap-2 md:grid-cols-[minmax(0,1fr)_auto]">
-              <Input
-                value={displayName}
-                onChange={(event) => setDisplayName(event.target.value)}
-                placeholder="Device name"
-              />
-              <Button
-                onClick={() => void createRemembered()}
-                disabled={!identifiers.length}
-              >
-                Remember device
-              </Button>
-            </div>
-          )}
-          <div className="grid gap-2 md:grid-cols-[minmax(0,1fr)_auto_auto]">
-            <Select
-              value={targetDeviceId}
-              onValueChange={(value) => setTargetDeviceId(value ?? "")}
-            >
-              <SelectTrigger>
-                <span>
-                  {targetDeviceId
-                    ? knownDevices.find(
-                        (known) => known.device_id === targetDeviceId,
-                      )?.display_name
-                    : "Select known device"}
-                </span>
-              </SelectTrigger>
-              <SelectContent
-                className="max-w-[min(92vw,30rem)]"
-                alignItemWithTrigger={false}
-              >
-                {otherKnownDevices.map((known) => (
-                  <SelectItem key={known.device_id} value={known.device_id}>
-                    {known.display_name}
-                  </SelectItem>
-                ))}
-              </SelectContent>
-            </Select>
-            <Button
-              variant="outline"
-              onClick={() => void attachToExisting()}
-              disabled={!targetDeviceId || !identifiers.length}
-            >
-              Attach IDs
-            </Button>
-            <Button
-              variant="outline"
-              onClick={() => void mergeIntoExisting()}
-              disabled={!targetDeviceId || !device.known_device}
-            >
-              Merge
-            </Button>
-          </div>
-          <p className="text-xs text-muted-foreground">
-            Proposed identifiers:{" "}
-            {identifiers.map((id) => `${id.kind}:${id.value}`).join(", ") ||
-              "-"}
-          </p>
-        </div>
-
-        <DialogFooter>
-          <Button variant="outline" onClick={() => onOpenChange(false)}>
-            Close
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}
-
-function FilterSelect({
-  label,
-  value,
-  values,
-  onChange,
-}: {
-  label: string;
-  value: string;
-  values: readonly string[];
-  onChange: (value: string) => void;
-}) {
-  return (
-    <label className="grid gap-1 text-sm text-muted-foreground">
-      <span>{label}</span>
-      <Select value={value} onValueChange={(next) => next && onChange(next)}>
-        <SelectTrigger>
-          <span>{value.replace("_", " ")}</span>
-        </SelectTrigger>
-        <SelectContent alignItemWithTrigger={false}>
-          {values.map((item) => (
-            <SelectItem key={item} value={item}>
-              {item.replace("_", " ")}
-            </SelectItem>
-          ))}
-        </SelectContent>
-      </Select>
-    </label>
-  );
-}
-
-function DetailBlock({
-  label,
-  values,
-  onCopy,
-}: {
-  label: string;
-  values: string[];
-  onCopy: (label: string, value: string) => void;
-}) {
-  return (
-    <div className="rounded-md border bg-muted/30 p-3">
-      <div className="mb-2 text-xs font-medium uppercase text-muted-foreground">
-        {label}
-      </div>
-      <div className="grid gap-1">
-        {values.length ? (
-          values.map((value) => (
-            <button
-              key={value}
-              type="button"
-              className="flex min-w-0 items-center justify-between gap-2 rounded px-1 py-0.5 text-left hover:bg-accent"
-              onClick={() => onCopy(label, value)}
-            >
-              <span className="min-w-0 truncate">{value}</span>
-              <Copy
-                className="size-3.5 shrink-0 text-muted-foreground"
-                aria-hidden
-              />
-            </button>
-          ))
-        ) : (
-          <span className="text-sm text-muted-foreground">-</span>
-        )}
-      </div>
-    </div>
-  );
-}
-
-function PresenceBadge({ presence }: { presence: string }) {
-  return (
-    <Badge variant={presence === "offline" ? "outline" : "secondary"}>
-      {presence.replace("_", " ")}
-    </Badge>
-  );
-}
-
-function MobileLabel({ label }: { label: string }) {
-  return (
-    <span className="mb-1 block text-xs font-medium text-muted-foreground xl:hidden">
-      {label}
-    </span>
-  );
-}
-
-function summarize(values: string[]): string {
-  if (!values.length) return "-";
-  if (values.length <= 2) return values.join(", ");
-  return `${values[0]}, ${values[1]} (+${values.length - 2})`;
-}
-
-function formatSeen(value: number | null): string {
-  if (!value) return "-";
-  const seconds = Math.max(0, Math.floor(Date.now() / 1000) - value);
-  if (seconds < 60) return `${seconds}s ago`;
-  const minutes = Math.floor(seconds / 60);
-  if (minutes < 60) return `${minutes}m ago`;
-  const hours = Math.floor(minutes / 60);
-  if (hours < 48) return `${hours}h ago`;
-  return new Date(value * 1000).toLocaleString();
-}
-
-function presenceRank(presence: string): number {
-  if (presence === "online") return 4;
-  if (presence === "likely_online") return 3;
-  if (presence === "unknown") return 2;
-  if (presence === "offline") return 1;
-  return 0;
-}
-
-function identifiersFor(
-  device: FleetDevice,
-): { kind: string; value: string }[] {
-  return [
-    ...device.macs.map((value) => ({ kind: "mac", value })),
-    ...device.ips.map((value) => ({ kind: "ip", value })),
-  ];
-}
-
-function agentLabel(agentId: string, nickname?: string | null): string {
-  const trimmed = nickname?.trim();
-  return trimmed ? trimmed : agentId;
-}
-
-function routeLabel(route: FleetWakeRoute): string {
-  const status = route.connected ? "connected" : "offline";
-  const target = route.mac
-    ? `${route.mac}${route.ip ? ` / ${route.ip}` : ""}`
-    : (route.ip ?? "-");
-  return `${agentLabel(route.agent_id, route.nickname)} · ${target} · ${route.source} · ${status}`;
-}

ui/src/pages/ObservationsPage.tsx

@@ -1 +0,0 @@
-export { ObservationsPage } from "@/pages/observations/ObservationsPage";

ui/src/pages/TerminalPage.tsx

@@ -0,0 +1,794 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+import { ClipboardAddon } from "@xterm/addon-clipboard";
+import { FitAddon } from "@xterm/addon-fit";
+import { Unicode11Addon } from "@xterm/addon-unicode11";
+import { UnicodeGraphemesAddon } from "@xterm/addon-unicode-graphemes";
+import { WebLinksAddon } from "@xterm/addon-web-links";
+import { Terminal as XTerm } from "@xterm/xterm";
+import { Eraser, Plus, RotateCcw, Terminal, X } from "lucide-react";
+import { toast } from "sonner";
+
+import {
+  APIError,
+  type Agent,
+  type TerminalSession,
+  attachTerminal,
+  closeTerminal,
+  createTerminal,
+  listTerminals,
+} from "@/api";
+import { AgentSelector, displayAgentLabel } from "@/components/AgentSelector";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from "@/components/ui/tooltip";
+
+type Props = {
+  agents: Agent[];
+  selectedAgentId: string;
+  onSelectAgent: (agentId: string) => void;
+};
+
+type ConnectionState =
+  | "idle"
+  | "connecting"
+  | "ready"
+  | "disconnected"
+  | "exited";
+
+const REMEMBERED_TERMINAL_KEY = "wakey.active-terminal-id";
+const TERMINAL_OPERATOR_KEY = "wakey.terminal-operator-id";
+
+// polyfill for testing in browsers that don't support crypto.randomUUID()
+const thing = () =>
+  (String(1e7) + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c: string) => {
+    const num = Number(c);
+    return (
+      num ^
+      (window.crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (num / 4)))
+    ).toString(16);
+  });
+
+function terminalOperatorId(): string {
+  // Session storage survives route unmounts but remains scoped to this browser
+  // tab. The ID coordinates attachment ownership; API authentication remains
+  // the security boundary.
+  const remembered = window.sessionStorage.getItem(TERMINAL_OPERATOR_KEY);
+  if (remembered) return remembered;
+  const created = window.crypto.randomUUID?.() ?? thing();
+  window.sessionStorage.setItem(TERMINAL_OPERATOR_KEY, created);
+  return created;
+}
+
+function mergeTerminalSession(
+  sessions: TerminalSession[],
+  next: TerminalSession,
+): TerminalSession[] {
+  const remaining = sessions.filter(
+    (item) => item.terminal_id !== next.terminal_id,
+  );
+  return [...remaining, next].sort(
+    (left, right) => left.created_at_unix - right.created_at_unix,
+  );
+}
+
+function orderTerminalSessions(sessions: TerminalSession[]): TerminalSession[] {
+  return [...sessions].sort(
+    (left, right) => left.created_at_unix - right.created_at_unix,
+  );
+}
+
+function reconcileTerminalSessions(
+  current: TerminalSession[],
+  listed: TerminalSession[],
+): TerminalSession[] {
+  const listedById = new Map(listed.map((item) => [item.terminal_id, item]));
+  const retained = current.flatMap((item) => {
+    const updated = listedById.get(item.terminal_id);
+    if (!updated) return [];
+    listedById.delete(item.terminal_id);
+    return [updated];
+  });
+  return [...retained, ...orderTerminalSessions([...listedById.values()])];
+}
+
+function restoreCandidates(
+  sessions: TerminalSession[],
+  rememberedId: string | null,
+  selectedAgentId: string,
+): TerminalSession[] {
+  const remembered = sessions.find((item) => item.terminal_id === rememberedId);
+  const available = sessions.filter(
+    (item) => !item.operator_attached && item !== remembered,
+  );
+  available.sort((left, right) => {
+    const leftPreferred = left.agent_id === selectedAgentId ? 1 : 0;
+    const rightPreferred = right.agent_id === selectedAgentId ? 1 : 0;
+    return (
+      rightPreferred - leftPreferred ||
+      right.created_at_unix - left.created_at_unix
+    );
+  });
+  return remembered ? [remembered, ...available] : available;
+}
+
+function websocketUrl(path: string): string {
+  const scheme = window.location.protocol === "https:" ? "wss:" : "ws:";
+  return `${scheme}//${window.location.host}${path}`;
+}
+
+function terminalCreatedTime(createdAtUnix: number): string {
+  return new Date(createdAtUnix * 1000).toLocaleTimeString([], {
+    hour: "2-digit",
+    minute: "2-digit",
+  });
+}
+
+export function TerminalPage({
+  agents,
+  selectedAgentId,
+  onSelectAgent,
+}: Props) {
+  const hostRef = useRef<HTMLDivElement>(null);
+  const terminalRef = useRef<XTerm | null>(null);
+  const fitRef = useRef<FitAddon | null>(null);
+  const socketRef = useRef<WebSocket | null>(null);
+  const activeSessionRef = useRef<TerminalSession | null>(null);
+  const selectedAgentIdRef = useRef(selectedAgentId);
+  const lastTerminalSizeRef = useRef({ rows: 0, cols: 0 });
+  const [sessions, setSessions] = useState<TerminalSession[]>([]);
+  const [session, setSession] = useState<TerminalSession | null>(null);
+  const [connection, setConnection] = useState<ConnectionState>("idle");
+  const [sessionTitles, setSessionTitles] = useState<Record<string, string>>(
+    {},
+  );
+  const [operatorId] = useState(terminalOperatorId);
+
+  activeSessionRef.current = session;
+  selectedAgentIdRef.current = selectedAgentId;
+
+  const selectedAgent = agents.find(
+    (agent) => agent.agent_id === selectedAgentId,
+  );
+  const selectedAgentSessionCount = sessions.filter(
+    (item) => item.agent_id === selectedAgentId,
+  ).length;
+  const agentAtSessionLimit = selectedAgentSessionCount >= 2;
+  const canRequestStart =
+    selectedAgent?.connected &&
+    selectedAgent.capabilities.includes("terminal") &&
+    connection !== "connecting";
+
+  const detachTransport = useCallback(() => {
+    const socket = socketRef.current;
+    socketRef.current = null;
+    socket?.close();
+  }, []);
+
+  const sendResize = useCallback(() => {
+    const terminal = terminalRef.current;
+    const socket = socketRef.current;
+    if (!terminal || socket?.readyState !== WebSocket.OPEN) return;
+    if (
+      lastTerminalSizeRef.current.rows === terminal.rows &&
+      lastTerminalSizeRef.current.cols === terminal.cols
+    ) {
+      return;
+    }
+    lastTerminalSizeRef.current = {
+      rows: terminal.rows,
+      cols: terminal.cols,
+    };
+    socket.send(
+      JSON.stringify({
+        type: "resize",
+        rows: terminal.rows,
+        cols: terminal.cols,
+      }),
+    );
+  }, []);
+
+  const connect = useCallback(
+    (nextSession: TerminalSession) => {
+      if (!nextSession.attachment_token) {
+        throw new Error(
+          "Control plane did not issue a terminal attachment token",
+        );
+      }
+      detachTransport();
+      setSession(nextSession);
+      activeSessionRef.current = nextSession;
+      setSessions((current) =>
+        mergeTerminalSession(current, {
+          ...nextSession,
+          operator_attached: true,
+        }),
+      );
+      window.sessionStorage.setItem(
+        REMEMBERED_TERMINAL_KEY,
+        nextSession.terminal_id,
+      );
+      setConnection("connecting");
+      const socket = new WebSocket(websocketUrl(nextSession.websocket_url));
+      socket.binaryType = "arraybuffer";
+      socketRef.current = socket;
+
+      socket.onopen = () => {
+        socket.send(
+          JSON.stringify({
+            type: "attach",
+            attachment_token: nextSession.attachment_token,
+            operator_id: operatorId,
+          }),
+        );
+        fitRef.current?.fit();
+        sendResize();
+      };
+      socket.onmessage = (event) => {
+        if (socketRef.current !== socket) return;
+        if (typeof event.data !== "string") {
+          terminalRef.current?.write(new Uint8Array(event.data as ArrayBuffer));
+          return;
+        }
+        try {
+          const control = JSON.parse(event.data) as {
+            type: string;
+            exit_code?: number | null;
+            message?: string;
+          };
+          if (control.type === "ready") {
+            setConnection("ready");
+            window.requestAnimationFrame(() => {
+              fitRef.current?.fit();
+              lastTerminalSizeRef.current = { rows: 0, cols: 0 };
+              sendResize();
+              terminalRef.current?.focus();
+            });
+          } else if (control.type === "exited") {
+            setConnection("exited");
+            terminalRef.current?.writeln(
+              `\r\n[process exited${control.exit_code == null ? "" : ` ${control.exit_code}`}]`,
+            );
+          } else if (control.type === "error") {
+            setConnection("exited");
+            terminalRef.current?.writeln(
+              `\r\n[terminal error: ${control.message ?? "unknown error"}]`,
+            );
+          }
+        } catch {
+          terminalRef.current?.writeln("\r\n[invalid terminal control frame]");
+        }
+      };
+      socket.onerror = () => {
+        if (socketRef.current !== socket) return;
+        terminalRef.current?.writeln("\r\n[terminal transport error]");
+      };
+      socket.onclose = () => {
+        if (socketRef.current !== socket) return;
+        socketRef.current = null;
+        setSessions((current) =>
+          current.map((item) =>
+            item.terminal_id === nextSession.terminal_id
+              ? { ...item, operator_attached: false }
+              : item,
+          ),
+        );
+        setConnection((current) => {
+          if (current === "exited") return current;
+          return "disconnected";
+        });
+      };
+    },
+    [detachTransport, operatorId, sendResize],
+  );
+
+  useEffect(() => {
+    if (!hostRef.current) return;
+    const terminal = new XTerm({
+      cursorBlink: true,
+      convertEol: false,
+      fontFamily: '"SFMono-Regular", Consolas, "Liberation Mono", monospace',
+      fontSize: 14,
+      lineHeight: 1.1,
+      // xterm uses this width for its internal scrollbar as well as the
+      // overview ruler. Reserve a larger touch target on coarse pointers.
+      overviewRuler: {
+        width: window.matchMedia("(pointer: coarse)").matches ? 22 : 16,
+      },
+      scrollback: 5000,
+      theme: {
+        background: "#0b1117",
+        foreground: "#e5e7eb",
+        cursor: "#6ee7a8",
+        scrollbarSliderBackground: "#52617099",
+        scrollbarSliderHoverBackground: "#6b7c8dcc",
+        scrollbarSliderActiveBackground: "#8294a6",
+      },
+      allowProposedApi: true, // this for unicode11 addon. FOR SOME reason xtermjs doesnt tell me this in the readme.
+    });
+    terminal.loadAddon(new Unicode11Addon());
+    terminal.unicode.activeVersion = "11";
+    terminal.loadAddon(new UnicodeGraphemesAddon());
+    terminal.loadAddon(new WebLinksAddon());
+    const fit = new FitAddon();
+    terminal.loadAddon(new ClipboardAddon());
+    terminal.loadAddon(fit);
+    terminal.open(hostRef.current);
+    terminal.attachCustomKeyEventHandler((event) => {
+      const copiesTerminalSelection =
+        event.type === "keydown" &&
+        event.ctrlKey &&
+        event.shiftKey &&
+        event.code === "KeyC";
+      if (!copiesTerminalSelection) return true;
+
+      // Chromium reserves Ctrl+Shift+C for DevTools. Other clipboard shortcuts
+      // fall through to xterm's native copy/paste event handlers.
+      event.preventDefault();
+      event.stopPropagation();
+      if (terminal.hasSelection()) {
+        if (!navigator.clipboard) {
+          toast.error("Clipboard access requires HTTPS or localhost");
+        } else {
+          void navigator.clipboard
+            .writeText(terminal.getSelection())
+            .catch((error) =>
+              toast.error("Clipboard access was denied", {
+                description: String(error),
+              }),
+            );
+        }
+      }
+      return false;
+    });
+    const titleChange = terminal.onTitleChange((title) => {
+      const terminalId = activeSessionRef.current?.terminal_id;
+      if (!terminalId) return;
+      const normalized = title.trim();
+      setSessionTitles((current) => {
+        if (current[terminalId] === normalized) return current;
+        if (!normalized) {
+          const next = { ...current };
+          delete next[terminalId];
+          return next;
+        }
+        return { ...current, [terminalId]: normalized };
+      });
+    });
+    fit.fit();
+    terminalRef.current = terminal;
+    fitRef.current = fit;
+
+    async function restoreTerminalSession() {
+      try {
+        const listed = await listTerminals();
+        if (cancelled) return;
+        setSessions(orderTerminalSessions(listed));
+        const rememberedId = window.sessionStorage.getItem(
+          REMEMBERED_TERMINAL_KEY,
+        );
+        const candidates = restoreCandidates(
+          listed,
+          rememberedId,
+          selectedAgentIdRef.current,
+        );
+
+        for (const candidate of candidates) {
+          setConnection("connecting");
+          try {
+            const attached = await attachTerminal(
+              candidate.terminal_id,
+              operatorId,
+            );
+            if (cancelled) return;
+            terminal.reset();
+            connect(attached);
+            return;
+          } catch (error) {
+            if (
+              !(error instanceof APIError) ||
+              error.code !== "terminal_operator_already_attached"
+            ) {
+              throw error;
+            }
+          }
+        }
+        setConnection("idle");
+      } catch (error) {
+        if (cancelled) return;
+        setConnection("idle");
+        toast.error("Could not restore terminal session", {
+          description: String(error),
+        });
+      }
+    }
+
+    let cancelled = false;
+    void document.fonts.ready.then(() => {
+      if (cancelled) return;
+      fit.fit();
+      lastTerminalSizeRef.current = { rows: 0, cols: 0 };
+      sendResize();
+    });
+
+    const input = terminal.onData((data) => {
+      const socket = socketRef.current;
+      if (socket?.readyState === WebSocket.OPEN) {
+        socket.send(new TextEncoder().encode(data));
+      }
+    });
+    let resizeFrame = 0;
+    let lastHostWidth = 0;
+    let lastHostHeight = 0;
+    const resizeObserver = new ResizeObserver(([entry]) => {
+      const width = Math.round(entry.contentRect.width);
+      const height = Math.round(entry.contentRect.height);
+      if (width === lastHostWidth && height === lastHostHeight) return;
+      lastHostWidth = width;
+      lastHostHeight = height;
+      window.cancelAnimationFrame(resizeFrame);
+      resizeFrame = window.requestAnimationFrame(() => {
+        fit.fit();
+        sendResize();
+      });
+    });
+    resizeObserver.observe(hostRef.current);
+    void restoreTerminalSession();
+    const sessionRefresh = window.setInterval(() => {
+      void listTerminals()
+        .then((listed) => {
+          if (!cancelled) {
+            setSessions((current) =>
+              reconcileTerminalSessions(current, listed),
+            );
+          }
+        })
+        .catch(() => {
+          // The attached terminal transport remains authoritative while a
+          // background list refresh is temporarily unavailable.
+        });
+    }, 5000);
+
+    return () => {
+      cancelled = true;
+      input.dispose();
+      titleChange.dispose();
+      resizeObserver.disconnect();
+      window.cancelAnimationFrame(resizeFrame);
+      window.clearInterval(sessionRefresh);
+      detachTransport();
+      terminal.dispose();
+      terminalRef.current = null;
+      fitRef.current = null;
+    };
+  }, [connect, detachTransport, sendResize]);
+
+  async function start() {
+    if (!selectedAgentId || !terminalRef.current) return;
+    if (agentAtSessionLimit) {
+      toast.error("Terminal session limit reached", {
+        description: `${selectedAgent ? displayAgentLabel(selectedAgent) : selectedAgentId} already reached the active session limit. Close one before opening another.`,
+      });
+      return;
+    }
+    const previousSession = activeSessionRef.current;
+    detachTransport();
+    if (previousSession) {
+      setSessions((current) =>
+        current.map((item) =>
+          item.terminal_id === previousSession.terminal_id
+            ? { ...item, operator_attached: false }
+            : item,
+        ),
+      );
+    }
+    setConnection("connecting");
+    terminalRef.current.reset();
+    try {
+      fitRef.current?.fit();
+      const created = await createTerminal(
+        selectedAgentId,
+        terminalRef.current.rows,
+        terminalRef.current.cols,
+      );
+      connect(created);
+    } catch (error) {
+      setSession(null);
+      activeSessionRef.current = null;
+      setConnection("idle");
+      toast.error("Could not start terminal", { description: String(error) });
+    }
+  }
+
+  async function activateSession(nextSession: TerminalSession) {
+    if (nextSession.terminal_id === session?.terminal_id) return;
+    if (nextSession.operator_attached) return;
+
+    const previousSession = activeSessionRef.current;
+    detachTransport();
+    if (previousSession) {
+      setSessions((current) =>
+        current.map((item) =>
+          item.terminal_id === previousSession.terminal_id
+            ? { ...item, operator_attached: false }
+            : item,
+        ),
+      );
+    }
+    setSession(null);
+    activeSessionRef.current = null;
+    setConnection("connecting");
+    terminalRef.current?.reset();
+    window.sessionStorage.setItem(
+      REMEMBERED_TERMINAL_KEY,
+      nextSession.terminal_id,
+    );
+
+    try {
+      const attached = await attachTerminal(
+        nextSession.terminal_id,
+        operatorId,
+      );
+      connect(attached);
+    } catch (error) {
+      setConnection("idle");
+      toast.error("Could not attach terminal session", {
+        description: String(error),
+      });
+      void listTerminals()
+        .then((listed) =>
+          setSessions((current) => reconcileTerminalSessions(current, listed)),
+        )
+        .catch(() => undefined);
+    }
+  }
+
+  async function reconnect() {
+    if (!session) return;
+    detachTransport();
+    try {
+      terminalRef.current?.reset();
+      setConnection("connecting");
+      const attached = await attachTerminal(session.terminal_id, operatorId);
+      connect(attached);
+    } catch (error) {
+      setConnection("disconnected");
+      toast.error("Terminal session is no longer available", {
+        description: String(error),
+      });
+    }
+  }
+
+  async function closeSession(closingSession: TerminalSession) {
+    const closingId = closingSession.terminal_id;
+    const closesActiveSession =
+      closingId === activeSessionRef.current?.terminal_id;
+    const remaining = sessions.filter((item) => item.terminal_id !== closingId);
+    const fallback = remaining.find((item) => !item.operator_attached);
+
+    if (closesActiveSession) {
+      if (socketRef.current?.readyState === WebSocket.OPEN) {
+        socketRef.current.send(JSON.stringify({ type: "close" }));
+      }
+      detachTransport();
+    }
+    try {
+      await closeTerminal(closingId);
+    } catch (error) {
+      toast.error("Terminal cleanup failed", { description: String(error) });
+      void listTerminals()
+        .then((listed) =>
+          setSessions((current) => reconcileTerminalSessions(current, listed)),
+        )
+        .catch(() => undefined);
+      return;
+    }
+
+    setSessions((current) =>
+      current.filter((item) => item.terminal_id !== closingId),
+    );
+    setSessionTitles((current) => {
+      const next = { ...current };
+      delete next[closingId];
+      return next;
+    });
+    if (window.sessionStorage.getItem(REMEMBERED_TERMINAL_KEY) === closingId) {
+      window.sessionStorage.removeItem(REMEMBERED_TERMINAL_KEY);
+    }
+    if (closesActiveSession) {
+      setSession(null);
+      activeSessionRef.current = null;
+      setConnection("idle");
+      // xterm.clear() deliberately preserves the active cursor line. Closing
+      // a session should discard its complete screen and terminal modes.
+      terminalRef.current?.reset();
+      if (fallback) void activateSession(fallback);
+    }
+  }
+
+  return (
+    <section className="terminal-page" aria-label="Remote terminal">
+      <header className="terminal-toolbar">
+        <div className="terminal-heading">
+          <Terminal className="size-5 text-primary" aria-hidden />
+          <h1>Remote Terminal</h1>
+        </div>
+
+        <div className="terminal-controls">
+          <AgentSelector
+            agents={agents.filter(
+              (agent) =>
+                agent.connected && agent.capabilities.includes("terminal"),
+            )}
+            value={selectedAgentId}
+            onChange={onSelectAgent}
+            disabled={connection === "connecting"}
+            className="w-full min-w-0 sm:w-64"
+          />
+        </div>
+      </header>
+
+      {!selectedAgent && connection === "idle" ? (
+        <p className="terminal-notice">
+          No connected terminal-capable agent is selected.
+        </p>
+      ) : selectedAgent && !selectedAgent.capabilities.includes("terminal") ? (
+        <p className="terminal-notice">
+          This agent has not enabled remote terminal capability.
+        </p>
+      ) : null}
+
+      <div className="terminal-frame">
+        <div className="terminal-framebar">
+          <div className="terminal-tabs">
+            <div
+              className="terminal-tab-list"
+              role="tablist"
+              aria-label="Terminal sessions"
+            >
+              {sessions.length === 0 ? (
+                <div className="terminal-session-label">
+                  <Terminal className="size-4" aria-hidden />
+                  <span>No active session</span>
+                </div>
+              ) : (
+                sessions.map((item) => {
+                  const agent = agents.find(
+                    (candidate) => candidate.agent_id === item.agent_id,
+                  );
+                  const active = item.terminal_id === session?.terminal_id;
+                  const locked = item.operator_attached && !active;
+                  const agentLabel = agent
+                    ? displayAgentLabel(agent)
+                    : item.agent_id;
+                  const sessionTitle = sessionTitles[item.terminal_id];
+                  const tabLabel = sessionTitle
+                    ? `${agentLabel} · ${sessionTitle}`
+                    : agentLabel;
+                  return (
+                    <div
+                      key={item.terminal_id}
+                      role="presentation"
+                      className="terminal-tab"
+                      data-active={active || undefined}
+                      data-locked={locked || undefined}
+                    >
+                      <button
+                        type="button"
+                        role="tab"
+                        aria-selected={active}
+                        className="terminal-tab-select"
+                        disabled={locked || connection === "connecting"}
+                        title={
+                          locked ? "Attached in another browser" : tabLabel
+                        }
+                        onClick={() => void activateSession(item)}
+                      >
+                        <span
+                          className="terminal-tab-dot"
+                          data-state={
+                            active
+                              ? connection
+                              : locked
+                                ? "attached"
+                                : item.agent_attached
+                                  ? "detached"
+                                  : "disconnected"
+                          }
+                          aria-hidden
+                        />
+                        <span className="terminal-tab-label">{tabLabel}</span>
+                        <time
+                          dateTime={new Date(
+                            item.created_at_unix * 1000,
+                          ).toISOString()}
+                        >
+                          {terminalCreatedTime(item.created_at_unix)}
+                        </time>
+                      </button>
+                      <button
+                        type="button"
+                        className="terminal-tab-close"
+                        disabled={locked}
+                        aria-label={`Close ${agentLabel} terminal session`}
+                        title={
+                          locked
+                            ? "Attached in another browser"
+                            : "Close session"
+                        }
+                        onClick={() => void closeSession(item)}
+                      >
+                        <X className="size-3.5" aria-hidden />
+                      </button>
+                    </div>
+                  );
+                })
+              )}
+            </div>
+            <Tooltip>
+              <TooltipTrigger>
+                <Button
+                  type="button"
+                  size="icon"
+                  variant="ghost"
+                  className="terminal-new-tab"
+                  disabled={!canRequestStart}
+                  aria-label="New terminal session"
+                  onClick={start}
+                >
+                  <Plus className="size-4" aria-hidden />
+                </Button>
+              </TooltipTrigger>
+              <TooltipContent>
+                {agentAtSessionLimit
+                  ? "Two-session limit reached"
+                  : "New session"}
+              </TooltipContent>
+            </Tooltip>
+          </div>
+
+          <div className="terminal-frame-actions">
+            <Badge
+              variant="outline"
+              className="terminal-status"
+              data-state={connection}
+            >
+              <span aria-hidden />
+              {connection}
+            </Badge>
+            {connection === "disconnected" ? (
+              <Button
+                type="button"
+                size="sm"
+                variant="ghost"
+                onClick={reconnect}
+              >
+                <RotateCcw className="size-4" aria-hidden />
+                Reconnect
+              </Button>
+            ) : null}
+            <Tooltip>
+              <TooltipTrigger>
+                <Button
+                  type="button"
+                  size="icon"
+                  variant="ghost"
+                  disabled={connection === "idle"}
+                  aria-label="Clear terminal"
+                  onClick={() => terminalRef.current?.clear()}
+                >
+                  <Eraser className="size-4" aria-hidden />
+                </Button>
+              </TooltipTrigger>
+              <TooltipContent>Clear terminal</TooltipContent>
+            </Tooltip>
+          </div>
+        </div>
+        <div className="terminal-surface" ref={hostRef} />
+      </div>
+    </section>
+  );
+}

ui/src/pages/TokensPage.tsx

@@ -1,4 +1,6 @@
 import { useEffect, useMemo, useState } from "react";
+import { toast } from "sonner";
+import { Key, Copy, Inbox } from "lucide-react";
 
 import {
   type EnrollTokenStatus,
@@ -8,19 +10,36 @@ import {
 } from "@/api";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 
 function formatUnix(unix: number): string {
   return new Date(unix * 1000).toLocaleString();
 }
 
+const TTL_PRESETS = [
+  { label: "1 hour", seconds: 3600 },
+  { label: "12 hours", seconds: 43200 },
+  { label: "1 day", seconds: 86400 },
+  { label: "7 days", seconds: 604800 },
+] as const;
+
 export function TokensPage() {
   const [tokens, setTokens] = useState<EnrollTokenStatus[]>([]);
-  const [ttlSeconds, setTtlSeconds] = useState("86400");
+  const [ttlSeconds, setTtlSeconds] = useState(86400);
-  const [status, setStatus] = useState("");
+  const [customTtl, setCustomTtl] = useState("");
-  const [error, setError] = useState("");
+  const [useCustom, setUseCustom] = useState(false);
   const [busy, setBusy] = useState(false);
+  const [lastIssued, setLastIssued] = useState<{
+    token: string;
+    expires: string;
+  } | null>(null);
 
   const activeCount = useMemo(
     () => tokens.filter((t) => !t.expired).length,
@@ -29,12 +48,11 @@ export function TokensPage() {
 
   async function load() {
     setBusy(true);
-    setError("");
     try {
       const next = await fetchEnrollTokens();
       setTokens(next);
     } catch (err) {
-      setError(String(err));
+      toast.error("Failed to load tokens", { description: String(err) });
     } finally {
       setBusy(false);
     }
@@ -42,17 +60,23 @@ export function TokensPage() {
 
   async function onIssue() {
     setBusy(true);
-    setError("");
-    setStatus("");
     try {
-      const ttl = Number.parseInt(ttlSeconds, 10);
+      const effectiveTtl = useCustom
-      const issued = await issueEnrollToken(Number.isFinite(ttl) ? ttl : 86400);
+        ? Number.parseInt(customTtl, 10) || 86400
-      setStatus(
+        : ttlSeconds;
-        `Issued ${issued.enroll_token} (expires ${formatUnix(issued.expires_at_unix)})`,
+      const issued = await issueEnrollToken(
+        Number.isFinite(effectiveTtl) ? effectiveTtl : 86400,
       );
+      setLastIssued({
+        token: issued.enroll_token,
+        expires: formatUnix(issued.expires_at_unix),
+      });
+      toast.success("Token issued", {
+        description: `Expires ${formatUnix(issued.expires_at_unix)}`,
+      });
       await load();
     } catch (err) {
-      setError(String(err));
+      toast.error("Failed to issue token", { description: String(err) });
     } finally {
       setBusy(false);
     }
@@ -60,30 +84,50 @@ export function TokensPage() {
 
   async function onRevoke(token: string) {
     setBusy(true);
-    setError("");
-    setStatus("");
     try {
       const result = await revokeEnrollToken(token);
-      setStatus(
+      if (result.revoked) {
-        result.revoked ? `Revoked ${token}` : `${token} was already absent`,
+        toast.success(`Revoked ${token}`);
-      );
+      } else {
+        toast.info(`${token} was already absent`);
+      }
       await load();
     } catch (err) {
-      setError(String(err));
+      toast.error("Failed to revoke token", { description: String(err) });
     } finally {
       setBusy(false);
     }
   }
 
+  async function copyToClipboard(text: string) {
+    try {
+      await navigator.clipboard.writeText(text);
+      toast.success("Copied to clipboard");
+    } catch {
+      toast.error("Copy failed");
+    }
+  }
+
   useEffect(() => {
     void load();
   }, []);
 
+  const controlPlaneUrl =
+    window.location.origin.replace(/:\d+$/, "") || "https://cp.example.com";
+
   return (
-    <section className="grid gap-3 xl:grid-cols-2">
+    <section className="grid gap-4 xl:grid-cols-2">
       <Card>
-        <CardHeader className="flex flex-row items-start justify-between gap-3 space-y-0">
+        <CardHeader className="flex flex-row items-start justify-between gap-3 gap-y-0">
-          <CardTitle>Enroll Tokens</CardTitle>
+          <div>
+            <CardTitle className="flex items-center gap-2">
+              <Key className="size-5 text-primary" />
+              Enroll Tokens
+            </CardTitle>
+            <CardDescription className="mt-1">
+              {activeCount} active, {tokens.length} shown
+            </CardDescription>
+          </div>
           <Button
             variant="outline"
             size="sm"
@@ -94,17 +138,16 @@ export function TokensPage() {
           </Button>
         </CardHeader>
         <CardContent className="space-y-3">
-          <p className="text-sm text-muted-foreground">
-            {activeCount} active, {tokens.length} shown
-          </p>
           <div className="grid gap-2">
             {tokens.map((token) => (
               <div
                 className="flex items-start justify-between gap-3 rounded-md border bg-card px-3 py-2"
                 key={token.enroll_token}
               >
-                <div>
+                <div className="min-w-0">
-                  <strong>{token.enroll_token}</strong>
+                  <strong className="block truncate text-sm">
+                    {token.enroll_token}
+                  </strong>
                   <div className="text-xs text-muted-foreground">
                     expires: {formatUnix(token.expires_at_unix)}
                   </div>
@@ -125,43 +168,117 @@ export function TokensPage() {
               </div>
             ))}
             {!tokens.length && (
-              <div className="px-1 py-2 text-sm text-muted-foreground">
+              <div className="flex flex-col items-center justify-center py-8 text-center">
+                <Inbox className="size-8 text-muted-foreground/40" />
+                <p className="mt-2 text-sm text-muted-foreground">
                   No tokens found
+                </p>
               </div>
             )}
           </div>
         </CardContent>
       </Card>
 
+      <div className="grid gap-4 content-start">
         <Card>
           <CardHeader>
             <CardTitle>Issue Token</CardTitle>
+            <CardDescription>
+              Create a new enrollment token for agents
+            </CardDescription>
           </CardHeader>
-        <CardContent className="grid gap-3">
+          <CardContent className="grid gap-4">
-          <label className="grid gap-1 text-sm text-muted-foreground">
+            <div>
-            <span>TTL seconds</span>
+              <p className="mb-2 text-sm text-muted-foreground">
+                Token lifetime
+              </p>
+              <div className="flex flex-wrap gap-2">
+                {TTL_PRESETS.map((preset) => (
+                  <Button
+                    key={preset.seconds}
+                    variant={
+                      !useCustom && ttlSeconds === preset.seconds
+                        ? "secondary"
+                        : "outline"
+                    }
+                    size="sm"
+                    onClick={() => {
+                      setTtlSeconds(preset.seconds);
+                      setUseCustom(false);
+                    }}
+                  >
+                    {preset.label}
+                  </Button>
+                ))}
+                <Button
+                  variant={useCustom ? "secondary" : "outline"}
+                  size="sm"
+                  onClick={() => setUseCustom(true)}
+                >
+                  Custom
+                </Button>
+              </div>
+              {useCustom && (
+                <label
+                  htmlFor="token-custom-ttl"
+                  className="mt-2 grid gap-1 text-sm text-muted-foreground"
+                >
+                  <span>TTL (seconds)</span>
                   <Input
+                    id="token-custom-ttl"
                     type="number"
                     min={1}
-              value={ttlSeconds}
+                    value={customTtl}
-              onChange={(e) => setTtlSeconds(e.target.value)}
+                    onChange={(e) => setCustomTtl(e.target.value)}
+                    placeholder="86400"
                   />
                 </label>
+              )}
+            </div>
             <Button onClick={() => void onIssue()} disabled={busy}>
-            Issue
+              Issue Token
             </Button>
-          {status && (
-            <pre className="max-h-80 overflow-auto rounded-md border bg-muted/40 p-3 text-xs">
-              {status}
-            </pre>
-          )}
-          {error && (
-            <pre className="max-h-80 overflow-auto rounded-md border border-destructive/60 bg-destructive/10 p-3 text-xs text-destructive">
-              {error}
-            </pre>
-          )}
           </CardContent>
         </Card>
+
+        {/* Install command after issuing */}
+        {lastIssued && (
+          <Card className="border-primary/30 bg-primary/5">
+            <CardHeader>
+              <CardTitle className="text-base">Agent Installation</CardTitle>
+              <CardDescription>
+                Token: <code className="text-xs">{lastIssued.token}</code>
+                <br />
+                Expires: {lastIssued.expires}
+              </CardDescription>
+            </CardHeader>
+            <CardContent className="space-y-2">
+              <p className="text-xs text-muted-foreground">
+                Run this on the target device to enroll:
+              </p>
+              <div className="relative">
+                <pre className="overflow-auto rounded-md border bg-muted/60 p-3 pr-10 font-mono text-xs">
+                  {`wakey-agent enroll \\
+  --server-url ${controlPlaneUrl} \\
+  --token ${lastIssued.token}`}
+                </pre>
+                <Button
+                  variant="ghost"
+                  size="sm"
+                  className="absolute right-1.5 top-1.5 size-7 p-0"
+                  onClick={() =>
+                    void copyToClipboard(
+                      `wakey-agent enroll --server-url ${controlPlaneUrl} --token ${lastIssued.token}`,
+                    )
+                  }
+                >
+                  <Copy className="size-3.5" />
+                </Button>
+              </div>
+            </CardContent>
+          </Card>
+        )}
+      </div>
     </section>
   );
 }

ui/src/pages/WakeToolsPage.tsx

@@ -0,0 +1,194 @@
+import { useState } from "react";
+import { toast } from "sonner";
+import { Zap, Inbox } from "lucide-react";
+
+import { runCommand, type Agent } from "@/api";
+import { AgentSelector } from "@/components/AgentSelector";
+import { Button } from "@/components/ui/button";
+import { Badge } from "@/components/ui/badge";
+import {
+  Card,
+  CardContent,
+  CardHeader,
+  CardTitle,
+  CardDescription,
+} from "@/components/ui/card";
+import { Input } from "@/components/ui/input";
+
+type WakeEvent = {
+  ts: number;
+  target: string;
+  agentId: string;
+  outcome: string;
+  detail: string;
+};
+
+type Props = {
+  agents: Agent[];
+  selectedAgentId: string;
+  onSelectAgent: (agentId: string) => void;
+  onAfterWake?: () => Promise<void>;
+};
+
+export function WakeToolsPage({
+  agents,
+  selectedAgentId,
+  onSelectAgent,
+  onAfterWake,
+}: Props) {
+  const [target, setTarget] = useState("");
+  const [busy, setBusy] = useState(false);
+  const [recentWakes, setRecentWakes] = useState<WakeEvent[]>([]);
+
+  async function handleWake(e?: React.FormEvent) {
+    e?.preventDefault();
+    const trimmed = target.trim();
+    if (!trimmed || !selectedAgentId || busy) return;
+
+    setBusy(true);
+    try {
+      const response = await runCommand(selectedAgentId, "wake", trimmed);
+      const detail = JSON.stringify(response);
+      const ok = detail.includes('"ok"') || detail.includes('"success"');
+      setRecentWakes((prev) =>
+        [
+          {
+            ts: Date.now(),
+            target: trimmed,
+            agentId: selectedAgentId,
+            outcome: ok ? "ok" : "fail",
+            detail,
+          },
+          ...prev,
+        ].slice(0, 20),
+      );
+      if (ok) {
+        toast.success(`Woke ${trimmed}`);
+      } else {
+        toast.error(`Wake failed: ${trimmed}`, { description: detail });
+      }
+      if (onAfterWake) await onAfterWake();
+      setTarget("");
+    } catch (err) {
+      setRecentWakes((prev) =>
+        [
+          {
+            ts: Date.now(),
+            target: trimmed,
+            agentId: selectedAgentId,
+            outcome: "error",
+            detail: String(err),
+          },
+          ...prev,
+        ].slice(0, 20),
+      );
+      toast.error("Wake failed", { description: String(err) });
+    } finally {
+      setBusy(false);
+    }
+  }
+
+  return (
+    <section className="grid gap-4 xl:grid-cols-[minmax(0,1fr)_minmax(20rem,1fr)]">
+      <Card>
+        <CardHeader>
+          <CardTitle className="flex items-center gap-2">
+            <Zap className="size-5 text-primary" />
+            Wake Target
+          </CardTitle>
+          <CardDescription>
+            Send a Wake-on-LAN packet by hostname, IP, or MAC address
+          </CardDescription>
+        </CardHeader>
+        <CardContent className="space-y-4">
+          <label
+            htmlFor="wake-agent"
+            className="grid gap-1.5 text-sm text-muted-foreground"
+          >
+            <span>Agent</span>
+            <AgentSelector
+              agents={agents}
+              value={selectedAgentId}
+              onChange={onSelectAgent}
+            />
+          </label>
+
+          <form onSubmit={handleWake} className="grid gap-3">
+            <label
+              htmlFor="wake-target"
+              className="grid gap-1.5 text-sm text-muted-foreground"
+            >
+              <span>Target</span>
+              <Input
+                id="wake-target"
+                value={target}
+                onChange={(e) => setTarget(e.target.value)}
+                placeholder="bedroom-pc, 192.168.1.100, or aa:bb:cc:dd:ee:ff"
+                disabled={busy}
+              />
+            </label>
+            <Button
+              type="submit"
+              disabled={!selectedAgentId || !target.trim() || busy}
+              className="gap-2"
+            >
+              <Zap className="size-4" />
+              {busy ? "Sending..." : "Wake"}
+            </Button>
+          </form>
+        </CardContent>
+      </Card>
+
+      <Card>
+        <CardHeader className="flex flex-row items-center justify-between gap-2 gap-y-0">
+          <CardTitle>Recent Wakes</CardTitle>
+          <Button
+            variant="outline"
+            size="sm"
+            onClick={() => setRecentWakes([])}
+          >
+            Clear
+          </Button>
+        </CardHeader>
+        <CardContent>
+          {recentWakes.length > 0 ? (
+            <div className="grid gap-0">
+              {recentWakes.map((event, i) => (
+                <div
+                  className={`flex items-start justify-between gap-3 py-2.5 ${i < recentWakes.length - 1 ? "border-b border-border/50" : ""}`}
+                  key={`${event.ts}-${event.target}-${event.agentId}`}
+                >
+                  <div className="min-w-0">
+                    <div className="flex items-center gap-2">
+                      <span className="text-sm font-medium">
+                        {event.target}
+                      </span>
+                      <Badge
+                        variant={
+                          event.outcome === "ok" ? "secondary" : "destructive"
+                        }
+                        className="text-[0.6rem] px-1.5 py-0"
+                      >
+                        {event.outcome}
+                      </Badge>
+                    </div>
+                    <p className="text-[0.65rem] text-muted-foreground/70">
+                      {new Date(event.ts).toLocaleString()} via {event.agentId}
+                    </p>
+                  </div>
+                </div>
+              ))}
+            </div>
+          ) : (
+            <div className="flex flex-col items-center justify-center py-8 text-center">
+              <Inbox className="size-8 text-muted-foreground/40" />
+              <p className="mt-2 text-sm text-muted-foreground">
+                No wake actions yet
+              </p>
+            </div>
+          )}
+        </CardContent>
+      </Card>
+    </section>
+  );
+}

ui/src/pages/devices/DeviceDetailsDialog.tsx

@@ -1,68 +0,0 @@
-import { Badge } from "@/components/ui/badge";
-import { Button } from "@/components/ui/button";
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
-import { Separator } from "@/components/ui/separator";
-import type { DeviceRow } from "@/pages/devices/types";
-
-type Props = {
-  device: DeviceRow | null;
-  open: boolean;
-  onOpenChange: (open: boolean) => void;
-};
-
-function summarizeAll(values: string[]): string {
-  if (!values.length) return "-";
-  return values.join(", ");
-}
-
-export function DeviceDetailsDialog({ device, open, onOpenChange }: Props) {
-  if (!device) return null;
-
-  return (
-    <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-w-2xl p-0">
-        <div className="grid gap-4 p-4 text-sm">
-          <DialogHeader className="pr-8">
-            <div className="flex items-start justify-between gap-3">
-              <div className="min-w-0">
-                <DialogTitle className="truncate">{device.name}</DialogTitle>
-                <DialogDescription>Device details</DialogDescription>
-              </div>
-              <Badge variant="outline">{device.presence}</Badge>
-            </div>
-          </DialogHeader>
-
-          <div>
-            <p className="mb-1 font-medium">IP addresses</p>
-            <p className="text-muted-foreground">{summarizeAll(device.ips)}</p>
-          </div>
-          <Separator />
-          <div>
-            <p className="mb-1 font-medium">MAC addresses</p>
-            <p className="text-muted-foreground">{summarizeAll(device.macs)}</p>
-          </div>
-          <Separator />
-          <div>
-            <p className="mb-1 font-medium">Interfaces</p>
-            <p className="text-muted-foreground">
-              {summarizeAll(device.interfaces)}
-            </p>
-          </div>
-
-          <DialogFooter>
-            <Button variant="outline" onClick={() => onOpenChange(false)}>
-              Close
-            </Button>
-          </DialogFooter>
-        </div>
-      </DialogContent>
-    </Dialog>
-  );
-}

ui/src/pages/devices/DeviceInventoryTable.tsx

@@ -1,196 +0,0 @@
-import { Button, buttonVariants } from "@/components/ui/button";
-import { Badge } from "@/components/ui/badge";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
-import { cn } from "@/lib/utils";
-import type { DeviceRow, SortDir } from "@/pages/devices/types";
-import {
-  chooseWakeTarget,
-  nextSort,
-  summarize,
-  type SortKey,
-} from "@/pages/devices/utils";
-
-type Props = {
-  rows: DeviceRow[];
-  selectedIds: string[];
-  sort: { key: SortKey; dir: SortDir };
-  allVisibleSelected: boolean;
-  wakeBusyId: string;
-  selectedAgentId: string;
-  bulkWakeBusy: boolean;
-  onToggleAllVisible: (checked: boolean) => void;
-  onToggleRow: (id: string, checked: boolean) => void;
-  onSortChange: (next: { key: SortKey; dir: SortDir }) => void;
-  onWakeDevice: (device: DeviceRow) => void;
-  onCopyValue: (label: string, value: string) => void;
-  onOpenDetails: (device: DeviceRow) => void;
-};
-
-function sortArrow(active: boolean, dir: SortDir) {
-  if (!active) return "";
-  return dir === "asc" ? "▲" : "▼";
-}
-
-export function DeviceInventoryTable({
-  rows,
-  selectedIds,
-  sort,
-  allVisibleSelected,
-  wakeBusyId,
-  selectedAgentId,
-  bulkWakeBusy,
-  onToggleAllVisible,
-  onToggleRow,
-  onSortChange,
-  onWakeDevice,
-  onCopyValue,
-  onOpenDetails,
-}: Props) {
-  function shouldIgnoreRowClick(target: EventTarget | null): boolean {
-    if (!(target instanceof Element)) return false;
-    return Boolean(target.closest("button, input, a, [role='menuitem']"));
-  }
-
-  return (
-    <div className="device-list grid gap-2">
-      <div className="device-row device-header rounded-md border bg-muted/60 px-3 py-2 text-sm">
-        <span className="device-cell device-select">
-          <input
-            type="checkbox"
-            checked={allVisibleSelected}
-            onChange={(e) => onToggleAllVisible(e.target.checked)}
-            disabled={!rows.length}
-            aria-label="Select all visible devices"
-          />
-        </span>
-        <span
-          className="sortable-col device-cell"
-          onClick={() => onSortChange(nextSort(sort, "name"))}
-        >
-          Name {sortArrow(sort.key === "name", sort.dir)}
-        </span>
-        <span
-          className="sortable-col device-cell"
-          onClick={() => onSortChange(nextSort(sort, "ip"))}
-        >
-          IP {sortArrow(sort.key === "ip", sort.dir)}
-        </span>
-        <span
-          className="sortable-col device-cell"
-          onClick={() => onSortChange(nextSort(sort, "mac"))}
-        >
-          MAC {sortArrow(sort.key === "mac", sort.dir)}
-        </span>
-        <span
-          className="sortable-col device-cell"
-          onClick={() => onSortChange(nextSort(sort, "presence"))}
-        >
-          Presence {sortArrow(sort.key === "presence", sort.dir)}
-        </span>
-        <span className="device-cell device-action">Actions</span>
-      </div>
-
-      {rows.map((row) => (
-        <div
-          className="device-row cursor-pointer rounded-md border bg-card px-3 py-2 text-sm transition-colors hover:bg-accent/30"
-          key={row.id}
-          role="button"
-          tabIndex={0}
-          onClick={(event) => {
-            if (shouldIgnoreRowClick(event.target)) return;
-            onOpenDetails(row);
-          }}
-          onKeyDown={(event) => {
-            if (shouldIgnoreRowClick(event.target)) return;
-            if (event.key === "Enter" || event.key === " ") {
-              event.preventDefault();
-              onOpenDetails(row);
-            }
-          }}
-        >
-          <span className="device-cell device-select" data-label="Pick">
-            <input
-              type="checkbox"
-              checked={selectedIds.includes(row.id)}
-              onChange={(e) => onToggleRow(row.id, e.target.checked)}
-              aria-label={`Select ${row.name}`}
-            />
-          </span>
-          <span className="device-cell" data-label="Name" title={row.name}>
-            {row.name}
-          </span>
-          <span
-            className="device-cell text-muted-foreground"
-            data-label="IP"
-            title={row.ips.join(", ") || "-"}
-          >
-            {summarize(row.ips)}
-          </span>
-          <span
-            className="device-cell text-muted-foreground"
-            data-label="MAC"
-            title={row.macs.join(", ") || "-"}
-          >
-            {summarize(row.macs)}
-          </span>
-          <span className="device-cell" data-label="Presence">
-            <Badge variant="outline">{row.presence}</Badge>
-          </span>
-          <span className="device-cell device-action" data-label="">
-            <Button
-              onClick={() => onWakeDevice(row)}
-              disabled={
-                wakeBusyId === row.id || !selectedAgentId || bulkWakeBusy
-              }
-              size="sm"
-              className="device-btn"
-            >
-              {wakeBusyId === row.id ? "Waking..." : "Wake"}
-            </Button>
-            <DropdownMenu>
-              <DropdownMenuTrigger
-                className={cn(
-                  buttonVariants({ variant: "outline", size: "sm" }),
-                  "device-copy-trigger",
-                )}
-              >
-                Copy
-              </DropdownMenuTrigger>
-              <DropdownMenuContent align="end" className="min-w-32">
-                <DropdownMenuItem
-                  onClick={() => onCopyValue("target", chooseWakeTarget(row))}
-                >
-                  Copy target
-                </DropdownMenuItem>
-                <DropdownMenuItem onClick={() => onCopyValue("name", row.name)}>
-                  Copy name
-                </DropdownMenuItem>
-                <DropdownMenuItem
-                  onClick={() => onCopyValue("ip", row.ips[0] || "")}
-                >
-                  Copy IP
-                </DropdownMenuItem>
-                <DropdownMenuItem
-                  onClick={() => onCopyValue("mac", row.macs[0] || "")}
-                >
-                  Copy MAC
-                </DropdownMenuItem>
-              </DropdownMenuContent>
-            </DropdownMenu>
-          </span>
-        </div>
-      ))}
-
-      {!rows.length && (
-        <div className="px-1 py-2 text-sm text-muted-foreground">
-          No devices found
-        </div>
-      )}
-    </div>
-  );
-}

ui/src/pages/devices/WakeHistoryCard.tsx

@@ -1,62 +0,0 @@
-import { Link } from "react-router-dom";
-
-import { Button } from "@/components/ui/button";
-import { Badge } from "@/components/ui/badge";
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
-import type { WakeEvent } from "@/pages/devices/types";
-
-type Props = {
-  events: WakeEvent[];
-  onClear: () => void;
-};
-
-export function WakeHistoryCard({ events, onClear }: Props) {
-  return (
-    <Card>
-      <CardHeader className="flex flex-row items-center justify-between gap-2 space-y-0">
-        <CardTitle>Recent Wake Actions</CardTitle>
-        <Button variant="outline" size="sm" onClick={onClear}>
-          Clear
-        </Button>
-      </CardHeader>
-      <CardContent>
-        <div className="grid gap-2">
-          {events.map((event, idx) => (
-            <div
-              className="flex items-start justify-between gap-3 rounded-md border bg-card px-3 py-2"
-              key={`${event.ts}-${event.target}-${idx}`}
-            >
-              <div>
-                <strong>{event.target}</strong>
-                <div className="text-xs text-muted-foreground">
-                  {new Date(event.ts).toLocaleString()} on {event.agentId}
-                </div>
-                <div className="text-xs text-muted-foreground">
-                  {event.detail}
-                </div>
-                {event.requestId && (
-                  <Link
-                    className="linkish text-xs text-muted-foreground"
-                    to={`/audit?q=${encodeURIComponent(event.requestId)}`}
-                  >
-                    View related audit ({event.requestId})
-                  </Link>
-                )}
-              </div>
-              <Badge
-                variant={event.outcome === "ok" ? "secondary" : "destructive"}
-              >
-                {event.outcome}
-              </Badge>
-            </div>
-          ))}
-          {!events.length && (
-            <div className="px-1 py-2 text-sm text-muted-foreground">
-              No wake actions yet
-            </div>
-          )}
-        </div>
-      </CardContent>
-    </Card>
-  );
-}

ui/src/pages/devices/devices.css

@@ -1,174 +0,0 @@
-.quick-wake {
-  display: grid;
-  grid-template-columns: 1fr auto;
-  gap: 0.6rem;
-  align-items: end;
-  margin-top: 0.65rem;
-}
-
-.quick-wake label {
-  display: grid;
-  gap: 0.35rem;
-  color: var(--muted-foreground);
-  font-size: 0.9rem;
-}
-
-.presence-filters {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.45rem;
-  margin-top: 0.65rem;
-}
-
-.bulk-actions {
-  display: flex;
-  gap: 0.45rem;
-  align-items: center;
-  flex-wrap: wrap;
-  margin-top: 0.65rem;
-}
-
-.select-visible {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.35rem;
-  color: var(--muted-foreground);
-  font-size: 0.88rem;
-}
-
-.linkish {
-  display: inline-block;
-  margin-top: 0.25rem;
-  text-decoration: underline;
-}
-
-.device-list {
-  margin-top: 0.8rem;
-  overflow-x: auto;
-  overscroll-behavior-x: contain;
-}
-
-.device-row {
-  display: grid;
-  grid-template-columns:
-    36px minmax(110px, 1.1fr) minmax(160px, 2fr) minmax(130px, 1.5fr)
-    minmax(100px, 0.85fr) minmax(170px, max-content);
-  align-items: center;
-  column-gap: 0.4rem;
-  row-gap: 0.55rem;
-  min-width: 860px;
-}
-
-.device-header {
-  font-weight: 600;
-  position: sticky;
-  top: 0;
-  z-index: 2;
-}
-
-.device-cell {
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.sortable-col {
-  cursor: pointer;
-  user-select: none;
-}
-
-.device-action {
-  display: flex;
-  justify-content: flex-end;
-  flex-wrap: nowrap;
-  gap: 0.35rem;
-  justify-self: end;
-}
-
-.device-btn {
-  min-width: 4.25rem;
-}
-
-.device-copy-trigger {
-  min-width: 6.2rem;
-}
-
-.device-select {
-  display: flex;
-  justify-content: center;
-}
-
-@media (max-width: 720px) {
-  .device-header {
-    display: none;
-  }
-
-  .device-row {
-    grid-template-columns: 1fr auto;
-    grid-template-areas:
-      "select action"
-      "name name"
-      "presence presence"
-      "ip ip"
-      "mac mac";
-    align-items: start;
-    min-width: 0;
-  }
-
-  .device-row .device-cell {
-    white-space: normal;
-    overflow-wrap: anywhere;
-    text-overflow: clip;
-  }
-
-  .device-row .device-cell[data-label]::before {
-    content: attr(data-label);
-    display: block;
-    font-size: 0.72rem;
-    color: var(--muted-foreground);
-    text-transform: uppercase;
-    letter-spacing: 0.03em;
-    margin-bottom: 0.1rem;
-  }
-
-  .device-row .device-cell[data-label="Name"] {
-    grid-area: name;
-  }
-
-  .device-row .device-cell[data-label="Pick"] {
-    grid-area: select;
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-    padding-top: 0.15rem;
-  }
-
-  .device-row .device-cell[data-label="Pick"]::before {
-    display: none;
-    content: "";
-  }
-
-  .device-row .device-cell[data-label="Presence"] {
-    grid-area: presence;
-  }
-
-  .device-row .device-cell[data-label="IP"] {
-    grid-area: ip;
-  }
-
-  .device-row .device-cell[data-label="MAC"] {
-    grid-area: mac;
-  }
-
-  .device-row .device-action {
-    grid-area: action;
-    justify-self: end;
-    justify-content: flex-end;
-    flex-wrap: wrap;
-  }
-
-  .quick-wake {
-    grid-template-columns: 1fr;
-  }
-}

ui/src/pages/devices/types.ts

@@ -1,21 +0,0 @@
-export type DeviceRow = {
-  id: string;
-  name: string;
-  isUnnamed: boolean;
-  ips: string[];
-  macs: string[];
-  interfaces: string[];
-  presence: string;
-};
-
-export type WakeEvent = {
-  ts: number;
-  target: string;
-  agentId: string;
-  outcome: string;
-  requestId: string;
-  detail: string;
-};
-
-export type SortDir = "asc" | "desc";
-export type PresenceFilter = "all" | "online" | "likely_online" | "unknown";

ui/src/pages/devices/utils.ts

@@ -1,174 +0,0 @@
-import type {
-  PresenceFilter,
-  SortDir,
-  DeviceRow,
-  WakeEvent,
-} from "@/pages/devices/types";
-
-export const WAKE_HISTORY_KEY = "wakey_recent_wakes_v1";
-
-export const PRESENCE_FILTERS: PresenceFilter[] = [
-  "all",
-  "online",
-  "likely_online",
-  "unknown",
-];
-
-export const sorters = {
-  name: (a: DeviceRow, b: DeviceRow) => a.name.localeCompare(b.name),
-  ip: (a: DeviceRow, b: DeviceRow) =>
-    (a.ips[0] || "").localeCompare(b.ips[0] || ""),
-  mac: (a: DeviceRow, b: DeviceRow) =>
-    (a.macs[0] || "").localeCompare(b.macs[0] || ""),
-  presence: (a: DeviceRow, b: DeviceRow) =>
-    a.presence.localeCompare(b.presence),
-};
-
-export type SortKey = keyof typeof sorters;
-
-export function parseInventoryRows(payload: unknown): DeviceRow[] {
-  if (!payload || typeof payload !== "object") return [];
-  const obj = payload as Record<string, unknown>;
-  if (obj.kind !== "inventory") return [];
-  if (!obj.devices || !Array.isArray(obj.devices)) return [];
-
-  return obj.devices
-    .map((raw, idx) => {
-      if (!raw || typeof raw !== "object") return null;
-      const device = raw as Record<string, unknown>;
-      const names = Array.isArray(device.names)
-        ? (device.names.filter((v) => typeof v === "string") as string[])
-        : [];
-      const ips = Array.isArray(device.ips)
-        ? (device.ips.filter((v) => typeof v === "string") as string[])
-        : [];
-      const macs = Array.isArray(device.macs)
-        ? (device.macs.filter((v) => typeof v === "string") as string[])
-        : [];
-      const interfaces = Array.isArray(device.interfaces)
-        ? (device.interfaces.filter((v) => typeof v === "string") as string[])
-        : [];
-      const presence =
-        typeof device.presence === "string" ? device.presence : "unknown";
-      const isUnnamed = names.length === 0;
-
-      const id = macs[0] || ips[0] || names[0] || `row-${idx}`;
-      return {
-        id,
-        name: names[0] || "(unnamed)",
-        isUnnamed,
-        ips,
-        macs,
-        interfaces,
-        presence,
-      };
-    })
-    .filter((v): v is DeviceRow => Boolean(v));
-}
-
-export function parseWakeSummary(response: unknown): {
-  outcome: string;
-  requestId: string;
-  detail: string;
-} {
-  if (!response || typeof response !== "object") {
-    return { outcome: "error", requestId: "", detail: "invalid wake response" };
-  }
-  const envelope = response as Record<string, unknown>;
-  const requestId =
-    typeof envelope.request_id === "string" ? envelope.request_id : "";
-  const status =
-    typeof envelope.status === "string" ? envelope.status : "error";
-
-  if (status !== "ok") {
-    const error = envelope.error as Record<string, unknown> | undefined;
-    const detail =
-      typeof error?.message === "string" ? error.message : "wake failed";
-    return { outcome: "error", requestId, detail };
-  }
-
-  const result = envelope.result as Record<string, unknown> | undefined;
-  if (result?.kind !== "wake") {
-    return { outcome: "ok", requestId, detail: "wake dispatched" };
-  }
-
-  const entries = Array.isArray(result.result) ? result.result : [];
-  const targetOutcomes = entries
-    .map((row) => {
-      if (!row || typeof row !== "object") return "";
-      const rowObj = row as Record<string, unknown>;
-      const statusRaw = rowObj.status;
-      const status =
-        typeof statusRaw === "string"
-          ? statusRaw
-          : typeof (statusRaw as Record<string, unknown> | undefined)?.kind ===
-              "string"
-            ? String((statusRaw as Record<string, unknown>).kind)
-            : "unknown";
-      const ip = typeof rowObj.ip === "string" ? rowObj.ip : "?";
-      const mac = typeof rowObj.mac === "string" ? rowObj.mac : "?";
-      return `${status}(${ip}/${mac})`;
-    })
-    .filter(Boolean);
-
-  const detail = targetOutcomes.length
-    ? targetOutcomes.join(", ")
-    : "wake dispatched";
-  const failed = targetOutcomes.some(
-    (s) =>
-      s.startsWith("incomplete") ||
-      s.startsWith("nonexistent_address") ||
-      s.startsWith("wrong_size"),
-  );
-  return { outcome: failed ? "error" : "ok", requestId, detail };
-}
-
-export function chooseWakeTarget(device: DeviceRow): string {
-  return device.isUnnamed ? device.macs[0] || device.ips[0] || "" : device.name;
-}
-
-export function summarize(values: string[]): string {
-  if (!values.length) return "-";
-  if (values.length === 1) return values[0];
-  return `${values[0]} (+${values.length - 1})`;
-}
-
-export function loadHistory(): WakeEvent[] {
-  try {
-    const raw = window.localStorage.getItem(WAKE_HISTORY_KEY);
-    if (!raw) return [];
-    const parsed = JSON.parse(raw) as unknown;
-    if (!Array.isArray(parsed)) return [];
-    return parsed.filter((row): row is WakeEvent => {
-      if (!row || typeof row !== "object") return false;
-      const event = row as Record<string, unknown>;
-      return (
-        typeof event.ts === "number" &&
-        typeof event.target === "string" &&
-        typeof event.agentId === "string" &&
-        typeof event.outcome === "string" &&
-        typeof event.requestId === "string" &&
-        typeof event.detail === "string"
-      );
-    });
-  } catch {
-    return [];
-  }
-}
-
-export function saveHistory(history: WakeEvent[]) {
-  window.localStorage.setItem(
-    WAKE_HISTORY_KEY,
-    JSON.stringify(history.slice(0, 20)),
-  );
-}
-
-export function nextSort(
-  current: { key: SortKey; dir: SortDir },
-  key: SortKey,
-): { key: SortKey; dir: SortDir } {
-  return {
-    key,
-    dir: current.key === key && current.dir === "asc" ? "desc" : "asc",
-  };
-}

ui/src/pages/fleet/FleetComponents.tsx

@@ -0,0 +1,108 @@
+import { Badge } from "@/components/ui/badge";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+} from "@/components/ui/select";
+
+export function PresenceBadge({ presence }: { presence: string }) {
+  return (
+    <Badge variant="outline" className={`presence-badge--${presence}`}>
+      <span className={`presence-dot presence-dot--${presence}`} aria-hidden />
+      {presence.replace("_", " ")}
+    </Badge>
+  );
+}
+
+export function MobileLabel({ label }: { label: string }) {
+  return (
+    <span className="mb-1 block text-xs font-medium text-muted-foreground xl:hidden">
+      {label}
+    </span>
+  );
+}
+
+export function FilterSelect({
+  label,
+  value,
+  values,
+  onChange,
+}: {
+  label: string;
+  value: string;
+  values: readonly string[];
+  onChange: (value: string) => void;
+}) {
+  return (
+    <label className="grid gap-1 text-sm text-muted-foreground">
+      <span>{label}</span>
+      <Select value={value} onValueChange={(next) => next && onChange(next)}>
+        <SelectTrigger>
+          <span>{value.replace("_", " ")}</span>
+        </SelectTrigger>
+        <SelectContent alignItemWithTrigger={false}>
+          {values.map((item) => (
+            <SelectItem key={item} value={item}>
+              {item.replace("_", " ")}
+            </SelectItem>
+          ))}
+        </SelectContent>
+      </Select>
+    </label>
+  );
+}
+
+export function DetailBlock({
+  label,
+  values,
+  onCopy,
+}: {
+  label: string;
+  values: string[];
+  onCopy: (label: string, value: string) => void;
+}) {
+  return (
+    <div className="rounded-md border bg-muted/30 p-3">
+      <div className="mb-2 text-xs font-medium uppercase text-muted-foreground">
+        {label}
+      </div>
+      <div className="grid gap-1">
+        {values.length ? (
+          values.map((value) => (
+            <button
+              key={value}
+              type="button"
+              className="flex min-w-0 items-center justify-between gap-2 rounded px-1 py-0.5 text-left hover:bg-accent"
+              onClick={() => onCopy(label, value)}
+            >
+              <span className="min-w-0 truncate">{value}</span>
+              <CopyIcon />
+            </button>
+          ))
+        ) : (
+          <span className="text-sm text-muted-foreground">-</span>
+        )}
+      </div>
+    </div>
+  );
+}
+
+function CopyIcon() {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth={2}
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      className="size-3.5 shrink-0 text-muted-foreground"
+      aria-hidden
+    >
+      <rect width="14" height="14" x="8" y="8" rx="2" ry="2" />
+      <path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" />
+    </svg>
+  );
+}

ui/src/pages/fleet/FleetDeviceDetailsDialog.tsx

@@ -0,0 +1,607 @@
+import { useMemo, useState } from "react";
+import { Copy, Minus, Plus, Zap } from "lucide-react";
+import { toast } from "sonner";
+
+import {
+  attachDeviceIdentifier,
+  createKnownDevice,
+  detachDeviceIdentifier,
+  mergeKnownDevice,
+  type FleetDevice,
+  type FleetDeviceEndpoint,
+  type KnownDevice,
+} from "@/api";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+} from "@/components/ui/select";
+import { Separator } from "@/components/ui/separator";
+import { DetailBlock, PresenceBadge } from "@/pages/fleet/FleetComponents";
+import {
+  agentLabel,
+  formatSeen,
+  identifiersFor,
+  presenceRank,
+  routeLabel,
+} from "@/pages/fleet/utils";
+
+type Props = {
+  device: FleetDevice | null;
+  knownDevices: KnownDevice[];
+  open: boolean;
+  busy: boolean;
+  onOpenChange: (open: boolean) => void;
+  onWake: (routeId?: string | null) => void;
+  onCopy: (label: string, value: string) => void;
+  onChanged: () => void;
+};
+
+export function FleetDeviceDetailsDialog({
+  device,
+  knownDevices,
+  open,
+  busy,
+  onOpenChange,
+  onWake,
+  onCopy,
+  onChanged,
+}: Props) {
+  const [displayName, setDisplayName] = useState(device?.display_name ?? "");
+  const [targetDeviceId, setTargetDeviceId] = useState("");
+  const [routeId, setRouteId] = useState(
+    device?.recommended_route?.route_id ?? "",
+  );
+  const [addKind, setAddKind] = useState<"mac" | "ip">("mac");
+  const [addValue, setAddValue] = useState("");
+  const [error, setError] = useState("");
+  const [actionBusy, setActionBusy] = useState(false);
+
+  const rowIdentifiers = device ? identifiersFor(device) : [];
+
+  // Resolve the full KnownDevice object if this fleet row is known
+  const fullKnown = knownDevices.find(
+    (kd) => kd.device_id === device?.known_device?.device_id,
+  );
+
+  // Identifiers from the row that are NOT already on the known device
+  const unattachedIdentifiers = useMemo(() => {
+    if (!fullKnown) return rowIdentifiers;
+    const existing = new Set(
+      fullKnown.identifiers.map((id) => `${id.kind}:${id.value}`),
+    );
+    return rowIdentifiers.filter(
+      (id) => !existing.has(`${id.kind}:${id.value}`),
+    );
+  }, [fullKnown, rowIdentifiers]);
+
+  if (!device) return null;
+
+  const currentDevice = device;
+
+  const otherKnownDevices = knownDevices.filter(
+    (kd) => kd.device_id !== currentDevice.known_device?.device_id,
+  );
+
+  async function wrap(fn: () => Promise<void | { changed?: boolean }>) {
+    setError("");
+    setActionBusy(true);
+    try {
+      const res = await fn();
+      if (!res || res.changed !== false) {
+        onChanged();
+      }
+    } catch (err: any) {
+      setError(String(err));
+      if (err && (err.changed || err.partial)) {
+        onChanged();
+      }
+    } finally {
+      setActionBusy(false);
+    }
+  }
+
+  async function handleCreateRemembered() {
+    await wrap(async () => {
+      const result = await createKnownDevice({
+        display_name: displayName.trim() || currentDevice.display_name,
+        pinned: true,
+        identifiers: rowIdentifiers,
+      });
+      toast.success(`Remembered as "${result.display_name}"`);
+    });
+  }
+
+  async function handleAttachToExisting() {
+    if (!targetDeviceId) return;
+    const target = knownDevices.find((kd) => kd.device_id === targetDeviceId);
+    await wrap(async () => {
+      const ids = fullKnown ? unattachedIdentifiers : rowIdentifiers;
+      if (ids.length === 0) return;
+
+      const results = await Promise.allSettled(
+        ids.map((id) => attachDeviceIdentifier(targetDeviceId, id)),
+      );
+
+      const changed = results.some((r) => r.status === "fulfilled");
+      const errors = results.filter((r) => r.status === "rejected");
+
+      if (errors.length) {
+        const err = errors[0].reason as Error;
+        if (changed) (err as any).changed = true;
+        throw err;
+      }
+
+      toast.success(
+        `Attached ${ids.length} identifier(s) to "${target?.display_name ?? targetDeviceId}"`,
+      );
+      return { changed };
+    });
+  }
+
+  async function handleMerge() {
+    if (!targetDeviceId || !currentDevice.known_device) return;
+    const target = knownDevices.find((kd) => kd.device_id === targetDeviceId);
+    await wrap(async () => {
+      await mergeKnownDevice(
+        targetDeviceId,
+        currentDevice.known_device!.device_id,
+      );
+      toast.success(`Merged into "${target?.display_name ?? targetDeviceId}"`);
+      onOpenChange(false);
+    });
+  }
+
+  async function handleAddIdentifier() {
+    if (!fullKnown || !addValue.trim()) return;
+    await wrap(async () => {
+      await attachDeviceIdentifier(fullKnown!.device_id, {
+        kind: addKind,
+        value: addValue.trim(),
+      });
+      setAddValue("");
+      toast.success(`Added ${addKind} identifier`);
+    });
+  }
+
+  async function handleDetachIdentifier(identifierKey: string) {
+    if (!fullKnown) return;
+    await wrap(async () => {
+      await detachDeviceIdentifier(fullKnown!.device_id, identifierKey);
+      toast.success("Identifier removed");
+    });
+  }
+
+  const selectedRoute =
+    device.route_candidates.find((r) => r.route_id === routeId) ??
+    device.recommended_route;
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="max-h-[92vh] overflow-auto sm:max-w-4xl">
+        <DialogHeader>
+          <div className="flex min-w-0 items-start justify-between gap-3 pr-8">
+            <div className="min-w-0">
+              <DialogTitle className="truncate">
+                {device.display_name}
+              </DialogTitle>
+              <DialogDescription>
+                {device.known_device
+                  ? "Remembered fleet device"
+                  : "Unidentified fleet device"}
+              </DialogDescription>
+            </div>
+            <PresenceBadge presence={device.presence} />
+          </div>
+        </DialogHeader>
+
+        {error && (
+          <pre className="max-h-40 overflow-auto rounded-md border border-destructive/60 bg-destructive/10 p-3 text-xs text-destructive">
+            {error}
+          </pre>
+        )}
+
+        <div className="grid gap-3 md:grid-cols-2">
+          <DetailBlock label="IPs" values={device.ips} onCopy={onCopy} />
+          <DetailBlock label="MACs" values={device.macs} onCopy={onCopy} />
+          <DetailBlock
+            label="Hostnames"
+            values={device.hostnames}
+            onCopy={onCopy}
+          />
+          <DetailBlock
+            label="Agents"
+            values={device.agents.map((a) =>
+              agentLabel(a.agent_id, a.nickname),
+            )}
+            onCopy={onCopy}
+          />
+        </div>
+
+        <Separator />
+
+        <div className="grid gap-2">
+          <div className="flex items-center justify-between gap-2">
+            <h3 className="text-sm font-medium">Endpoints</h3>
+            <Badge variant="outline">{device.endpoints.length}</Badge>
+          </div>
+          {device.endpoints.length ? (
+            <div className="grid gap-1.5">
+              <div className="hidden grid-cols-[minmax(0,1.3fr)_minmax(0,1fr)_8rem_2rem] items-center gap-2 px-3 py-1.5 text-xs font-medium text-muted-foreground sm:grid">
+                <span>Source</span>
+                <span>Target</span>
+                <span className="text-right">Last seen</span>
+                <span />
+              </div>
+              {[...device.endpoints]
+                .sort((a, b) => {
+                  const p = presenceRank(b.presence) - presenceRank(a.presence);
+                  if (p !== 0) return p;
+                  return (b.last_seen_unix ?? 0) - (a.last_seen_unix ?? 0);
+                })
+                .map((endpoint, index) => (
+                  <EndpointRow
+                    key={`${endpoint.agent_id}:${endpoint.source}:${endpoint.mac ?? ""}:${endpoint.ip ?? ""}:${index}`}
+                    endpoint={endpoint}
+                    onCopy={onCopy}
+                  />
+                ))}
+            </div>
+          ) : (
+            <p className="rounded-md border bg-muted/30 p-3 text-sm text-muted-foreground">
+              No endpoint evidence reported.
+            </p>
+          )}
+        </div>
+
+        <Separator />
+
+        {/* ── Wake route ── */}
+        <div className="grid gap-2">
+          <div className="flex items-center justify-between gap-2">
+            <h3 className="text-sm font-medium">Wake route</h3>
+            <Button
+              size="sm"
+              onClick={() => onWake(selectedRoute?.route_id ?? null)}
+              disabled={busy || !selectedRoute?.wakeable}
+            >
+              <Zap className="size-4" aria-hidden />
+              {busy ? "Waking" : "Wake"}
+            </Button>
+          </div>
+          <Select value={routeId} onValueChange={(v) => setRouteId(v ?? "")}>
+            <SelectTrigger>
+              <span>
+                {selectedRoute
+                  ? routeLabel(selectedRoute)
+                  : "No connected MAC-backed route"}
+              </span>
+            </SelectTrigger>
+            <SelectContent alignItemWithTrigger={false}>
+              {device.route_candidates.map((route) => (
+                <SelectItem key={route.route_id} value={route.route_id}>
+                  {routeLabel(route)}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+        </div>
+
+        <Separator />
+
+        {/* ── Identity section ── */}
+        <div className="grid gap-3">
+          <h3 className="text-sm font-medium">Identity</h3>
+
+          {/* ── Known device: show metadata + identifiers ── */}
+          {fullKnown && (
+            <div className="grid gap-3">
+              <div className="flex flex-wrap items-center gap-2 text-sm">
+                <Badge variant="secondary">known</Badge>
+                {fullKnown.pinned && <Badge variant="outline">pinned</Badge>}
+                <span className="font-medium">{fullKnown.display_name}</span>
+                {fullKnown.notes && (
+                  <span className="text-muted-foreground">
+                    : {fullKnown.notes}
+                  </span>
+                )}
+              </div>
+
+              {/* Current identifiers with remove buttons */}
+              <div className="rounded-md border bg-muted/30 p-3">
+                <div className="mb-2 text-xs font-medium uppercase text-muted-foreground">
+                  Identifiers
+                </div>
+                {fullKnown.identifiers.length ? (
+                  <div className="grid gap-1">
+                    {fullKnown.identifiers.map((id) => (
+                      <div
+                        key={id.identifier_key}
+                        className="flex items-center justify-between gap-2 rounded px-1 py-0.5 text-sm hover:bg-accent"
+                      >
+                        <span className="min-w-0 truncate">
+                          <Badge
+                            variant="outline"
+                            className="mr-1.5 text-[0.65rem]"
+                          >
+                            {id.kind}
+                          </Badge>
+                          {id.value}
+                        </span>
+                        <Button
+                          variant="ghost"
+                          size="icon-sm"
+                          onClick={() =>
+                            void handleDetachIdentifier(id.identifier_key)
+                          }
+                          disabled={actionBusy}
+                          aria-label={`Remove ${id.kind} ${id.value}`}
+                        >
+                          <Minus className="size-3.5" />
+                        </Button>
+                      </div>
+                    ))}
+                  </div>
+                ) : (
+                  <p className="text-sm text-muted-foreground">
+                    No identifiers attached
+                  </p>
+                )}
+              </div>
+
+              {/* Quick-add from row values */}
+              {unattachedIdentifiers.length > 0 && (
+                <div className="grid gap-1.5">
+                  <p className="text-xs text-muted-foreground">
+                    Add from this device row:
+                  </p>
+                  <div className="flex flex-wrap gap-1.5">
+                    {unattachedIdentifiers.map((id) => (
+                      <Button
+                        key={`${id.kind}:${id.value}`}
+                        variant="outline"
+                        size="sm"
+                        disabled={actionBusy}
+                        onClick={() =>
+                          void wrap(async () => {
+                            await attachDeviceIdentifier(
+                              fullKnown!.device_id,
+                              id,
+                            );
+                            toast.success(`Added ${id.kind}: ${id.value}`);
+                          })
+                        }
+                      >
+                        <Plus className="size-3.5" />
+                        {id.kind}: {id.value}
+                      </Button>
+                    ))}
+                  </div>
+                </div>
+              )}
+
+              {/* Manual add identifier */}
+              <div className="grid gap-1.5">
+                <p className="text-xs text-muted-foreground">
+                  Add identifier manually:
+                </p>
+                <div className="grid grid-cols-[6rem_minmax(0,1fr)_auto] gap-2">
+                  <Select
+                    value={addKind}
+                    onValueChange={(v) =>
+                      setAddKind((v as "mac" | "ip") ?? "mac")
+                    }
+                  >
+                    <SelectTrigger>
+                      <span>{addKind}</span>
+                    </SelectTrigger>
+                    <SelectContent alignItemWithTrigger={false}>
+                      <SelectItem value="mac">mac</SelectItem>
+                      <SelectItem value="ip">ip</SelectItem>
+                    </SelectContent>
+                  </Select>
+                  <Input
+                    value={addValue}
+                    onChange={(e) => setAddValue(e.target.value)}
+                    placeholder={
+                      addKind === "mac" ? "aa:bb:cc:dd:ee:ff" : "192.168.1.100"
+                    }
+                  />
+                  <Button
+                    variant="outline"
+                    onClick={() => void handleAddIdentifier()}
+                    disabled={actionBusy || !addValue.trim()}
+                  >
+                    <Plus className="size-4" />
+                    Add
+                  </Button>
+                </div>
+              </div>
+
+              {/* Merge into another known device */}
+              <Separator />
+              <div className="grid gap-1.5">
+                <p className="text-xs text-muted-foreground">
+                  Merge this known device into another:
+                </p>
+                <div className="grid grid-cols-[minmax(0,1fr)_auto] gap-2">
+                  <Select
+                    value={targetDeviceId}
+                    onValueChange={(v) => setTargetDeviceId(v ?? "")}
+                  >
+                    <SelectTrigger>
+                      <span>
+                        {targetDeviceId
+                          ? knownDevices.find(
+                              (kd) => kd.device_id === targetDeviceId,
+                            )?.display_name
+                          : "Select target device"}
+                      </span>
+                    </SelectTrigger>
+                    <SelectContent
+                      className="max-w-[min(92vw,30rem)]"
+                      alignItemWithTrigger={false}
+                    >
+                      {otherKnownDevices.map((kd) => (
+                        <SelectItem key={kd.device_id} value={kd.device_id}>
+                          {kd.display_name}
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
+                  <Button
+                    variant="outline"
+                    onClick={() => void handleMerge()}
+                    disabled={actionBusy || !targetDeviceId}
+                  >
+                    Merge
+                  </Button>
+                </div>
+              </div>
+            </div>
+          )}
+
+          {/* ── Unknown device: remember or attach ── */}
+          {!device.known_device && (
+            <div className="grid gap-3">
+              {/* Remember as new known device */}
+              <div className="grid gap-1.5">
+                <p className="text-xs text-muted-foreground">
+                  Remember as a new known device:
+                </p>
+                <div className="grid grid-cols-[minmax(0,1fr)_auto] gap-2">
+                  <Input
+                    value={displayName}
+                    onChange={(e) => setDisplayName(e.target.value)}
+                    placeholder="Device name"
+                  />
+                  <Button
+                    onClick={() => void handleCreateRemembered()}
+                    disabled={actionBusy || !rowIdentifiers.length}
+                  >
+                    Remember device
+                  </Button>
+                </div>
+                <p className="text-xs text-muted-foreground">
+                  Identifiers:{" "}
+                  {rowIdentifiers
+                    .map((id) => `${id.kind}:${id.value}`)
+                    .join(", ") || "none"}
+                </p>
+              </div>
+
+              {/* Attach to existing known device */}
+              <div className="grid gap-1.5">
+                <p className="text-xs text-muted-foreground">
+                  Or attach to an existing known device:
+                </p>
+                <div className="grid grid-cols-[minmax(0,1fr)_auto] gap-2">
+                  <Select
+                    value={targetDeviceId}
+                    onValueChange={(v) => setTargetDeviceId(v ?? "")}
+                  >
+                    <SelectTrigger>
+                      <span>
+                        {targetDeviceId
+                          ? knownDevices.find(
+                              (kd) => kd.device_id === targetDeviceId,
+                            )?.display_name
+                          : "Select known device"}
+                      </span>
+                    </SelectTrigger>
+                    <SelectContent
+                      className="max-w-[min(92vw,30rem)]"
+                      alignItemWithTrigger={false}
+                    >
+                      {knownDevices.map((kd) => (
+                        <SelectItem key={kd.device_id} value={kd.device_id}>
+                          {kd.display_name}
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
+                  <Button
+                    variant="outline"
+                    onClick={() => void handleAttachToExisting()}
+                    disabled={
+                      actionBusy || !targetDeviceId || !rowIdentifiers.length
+                    }
+                  >
+                    Attach IDs
+                  </Button>
+                </div>
+              </div>
+            </div>
+          )}
+        </div>
+
+        <DialogFooter>
+          <Button variant="outline" onClick={() => onOpenChange(false)}>
+            Close
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}
+
+function EndpointRow({
+  endpoint,
+  onCopy,
+}: {
+  endpoint: FleetDeviceEndpoint;
+  onCopy: (label: string, value: string) => void;
+}) {
+  const target = [endpoint.mac, endpoint.ip].filter(Boolean).join(" / ");
+  const location = [endpoint.interface, endpoint.hostname]
+    .filter(Boolean)
+    .join(" / ");
+
+  return (
+    <div className="grid gap-3 rounded-md border bg-card px-3 py-2.5 text-sm sm:grid-cols-[minmax(0,1.3fr)_minmax(0,1fr)_8rem_2rem] sm:items-center sm:gap-2">
+      <div className="min-w-0">
+        <div className="flex min-w-0 flex-wrap items-center gap-1.5">
+          <PresenceBadge presence={endpoint.presence} />
+          <Badge variant="secondary">{endpoint.source.replace("_", " ")}</Badge>
+        </div>
+        <p className="mt-1 truncate text-xs text-muted-foreground">
+          {agentLabel(endpoint.agent_id, endpoint.nickname)}
+          {endpoint.connected ? " (connected)" : " (offline)"}
+        </p>
+      </div>
+      <div className="min-w-0">
+        <p className="truncate font-mono text-xs">{target || "-"}</p>
+        <p className="mt-0.5 truncate text-xs text-muted-foreground">
+          {location || "No interface or hostname"}
+        </p>
+      </div>
+      <span className="whitespace-nowrap text-right text-xs text-muted-foreground">
+        {formatSeen(endpoint.last_seen_unix)}
+      </span>
+      <div className="flex justify-end">
+        {target && (
+          <Button
+            variant="ghost"
+            size="icon-sm"
+            onClick={() => onCopy("Endpoint", target)}
+            aria-label={`Copy endpoint ${target}`}
+          >
+            <Copy className="size-3.5" />
+          </Button>
+        )}
+      </div>
+    </div>
+  );
+}

ui/src/pages/fleet/utils.ts

@@ -0,0 +1,68 @@
+import type { FleetDevice, FleetWakeRoute } from "@/api";
+
+export type SortKey =
+  | "name"
+  | "presence"
+  | "last_seen"
+  | "agents"
+  | "ip"
+  | "mac";
+export type SortDir = "asc" | "desc";
+export type KnownFilter = "all" | "known" | "unknown";
+
+export const presenceFilters = [
+  "all",
+  "online",
+  "likely_online",
+  "offline",
+  "unknown",
+] as const;
+
+export const knownFilters: KnownFilter[] = ["all", "known", "unknown"];
+
+export function summarize(values: string[]): string {
+  if (!values.length) return "-";
+  if (values.length <= 2) return values.join(", ");
+  return `${values[0]}, ${values[1]} (+${values.length - 2})`;
+}
+
+export function formatSeen(value: number | null): string {
+  if (!value) return "-";
+  const seconds = Math.max(0, Math.floor(Date.now() / 1000) - value);
+  if (seconds < 60) return `${seconds}s ago`;
+  const minutes = Math.floor(seconds / 60);
+  if (minutes < 60) return `${minutes}m ago`;
+  const hours = Math.floor(minutes / 60);
+  if (hours < 48) return `${hours}h ago`;
+  return new Date(value * 1000).toLocaleString();
+}
+
+export function presenceRank(presence: string): number {
+  if (presence === "online") return 4;
+  if (presence === "likely_online") return 3;
+  if (presence === "offline") return 2;
+  if (presence === "unknown") return 1;
+  return 0;
+}
+
+export function identifiersFor(
+  device: FleetDevice,
+): { kind: string; value: string }[] {
+  return [
+    ...device.macs.map((value) => ({ kind: "mac", value })),
+    ...device.ips.map((value) => ({ kind: "ip", value })),
+  ];
+}
+
+export function agentLabel(agentId: string, nickname?: string | null): string {
+  const trimmed = nickname?.trim();
+  return trimmed ? trimmed : agentId;
+}
+
+export function routeLabel(route: FleetWakeRoute): string {
+  const status = route.connected ? "connected" : "agent offline";
+  const target = route.mac
+    ? `${route.mac}${route.ip ? ` / ${route.ip}` : ""}`
+    : (route.ip ?? "-");
+  return `${agentLabel(route.agent_id, route.nickname)} · ${target} · ${route.source} · ${status}`;
+}