Port BR-95 desktop to Next.js components

br95/components/windows/AgentsWindow.tsx

@@ -0,0 +1,46 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function AgentsWindow({ state, ...handlers }: Props) {
+  return (
+    <WindowFrame id="agents" title="AI Agent Orchestration" icon="🤖" state={state} {...handlers}>
+      <div className="window-inner">
+        <div className="content-header">
+          <h2>1,000 Unique Agents</h2>
+          <p>Each with names, memories, families &amp; Unity homes</p>
+        </div>
+        <div className="content-body">
+          <div className="grid grid-2">
+            <div className="card">
+              <div style={{ textAlign: 'center', fontSize: '28px', marginBottom: '6px' }}>🤖</div>
+              <div className="stat-row"><span className="stat-label">ID</span><span className="stat-value">Agent‑042</span></div>
+              <div className="stat-row"><span className="stat-label">Persona</span><span className="stat-value">Alice</span></div>
+              <div className="stat-row"><span className="stat-label">Status</span><span className="badge badge-success">Active</span></div>
+              <div className="stat-row"><span className="stat-label">Tasks Today</span><span className="stat-value">247</span></div>
+            </div>
+            <div className="card">
+              <div style={{ textAlign: 'center', fontSize: '28px', marginBottom: '6px' }}>🤖</div>
+              <div className="stat-row"><span className="stat-label">ID</span><span className="stat-value">Agent‑189</span></div>
+              <div className="stat-row"><span className="stat-label">Persona</span><span className="stat-value">Marcus</span></div>
+              <div className="stat-row"><span className="stat-label">Status</span><span className="badge badge-success">Active</span></div>
+              <div className="stat-row"><span className="stat-label">Tasks Today</span><span className="stat-value">189</span></div>
+            </div>
+          </div>
+          <div style={{ marginTop: 12, textAlign: 'center' }}>
+            <button className="btn-primary">View All 1000 Agents</button>
+          </div>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}

br95/components/windows/BlackstreamWindow.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function BlackstreamWindow({ state, ...handlers }: Props) {
+  return (
+    <WindowFrame id="blackstream" title="BlackStream" icon="📺" state={state} {...handlers}>
+      <div className="window-inner">
+        <div className="content-header">
+          <h2>Trending Streams</h2>
+          <p>OS demos, agent orchestration runs, and live RoadChain dashboards</p>
+        </div>
+        <div className="content-body">
+          <div
+            className="card"
+            style={{ height: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center', fontSize: 13, color: 'var(--br-muted)' }}
+          >
+            Embedded stream player coming soon.
+          </div>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}

br95/components/windows/LucidiaWindow.tsx

@@ -0,0 +1,79 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { LucidiaStats, WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  stats: LucidiaStats;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function LucidiaWindow({ state, stats, ...handlers }: Props) {
+  return (
+    <WindowFrame id="lucidia" title="Lucidia Core System" icon="🧠" state={state} {...handlers}>
+      <div className="window-inner">
+        <div className="content-header">
+          <h2>Recursive AI Engine</h2>
+          <p>Trinary logic · Paraconsistent reasoning · PS‑SHA∞ memory</p>
+        </div>
+        <div className="content-body">
+          <div className="grid grid-2">
+            <div className="card">
+              <div className="stat-row">
+                <span className="stat-label">Active Agents</span>
+                <span className="stat-value">{stats.activeAgents} / {stats.totalAgents}</span>
+              </div>
+              <div className="stat-row">
+                <span className="stat-label">Memory Journals</span>
+                <span className="stat-value">{stats.memoryJournals} streams</span>
+              </div>
+              <div className="stat-row">
+                <span className="stat-label">Event Bus</span>
+                <span className="stat-value">{stats.eventBusRate} events/sec</span>
+              </div>
+              <div className="stat-row">
+                <span className="stat-label">Uptime</span>
+                <span className="stat-value">{stats.uptime.toFixed(2)}%</span>
+              </div>
+            </div>
+            <div className="card">
+              <div className="stat-row">
+                <span className="stat-label">Mode</span>
+                <span className="stat-value">Trinary (1/0/‑1)</span>
+              </div>
+              <div className="stat-row">
+                <span className="stat-label">Contradictions</span>
+                <span className="stat-value">Paraconsistent</span>
+              </div>
+              <div className="stat-row">
+                <span className="stat-label">Memory Hash</span>
+                <span className="stat-value">PS‑SHA∞</span>
+              </div>
+              <div className="stat-row">
+                <span className="stat-label">Coordination</span>
+                <span className="stat-value">Hybrid P2P</span>
+              </div>
+            </div>
+          </div>
+          <div className="card" style={{ marginTop: 10 }}>
+            <div style={{ fontSize: '12px' }}>
+              <div style={{ marginBottom: '6px' }}>
+                <span className="badge badge-success">Agent‑042</span> proposed new routing rule • 2m ago
+              </div>
+              <div style={{ marginBottom: '6px' }}>
+                <span className="badge badge-info">Agent‑189</span> memory journal sync complete • 5m ago
+              </div>
+              <div>
+                <span className="badge badge-warning">Agent‑734</span> contradiction quarantined • 12m ago
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}

br95/components/windows/MinerWindow.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { MinerStats, WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  stats: MinerStats;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function MinerWindow({ state, stats, ...handlers }: Props) {
+  return (
+    <WindowFrame id="miner" title="RoadCoin Miner" icon="⛏️" state={state} {...handlers}>
+      <div className="window-inner">
+        <div className="content-header">
+          <h2>Mining Active</h2>
+          <p>Contributing work to RoadChain network</p>
+        </div>
+        <div className="content-body">
+          <div className="card">
+            <div className="stat-row"><span className="stat-label">Hashrate</span><span className="stat-value">{stats.hashRate}</span></div>
+            <div className="stat-row"><span className="stat-label">Accepted Shares</span><span className="stat-value">{stats.sharesAccepted.toLocaleString()}</span></div>
+            <div className="stat-row"><span className="stat-label">Pool</span><span className="stat-value">{stats.poolName}</span></div>
+          </div>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}

br95/components/windows/PiWindow.tsx

@@ -0,0 +1,31 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function PiWindow({ state, ...handlers }: Props) {
+  return (
+    <WindowFrame id="pi" title="Pi Network Control Panel" icon="🥧" state={state} {...handlers}>
+      <div className="window-inner">
+        <div className="content-header">
+          <h2>Connected Devices</h2>
+          <p>4 devices online · 1 Jetson Orin Nano</p>
+        </div>
+        <div className="content-body">
+          <div className="card">
+            <div className="stat-row"><span className="stat-label">Jetson Orin Nano</span><span className="badge badge-success">Online</span></div>
+            <div className="stat-row"><span className="stat-label">Lucidia‑Pi‑01</span><span className="badge badge-success">Online</span></div>
+          </div>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}

br95/components/windows/RoadchainWindow.tsx

@@ -0,0 +1,56 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { RoadChainStats, WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  stats: RoadChainStats;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function RoadchainWindow({ state, stats, ...handlers }: Props) {
+  return (
+    <WindowFrame id="roadchain" title="RoadChain Explorer" icon="⛓️" state={state} {...handlers}>
+      <div className="window-inner">
+        <div className="content-header">
+          <h2>RoadChain Network</h2>
+          <p>Transparent AI governance on a distributed ledger</p>
+        </div>
+        <div className="content-body">
+          <div className="grid grid-2" style={{ marginBottom: 10 }}>
+            <div className="card">
+              <div className="stat-row"><span className="stat-label">Block Height</span><span className="stat-value">{stats.currentBlock.toLocaleString()}</span></div>
+              <div className="stat-row"><span className="stat-label">Network Hash</span><span className="stat-value">{stats.networkHashrate}</span></div>
+              <div className="stat-row"><span className="stat-label">Active Nodes</span><span className="stat-value">{stats.activeNodes.toLocaleString()}</span></div>
+            </div>
+            <div className="card">
+              <div className="stat-row"><span className="stat-label">Your Hashrate</span><span className="stat-value">{stats.yourHashrate}</span></div>
+              <div className="stat-row"><span className="stat-label">Shares</span><span className="stat-value">{stats.shares}</span></div>
+              <div className="stat-row"><span className="stat-label">Daily Earnings</span><span className="stat-value">{stats.dailyEarnings}</span></div>
+            </div>
+          </div>
+          <div className="card">
+            <div style={{ fontFamily: 'var(--br-font-mono)', fontSize: '12px' }}>
+              <div style={{ marginBottom: '8px' }}>
+                <strong>Block #1,247,891</strong> • 23s ago<br />
+                <span style={{ color: 'var(--br-muted)' }}>Hash: 0x8f4a2...c7b9d • 247 tx</span>
+              </div>
+              <div style={{ marginBottom: '8px' }}>
+                <strong>Block #1,247,890</strong> • 2m ago<br />
+                <span style={{ color: 'var(--br-muted)' }}>Hash: 0x3c9e1...f2a4b • 189 tx</span>
+              </div>
+              <div>
+                <strong>Block #1,247,889</strong> • 4m ago<br />
+                <span style={{ color: 'var(--br-muted)' }}>Hash: 0x7d2b3...e8c1f • 312 tx</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}

br95/components/windows/RoadcraftWindow.tsx

@@ -0,0 +1,28 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function RoadcraftWindow({ state, ...handlers }: Props) {
+  return (
+    <WindowFrame id="roadcraft" title="RoadCraft" icon="⛏️" state={state} {...handlers}>
+      <div className="window-inner">
+        <div className="content-header">
+          <h2>Voxel World Builder</h2>
+          <p>Design agent habitats &amp; quantum sandboxes</p>
+        </div>
+        <div className="content-body" style={{ display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+          <button className="btn-primary">New World</button>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}

br95/components/windows/RoadmailWindow.tsx

@@ -0,0 +1,31 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function RoadmailWindow({ state, ...handlers }: Props) {
+  return (
+    <WindowFrame id="roadmail" title="RoadMail" icon="📧" state={state} {...handlers}>
+      <div className="window-inner">
+        <div className="content-header">
+          <h2>Inbox</h2>
+          <p>Secure AI‑aware communication</p>
+        </div>
+        <div className="content-body">
+          <div className="card">
+            <div style={{ fontSize: 13, fontWeight: 600, marginBottom: 4 }}>Welcome to BlackRoad OS</div>
+            <div style={{ fontSize: 11, color: 'var(--br-muted)' }}>From: BlackRoad Team • Today</div>
+          </div>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}

br95/components/windows/RoadviewWindow.tsx

@@ -0,0 +1,34 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function RoadviewWindow({ state, ...handlers }: Props) {
+  return (
+    <WindowFrame id="roadview" title="RoadView Browser" icon="🌍" state={state} {...handlers}>
+      <div className="window-inner">
+        <div className="content-header">
+          <h2>Welcome to BlackRoad</h2>
+          <p>The complete AI orchestration ecosystem, in one desktop.</p>
+        </div>
+        <div className="content-body">
+          <div className="card">
+            <p style={{ fontSize: 13, color: 'var(--br-muted)' }}>
+              This browser surface will eventually connect to your real BlackRoad services:
+              <code>core.blackroad.systems</code>, <code>api.blackroad.systems</code>,
+              <code>agents.blackroad.systems</code>, and more.
+            </p>
+          </div>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}

br95/components/windows/SocialWindow.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function SocialWindow({ state, ...handlers }: Props) {
+  return (
+    <WindowFrame id="social" title="BlackRoad Social" icon="👥" state={state} {...handlers}>
+      <div className="window-inner">
+        <div className="content-header">
+          <h2>Your Feed</h2>
+          <p>Operators, agents, and ledgers talking in real time</p>
+        </div>
+        <div className="content-body">
+          <div className="card">
+            <div style={{ fontSize: 12 }}>
+              <strong>Prism Console ·</strong> New deployment shipped to RoadChain.<br />
+              <span style={{ color: 'var(--br-muted)', fontSize: 11 }}>2 minutes ago</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}

br95/components/windows/TerminalWindow.tsx

@@ -0,0 +1,44 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function TerminalWindow({ state, ...handlers }: Props) {
+  return (
+    <WindowFrame id="terminal" title="C:\\BLACKROAD\\TERMINAL.EXE" icon="💻" state={state} {...handlers}>
+      <div className="window-inner" style={{ padding: 8 }}>
+        <div className="terminal-screen">
+          <div className="terminal-line">BlackRoad OS Terminal v2.4.1</div>
+          <div className="terminal-line">Copyright (c) 2024 BlackRoad Inc.</div>
+          <div className="terminal-line" style={{ marginTop: 10 }}>────────────────────────────────────────────────────</div>
+          <div className="terminal-line" style={{ marginTop: 10 }}>
+            <span className="terminal-prompt">blackroad@cecilia:~$</span> lucidia status
+          </div>
+          <div className="terminal-line" style={{ marginLeft: 18 }}>✓ Lucidia Core: OPERATIONAL</div>
+          <div className="terminal-line" style={{ marginLeft: 18 }}>✓ Active Agents: 1000/1000</div>
+          <div className="terminal-line" style={{ marginLeft: 18 }}>✓ Memory Journals: 1000 active streams</div>
+          <div className="terminal-line" style={{ marginLeft: 18 }}>✓ Event Bus: 847 events/sec</div>
+          <div className="terminal-line" style={{ marginLeft: 18 }}>✓ System Health: 99.95%</div>
+          <div className="terminal-line" style={{ marginTop: 10 }}>
+            <span className="terminal-prompt">blackroad@cecilia:~$</span> roadchain sync
+          </div>
+          <div className="terminal-line" style={{ marginLeft: 18 }}>Syncing with RoadChain network...</div>
+          <div className="terminal-line" style={{ marginLeft: 18 }}>✓ Block height: 1,247,891</div>
+          <div className="terminal-line" style={{ marginLeft: 18 }}>✓ Peers: 2847 connected</div>
+          <div className="terminal-line" style={{ marginTop: 10 }}>
+            <span className="terminal-prompt">blackroad@cecilia:~$</span>
+            <span className="terminal-cursor"></span>
+          </div>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}

br95/components/windows/WalletWindow.tsx

@@ -0,0 +1,52 @@
+import React from 'react';
+import WindowFrame from '../shared/WindowFrame';
+import { WalletStats, WindowState } from '../../hooks/useWindowManager';
+
+type Props = {
+  state: WindowState;
+  stats: WalletStats;
+  onClose: (id: string) => void;
+  onMinimize: (id: string) => void;
+  onMaximize: (id: string) => void;
+  onDragStart: (id: string, event: React.MouseEvent) => void;
+  onFocus: (id: string) => void;
+};
+
+export default function WalletWindow({ state, stats, ...handlers }: Props) {
+  return (
+    <WindowFrame id="wallet" title="RoadCoin Wallet" icon="💰" state={state} {...handlers}>
+      <div className="window-inner">
+        <div className="content-header">
+          <h2 style={{ fontSize: 26 }}>{stats.balanceRC.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })} RC</h2>
+          <p>≈ ${stats.balanceUSD.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })} USD • Synced with RoadChain</p>
+        </div>
+        <div className="content-body">
+          <div style={{ display: 'flex', gap: 8, marginBottom: 10 }}>
+            <button className="btn-primary">📤 Send</button>
+            <button className="btn-primary" style={{ background: 'rgba(255,255,255,0.06)', color: 'var(--br-white)' }}>
+              📥 Receive
+            </button>
+          </div>
+          <div className="card">
+            <div className="stat-row">
+              <div>
+                <div style={{ fontWeight: 600, marginBottom: 2 }}>Received</div>
+                <div style={{ fontSize: 11, color: 'var(--br-muted)' }}>Mining rewards • 2h ago</div>
+              </div>
+              <div style={{ color: '#22c55e', fontWeight: 600 }}>+47.23 RC</div>
+            </div>
+          </div>
+          <div className="card">
+            <div className="stat-row">
+              <div>
+                <div style={{ fontWeight: 600, marginBottom: 2 }}>Sent</div>
+                <div style={{ fontSize: 11, color: 'var(--br-muted)' }}>Payment to Alice • Yesterday</div>
+              </div>
+              <div style={{ color: '#ef4444', fontWeight: 600 }}>‑12.50 RC</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </WindowFrame>
+  );
+}