WeftOS

React 19 + TypeScript + Tailwind GUI layer shipped as a Tauri 2.0 desktop app: Dashboard, Admin Forms, Knowledge Graph visualization, Component Generator, and WebSocket kernel bridge.

K8 is the human interface layer of WeftOS — a web-based GUI that provides real-time visibility into kernel state and interactive administration.

Source: gui/ Stack: React 19, TypeScript, Vite, Tailwind CSS, Cytoscape.js Phase: K8

Views

Dashboard

Read-only overview of kernel state:

Metrics grid: process count, chain height, uptime, message rates
Process table: active agents with PID, state, CPU/memory
Chain events: recent ExoChain commits with hash, type, timestamp
Health indicators: service status badges

Admin Forms

Five CRUD forms testing the full TypeScript → Rust round-trip:

Spawn Agent — name, capabilities, restart strategy
Stop Agent — select by PID, graceful/force
Set Config — namespace, key, value (typed)
Query Chain — hash or height lookup
Register Service — name, port, health endpoint

Knowledge Graph

Interactive causal graph visualization using Cytoscape.js:

8 edge type colors: Causes (red), Enables (green), Correlates (blue), etc.
Node sizing: scales with degree (more connections = larger node)
Community coloring: background tint by detected community
Click-to-inspect: NodeDetail panel showing edges, metadata, community ID
Search: highlight/dim filtering with search bar
Coherence gauge: displays lambda_2 (algebraic connectivity)
Layout: force-directed (cose) with configurable parameters

Architecture

┌──────────────┐     WebSocket      ┌──────────────┐
│   React GUI  │ ◄─────────────────► │  Kernel API  │
│  (Vite dev)  │     JSON messages   │  (Rust)      │
└──────────────┘                     └──────────────┘

TypeScript Types

TypeScript interfaces mirror Rust kernel structs:

ProcessEntry, ProcessState, ResourceUsage
ChainEvent, KernelMetrics
CausalNode, CausalEdge, SpectralResult

WebSocket Hook

useKernelWebSocket hook manages the connection lifecycle:

Auto-reconnect with exponential backoff
Mock data mode for development (no kernel required)
Message type routing to React state

Development

cd gui
npm install
npm run dev     # Vite dev server at localhost:5173
npm run build   # Production build (204KB JS, 17KB CSS)

Build Output

Production build: 204KB JavaScript, 17KB CSS. No external CDN dependencies.

Tauri 2.0 Desktop App

The GUI ships as a native desktop application via Tauri 2.0. The Rust backend exposes four IPC commands:

Command	Description
`kernel_status`	Returns kernel version, uptime, health, state
`spawn_agent`	Spawns a new agent by name with capabilities
`stop_agent`	Stops a running agent by PID
`set_config`	Sets a kernel configuration key/value pair

Source: gui/src-tauri/src/lib.rs

Build

cd gui
npm install
npm run tauri dev     # Dev mode with hot reload
npm run tauri build   # Production binary

The ComponentGenerator view (gui/src/views/ComponentGenerator.tsx) allows agents to dynamically generate React components at runtime. The Weaver or other authorized agents submit TSX source code, which is validated, rendered, and optionally persisted as a new block in the block registry.

K8 GUI