@volter/teams 0.1.18 → 0.1.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@volter/teams",
-  "version": "0.1.18",
+  "version": "0.1.20",
   "type": "module",
   "description": "Volter Teams, the neutral team plane: machine identity and daemon core, the local door and server link, admission from machine grants, product doors, and the Teams server's neutral routes (company RFC 0008).",
   "license": "MIT",

package/server/viewer.mjs

@@ -10,6 +10,9 @@ const FILES = {
   // The same module under its own name, as a workplace console imports it (openBrowserSession, sendBrowserTurn).
   '/view/browser-channel.mjs': ['browser-channel.mjs', 'text/javascript; charset=utf-8'],
   '/view/stream-rpc.mjs': ['stream-rpc.mjs', 'text/javascript; charset=utf-8'],
+  // A team session's surface: supercode-ui's transcript and composer, built by scripts/build-session-view.mjs.
+  '/view/session-view.mjs': ['viewer/session-view.mjs', 'text/javascript; charset=utf-8'],
+  '/view/session-view.css': ['viewer/session-view.css', 'text/css; charset=utf-8'],
 };
 let bundled = null;
 

package/viewer/index.html

@@ -33,6 +33,12 @@
   button.action, label.action { font: inherit; font-size: 12px; padding: 3px 10px; border-radius: 4px; border: 1px solid var(--line); background: var(--panel); color: var(--text); cursor: pointer; }
   button.action:disabled { opacity: .5; cursor: default; }
   label.action input { display: none; }
+  /* supercode-ui follows this page's dark scheme; its composer spans the page instead of its 420px default. */
+  #session { flex: 1; min-width: 0; min-height: 0; display: flex; --scui-color-scheme: dark; }
+  #session .session-view { flex: 1; min-width: 0; display: flex; flex-direction: column; }
+  #session .session-view > section { flex: 1; min-height: 0; overflow: auto; }
+  #session .session-composer { border-top: 1px solid var(--line); padding: 8px; --scui-width: 100%; --scui-height: auto; }
+  #session .session-composer > * { flex: 1; min-width: 0; }
   [hidden] { display: none !important; }
 </style>
 </head>
@@ -41,6 +47,7 @@
 <div id="status"></div>
 <main>
   <div id="terminal" hidden></div>
+  <div id="session" hidden></div>
   <div id="folder">
     <nav id="entries"><div class="crumbs" id="crumbs"></div><div id="list"></div></nav>
     <section id="file">

package/viewer/session-view-entry.mjs

@@ -0,0 +1,78 @@
+// The hosted viewer's session surface, bundled with its dependencies into viewer/session-view.mjs
+// (scripts/build-session-view.mjs): supercode-ui's team transcript and composer, mounted for one team session. The
+// page (viewer.mjs) owns the token, the reads and the channel; this module only renders what it is given and hands
+// back what the member typed.
+import { h, render } from 'preact';
+import { TeamTranscript } from '@volter/supercode-ui/preact/teams';
+import { Composer } from '@volter/supercode-ui/preact/composer';
+import { EMPTY_UI_STATE, normalizeUiState } from '@volter/supercode-ui';
+import { projectSubagentTranscript } from '@volter/supercode-ui/controller';
+
+// A person's picture: the brand's person placeholder. An empty seed is its one standard anonymous face.
+const personImage = (seed = '') => `https://brand.volter.ai/runner/svg?seed=${encodeURIComponent(seed)}&size=36&radius=18`;
+
+/**
+ * Who wrote each user turn, from the message's own annotations (source_name / source_principal_id, recorded when a
+ * Room member typed it): their name and face, or, for anyone unnamed, the standard anonymous face. Never an agent mark.
+ */
+function withPeople(transcript, messages) {
+  const byTime = new Map();
+  for (const message of messages) {
+    if (message?.role !== 'user') continue;
+    const at = Date.parse(message.metadata?.timestamp ?? '');
+    if (Number.isFinite(at)) byTime.set(at, message.metadata);
+  }
+  return transcript.map((entry) => {
+    if (entry.role !== 'user') return entry;
+    const metadata = byTime.get(entry.ts) ?? {};
+    const name = metadata.source_name || null;
+    return { ...entry, actor: { name: name ?? 'Someone in the session', image: personImage(name ? (metadata.source_principal_id || name) : '') } };
+  });
+}
+
+const SOURCES = { 'claude-code': 'claude_code', codex: 'codex', gemini: 'gemini', goose: 'goose', grok: 'grok', opencode: 'opencode', pi: 'pi' };
+
+/** A team session's captured messages as the harness SDK's normalized session, for supercode-ui's projection. */
+function normalizedSession(descriptor, messages) {
+  return {
+    source: SOURCES[descriptor.harness] ?? 'native',
+    session_id: descriptor.id,
+    model: null,
+    cwd: null,
+    system_prompt: null,
+    agent_id: null,
+    parent_tool_use_id: null,
+    lineage: {},
+    trigger: 'human',
+    surface: null,
+    messages,
+  };
+}
+
+/**
+ * Mount one session into `element`. `update({ descriptor, messages, live, status, error, canSend, sending })` renders
+ * the session (messages are the captured normalized values, oldest first); `onSend(text)` is called with a turn the
+ * member typed, and resolves once it was delivered or refused.
+ */
+export function mountSessionView(element, { onSend }) {
+  let current = { descriptor: null, messages: [], live: false, status: 'loading', error: null, canSend: false, sending: false };
+  const adapter = {
+    onIntent: async (intent) => { if (intent?.action === 'send' && intent.text?.trim()) await onSend(intent.text.trim()); },
+    copyText: (text) => globalThis.navigator?.clipboard?.writeText(text),
+  };
+  const draw = () => {
+    const { descriptor, messages, live, status, error, canSend, sending } = current;
+    const transcript = descriptor ? withPeople(projectSubagentTranscript(normalizedSession(descriptor, messages), { prefix: descriptor.id, maxEntries: 500 }), messages) : [];
+    const composerState = normalizeUiState({ ...EMPTY_UI_STATE, startup: 'ready', harness: descriptor?.harness ?? '', canSend: canSend && !sending, busy: sending, transcript });
+    render(h('div', { class: 'session-view' },
+      // The header says what this viewer may do: type into the session (a control token) or only read it.
+      h(TeamTranscript, { session: descriptor, transcript, live, status, error, adapter, labels: { readOnly: canSend ? 'Control' : 'Read-only' } }),
+      canSend ? h('div', { class: 'session-composer scui-root' }, h(Composer, { state: composerState, adapter })) : null,
+    ), element);
+  };
+  draw();
+  return {
+    update(next) { current = { ...current, ...next }; draw(); },
+    unmount() { render(null, element); },
+  };
+}