@aion0/forge 0.10.31 → 0.10.33

package/RELEASE_NOTES.md

@@ -1,11 +1,23 @@
-# Forge v0.10.31
+# Forge v0.10.33
 
 Released: 2026-06-02
 
-## Changes since v0.10.30
+## Changes since v0.10.32
+
+### Documentation
+- docs: update help-docs for activity pill, marketplace, usage move, watch builtins
 
 ### Other
-- fix(watch): allow builtin tool names (no connector prefix) in start_watch
+- refactor(marketplace): Pipelines first + default landing
+- refactor(dashboard): move Activity pill next to Automation tab
+- refactor(dashboard): promote Chat (web) + open standalone routes in new tab
+- refactor(dashboard): promote Settings, add icons to user menu rows
+- refactor(dashboard): move Usage into user menu next to Monitor/Login Status
+- refactor(marketplace): split category dropdown by group
+- perf(pipeline-view): invalidate cache after mutations
+- fix(activity): view link uses forge:navigate event
+- perf(pipeline-view): module-level SWR cache for meta + per-workflow runs
+- feat(activity): top-right Activity pill — running pipelines + upcoming schedules
 
 
-**Full Changelog**: https://github.com/aiwatching/forge/compare/v0.10.30...v0.10.31
+**Full Changelog**: https://github.com/aiwatching/forge/compare/v0.10.32...v0.10.33

package/app/api/activity/summary/route.ts

@@ -0,0 +1,135 @@
+/**
+ * GET /api/activity/summary
+ *
+ * Small snapshot for the Activity pill / dashboard. Three sections:
+ *   - running:  pipelines currently in flight (status queued|running)
+ *   - upcoming: enabled schedules sorted by next_run_at ASC
+ *   - recent:   last 8 finished pipelines (succeeded|failed|cancelled)
+ *
+ * Aim <5KB response, <30ms. No expensive joins, no per-pipeline detail.
+ * Front-end refetches every 5s when ActivityPanel is open.
+ */
+
+import { NextResponse } from 'next/server';
+import { listPipelinesSummary } from '@/lib/pipeline';
+import { listSchedules } from '@/lib/schedules/store';
+
+interface RunningRow {
+  id: string;
+  workflowName: string;
+  status: string;
+  currentNode: string | null;
+  progress: { done: number; total: number };
+  createdAt: string;
+}
+
+interface UpcomingRow {
+  id: string;
+  name: string;
+  body_kind: string;
+  body_ref: string;
+  next_run_at: string | null;
+  schedule_kind: string;
+  schedule_summary: string;
+}
+
+interface RecentRow {
+  id: string;
+  workflowName: string;
+  status: string;
+  completedAt: string | null;
+  durationMs: number | null;
+}
+
+interface Summary {
+  running: RunningRow[];
+  upcoming: UpcomingRow[];
+  recent: RecentRow[];
+  generated_at: string;
+}
+
+function scheduleSummary(s: {
+  schedule_kind: string;
+  schedule_interval_minutes: number;
+  schedule_at: string | null;
+  schedule_cron: string | null;
+}): string {
+  switch (s.schedule_kind) {
+    case 'period':
+      return s.schedule_interval_minutes >= 60
+        ? `every ${Math.round(s.schedule_interval_minutes / 60)}h`
+        : `every ${s.schedule_interval_minutes}m`;
+    case 'cron':
+      return `cron: ${s.schedule_cron || '?'}`;
+    case 'once':
+      return s.schedule_at ? `at ${s.schedule_at}` : 'one-shot';
+    case 'manual':
+      return 'manual only';
+    default:
+      return s.schedule_kind;
+  }
+}
+
+export async function GET() {
+  // Single listPipelinesSummary call — uses the parse cache, sorted desc.
+  // 200 runs cap is plenty; we'll filter into running + recent and discard
+  // the rest.
+  const all = listPipelinesSummary({ limit: 200 });
+
+  const running: RunningRow[] = [];
+  const recent: RecentRow[] = [];
+  for (const p of all) {
+    const isActive = p.status === 'running';
+    if (isActive && running.length < 30) {
+      // Compute progress + current node from the in-memory nodes map.
+      let done = 0;
+      let current: string | null = null;
+      for (const name of p.nodeOrder) {
+        const st = p.nodes[name]?.status;
+        if (st === 'done' || st === 'skipped') done++;
+        else if (!current && st === 'running') current = name;
+      }
+      running.push({
+        id: p.id,
+        workflowName: p.workflowName,
+        status: p.status,
+        currentNode: current,
+        progress: { done, total: p.nodeOrder.length },
+        createdAt: p.createdAt,
+      });
+    } else if (!isActive && recent.length < 8) {
+      const startedMs = Date.parse(p.createdAt);
+      const endedMs = p.completedAt ? Date.parse(p.completedAt) : NaN;
+      recent.push({
+        id: p.id,
+        workflowName: p.workflowName,
+        status: p.status,
+        completedAt: p.completedAt || null,
+        durationMs: isFinite(startedMs) && isFinite(endedMs) ? endedMs - startedMs : null,
+      });
+    }
+  }
+
+  // Upcoming = enabled schedules sorted by next_run_at ASC, top 10.
+  const schedules = listSchedules()
+    .filter((s) => s.enabled && s.next_run_at)
+    .sort((a, b) => String(a.next_run_at).localeCompare(String(b.next_run_at)))
+    .slice(0, 10);
+  const upcoming: UpcomingRow[] = schedules.map((s) => ({
+    id: s.id,
+    name: s.name,
+    body_kind: s.body_kind,
+    body_ref: s.body_ref,
+    next_run_at: s.next_run_at,
+    schedule_kind: s.schedule_kind,
+    schedule_summary: scheduleSummary(s),
+  }));
+
+  const summary: Summary = {
+    running,
+    upcoming,
+    recent,
+    generated_at: new Date().toISOString(),
+  };
+  return NextResponse.json(summary);
+}

package/components/ActivityPanel.tsx

@@ -0,0 +1,266 @@
+'use client';
+
+import { useCallback, useEffect, useRef, useState } from 'react';
+
+interface RunningRow {
+  id: string;
+  workflowName: string;
+  status: string;
+  currentNode: string | null;
+  progress: { done: number; total: number };
+  createdAt: string;
+}
+
+interface UpcomingRow {
+  id: string;
+  name: string;
+  body_kind: string;
+  body_ref: string;
+  next_run_at: string | null;
+  schedule_kind: string;
+  schedule_summary: string;
+}
+
+interface RecentRow {
+  id: string;
+  workflowName: string;
+  status: string;
+  completedAt: string | null;
+  durationMs: number | null;
+}
+
+interface Summary {
+  running: RunningRow[];
+  upcoming: UpcomingRow[];
+  recent: RecentRow[];
+  generated_at: string;
+}
+
+const POLL_OPEN_MS = 5000;   // active polling while open
+const POLL_BADGE_MS = 30000; // background polling while closed (just for counts)
+
+function timeAgo(iso: string | null): string {
+  if (!iso) return '';
+  const s = Math.round((Date.now() - Date.parse(iso)) / 1000);
+  if (s < 60) return `${s}s ago`;
+  if (s < 3600) return `${Math.round(s / 60)}m ago`;
+  if (s < 86400) return `${Math.round(s / 3600)}h ago`;
+  return `${Math.round(s / 86400)}d ago`;
+}
+
+function timeUntil(iso: string | null): string {
+  if (!iso) return '';
+  const s = Math.round((Date.parse(iso) - Date.now()) / 1000);
+  if (s < 0) return 'overdue';
+  if (s < 60) return `in ${s}s`;
+  if (s < 3600) return `in ${Math.round(s / 60)}m`;
+  if (s < 86400) return `in ${Math.round(s / 3600)}h`;
+  return `in ${Math.round(s / 86400)}d`;
+}
+
+function fmtDuration(ms: number | null): string {
+  if (ms == null) return '';
+  if (ms < 1000) return `${ms}ms`;
+  if (ms < 60_000) return `${(ms / 1000).toFixed(1)}s`;
+  return `${Math.round(ms / 60_000)}m`;
+}
+
+function statusGlyph(s: string): string {
+  if (s === 'done') return '✓';
+  if (s === 'failed') return '✗';
+  if (s === 'cancelled') return '⊘';
+  if (s === 'running') return '▶';
+  return s;
+}
+
+function statusColor(s: string): string {
+  if (s === 'done') return 'text-green-500';
+  if (s === 'failed') return 'text-red-400';
+  if (s === 'cancelled') return 'text-gray-400';
+  if (s === 'running') return 'text-blue-400';
+  return 'text-[var(--text-secondary)]';
+}
+
+/**
+ * Activity pill — top-right glanceable status for running pipelines +
+ * upcoming schedules. Click to expand a 3-section dropdown. Polls every
+ * 5s while open, 30s in background for badge counts.
+ */
+export default function ActivityPanel() {
+  const [summary, setSummary] = useState<Summary | null>(null);
+  const [open, setOpen] = useState(false);
+  const panelRef = useRef<HTMLDivElement | null>(null);
+
+  const refetch = useCallback(async () => {
+    try {
+      const r = await fetch('/api/activity/summary');
+      if (!r.ok) return;
+      const j: Summary = await r.json();
+      setSummary(j);
+    } catch { /* network blip — silent */ }
+  }, []);
+
+  // Initial fetch + adaptive polling cadence
+  useEffect(() => {
+    refetch();
+    const ms = open ? POLL_OPEN_MS : POLL_BADGE_MS;
+    const id = setInterval(refetch, ms);
+    return () => clearInterval(id);
+  }, [open, refetch]);
+
+  // Click-outside dismisses
+  useEffect(() => {
+    if (!open) return;
+    const onClick = (e: MouseEvent) => {
+      if (panelRef.current && !panelRef.current.contains(e.target as Node)) {
+        setOpen(false);
+      }
+    };
+    window.addEventListener('mousedown', onClick);
+    return () => window.removeEventListener('mousedown', onClick);
+  }, [open]);
+
+  const runningCount = summary?.running.length ?? 0;
+  const upcomingCount = summary?.upcoming.length ?? 0;
+  const recentFailed = (summary?.recent ?? []).filter((r) => r.status === 'failed').length;
+
+  // Pill chips
+  const chips: string[] = [];
+  if (runningCount) chips.push(`▶${runningCount}`);
+  if (upcomingCount) chips.push(`⏰${upcomingCount}`);
+  if (!chips.length) chips.push('✓');
+
+  return (
+    <div className="relative" ref={panelRef}>
+      <button
+        onClick={() => setOpen((o) => !o)}
+        className={`text-[10px] px-2 py-0.5 rounded border border-[var(--border)] flex items-center gap-1.5
+          ${runningCount > 0 ? 'text-blue-400 border-blue-500/50' : 'text-[var(--text-secondary)]'}
+          hover:text-[var(--text-primary)]`}
+        title="Activity — running pipelines + upcoming schedules"
+      >
+        <span className="font-medium">{chips.join(' ')}</span>
+        {recentFailed > 0 && (
+          <span className="text-red-400 text-[9px]" title={`${recentFailed} recently failed`}>!{recentFailed}</span>
+        )}
+      </button>
+
+      {open && (
+        <div
+          className="absolute right-0 mt-1 w-[440px] max-h-[70vh] overflow-y-auto bg-[var(--bg-secondary)] border border-[var(--border)] rounded-lg shadow-xl z-50"
+          onClick={(e) => e.stopPropagation()}
+        >
+          {summary === null ? (
+            <div className="p-6 text-center text-xs text-[var(--text-secondary)]">Loading…</div>
+          ) : (
+            <div className="p-3 space-y-4">
+              {/* Running */}
+              <Section title="Running" count={runningCount}>
+                {runningCount === 0 ? (
+                  <Empty>Nothing running.</Empty>
+                ) : (
+                  summary.running.map((r) => (
+                    <div key={r.id} className="flex items-start gap-2 text-xs py-1">
+                      <span className={`${statusColor(r.status)} mt-0.5`}>{statusGlyph(r.status)}</span>
+                      <div className="flex-1 min-w-0">
+                        <div className="flex items-center gap-2">
+                          <span className="text-[var(--text-primary)] font-medium truncate">{r.workflowName}</span>
+                          <span className="text-[10px] text-[var(--text-secondary)]">
+                            {r.progress.done}/{r.progress.total}
+                          </span>
+                          <span className="text-[10px] text-gray-500">{timeAgo(r.createdAt)}</span>
+                        </div>
+                        {r.currentNode && (
+                          <div className="text-[10px] text-[var(--text-secondary)] mt-0.5">
+                            current: {r.currentNode}
+                          </div>
+                        )}
+                      </div>
+                      <button
+                        onClick={() => {
+                          setOpen(false);
+                          window.dispatchEvent(new CustomEvent('forge:navigate', { detail: { view: 'pipelines', pipelineId: r.id } }));
+                        }}
+                        className="text-[10px] px-1.5 py-0.5 rounded border border-[var(--border)] text-[var(--text-secondary)] hover:text-[var(--text-primary)]"
+                      >
+                        view
+                      </button>
+                    </div>
+                  ))
+                )}
+              </Section>
+
+              {/* Upcoming */}
+              <Section title="Next up" count={upcomingCount}>
+                {upcomingCount === 0 ? (
+                  <Empty>No enabled schedules.</Empty>
+                ) : (
+                  summary.upcoming.map((u) => (
+                    <div key={u.id} className="flex items-start gap-2 text-xs py-1">
+                      <span className="text-[var(--text-secondary)] mt-0.5">⏰</span>
+                      <div className="flex-1 min-w-0">
+                        <div className="flex items-center gap-2">
+                          <span className="text-[var(--text-primary)] font-medium truncate">{u.name}</span>
+                          <span className="text-[10px] text-blue-400">{timeUntil(u.next_run_at)}</span>
+                        </div>
+                        <div className="text-[10px] text-[var(--text-secondary)] mt-0.5 truncate">
+                          {u.body_kind}: {u.body_ref} · {u.schedule_summary}
+                        </div>
+                      </div>
+                    </div>
+                  ))
+                )}
+              </Section>
+
+              {/* Recent */}
+              <Section title="Recent" count={summary.recent.length}>
+                {summary.recent.length === 0 ? (
+                  <Empty>No recent runs.</Empty>
+                ) : (
+                  summary.recent.map((r) => (
+                    <div key={r.id} className="flex items-start gap-2 text-xs py-1">
+                      <span className={`${statusColor(r.status)} mt-0.5`}>{statusGlyph(r.status)}</span>
+                      <div className="flex-1 min-w-0">
+                        <div className="flex items-center gap-2">
+                          <span className="text-[var(--text-primary)] truncate">{r.workflowName}</span>
+                          <span className="text-[10px] text-[var(--text-secondary)]">
+                            {fmtDuration(r.durationMs)} · {timeAgo(r.completedAt)}
+                          </span>
+                        </div>
+                      </div>
+                      <button
+                        onClick={() => {
+                          setOpen(false);
+                          window.dispatchEvent(new CustomEvent('forge:navigate', { detail: { view: 'pipelines', pipelineId: r.id } }));
+                        }}
+                        className="text-[10px] px-1.5 py-0.5 rounded border border-[var(--border)] text-[var(--text-secondary)] hover:text-[var(--text-primary)]"
+                      >
+                        view
+                      </button>
+                    </div>
+                  ))
+                )}
+              </Section>
+            </div>
+          )}
+        </div>
+      )}
+    </div>
+  );
+}
+
+function Section({ title, count, children }: { title: string; count: number; children: React.ReactNode }) {
+  return (
+    <div>
+      <h3 className="text-[10px] font-semibold text-[var(--text-secondary)] uppercase mb-1 flex items-center gap-2">
+        {title}
+        <span className="text-gray-500 font-normal">({count})</span>
+      </h3>
+      <div className="space-y-0.5">{children}</div>
+    </div>
+  );
+}
+
+function Empty({ children }: { children: React.ReactNode }) {
+  return <div className="text-[10px] text-gray-500 italic py-0.5">{children}</div>;
+}

package/components/Dashboard.tsx

@@ -25,6 +25,7 @@ const NewTaskModal = lazy(() => import('./NewTaskModal'));
 const SettingsModal = lazy(() => import('./SettingsModal'));
 const MonitorPanel = lazy(() => import('./MonitorPanel'));
 const LoginStatusPanel = lazy(() => import('./LoginStatusPanel'));
+const ActivityPanel = lazy(() => import('./ActivityPanel'));
 const WorkspaceView = lazy(() => import('./WorkspaceView'));
 // WorkspaceTree moved into ProjectDetail — no longer needed at Dashboard level
 
@@ -398,6 +399,11 @@ export default function Dashboard({ user }: { user: any }) {
             >
               Automation
             </button>
+            {/* Activity sub-pill — sits next to Automation since its content
+                (running pipelines + upcoming schedules + recent runs) is the
+                live read-side of Automation. Click anywhere → dropdown with
+                3 sections + a "view" jump to the run. */}
+            <Suspense fallback={null}><ActivityPanel /></Suspense>
             <span className="w-[2px] h-4 bg-[var(--text-secondary)]/30 mx-1.5" />
             {/* Marketplace */}
             <button
@@ -465,14 +471,6 @@ export default function Dashboard({ user }: { user: any }) {
               </>
             )}
           </div>
-          <button
-            onClick={() => setViewMode('usage')}
-            className={`text-[10px] px-2 py-0.5 border rounded transition-colors ${
-              viewMode === 'usage'
-                ? 'border-[var(--accent)] text-[var(--accent)]'
-                : 'border-[var(--border)] text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:border-[var(--text-secondary)]'
-            }`}
-          >Usage</button>
           <Suspense fallback={null}><TunnelToggle /></Suspense>
           {onlineCount.total > 0 && (
             <span className="text-[10px] text-[var(--text-secondary)] flex items-center gap-1" title={`${onlineCount.total} online${onlineCount.remote > 0 ? `, ${onlineCount.remote} remote` : ''}`}>
@@ -618,52 +616,73 @@ export default function Dashboard({ user }: { user: any }) {
             {showUserMenu && (
               <>
                 <div className="fixed inset-0 z-40" onClick={() => setShowUserMenu(false)} />
-                <div className="absolute right-0 top-8 w-[140px] bg-[var(--bg-secondary)] border border-[var(--border)] rounded-lg shadow-xl z-50 py-1">
+                <div className="absolute right-0 top-8 w-[170px] bg-[var(--bg-secondary)] border border-[var(--border)] rounded-lg shadow-xl z-50 py-1">
+                  {/* Settings promoted to the top — most-reached item in this
+                      menu. Each row leads with a glyph so it's scannable. */}
+                  <button
+                    onClick={() => { setShowSettings(true); setShowUserMenu(false); }}
+                    className="w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)] flex items-center gap-2"
+                  >
+                    <span className="w-3 text-center">⚙</span><span>Settings</span>
+                  </button>
+                  {/* Chat (web) is a separate route — open in a new tab so
+                      the dashboard isn't replaced. Promoted up here so it's
+                      one of the prominent items, not buried below Logs. */}
+                  <a
+                    href="/chat"
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="block w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)] flex items-center gap-2"
+                  >
+                    <span className="w-3 text-center">💬</span>
+                    <span className="flex-1">Chat (web)</span>
+                    <span className="text-[9px] text-[var(--text-secondary)]">↗</span>
+                  </a>
+                  <div className="border-t border-[var(--border)] my-1" />
                   <button
                     onClick={() => { setShowMonitor(true); setShowUserMenu(false); }}
-                    className="w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)]"
+                    className="w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)] flex items-center gap-2"
                   >
-                    Monitor
+                    <span className="w-3 text-center">📊</span><span>Monitor</span>
                   </button>
                   <button
                     onClick={() => { setShowLoginStatus(true); setShowUserMenu(false); }}
-                    className="w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)] flex items-center justify-between"
+                    className="w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)] flex items-center gap-2"
                   >
-                    <span>Login Status</span>
+                    <span className="w-3 text-center">🔐</span>
+                    <span className="flex-1">Login Status</span>
                     {loginBadge && loginBadge.broken > 0 && (
-                      <span className="text-[9px] text-red-400">🔴 {loginBadge.broken}/{loginBadge.total}</span>
+                      <span className="text-[9px] text-red-400">{loginBadge.broken}/{loginBadge.total}</span>
                     )}
                   </button>
                   <button
-                    onClick={() => { setShowSettings(true); setShowUserMenu(false); }}
-                    className="w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)]"
+                    onClick={() => { setViewMode('usage'); setShowUserMenu(false); }}
+                    className="w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)] flex items-center gap-2"
                   >
-                    Settings
+                    <span className="w-3 text-center">💰</span><span>Usage</span>
                   </button>
                   <button
                     onClick={() => { setViewMode('logs'); setShowUserMenu(false); }}
-                    className="w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)]"
+                    className="w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)] flex items-center gap-2"
                   >
-                    Logs
+                    <span className="w-3 text-center">📜</span><span>Logs</span>
                   </button>
-                  <a
-                    href="/chat"
-                    className="block w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)]"
-                  >
-                    Chat (web)
-                  </a>
                   <a
                     href="/mobile"
-                    className="block w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)]"
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="block w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-tertiary)] flex items-center gap-2"
                   >
-                    Mobile View
+                    <span className="w-3 text-center">📱</span>
+                    <span className="flex-1">Mobile View</span>
+                    <span className="text-[9px] text-[var(--text-secondary)]">↗</span>
                   </a>
                   <div className="border-t border-[var(--border)] my-1" />
                   <button
                     onClick={() => signOut({ callbackUrl: '/login' })}
-                    className="w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--red)] hover:bg-[var(--bg-tertiary)]"
+                    className="w-full text-left text-[11px] px-3 py-1.5 text-[var(--text-secondary)] hover:text-[var(--red)] hover:bg-[var(--bg-tertiary)] flex items-center gap-2"
                   >
-                    Logout
+                    <span className="w-3 text-center">⏻</span><span>Logout</span>
                   </button>
                 </div>
               </>

package/components/PipelineView.tsx

@@ -7,6 +7,42 @@ import type { TaskLogEntry } from '@/src/types';
 const PipelineEditor = lazy(() => import('./PipelineEditor'));
 const ConversationEditor = lazy(() => import('./ConversationEditor'));
 
+// ─── Module-level SWR cache ──────────────────────────────
+// Survives tab switches (but not page refresh). On mount we hydrate
+// state from cache instantly if present (<30s old) and revalidate in
+// the background. Eliminates the "blank then slow load" feeling when
+// users switch away and come back to this tab. Cache is per-component-
+// module — entries are flushed when the page reloads.
+const _metaCache: { ts: number; workflows: any[]; projects: any[]; agents: any[] } | null = null as any;
+const _runsCache = new Map<string, { ts: number; runs: any[] }>();
+const META_TTL_MS = 30_000;
+const RUNS_TTL_MS = 15_000;
+let _metaCacheRef: typeof _metaCache = _metaCache;
+
+function readMetaCache() {
+  if (_metaCacheRef && Date.now() - _metaCacheRef.ts < META_TTL_MS) return _metaCacheRef;
+  return null;
+}
+function writeMetaCache(workflows: any[], projects: any[], agents: any[]) {
+  _metaCacheRef = { ts: Date.now(), workflows, projects, agents };
+}
+function readRunsCache(workflow: string) {
+  const c = _runsCache.get(workflow);
+  if (c && Date.now() - c.ts < RUNS_TTL_MS) return c;
+  return null;
+}
+function writeRunsCache(workflow: string, runs: any[]) {
+  _runsCache.set(workflow, { ts: Date.now(), runs });
+}
+// Invalidate after user mutations (delete/import/reinstall) so the next
+// fetchMeta/fetchWorkflowRuns doesn't hydrate stale UI from cache while
+// the live refetch is in flight.
+function clearMetaCache() { _metaCacheRef = null; }
+function clearRunsCache(workflow?: string) {
+  if (workflow) _runsCache.delete(workflow);
+  else _runsCache.clear();
+}
+
 // ─── Live Task Log Hook ──────────────────────────────────
 // Subscribes to SSE stream for a running task, returns live log entries
 function useTaskStream(taskId: string | undefined, isRunning: boolean) {
@@ -698,6 +734,7 @@ export default function PipelineView({ onViewTask, focusPipelineId, onFocusHandl
       });
       const data = await res.json();
       if (!data.ok) { setMarketErr(data.error || 'install failed'); return; }
+      clearMetaCache();
       await Promise.all([fetchMarketplace(), fetchData()]);
     } catch (e) {
       setMarketErr(e instanceof Error ? e.message : String(e));
@@ -743,25 +780,52 @@ export default function PipelineView({ onViewTask, focusPipelineId, onFocusHandl
   // Lightweight metadata only — no pipeline runs. Runs are lazy-loaded
   // per-workflow on click. Reduces initial page to a single workflow
   // table fetch + projects + agents, even with hundreds of runs on disk.
+  //
+  // SWR pattern: if module-level cache is fresh, hydrate UI instantly
+  // and revalidate in background. First visit per page-load still pays
+  // the full fetch cost; tab switches feel instant.
   const fetchMeta = useCallback(async () => {
+    const cached = readMetaCache();
+    if (cached) {
+      setWorkflows(cached.workflows);
+      setProjects(cached.projects.map((p: any) => ({ name: p.name, path: p.path })));
+      setAgents(cached.agents);
+      // Fall through to background refetch — comment out to make TTL strict.
+    }
     const [wRes, projRes, agentRes] = await Promise.all([
       fetch('/api/pipelines?type=workflows'),
       fetch('/api/projects'),
       fetch('/api/agents'),
     ]);
     const [wData, projData, agentData] = await Promise.all([wRes.json(), projRes.json(), agentRes.json()]);
-    if (Array.isArray(wData)) setWorkflows(wData);
-    if (Array.isArray(projData)) setProjects(projData.map((p: any) => ({ name: p.name, path: p.path })));
-    if (Array.isArray(agentData?.agents)) setAgents(agentData.agents);
+    const ws = Array.isArray(wData) ? wData : [];
+    const ps = Array.isArray(projData) ? projData : [];
+    const ags = Array.isArray(agentData?.agents) ? agentData.agents : [];
+    if (ws.length) setWorkflows(ws);
+    if (ps.length) setProjects(ps.map((p: any) => ({ name: p.name, path: p.path })));
+    if (ags.length) setAgents(ags);
+    writeMetaCache(ws, ps, ags);
   }, []);
 
   // Fetch the run history for ONE workflow. Used on first expand + on
   // the 5s polling tick (only for the currently active workflow).
   const fetchWorkflowRuns = useCallback(async (workflowName: string, opts: { append?: boolean } = {}) => {
+    // SWR for the first expand of a workflow tab (not for append=true
+    // "load more" calls, those want fresh server pagination).
+    if (!opts.append) {
+      const cached = readRunsCache(workflowName);
+      if (cached) {
+        setPipelines((prev) => {
+          const others = prev.filter((p) => p.workflowName !== workflowName);
+          return [...others, ...cached.runs];
+        });
+      }
+    }
     try {
       const res = await fetch(`/api/pipelines?workflow=${encodeURIComponent(workflowName)}&limit=100`);
       const data: Pipeline[] = await res.json();
       if (!Array.isArray(data)) return;
+      if (!opts.append) writeRunsCache(workflowName, data);
       setPipelines(prev => {
         if (!opts.append) {
           // Replace this workflow's runs (covers status changes during polling),
@@ -890,6 +954,8 @@ export default function PipelineView({ onViewTask, focusPipelineId, onFocusHandl
       body: JSON.stringify({ action: 'delete' }),
     });
     if (selectedPipeline?.id === id) setSelectedPipeline(null);
+    const wf = pipelines.find((p) => p.id === id)?.workflowName;
+    clearRunsCache(wf);
     fetchData();
   };
 
@@ -1015,6 +1081,8 @@ initial_prompt: "{{input.task}}"
                               });
                               const data = await res.json();
                               if (!data.ok) { setMarketErr(data.error || 'reinstall failed'); return; }
+                              clearMetaCache();
+                              clearRunsCache(r.name);
                               await Promise.all([fetchMarketplace(), fetchData()]);
                               alert(`"${r.name}" reinstalled from registry (v${r.version}).`);
                             } catch (e) {
@@ -1052,6 +1120,7 @@ initial_prompt: "{{input.task}}"
                             });
                             const data = await res.json();
                             if (!data.ok) { setMarketErr(data.error || 'import failed'); return; }
+                            clearMetaCache();
                             await Promise.all([fetchMarketplace(), fetchData()]);
                             alert(`Imported as "${data.installed_as}". Open it from the Workflows list.`);
                           } catch (e) {
@@ -1287,6 +1356,8 @@ initial_prompt: "{{input.task}}"
                           const data = await res.json();
                           if (!res.ok || data.error) { alert(`Delete failed: ${data.error || res.status}`); return; }
                           if (activeWorkflow === w.name) setActiveWorkflow(null);
+                          clearMetaCache();
+                          clearRunsCache(w.name);
                           fetchData();
                         } catch { alert('Delete failed'); }
                       }}

package/components/SkillsPanel.tsx

@@ -142,7 +142,7 @@ export default function SkillsPanel({ projectFilter }: { projectFilter?: string
   const [syncing, setSyncing] = useState(false);
   const [loading, setLoading] = useState(true);
   const [installTarget, setInstallTarget] = useState<{ skill: string; show: boolean }>({ skill: '', show: false });
-  const [typeFilter, setTypeFilter] = useState<'all' | 'skill' | 'command' | 'local' | 'rules' | 'plugins' | 'connectors' | 'crafts' | 'recipes' | 'pipelines'>('all');
+  const [typeFilter, setTypeFilter] = useState<'all' | 'skill' | 'command' | 'local' | 'rules' | 'plugins' | 'connectors' | 'crafts' | 'recipes' | 'pipelines'>('pipelines');
   const [localItems, setLocalItems] = useState<{ name: string; type: string; scope: string; fileCount: number; projectPath?: string }[]>([]);
   // Rules (CLAUDE.md templates)
   const [rulesTemplates, setRulesTemplates] = useState<{ id: string; name: string; description: string; tags: string[]; builtin: boolean; isDefault: boolean; content: string }[]>([]);
@@ -414,30 +414,65 @@ export default function SkillsPanel({ projectFilter }: { projectFilter?: string
       <div className="flex items-center justify-between px-4 py-2 border-b border-[var(--border)] shrink-0">
         <div className="flex items-center gap-2">
           <span className="text-xs font-semibold text-[var(--text-primary)]">Marketplace</span>
-          {/* Grouped category dropdown — replaces the long inline tab bar.
-              Native <optgroup> gives free keyboard nav + a coherent layout
-              regardless of category count. */}
-          <select
-            value={typeFilter}
-            onChange={(e) => setTypeFilter(e.target.value as typeof typeFilter)}
-            className="text-[10px] px-2 py-1 rounded bg-[var(--bg-tertiary)] border border-[var(--border)] text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent)]"
-          >
-            <optgroup label="Catalog">
-              <option value="all">All ({skills.length})</option>
-              <option value="skill">Skills ({skillCount})</option>
-              <option value="command">Commands ({commandCount})</option>
-              <option value="local">Local ({localCount})</option>
-              <option value="rules">Rules</option>
-            </optgroup>
-            <optgroup label="Extensions">
-              <option value="plugins">Plugins</option>
-              <option value="connectors">Connectors</option>
-              <option value="crafts">Crafts</option>
-            </optgroup>
-            <optgroup label="Templates">
-              <option value="pipelines">Pipelines</option>
-            </optgroup>
-          </select>
+          {/* Three group-scoped dropdowns instead of one big <select>.
+              Order is by usage frequency: Extensions (Connectors lives
+              here) → Templates → Catalog. Each dropdown highlights when
+              its current value is active; the inactive ones show the
+              group label as a placeholder. Picking from any sets the
+              single global typeFilter. */}
+          {(() => {
+            const groups: Array<{ label: string; opts: Array<{ value: typeof typeFilter; label: string }> }> = [
+              { label: 'Templates', opts: [
+                { value: 'pipelines',  label: 'Pipelines' },
+              ]},
+              { label: 'Extensions', opts: [
+                { value: 'connectors', label: 'Connectors' },
+                { value: 'plugins',    label: 'Plugins' },
+                { value: 'crafts',     label: 'Crafts' },
+              ]},
+              { label: 'Catalog', opts: [
+                { value: 'all',     label: `All (${skills.length})` },
+                { value: 'skill',   label: `Skills (${skillCount})` },
+                { value: 'command', label: `Commands (${commandCount})` },
+                { value: 'local',   label: `Local (${localCount})` },
+                { value: 'rules',   label: 'Rules' },
+              ]},
+            ];
+            return groups.map((g) => {
+              const isActive = g.opts.some((o) => o.value === typeFilter);
+              if (g.opts.length === 1) {
+                const only = g.opts[0];
+                return (
+                  <button
+                    key={g.label}
+                    onClick={() => setTypeFilter(only.value)}
+                    className={`text-[10px] px-2 py-1 rounded border ${
+                      isActive
+                        ? 'border-[var(--accent)] text-[var(--accent)] bg-[var(--accent)]/10'
+                        : 'border-[var(--border)] text-[var(--text-primary)] bg-[var(--bg-tertiary)] hover:border-[var(--text-secondary)]'
+                    }`}
+                  >{only.label}</button>
+                );
+              }
+              return (
+                <select
+                  key={g.label}
+                  value={isActive ? (typeFilter as string) : ''}
+                  onChange={(e) => { if (e.target.value) setTypeFilter(e.target.value as typeof typeFilter); }}
+                  className={`text-[10px] px-2 py-1 rounded bg-[var(--bg-tertiary)] border focus:outline-none ${
+                    isActive
+                      ? 'border-[var(--accent)] text-[var(--accent)]'
+                      : 'border-[var(--border)] text-[var(--text-primary)] focus:border-[var(--accent)]'
+                  }`}
+                >
+                  <option value="" disabled hidden>{g.label}</option>
+                  {g.opts.map((o) => (
+                    <option key={o.value} value={o.value as string}>{o.label}</option>
+                  ))}
+                </select>
+              );
+            });
+          })()}
         </div>
         <span className="text-[8px] px-1.5 py-0.5 rounded bg-blue-500/15 text-blue-400">Claude Code</span>
         <input

package/lib/chat/tool-dispatcher.ts

@@ -163,50 +163,61 @@ const BUILTINS: Record<string, BuiltinHandler> = {
     }
 
     const pipeline = startPipeline(params.workflow, stringInput, { skills: skills.length ? skills : undefined });
-    let line = `Pipeline started: ${pipeline.id} (workflow: ${params.workflow}, status: ${pipeline.status})`;
+    const fresh = getPipeline(pipeline.id) || pipeline;
+    const errors: string[] = [];
     if (pipeline.status === 'failed') {
-      const fresh = getPipeline(pipeline.id) || pipeline;
-      const errs: string[] = [];
       for (const [nid, n] of Object.entries(fresh.nodes || {})) {
-        if ((n as any).error) errs.push(`${nid}: ${(n as any).error}`);
+        if ((n as any).error) errors.push(`${nid}: ${(n as any).error}`);
       }
-      if (errs.length > 0) line += `\nFailure(s): ${errs.join(' | ').slice(0, 500)}`;
-    } else if (pipeline.status === 'done') {
-      // For for_each workflows, a "done" with zero iterations is the silent
-      // failure mode (empty source). Warn the LLM explicitly so it doesn't
-      // claim success.
-      const fresh = getPipeline(pipeline.id) || pipeline;
+    }
+    let warning: string | undefined;
+    if (pipeline.status === 'done') {
       const forEach = (fresh as any).forEach;
       if (forEach && typeof forEach === 'object') {
         const iters = Array.isArray(forEach.iterations) ? forEach.iterations.length : 0;
         const total = typeof forEach.total === 'number' ? forEach.total : iters;
         if (total === 0) {
-          line += '\n⚠ Pipeline finished with 0 iterations — likely empty source list. This is NOT a success; the work the user asked for did NOT happen. Re-check input fields (especially the one feeding for_each.source) and retry.';
+          warning = 'Pipeline finished with 0 iterations — likely empty source list. This is NOT a success; the work the user asked for did NOT happen. Re-check input fields (especially the one feeding for_each.source) and retry.';
         }
       }
-    } else {
-      line += '. Watch progress in the Pipelines view.';
     }
-    return line;
+    return JSON.stringify({
+      ok: pipeline.status !== 'failed',
+      pipeline_id: pipeline.id,
+      workflow: params.workflow,
+      status: pipeline.status,
+      terminal: pipeline.status !== 'running',
+      ...(errors.length ? { errors: errors.join(' | ').slice(0, 500) } : {}),
+      ...(warning ? { warning } : {}),
+      hint: pipeline.status === 'running'
+        ? 'To wait for completion: start_watch poll="get_pipeline_status" poll_args={pipeline_id:"' + pipeline.id + '"} done_match={path:"status",equals:"done"} fail_path="status==failed". Do NOT poll get_pipeline_status in this conversation.'
+        : undefined,
+    });
   },
 
   // Query a pipeline run's status + per-node results by id (pairs with
-  // trigger_pipeline's returned id). Mirrors the MCP get_pipeline_status tool.
+  // trigger_pipeline's returned id). Returns JSON so start_watch's
+  // done_match={path:"status",equals:"done"} can resolve — a string-shaped
+  // response leaves watches polling forever.
   get_pipeline_status: async (input) => {
     const params = (input as { pipeline_id?: string } | undefined) || {};
-    if (!params.pipeline_id) return 'get_pipeline_status failed: pipeline_id is required (returned by trigger_pipeline).';
+    if (!params.pipeline_id) return JSON.stringify({ ok: false, error: 'pipeline_id is required (returned by trigger_pipeline)' });
     const { getPipeline } = await import('../pipeline');
     const pipeline = getPipeline(params.pipeline_id);
-    if (!pipeline) return `Pipeline "${params.pipeline_id}" not found.`;
-    const nodes = Object.entries(pipeline.nodes || {}).map(([id, n]) => {
-      let line = `  ${id}: ${n.status}`;
-      if (n.error) line += ` — ${n.error}`;
-      for (const [k, v] of Object.entries(n.outputs || {})) {
-        line += `\n    ${k}: ${String(v).slice(0, 200)}`;
-      }
-      return line;
-    }).join('\n');
-    return `Pipeline ${pipeline.id} [${pipeline.status}] (${pipeline.workflowName})\n${nodes}`;
+    if (!pipeline) return JSON.stringify({ ok: false, error: `Pipeline "${params.pipeline_id}" not found` });
+    const nodes = Object.entries(pipeline.nodes || {}).map(([id, n]) => ({
+      id,
+      status: n.status,
+      ...(n.error ? { error: n.error } : {}),
+      outputs: Object.fromEntries(Object.entries(n.outputs || {}).map(([k, v]) => [k, String(v).slice(0, 500)])),
+    }));
+    return JSON.stringify({
+      id: pipeline.id,
+      status: pipeline.status,
+      terminal: pipeline.status !== 'running',
+      workflowName: pipeline.workflowName,
+      nodes,
+    });
   },
 
   // Surface Forge's local context (projects + agents + skills) so the chat
@@ -260,11 +271,11 @@ const BUILTINS: Record<string, BuiltinHandler> = {
   // caller can ask "what's the status of task <id>?" later — we don't block.
   dispatch_task: async (input) => {
     const params = (input as { project?: string; prompt?: string; agent?: string } | undefined) || {};
-    if (!params.prompt) return 'dispatch_task failed: prompt is required';
+    if (!params.prompt) return JSON.stringify({ ok: false, error: 'prompt is required' });
     const { getProjectInfo, SCRATCH_PROJECT_NAME } = await import('../projects');
     const projectName = params.project?.trim() || SCRATCH_PROJECT_NAME;
     const project = getProjectInfo(projectName);
-    if (!project) return `dispatch_task failed: project "${projectName}" not found`;
+    if (!project) return JSON.stringify({ ok: false, error: `project "${projectName}" not found` });
     const { createTask } = await import('../task-manager');
     const task = createTask({
       projectName: project.name,
@@ -273,7 +284,33 @@ const BUILTINS: Record<string, BuiltinHandler> = {
       conversationId: '',
       agent: params.agent || undefined,
     });
-    return `Task dispatched: ${task.id} (project: ${project.name}, status: ${task.status}). Watch in the Tasks view.`;
+    return JSON.stringify({
+      ok: true,
+      task_id: task.id,
+      project: project.name,
+      status: task.status,
+      hint: 'To wait for completion: start_watch poll="get_task_status" poll_args={task_id:"' + task.id + '"} done_path="terminal". Do NOT poll get_task_status in this conversation.',
+    });
+  },
+
+  // Companion to dispatch_task — read a task's status + result. Returns JSON
+  // so start_watch can poll via done_path="terminal" or done_match
+  // {path:"status", equals:"done"}.
+  get_task_status: async (input) => {
+    const params = (input as { task_id?: string } | undefined) || {};
+    if (!params.task_id) return JSON.stringify({ ok: false, error: 'task_id is required (returned by dispatch_task)' });
+    const { getTask } = await import('../task-manager');
+    const task = getTask(params.task_id);
+    if (!task) return JSON.stringify({ ok: false, error: `Task "${params.task_id}" not found` });
+    return JSON.stringify({
+      id: task.id,
+      status: task.status,
+      terminal: task.status === 'done' || task.status === 'failed' || task.status === 'cancelled',
+      project: task.projectName,
+      ...(task.resultSummary ? { result_summary: String(task.resultSummary).slice(0, 1000) } : {}),
+      ...(task.error ? { error: String(task.error).slice(0, 500) } : {}),
+      ...(task.completedAt ? { completed_at: task.completedAt } : {}),
+    });
   },
 
   // List Forge's own help/documentation files so the chat agent can answer
@@ -315,7 +352,7 @@ export const BUILTIN_TOOL_DEFS: BuiltinToolDef[] = [
   },
   {
     name: 'trigger_pipeline',
-    description: 'Trigger a Forge pipeline workflow (YAML under flows/). Two-step usage: (1) call with NO args first — returns every workflow + its input schema (which fields are required vs have defaults). (2) call again with workflow=<name> and input={...} passing ONLY required fields and any optional fields the user explicitly specified. NEVER pass invented placeholder values for optional fields with defaults — omit them and the default is used. If the pipeline fails immediately, the response includes the validation error so you can fix the inputs and retry.',
+    description: 'Trigger a Forge pipeline workflow (YAML under flows/). Two-step usage: (1) call with NO args first — returns every workflow + its input schema (which fields are required vs have defaults). (2) call again with workflow=<name> and input={...} passing ONLY required fields and any optional fields the user explicitly specified. NEVER pass invented placeholder values for optional fields with defaults — omit them and the default is used. On success returns JSON: {ok, pipeline_id, workflow, status, terminal, errors?, warning?, hint?}. If the run is still running, follow the hint — call start_watch on get_pipeline_status and STOP polling in this conversation.',
     input_schema: {
       type: 'object',
       properties: {
@@ -337,7 +374,7 @@ export const BUILTIN_TOOL_DEFS: BuiltinToolDef[] = [
   },
   {
     name: 'get_pipeline_status',
-    description: "Check a Forge pipeline run's live status + per-node results by id. Pass pipeline_id (returned by trigger_pipeline) to get the run's overall status + each node's status / error / outputs. Use whenever the user asks how a running or finished pipeline is doing.",
+    description: "Check a Forge pipeline run's live status + per-node results by id. Pass pipeline_id (returned by trigger_pipeline) to get a JSON object: {id, status: 'running'|'done'|'failed'|'cancelled', terminal: bool, workflowName, nodes: [{id, status, error?, outputs}]}. Use whenever the user asks how a running or finished pipeline is doing. For start_watch, pair this with done_match={path:\"status\",equals:\"done\"} (or done_path=\"terminal\" to fire on ANY terminal state) and fail_path=... per your needs.",
     input_schema: {
       type: 'object',
       properties: {
@@ -356,7 +393,7 @@ export const BUILTIN_TOOL_DEFS: BuiltinToolDef[] = [
   },
   {
     name: 'dispatch_task',
-    description: 'Dispatch a one-shot background Claude task in a Forge project. Use for longer-running asks the user wants to fire-and-forget ("analyze X codebase and write findings to a file", "run the test suite and summarize failures"). Returns immediately with the task id; the task runs in the background and the user can check the Tasks view for output.',
+    description: 'Dispatch a one-shot background Claude task in a Forge project. Use for longer-running asks the user wants to fire-and-forget ("analyze X codebase and write findings to a file", "run the test suite and summarize failures"). Returns JSON: {ok, task_id, project, status, hint}. The task runs in the background; if the user wants to be notified on completion, follow the hint — call start_watch on get_task_status and STOP polling in this conversation.',
     input_schema: {
       type: 'object',
       properties: {
@@ -376,6 +413,20 @@ export const BUILTIN_TOOL_DEFS: BuiltinToolDef[] = [
       required: ['prompt'],
     },
   },
+  {
+    name: 'get_task_status',
+    description: "Check a dispatched Forge task's status + result by id. Pass task_id (returned by dispatch_task). Returns JSON: {id, status: 'queued'|'running'|'done'|'failed'|'cancelled', terminal: bool, project, result_summary?, error?, completed_at?}. For start_watch, use done_path=\"terminal\" (fires on done/failed/cancelled) or done_match={path:\"status\",equals:\"done\"}.",
+    input_schema: {
+      type: 'object',
+      properties: {
+        task_id: {
+          type: 'string',
+          description: 'Task id (returned by dispatch_task).',
+        },
+      },
+      required: ['task_id'],
+    },
+  },
   {
     name: 'list_help_docs',
     description: "List Forge's own documentation files. Call this FIRST whenever the user asks how Forge itself works — its features, settings/config, setup, or troubleshooting (e.g. pipelines, schedules, connectors, telegram, tunnel, workspace/smiths, skills, crafts, usage/cost, agents/models). Returns doc filenames; then read the relevant one(s) with read_help_doc and answer from their content. No arguments.",

package/lib/help-docs/00-overview.md

@@ -57,3 +57,17 @@ forge server start --port 4000  # custom port
 forge server start --dir ~/.forge-test  # custom data dir
 forge --reset-password          # reset admin password
 ```
+
+## Dashboard top bar
+
+The top toolbar is split between **at-a-glance signals** (left to right) and a **user menu** (right edge):
+
+- **? Help** — opens the in-app Help AI.
+- **Browser ▾** — open an embedded browser (float / right / left dock or external tab).
+- **Tunnel** — start/stop the Cloudflare tunnel + online-count badge.
+- **Alerts** — notifications (task done, pipeline failed, tunnel events).
+
+Next to the **Automation** tab in the left-side nav sits a small **Activity** sub-pill — running pipelines + upcoming schedules + recent runs (`▶<running>` `⏰<upcoming>`). Click for a 3-section dropdown with a "view" link that jumps to the run. It lives there because its content is the live read-side of Automation.
+- **User menu (▾)** — `⚙ Settings` + `💬 Chat (web) ↗` at the top (Chat opens in a new tab so the dashboard isn't replaced); then a divider, then the periodic-check screens `📊 Monitor` (background watches, processes, queues), `🔐 Login Status` (connector creds), `💰 Usage` (token/cost analytics), `📜 Logs`, `📱 Mobile View ↗`; then `⏻ Logout`.
+
+Periodic-check screens (Monitor / Login Status / Usage) live inside the user menu so the top bar only shows things worth glancing at.

package/lib/help-docs/06-skills.md

@@ -16,11 +16,21 @@ Both register as `/slash-command` in Claude Code.
 
 ## Install
 
-1. Go to **Skills** tab in Forge
+1. Go to **Marketplace** tab in Forge
 2. Click **Sync** to fetch latest registry
 3. Click **Install** on any skill → choose Global or specific project
 4. Use in Claude Code with `/<skill-name>`
 
+## Navigating the Marketplace
+
+The toolbar has three group-scoped controls, ordered by usage frequency. Opening the Marketplace tab lands on **Pipelines** by default — the highest-traffic category.
+
+- **Pipelines** (button) — Templates synced from `forge-workflow`. Default landing view.
+- **Extensions ▾** — Connectors / Plugins / Crafts
+- **Catalog ▾** — All / Skills / Commands / Local / Rules
+
+The control whose value is currently active highlights in the accent color; the other two show their group label as a placeholder. Click any option to switch — no need to traverse a single long dropdown.
+
 ## Update
 
 Skills with newer versions show a yellow "update" indicator. Click to update (checks for local modifications first).

package/lib/help-docs/12-usage.md

@@ -4,7 +4,7 @@ Forge tracks Claude API token usage and estimated costs across all your projects
 
 ## Access
 
-Click **Usage** in the Dashboard top navigation.
+Open the **user menu** (top-right `▾`) and click **Usage**. It sits next to Monitor and Login Status — the three periodic-check screens are grouped there so the top toolbar only carries at-a-glance signals.
 
 ## Data Source
 

package/lib/help-docs/24-watch.md

@@ -47,25 +47,50 @@ Both use the same background machinery; you experience them identically.
 ## `start_watch` (for the assistant)
 
 When you've just started a long job and have a tool that reports its
-status, register a watch instead of polling in the conversation:
+status, register a watch instead of polling in the conversation. Two
+poll forms are accepted:
+
+**1. Connector tool** — `"<connector>.<tool>"`, e.g. `jenkins.get_build`:
 
 ```
 start_watch({
-  poll: "jenkins.get_build",                       // <connector>.<status tool>
+  poll: "jenkins.get_build",
   poll_args: { job_path: "job/foo", build_number: 18 },
-  done_match: { path: "result", equals: "SUCCESS" },  // or done_path (truthy)
+  done_match: { path: "result", equals: "SUCCESS" },
   interval_sec: 60, timeout_sec: 1800,
-  message: "Build 18 finished: {poll.result}"      // {poll.<path>} = latest result
+  message: "Build 18 finished: {poll.result}"
+})
+```
+
+**2. Bare builtin name** — Forge's own status readers:
+
+| Builtin | Pair with | done condition |
+|---|---|---|
+| `get_pipeline_status` | `trigger_pipeline` → pipeline_id | `done_match={path:"status",equals:"done"}` (or `done_path:"terminal"`) |
+| `get_task_status` | `dispatch_task` → task_id | `done_path:"terminal"` |
+
+```
+start_watch({
+  poll: "get_pipeline_status",                   // bare builtin, no prefix
+  poll_args: { pipeline_id: "a8e049a3" },
+  done_path: "terminal",
+  message: "Pipeline {poll.workflowName} finished: {poll.status}"
 })
 ```
 
-Then **stop** — do not keep calling get_build in the conversation. A
-completion message arrives in chat; the user can cancel it from the watch
-list. Pick `done_match`/`done_path` from a field you saw in the status
-tool's output (you usually called it once already). Queue/startup errors
-(e.g. a build number 404 while still queued) are tolerated for a while.
-Guards (max polls, timeout, lifetime, active cap) keep it from running
-away; worst case it times out and reports that.
+Then **stop** — do not keep calling the status tool in the conversation.
+A completion message arrives in chat; the user can cancel it from the
+watch list. Pick `done_match`/`done_path` from a field you saw in the
+status tool's output (you usually called it once already). Queue/startup
+errors (e.g. a build number 404 while still queued) are tolerated for a
+while. Guards (max polls, timeout, lifetime, active cap) keep it from
+running away; worst case it times out and reports that.
+
+### `_raw` fallback for non-JSON tools
+
+The poll result is parsed as JSON. If the tool returns plain text (some
+shell-protocol tools), Forge wraps it as `{_raw: "...full output..."}`
+so you can still grep — e.g. `done_match={path:"_raw",contains:"DONE"}`.
 
 ## Limits
 

package/lib/watch/start-watch-tool.ts

@@ -36,11 +36,13 @@ export function buildStartWatchTool(sessionId: string | null): StartWatchTool {
     name: 'start_watch',
     description:
       'Register a BACKGROUND WATCH that polls a tool until done, then posts the result back here — for long-running jobs you just kicked off (a Forge pipeline, a Jenkins build, a test run, a device upgrade). Use this INSTEAD of polling in conversation: call the trigger tool, then call start_watch and STOP — Forge polls in the background and a completion message arrives in this chat. ' +
-      'Pick `poll` = the read tool that reports status. Two forms accepted: (a) connector tool "<connector>.<tool>" e.g. "jenkins.get_build", "gitlab.get_pipeline"; (b) BARE builtin name e.g. "get_pipeline_status" (Forge pipelines — pair with poll_args={pipeline_id} and done_match={path:"status",equals:"done"}). Set `poll_args` to call it with (e.g. the build number you predicted via get_next_build_number). Give a done condition: `done_match` {path, equals} on the poll result (e.g. path "result" equals "SUCCESS"), or `done_path` (a result path that becomes truthy). You usually already saw the poll tool\'s output once, so you know the right field. Optional `fail_path` (truthy = failed). Tune `interval_sec`/`timeout_sec` to the job (pipeline ≈ 30s / 1800s, build ≈ 60s / 1800s).',
+      'Pick `poll` = the read tool that reports status. Two forms accepted: (a) connector tool "<connector>.<tool>" e.g. "jenkins.get_build", "gitlab.get_pipeline"; (b) BARE builtin name — "get_pipeline_status" (pair with poll_args={pipeline_id} and done_match={path:"status",equals:"done"}) or "get_task_status" (pair with poll_args={task_id} and done_path="terminal"). Set `poll_args` to call it with (e.g. the build number you predicted via get_next_build_number). ' +
+      'Give a done condition: `done_match` {path, equals} on the poll result (e.g. path "result" equals "SUCCESS"), or `done_path` (a result path that becomes truthy). You usually already saw the poll tool\'s output once, so you know the right field. Optional `fail_path` (truthy = failed). ' +
+      'If the poll tool returns NON-JSON text (e.g. some shell-protocol tools), the result is wrapped as {_raw: "...full output..."}, so use done_match={path:"_raw",contains:"DONE"} to grep markers in the output. Tune `interval_sec`/`timeout_sec` to the job (pipeline ≈ 30s / 1800s, build ≈ 60s / 1800s).',
     input_schema: {
       type: 'object',
       properties: {
-        poll: { type: 'string', description: 'Tool to poll. Either "<connector>.<tool>" e.g. "jenkins.get_build", OR a bare builtin name e.g. "get_pipeline_status" (for Forge pipelines). Must be a read/status tool.' },
+        poll: { type: 'string', description: 'Tool to poll. Either "<connector>.<tool>" e.g. "jenkins.get_build", OR a bare builtin name — "get_pipeline_status" (Forge pipelines) or "get_task_status" (dispatched tasks). Must be a read/status tool.' },
         poll_args: { type: 'object', description: 'Args to call the poll tool with each tick, e.g. {"job_path":"job/foo","build_number":18}. Concrete values, not templates.' },
         done_match: {
           type: 'object',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aion0/forge",
-  "version": "0.10.31",
+  "version": "0.10.33",
   "description": "Unified AI workflow platform — multi-model task orchestration, persistent sessions, web terminal, remote access",
   "type": "module",
   "scripts": {