@dfosco/storyboard 0.6.0-beta.13 → 0.6.0-beta.15

package/mascot.config.json

@@ -2,7 +2,6 @@
   "$comment": "Mascot animation rendered above the Vite dev banner. Each entry in `frames` is either a string (uses frameDurationMs as the default delay) or a [filename, delayMs] tuple for per-frame timing. After loops finish, settleFrame is left on screen with the dev URL beside it.",
   "frames": [
     ["frame-01-peek-left.txt", 600],
-    ["frame-02-eyes-open.txt", 300],
     ["frame-03-peek-right.txt", 600],
     ["frame-04-eyes-open.txt", 400],
     ["frame-05-eyes-closed.txt", 200],

package/package.json

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

package/src/core/canvas/agent-session.js

@@ -221,25 +221,33 @@ export function buildResumeStartupCommand({ startupCommand, sessionId, agentCfg
   if (!startupCommand) return startupCommand
 
   const notice = `printf '\\n\\033[33m[storyboard] resume failed; starting fresh session...\\033[0m\\n'`
-  const wrapFallback = (cmd) => agentCfg?.resumeFallback === false
-    ? cmd
-    : `${cmd} || { ${notice}; ${startupCommand}; }`
+  const lastCmd = agentCfg?.resumeLastCommand
+
+  // Chain: stored-id resume → resumeLastCommand (if any) → fresh startupCommand.
+  // Each step's non-zero exit cascades to the next via shell `||`. Note: if a
+  // resume hangs (vs. exits non-zero), the chain won't progress — users
+  // should use the widget's restart button. We deliberately don't wrap in a
+  // timeout to avoid killing slow-starting agents on flaky networks.
+  const wrapFallback = (cmd) => {
+    if (agentCfg?.resumeFallback === false) return cmd
+    const last = lastCmd ? `${lastCmd} || { ${notice}; ${startupCommand}; }` : `${notice}; ${startupCommand}`
+    return `${cmd} || { ${last}; }`
+  }
 
   // Primary: per-widget captured sessionId → `resumeCommand` with {id}.
-  if (sessionId && isResumableSessionId(sessionId, agentCfg)) {
+  if (sessionId && UUID_RE.test(sessionId)) {
     const template = agentCfg?.resumeCommand
     if (template && template.includes('{id}')) {
       return wrapFallback(template.replace('{id}', sessionId))
     }
   }
 
-  // Fallback: agents like Codex provide a `resumeLastCommand` that
-  // resumes the most recent session in the current cwd without needing
-  // a captured id (e.g. `codex resume --last`). Useful when the agent's
-  // sessionStart hook requires manual trust before it can capture ids
-  // (Codex case — hook needs `/hooks` approval).
-  const lastCmd = agentCfg?.resumeLastCommand
-  if (lastCmd) return wrapFallback(lastCmd)
+  // No id stored — try resumeLastCommand (e.g. `--continue` / `resume --last`),
+  // falling through to fresh startupCommand if it exits non-zero.
+  if (lastCmd) {
+    if (agentCfg?.resumeFallback === false) return lastCmd
+    return `${lastCmd} || { ${notice}; ${startupCommand}; }`
+  }
 
   return startupCommand
 }

package/src/core/cli/dev.js

@@ -23,6 +23,7 @@ import { compactAll } from '../canvas/compact.js'
 import { parseFlags } from './flags.js'
 import { setupNeeded, writeUserState, getInstalledStoryboardVersion } from './userState.js'
 import { dim, magenta, bold } from './intro.js'
+import { rmSync } from 'node:fs'
 
 /** Find the mascot directory shipped with the storyboard package. */
 function mascotPaths(targetCwd) {
@@ -157,6 +158,28 @@ function readConfiguredPort(cwd) {
   }
 }
 
+/**
+ * Resolve the Vite base path for URL display. Priority:
+ *   1. `VITE_BASE_PATH` env var (matches vite.config.js convention)
+ *   2. `basePath` key in storyboard.config.json (if user wants to override)
+ *   3. `/` (Vite default)
+ *
+ * Trailing slash is normalized so the rendered URL never double-slashes.
+ */
+function resolveBasePath(cwd) {
+  let base = process.env.VITE_BASE_PATH || null
+  if (!base) {
+    try {
+      const cfg = JSON.parse(readFileSync(resolve(cwd, 'storyboard.config.json'), 'utf8'))
+      if (typeof cfg.basePath === 'string' && cfg.basePath) base = cfg.basePath
+    } catch { /* empty */ }
+  }
+  base = base || '/'
+  if (!base.startsWith('/')) base = '/' + base
+  if (!base.endsWith('/')) base = base + '/'
+  return base
+}
+
 async function main() {
   const { flags } = parseFlags(process.argv.slice(3), flagSchema)
   const worktreeName = detectWorktreeName()
@@ -169,6 +192,8 @@ async function main() {
   const configuredPort = readConfiguredPort(targetCwd)
   const strictPort = flags.port == null && configuredPort != null
   const port = flags.port || configuredPort || getPort(worktreeName)
+  const basePath = resolveBasePath(targetCwd)
+  const devUrl = `http://localhost:${port}${basePath}`
 
   const verbose = flags.verbose
 
@@ -193,6 +218,11 @@ async function main() {
         ? 'first run in this repo'
         : `version changed ${need.from} → ${need.to}`
       if (verbose) p.log.info(`Running setup (${why})…`)
+
+      // Invalidate Vite's optimize-deps cache when the storyboard version
+      // changes. Otherwise the browser hits 504 Outdated Optimize Dep
+      // because the dep graph IDs no longer match the cached chunks.
+      try { rmSync(join(targetCwd, 'node_modules', '.vite'), { recursive: true, force: true }) } catch { /* empty */ }
       await new Promise((resolveSetup) => {
         const setupChild = spawn(
           process.platform === 'win32' ? 'npx.cmd' : 'npx',
@@ -274,11 +304,11 @@ async function main() {
       console.log()
       const animated = showBuddy && renderMascot(
         mascotPaths(targetCwd),
-        bold(`http://localhost:${port}/storyboard/`),
+        bold(devUrl),
         dim('Stop with Ctrl+C'),
       )
       if (!animated) {
-        console.log(`  ${bold(`http://localhost:${port}/storyboard/`)}`)
+        console.log(`  ${bold(devUrl)}`)
         console.log(`  ${dim('Stop with Ctrl+C')}`)
       }
       // Wait for animation to settle, then flush anything Vite emitted
@@ -323,18 +353,30 @@ async function main() {
     setTimeout(() => { renderOnce() }, 8000).unref?.()
   }
 
+  let shuttingDown = false
   function shutdown() {
+    if (shuttingDown) {
+      // Second Ctrl+C → hard exit, kill child with SIGKILL.
+      try { child.kill('SIGKILL') } catch { /* empty */ }
+      process.exit(130)
+    }
+    shuttingDown = true
     clearInterval(compactInterval)
     renameWatcher.close()
     // Suppress Vite's shutdown-time esbuild noise ("Pre-transform error:
-    // The service was stopped" for every in-flight transform).
+    // The service was stopped" for every in-flight transform) AND the
+    // orphan-archive log spam from the storyboard-server plugin teardown.
     try { child.stdout?.removeAllListeners('data') } catch { /* empty */ }
     try { child.stderr?.removeAllListeners('data') } catch { /* empty */ }
     try { child.stdout?.destroy() } catch { /* empty */ }
     try { child.stderr?.destroy() } catch { /* empty */ }
-    // SIGINT lets Vite shut down esbuild and HMR cleanly; SIGTERM is harsher
-    // and tends to leave in-flight transforms aborting noisily.
+    // SIGINT first (clean esbuild shutdown), then SIGTERM after 2s if
+    // Vite is still alive (handles plugins that loop on session teardown),
+    // then SIGKILL after 5s as last resort.
     try { child.kill('SIGINT') } catch { /* already dead */ }
+    const term = setTimeout(() => { try { child.kill('SIGTERM') } catch { /* empty */ } }, 2000)
+    const kill = setTimeout(() => { try { child.kill('SIGKILL') } catch { /* empty */ } }, 5000)
+    term.unref?.(); kill.unref?.()
     releasePort(worktreeName)
   }
   process.on('SIGINT', shutdown)

package/src/core/vite/server-plugin.js

@@ -774,6 +774,54 @@ export default function storyboardServer() {
         })
       }
 
+      // Auto-reload on Vite's "outdated optimize dep" 504 errors.
+      // Happens when the dep graph IDs in cached chunks no longer match
+      // what Vite is serving (after upgrades, dep additions, etc).
+      // We catch failed fetches inside the page and trigger a full reload
+      // once — the second load will see the freshly-built optimize deps.
+      if (isDev) {
+        tags.push({
+          tag: 'script',
+          children: `
+(function(){
+  var reloaded = false;
+  function maybeReload(reason){
+    if (reloaded) return;
+    if (sessionStorage.getItem('__sb_outdated_reload__')) return;
+    reloaded = true;
+    sessionStorage.setItem('__sb_outdated_reload__', '1');
+    console.warn('[storyboard] Reloading: ' + reason);
+    setTimeout(function(){ sessionStorage.removeItem('__sb_outdated_reload__'); }, 5000);
+    location.reload();
+  }
+  // Clear stale guard from previous successful loads.
+  if (document.readyState === 'complete') {
+    sessionStorage.removeItem('__sb_outdated_reload__');
+  } else {
+    window.addEventListener('load', function(){
+      setTimeout(function(){ sessionStorage.removeItem('__sb_outdated_reload__'); }, 2000);
+    });
+  }
+  // Catch module load failures.
+  window.addEventListener('error', function(e){
+    var msg = (e && e.message) || '';
+    if (/Outdated Optimize Dep|Failed to fetch dynamically imported module|504/i.test(msg)) {
+      maybeReload('outdated dep / dynamic import failure');
+    }
+  }, true);
+  // Catch unhandled promise rejections from dynamic imports.
+  window.addEventListener('unhandledrejection', function(e){
+    var msg = (e && e.reason && (e.reason.message || String(e.reason))) || '';
+    if (/Outdated Optimize Dep|Failed to fetch dynamically imported module|504/i.test(msg)) {
+      maybeReload('outdated dep / dynamic import failure');
+    }
+  });
+})();
+`.trim(),
+          injectTo: 'head',
+        })
+      }
+
       // Inject base path so the inspector UI can resolve static assets
       // (e.g. inspector.json) when deployed under a subpath
       tags.push({

package/terminal.config.json

@@ -18,6 +18,7 @@
       "icon": "primer/copilot",
       "startupCommand": "copilot --agent terminal-agent",
       "resumeCommand": "copilot --resume={id} --agent terminal-agent",
+      "resumeLastCommand": "copilot --continue --agent terminal-agent",
       "sessionIdEnv": "COPILOT_AGENT_SESSION_ID",
       "postStartup": "/allow-all on",
       "resizable": true
@@ -27,6 +28,7 @@
       "icon": "claude",
       "startupCommand": "claude --agent terminal-agent --dangerously-skip-permissions",
       "resumeCommand": "claude --resume {id} --agent terminal-agent --dangerously-skip-permissions",
+      "resumeLastCommand": "claude --continue --agent terminal-agent --dangerously-skip-permissions",
       "sessionIdEnv": "CLAUDE_SESSION_ID",
       "sessionStateGlob": "~/.claude/projects/*/{id}.jsonl",
       "readinessSignal": "bypass permissions",