@dfosco/storyboard 0.5.0-beta.36 → 0.5.0-beta.37

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dfosco/storyboard",
-  "version": "0.5.0-beta.36",
+  "version": "0.5.0-beta.37",
   "type": "module",
   "license": "MIT",
   "description": "Storyboard prototyping framework — core engine, React integration, and canvas",

package/src/core/cli/terminal-welcome.js

@@ -237,7 +237,10 @@ async function launchAgent(agent, { isInitialStartup = false } = {}) {
 
   try {
     const shell = process.env.SHELL || '/bin/zsh'
-    const child = spawn(shell, ['-lc', agent.startupCommand], {
+    // -ilc: interactive + login so both .zprofile and .zshrc are sourced.
+    // Many users install agent CLIs (claude, copilot, etc.) via nvm/volta/asdf
+    // shims that only register PATH in .zshrc. Without -i the binary is not found.
+    const child = spawn(shell, ['-ilc', agent.startupCommand], {
       stdio: 'inherit',
       env: agentEnv(),
     })
@@ -498,7 +501,7 @@ async function welcomeLoop() {
           setMouse(true)
           try {
             const shell = process.env.SHELL || '/bin/zsh'
-            const child = spawn(shell, ['-lc', agent.resumeCommand], {
+            const child = spawn(shell, ['-ilc', agent.resumeCommand], {
               stdio: 'inherit',
               env: agentEnv(),
             })

package/src/core/cli/terminal-welcome.test.js

@@ -0,0 +1,38 @@
+import { describe, it, expect } from 'vitest'
+import { readFileSync } from 'node:fs'
+import { fileURLToPath } from 'node:url'
+import { dirname, join } from 'node:path'
+
+const __dirname = dirname(fileURLToPath(import.meta.url))
+const SOURCE = readFileSync(join(__dirname, 'terminal-welcome.js'), 'utf8')
+
+// Regression guard for the "command not found: claude" bug.
+//
+// Background: agents spawn via the user's $SHELL with -lc (login shell). On
+// zsh that sources /etc/zprofile + ~/.zprofile but NOT ~/.zshrc. Many agent
+// CLIs (claude, copilot, nvm/volta/asdf shims) only register PATH in
+// ~/.zshrc, so a login-only shell cannot find them. Always use -ilc
+// (interactive + login) so both rc files are sourced.
+//
+// This test scans the source rather than importing the module because
+// terminal-welcome.js is a CLI entrypoint with top-level side effects and
+// no exports. If you later refactor to export the spawn args, replace this
+// with a stub-spawn unit test.
+describe('terminal-welcome: agent spawn shell flags', () => {
+  it('uses -ilc (not -lc) for every spawn(shell, ...) call', () => {
+    const spawnCalls = SOURCE.match(/spawn\(\s*shell\s*,\s*\[[^\]]*\]/g) || []
+    expect(spawnCalls.length).toBeGreaterThan(0)
+
+    for (const call of spawnCalls) {
+      // Bare interactive shell (no -c flag, no command) is allowed —
+      // that's the fallback shell session. Anything passing a command
+      // string MUST source .zshrc.
+      const passesCommand = /-[il]+c['"]/.test(call)
+      if (!passesCommand) continue
+
+      expect(call, `spawn call missing -i flag: ${call}`).toMatch(/['"]-i?l?i?l?c['"]/)
+      expect(call, `spawn call must include -i: ${call}`).toMatch(/['"]-(i[l]?c|li?c|il?c)['"]/)
+      expect(call, `spawn call must not use bare -lc: ${call}`).not.toMatch(/['"]-lc['"]/)
+    }
+  })
+})

package/src/internals/canvas/CanvasPage.jsx

@@ -379,6 +379,27 @@ const ChromeWrappedWidget = memo(function ChromeWrappedWidget({
   // Dynamically adjust features based on widget state
   const features = useMemo(() => {
     const isGitHub = !!widget.props?.github
+    const isTerminalOrAgent = widget.type === 'terminal' || widget.type === 'agent'
+
+    // Detect connected terminal/agent peers — used to gate hub-related features.
+    // Hub role and broadcast are meaningless without a peer to coordinate with.
+    let hasHubPeers = false
+    let allBroadcastActive = true
+    const broadcastConnectorIds = []
+    if (isTerminalOrAgent) {
+      const widgetConnectors = connectorCount || []
+      const widgetList = allWidgets || []
+      for (const conn of widgetConnectors) {
+        const peerId = conn.start?.widgetId === widget.id ? conn.end?.widgetId : conn.start?.widgetId
+        const peer = widgetList.find((w) => w.id === peerId)
+        if (peer && (peer.type === 'terminal' || peer.type === 'agent')) {
+          hasHubPeers = true
+          broadcastConnectorIds.push(conn.id)
+          if (conn.meta?.messagingMode !== 'two-way') allBroadcastActive = false
+        }
+      }
+    }
+
     const adjusted = rawFeatures.map((f) => {
       // Toggle collapse label and hide when content is short (no github = no collapse)
       if (f.action === 'toggle-collapse') {
@@ -391,6 +412,9 @@ const ChromeWrappedWidget = memo(function ChromeWrappedWidget({
       }
       // Hide refresh-github for non-GitHub link previews
       if (f.action === 'refresh-github' && !isGitHub) return null
+      // Hide hub-role selector when terminal/agent has no connected peers —
+      // a hub of one is not a hub.
+      if (f.type === 'role-selector' && isTerminalOrAgent && !hasHubPeers) return null
       return f
     }).filter(Boolean)
 
@@ -420,37 +444,19 @@ const ChromeWrappedWidget = memo(function ChromeWrappedWidget({
     }
 
     // Add dynamic "Broadcast" toggle for terminal/agent widgets with connected peers
-    if (widget.type === 'terminal' || widget.type === 'agent') {
-      const widgetConnectors = connectorCount || []
-      const widgetList = allWidgets || []
-      let hasBroadcastPeers = false
-      let allBroadcastActive = true
-      const broadcastConnectorIds = []
-
-      for (const conn of widgetConnectors) {
-        const peerId = conn.start?.widgetId === widget.id ? conn.end?.widgetId : conn.start?.widgetId
-        const peer = widgetList.find((w) => w.id === peerId)
-        if (peer && (peer.type === 'terminal' || peer.type === 'agent')) {
-          hasBroadcastPeers = true
-          broadcastConnectorIds.push(conn.id)
-          if (conn.meta?.messagingMode !== 'two-way') allBroadcastActive = false
-        }
-      }
-
-      if (hasBroadcastPeers) {
-        const isActive = allBroadcastActive
-        const insertIdx = adjusted.findIndex((f) => f.menu)
-        const broadcastFeature = {
-          id: 'broadcast',
-          type: 'action',
-          action: `broadcast-toggle:${broadcastConnectorIds.join(',')}:${isActive ? 'off' : 'on'}`,
-          label: isActive ? 'Broadcast On' : 'Broadcast',
-          icon: 'broadcast',
-          active: isActive,
-        }
-        if (insertIdx >= 0) adjusted.splice(insertIdx, 0, broadcastFeature)
-        else adjusted.push(broadcastFeature)
-      }
+    if (isTerminalOrAgent && hasHubPeers) {
+      const isActive = allBroadcastActive
+      const insertIdx = adjusted.findIndex((f) => f.menu)
+      const broadcastFeature = {
+        id: 'broadcast',
+        type: 'action',
+        action: `broadcast-toggle:${broadcastConnectorIds.join(',')}:${isActive ? 'off' : 'on'}`,
+        label: isActive ? 'Broadcast On' : 'Broadcast',
+        icon: 'broadcast',
+        active: isActive,
+      }
+      if (insertIdx >= 0) adjusted.splice(insertIdx, 0, broadcastFeature)
+      else adjusted.push(broadcastFeature)
     }
 
     return adjusted