@animalabs/connectome-host 0.7.2 → 0.7.4

package/web/src/Lessons.tsx

@@ -1,5 +1,6 @@
 /**
- * Lessons panel — read-only view of the parent process's lesson library.
+ * Lessons panel — read-only view of one process's lesson library (the host
+ * or a fleet child; the sidebar's shared scope selector decides which).
  *
  * Shows active lessons sorted by confidence; deprecated entries collapse to a
  * dim line with the reason. Manual refresh button — lessons mutate slowly
@@ -27,12 +28,6 @@ export function LessonsPanel(props: {
   /** True if the LessonsModule is mounted in the recipe. */
   moduleLoaded: boolean;
   lessons: LessonRow[];
-  /** Currently-selected scope ('local' for the parent process, or a fleet
-   *  child name). Drives which process's lessons are shown. */
-  scope: string;
-  /** Selectable scopes — always includes 'local', plus every fleet child. */
-  scopes: Array<{ id: string; label: string }>;
-  onScopeChange(scope: string): void;
   onRefresh(): void;
 }) {
   const active = (): LessonRow[] => props.lessons.filter(l => !l.deprecated)
@@ -60,7 +55,6 @@ export function LessonsPanel(props: {
           refresh
         </button>
       </div>
-      <ScopePicker scope={props.scope} scopes={props.scopes} onChange={props.onScopeChange} />
 
       <Show when={!props.loaded} fallback={null}>
         <div class="text-neutral-600 italic">Loading…</div>
@@ -95,36 +89,6 @@ export function LessonsPanel(props: {
   );
 }
 
-/** Compact scope chooser shown at the top of scoped panels. The current
- *  scope is rendered as a pill; alternative scopes appear as siblings.
- *  Hidden when there's only one scope (no fleet children). */
-export function ScopePicker(props: {
-  scope: string;
-  scopes: Array<{ id: string; label: string }>;
-  onChange(scope: string): void;
-}) {
-  return (
-    <Show when={props.scopes.length > 1}>
-      <div class="flex flex-wrap items-center gap-1 mb-2 text-[10px] font-mono">
-        <span class="text-neutral-600 uppercase tracking-wider mr-1">scope</span>
-        <For each={props.scopes}>{(s) => (
-          <button
-            type="button"
-            class={`px-1.5 py-0.5 rounded ${
-              props.scope === s.id
-                ? 'bg-cyan-900/60 text-cyan-100'
-                : 'bg-neutral-800 hover:bg-neutral-700 text-neutral-300'
-            }`}
-            onClick={() => props.onChange(s.id)}
-          >
-            {s.label}
-          </button>
-        )}</For>
-      </div>
-    </Show>
-  );
-}
-
 function LessonCard(props: { lesson: LessonRow }) {
   const conf = (): number => Math.round(props.lesson.confidence * 100);
   const confColor = (): string => {

package/web/src/Mcpl.tsx

@@ -1,10 +1,15 @@
 /**
- * MCPL admin panel — read/write view of mcpl-servers.json. Mirrors the
- * `/mcp list|add|remove|env` slash commands but with structured controls.
+ * MCPL panel — two views of one scope's MCPL world:
  *
- * Mutations are file-only — the host needs to restart for them to take
- * effect. The panel makes that explicit so operators don't expect live
- * reconnects.
+ *   live      what the scoped process actually LOADED (recipe opt-in +
+ *             agent overlay), with connection status and tool counts. This
+ *             is the per-scope truth: a conductor with zero MCPLs and a
+ *             clerk with five share the same registry file.
+ *   registry  the shared mcpl-servers.json (editable). Mutations are
+ *             file-only — a restart applies them — and happen on the HOST
+ *             scope: the file is one cwd-shared registry for the whole
+ *             fleet, so the panel goes read-only on child scopes rather
+ *             than pretending a "child-local" edit exists.
  */
 
 import { createSignal, For, Show } from 'solid-js';
@@ -20,10 +25,25 @@ export interface McplServerRow {
   disabledFeatureSets?: string[];
 }
 
+/** A server the scoped process has actually loaded, with live status. */
+export interface McplLiveRow {
+  id: string;
+  connected: boolean;
+  toolCount: number;
+  toolPrefix?: string;
+  target?: string;
+}
+
 export function McplPanel(props: {
   loaded: boolean;
   configPath: string;
   servers: McplServerRow[];
+  /** Servers the scoped process actually loaded, with connection status.
+   *  Empty array is meaningful ("this process runs no MCPLs"); undefined
+   *  means an older host that doesn't report it. */
+  live?: McplLiveRow[];
+  /** True on fleet-child scopes: registry edits stay on the host scope. */
+  readOnly?: boolean;
   onRefresh(): void;
   onAdd(input: { id: string; command: string; args?: string[]; env?: Record<string, string>; toolPrefix?: string }): void;
   onRemove(id: string): void;
@@ -45,13 +65,15 @@ export function McplPanel(props: {
         >
           refresh
         </button>
-        <button
-          type="button"
-          class="px-2 py-0.5 text-[10px] bg-cyan-900/40 hover:bg-cyan-900/60 text-cyan-200 rounded font-mono"
-          onClick={() => setShowAdd(s => !s)}
-        >
-          {showAdd() ? 'cancel add' : '+ add'}
-        </button>
+        <Show when={!props.readOnly}>
+          <button
+            type="button"
+            class="px-2 py-0.5 text-[10px] bg-cyan-900/40 hover:bg-cyan-900/60 text-cyan-200 rounded font-mono"
+            onClick={() => setShowAdd(s => !s)}
+          >
+            {showAdd() ? 'cancel add' : '+ add'}
+          </button>
+        </Show>
       </div>
 
       <Show when={!props.loaded}>
@@ -59,11 +81,51 @@ export function McplPanel(props: {
       </Show>
 
       <Show when={props.loaded}>
+        {/* ---- live: what this process actually runs ---- */}
+        <Show when={props.live !== undefined}>
+          <div class="text-neutral-500 uppercase tracking-wider text-[10px] font-semibold mb-1">
+            loaded by this process
+          </div>
+          <Show when={props.live!.length === 0}>
+            <div class="text-neutral-600 italic mb-2">
+              No MCPL servers loaded — the recipe opts into none.
+            </div>
+          </Show>
+          <div class="space-y-1 mb-3">
+            <For each={props.live}>{(s) => (
+              <div class="border border-neutral-800 rounded px-2 py-1 bg-neutral-950 flex items-baseline gap-2">
+                <span class={`inline-block w-2 h-2 rounded-full self-center shrink-0 ${s.connected ? 'bg-emerald-500' : 'bg-rose-500'}`}
+                  title={s.connected ? 'connected' : 'disconnected'} />
+                <span class="font-mono text-cyan-300 truncate">{s.id}</span>
+                <span class="text-[10px] text-neutral-500 shrink-0">{s.toolCount} tools</span>
+                <Show when={s.toolPrefix}>
+                  <span class="text-[10px] text-neutral-600 shrink-0">prefix={s.toolPrefix}</span>
+                </Show>
+                <Show when={s.target}>
+                  <span class="text-[10px] font-mono text-neutral-600 truncate ml-auto" title={s.target}>
+                    {s.target}
+                  </span>
+                </Show>
+              </div>
+            )}</For>
+          </div>
+          <div class="text-neutral-500 uppercase tracking-wider text-[10px] font-semibold mb-1">
+            shared registry
+          </div>
+        </Show>
+
         <div class="text-[10px] text-neutral-600 italic mb-2 break-all" title={props.configPath}>
           {props.configPath}
         </div>
 
-        <Show when={showAdd()}>
+        <Show when={props.readOnly}>
+          <div class="text-[10px] text-neutral-500 italic mb-2">
+            The registry file is shared fleet-wide — edit it from the host
+            scope. Which entries this child loads is its recipe's opt-in.
+          </div>
+        </Show>
+
+        <Show when={showAdd() && !props.readOnly}>
           <AddServerForm
             onSubmit={(input) => {
               props.onAdd(input);
@@ -81,13 +143,14 @@ export function McplPanel(props: {
           <For each={props.servers}>{(server) => (
             <ServerCard
               server={server}
+              readOnly={props.readOnly ?? false}
               onRemove={() => props.onRemove(server.id)}
               onSetEnv={(env) => props.onSetEnv(server.id, env)}
             />
           )}</For>
         </div>
 
-        <Show when={props.servers.length > 0}>
+        <Show when={props.servers.length > 0 && !props.readOnly}>
           <div class="mt-3 text-[10px] text-amber-300/80 italic">
             Changes are written to disk; restart the host process to apply.
           </div>
@@ -99,6 +162,7 @@ export function McplPanel(props: {
 
 function ServerCard(props: {
   server: McplServerRow;
+  readOnly: boolean;
   onRemove(): void;
   onSetEnv(env: Record<string, string>): void;
 }) {
@@ -117,6 +181,7 @@ function ServerCard(props: {
         <Show when={props.server.reconnect}>
           <span class="text-[10px] text-emerald-400">↻ reconnect</span>
         </Show>
+        <Show when={!props.readOnly}>
         <button
           type="button"
           class="ml-auto text-[10px] px-1 py-0.5 bg-neutral-800 hover:bg-neutral-700 text-neutral-300 rounded font-mono"
@@ -150,6 +215,7 @@ function ServerCard(props: {
             remove
           </button>
         </Show>
+        </Show>
       </div>
       <div class="font-mono text-neutral-300 text-[11px] break-all leading-tight">
         {cmdLine()}

package/web/src/Pins.tsx

@@ -35,6 +35,11 @@ export interface PinsState {
   pinsSupported: boolean;
   levelHonored: boolean;
   deepestLevel?: number;
+  /** Picker candidates shipped by a fleet-child scope's snapshot — the
+   *  client has no window into a child's message store, so the child sends
+   *  recent real store ids along. Absent on local scope (the client builds
+   *  its candidate list from its own message window). */
+  candidates?: PinCandidate[];
 }
 
 /**

package/web/src/Settings.tsx

@@ -91,6 +91,10 @@ const TRANSITION_HELP: Record<string, string> = {
 export function SettingsPanel(props: {
   loaded: boolean;
   state: SettingsState | null;
+  /** Inspection scope ('local' or fleet-child name) — routes the preview
+   *  fetch through the host's ?scope= proxy so the DRY RUN compiles in the
+   *  same process whose settings this panel is editing. */
+  scope?: string;
   onRefresh(): void;
   onApply(patch: {
     contextBudgetTokens?: number;
@@ -157,6 +161,7 @@ export function SettingsPanel(props: {
     setElapsed(null);
     try {
       const qs = new URLSearchParams({ budget: String(b), agent: props.state!.agent });
+      if (props.scope && props.scope !== 'local') qs.set('scope', props.scope);
       const t = num(tail());
       if (t !== undefined) qs.set('tail', String(t));
       if (render) qs.set('render', '1');

package/web/vite.config.ts

@@ -19,14 +19,20 @@ export default defineConfig({
     emptyOutDir: true,
   },
   server: {
-    // Dev server proxies WS to the running conhost so `bun run dev` in web/
-    // talks to a real backend. Port matches WebUiModule default.
+    // Dev server proxies WS + HTTP surfaces to the running conhost so
+    // `bun run dev` in web/ talks to a real backend. Port matches the
+    // WebUiModule default. Without the HTTP entries every /debug and
+    // /healthz fetch 404s against Vite itself in dev.
     proxy: {
       '/ws': {
         target: 'ws://127.0.0.1:7340',
         ws: true,
         changeOrigin: true,
       },
+      '/debug': { target: 'http://127.0.0.1:7340', changeOrigin: true },
+      '/healthz': { target: 'http://127.0.0.1:7340', changeOrigin: true },
+      '/curve': { target: 'http://127.0.0.1:7340', changeOrigin: true },
+      '/files': { target: 'http://127.0.0.1:7340', changeOrigin: true },
     },
   },
 });