@runfusion/fusion 0.16.0 → 0.17.0

package/dist/pi-claude-cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fusion/pi-claude-cli",
-  "version": "0.16.0",
+  "version": "0.17.0",
   "description": "Fusion vendored fork: pi coding-agent extension that routes LLM calls through the Claude Code CLI. Forked from rchern/pi-claude-cli (MIT). See UPSTREAM.md.",
   "license": "MIT",
   "private": true,

package/dist/pi-claude-cli/src/__tests__/process-manager.test.ts

@@ -713,6 +713,17 @@ describe("resume session flag", () => {
     expect(args).not.toContain("--resume");
   });
 
+  it("does not include --session-id when --resume is provided", () => {
+    spawnClaude("claude-sonnet-4-5-20250929", undefined, {
+      resumeSessionId: "session-abc",
+      newSessionId: "session-new",
+    });
+    const args = (spawn as any).mock.calls[0][1] as string[];
+
+    expect(args).toContain("--resume");
+    expect(args).not.toContain("--session-id");
+  });
+
   it("includes both --resume and --effort when both are provided", () => {
     spawnClaude("claude-sonnet-4-5-20250929", undefined, {
       resumeSessionId: "session-abc",

package/dist/pi-claude-cli/src/__tests__/provider.test.ts

@@ -1512,6 +1512,31 @@ describe("streamViaCli", { timeout: 90_000 }, () => {
     });
   });
 
+  describe("resume behavior", () => {
+    it("uses --resume for follow-up quick-chat turns when sessionId is present", async () => {
+      const model = mockModels[0] as any;
+      const context = {
+        messages: [
+          { role: "user", content: "Turn 1" },
+          { role: "assistant", content: "Reply 1" },
+          { role: "user", content: "Follow-up" },
+        ],
+      };
+
+      streamViaCli(model, context, { sessionId: "session-follow-up" } as any);
+      await vi.advanceTimersByTimeAsync(0);
+
+      const args = (spawn as any).mock.calls[0][1] as string[];
+      expect(args).toContain("--resume");
+      expect(args).toContain("session-follow-up");
+      expect(args).not.toContain("--session-id");
+
+      const proc = (spawn as any).mock.results[0].value;
+      proc.stdout.end();
+      await vi.advanceTimersByTimeAsync(100);
+    });
+  });
+
   describe("MCP config with custom tool results", () => {
     it("keeps MCP config even when conversation ends with custom tool result", async () => {
       const model = mockModels[0] as any;

package/dist/plugins/fusion-plugin-dependency-graph/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fusion-plugin-examples/dependency-graph",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "type": "module",
   "description": "Dependency graph dashboard view plugin for Fusion",
   "private": true,
@@ -19,14 +19,16 @@
     "test": "vitest run --silent=passed-only --reporter=dot"
   },
   "dependencies": {
-    "@fusion/plugin-sdk": "workspace:*",
-    "@fusion/core": "workspace:*"
+    "@fusion/core": "workspace:*",
+    "@fusion/plugin-sdk": "workspace:*"
   },
   "devDependencies": {
+    "@testing-library/react": "^16.3.2",
     "@types/node": "^25.5.2",
     "@types/react": "^19.0.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.2.4",
     "typescript": "^5.7.0",
-    "vitest": "^3.2.4",
-    "react": "^19.0.0"
+    "vitest": "^3.2.4"
   }
 }

package/dist/plugins/fusion-plugin-dependency-graph/src/DependencyGraphView.css

@@ -23,6 +23,7 @@
   background: var(--surface);
   min-height: var(--dependency-graph-canvas-min-height);
   cursor: grab;
+  touch-action: none;
 }
 
 .dependency-graph-canvas:active {
@@ -86,16 +87,46 @@
   filter: saturate(0.8);
 }
 
+.dependency-graph-empty {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  min-height: var(--dependency-graph-canvas-min-height);
+  padding: var(--space-xl);
+  color: var(--text-muted);
+  text-align: center;
+}
+
 @media (max-width: 768px) {
   .dependency-graph-view {
     padding: var(--space-md);
   }
 
+  .dependency-graph-controls {
+    position: sticky;
+    top: 0;
+    z-index: 1;
+    background: var(--bg);
+    padding: var(--space-sm) 0;
+  }
+
+  .dependency-graph-controls .btn {
+    min-height: 44px;
+    min-width: 44px;
+  }
+
   .dependency-graph-canvas {
+    flex: 1;
+    min-height: 0;
     min-height: var(--dependency-graph-canvas-min-height-mobile);
   }
 
   .dependency-graph-node {
     width: min(100%, var(--dependency-graph-node-max-width-mobile)) !important;
   }
+
+  .dependency-graph-empty {
+    min-height: var(--dependency-graph-canvas-min-height-mobile);
+  }
 }

package/dist/plugins/fusion-plugin-dependency-graph/src/DependencyGraphView.tsx

@@ -1,5 +1,5 @@
-import { useMemo, useRef, useState } from "react";
-import type { PointerEvent as ReactPointerEvent, ReactNode } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import type { PointerEvent as ReactPointerEvent, ReactNode, WheelEvent as ReactWheelEvent } from "react";
 import type { Task } from "@fusion/core";
 import { loadPositions, savePositions } from "./storage";
 import "./DependencyGraphView.css";
@@ -14,6 +14,8 @@ const SCENE_PADDING_REM = 2;
 const FIT_PADDING_REM = 2;
 const MIN_SCALE = 0.4;
 const MAX_SCALE = 2;
+const WHEEL_ZOOM_FACTOR = 0.002;
+const MOBILE_BREAKPOINT = 768;
 
 export interface DependencyGraphHostContext {
   projectId?: string;
@@ -29,9 +31,12 @@ export interface PluginDashboardViewComponentProps {
 type Position = { x: number; y: number };
 
 function getDistance(a: Position, b: Position): number {
-  const deltaX = a.x - b.x;
-  const deltaY = a.y - b.y;
-  return Math.hypot(deltaX, deltaY);
+  return Math.hypot(a.x - b.x, a.y - b.y);
+}
+
+function isMobileViewport(): boolean {
+  if (typeof window === "undefined") return false;
+  return window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT}px)`).matches;
 }
 
 export function DependencyGraphView({ context }: PluginDashboardViewComponentProps) {
@@ -42,11 +47,16 @@ export function DependencyGraphView({ context }: PluginDashboardViewComponentPro
   const [hoveredTaskId, setHoveredTaskId] = useState<string | null>(null);
   const persisted = useMemo(() => loadPositions(context.projectId), [context.projectId]);
   const canvasRef = useRef<HTMLDivElement | null>(null);
+
+  // Multi-pointer tracking (no setPointerCapture — it breaks two-finger gestures)
+  const pointersRef = useRef<Map<number, Position>>(new Map());
   const interactionRef = useRef<
     | { kind: "node"; taskId: string; startPointer: Position; startNode: Position; moved: boolean }
     | { kind: "pan"; startPointer: Position; startPan: Position; moved: boolean }
     | null
   >(null);
+  const pinchRef = useRef<{ startDistance: number; startScale: number } | null>(null);
+  const autoFitDoneRef = useRef(false);
 
   const tasks = useMemo(
     () => context.tasks.filter((task) => ACTIVE_COLUMNS.has(task.column)),
@@ -162,7 +172,7 @@ export function DependencyGraphView({ context }: PluginDashboardViewComponentPro
     return related;
   }, [dependencyGraph.downstream, dependencyGraph.upstream, focusTaskId]);
 
-  const fitToGraph = () => {
+  const fitToGraph = useCallback(() => {
     const canvas = canvasRef.current;
     if (!canvas) return;
 
@@ -179,7 +189,26 @@ export function DependencyGraphView({ context }: PluginDashboardViewComponentPro
 
     setScale(nextScale);
     setPan({ x: centeredPanX, y: centeredPanY });
-  };
+  }, [bounds.width, bounds.height]);
+
+  // Auto-fit on initial mobile load
+  useEffect(() => {
+    if (autoFitDoneRef.current) return;
+    if (!isMobileViewport()) return;
+    if (positioned.length === 0) return;
+
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+
+    // Ensure the canvas has non-zero dimensions before fitting
+    if (canvas.clientWidth === 0 || canvas.clientHeight === 0) return;
+
+    autoFitDoneRef.current = true;
+    // Use rAF to ensure layout is settled
+    requestAnimationFrame(() => {
+      fitToGraph();
+    });
+  }, [fitToGraph, positioned.length]);
 
   const persistPosition = (taskId: string, next: Position) => {
     setNodeOverrides((current) => ({ ...current, [taskId]: next }));
@@ -193,6 +222,10 @@ export function DependencyGraphView({ context }: PluginDashboardViewComponentPro
     event.stopPropagation();
     const hit = map.get(taskId);
     if (!hit) return;
+
+    // Track this pointer in the global map
+    pointersRef.current.set(event.pointerId, { x: event.clientX, y: event.clientY });
+
     interactionRef.current = {
       kind: "node",
       taskId,
@@ -200,21 +233,48 @@ export function DependencyGraphView({ context }: PluginDashboardViewComponentPro
       startNode: { x: hit.x, y: hit.y },
       moved: false,
     };
-    event.currentTarget.setPointerCapture(event.pointerId);
   };
 
   const handleCanvasPointerDown = (event: ReactPointerEvent<HTMLDivElement>) => {
     if (event.button !== 0) return;
+
+    // Track this pointer
+    pointersRef.current.set(event.pointerId, { x: event.clientX, y: event.clientY });
+
+    // If we already have another pointer, this is the start of a pinch gesture
+    if (pointersRef.current.size === 2) {
+      // Cancel any ongoing pan interaction
+      interactionRef.current = null;
+      const [p1, p2] = Array.from(pointersRef.current.values());
+      const distance = getDistance(p1, p2);
+      pinchRef.current = { startDistance: distance, startScale: scale };
+      return;
+    }
+
     interactionRef.current = {
       kind: "pan",
       startPointer: { x: event.clientX, y: event.clientY },
       startPan: pan,
       moved: false,
     };
-    event.currentTarget.setPointerCapture(event.pointerId);
   };
 
   const handlePointerMove = (event: ReactPointerEvent<HTMLDivElement>) => {
+    // Update tracked pointer position
+    if (pointersRef.current.has(event.pointerId)) {
+      pointersRef.current.set(event.pointerId, { x: event.clientX, y: event.clientY });
+    }
+
+    // Handle pinch gesture when two pointers are active
+    if (pointersRef.current.size >= 2 && pinchRef.current) {
+      const [p1, p2] = Array.from(pointersRef.current.values());
+      const currentDistance = getDistance(p1, p2);
+      const scaleFactor = currentDistance / pinchRef.current.startDistance;
+      const newScale = Math.min(MAX_SCALE, Math.max(MIN_SCALE, pinchRef.current.startScale * scaleFactor));
+      setScale(newScale);
+      return;
+    }
+
     const current = interactionRef.current;
     if (!current) return;
 
@@ -241,6 +301,16 @@ export function DependencyGraphView({ context }: PluginDashboardViewComponentPro
   };
 
   const handlePointerUp = (event: ReactPointerEvent<HTMLDivElement>) => {
+    pointersRef.current.delete(event.pointerId);
+
+    // If we had a pinch and one finger remains, end pinch mode
+    if (pinchRef.current) {
+      if (pointersRef.current.size < 2) {
+        pinchRef.current = null;
+      }
+      return;
+    }
+
     const current = interactionRef.current;
     interactionRef.current = null;
     if (!current) return;
@@ -256,8 +326,38 @@ export function DependencyGraphView({ context }: PluginDashboardViewComponentPro
 
       persistPosition(current.taskId, { x: hit.x, y: hit.y });
     }
+  };
 
-    event.currentTarget.releasePointerCapture(event.pointerId);
+  const handlePointerCancel = (event: ReactPointerEvent<HTMLDivElement>) => {
+    pointersRef.current.delete(event.pointerId);
+    pinchRef.current = null;
+    interactionRef.current = null;
+  };
+
+  const handleWheel = (event: ReactWheelEvent<HTMLDivElement>) => {
+    event.preventDefault();
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+
+    const rootFontSize = Number.parseFloat(globalThis.getComputedStyle(document.documentElement).fontSize) || 16;
+    const delta = -event.deltaY * WHEEL_ZOOM_FACTOR;
+    const newScale = Math.min(MAX_SCALE, Math.max(MIN_SCALE, scale * (1 + delta)));
+
+    // Zoom toward the pointer position
+    const rect = canvas.getBoundingClientRect();
+    const pointerX = event.clientX - rect.left;
+    const pointerY = event.clientY - rect.top;
+
+    // How much the point under the cursor should shift in rem
+    const scaleRatio = newScale / scale;
+    const panOffsetX = (pointerX / rootFontSize) * (1 - scaleRatio) / scale;
+    const panOffsetY = (pointerY / rootFontSize) * (1 - scaleRatio) / scale;
+
+    setScale(newScale);
+    setPan((prev) => ({
+      x: prev.x + panOffsetX * newScale / scale,
+      y: prev.y + panOffsetY * newScale / scale,
+    }));
   };
 
   return (
@@ -274,46 +374,54 @@ export function DependencyGraphView({ context }: PluginDashboardViewComponentPro
         onPointerDown={handleCanvasPointerDown}
         onPointerMove={handlePointerMove}
         onPointerUp={handlePointerUp}
+        onPointerCancel={handlePointerCancel}
+        onWheel={handleWheel}
       >
-        <div
-          className="dependency-graph-scene"
-          style={{
-            width: `${bounds.width}rem`,
-            height: `${bounds.height}rem`,
-            transform: `translate(${pan.x}rem, ${pan.y}rem) scale(${scale})`,
-            transformOrigin: "top left",
-          }}
-        >
-          <svg className="dependency-graph-edges" viewBox={`0 0 ${bounds.width} ${bounds.height}`}>
-            {edgesForRender.map((edge) => (
-              <line
-                key={`${edge.from}-${edge.to}`}
-                x1={edge.renderX1}
-                y1={edge.renderY1}
-                x2={edge.renderX2}
-                y2={edge.renderY2}
-                className={`dependency-graph-edge${relatedTaskIds ? relatedTaskIds.has(edge.from) && relatedTaskIds.has(edge.to) ? " is-related" : " is-dimmed" : ""}`}
-              />
+        {tasks.length === 0 ? (
+          <div className="dependency-graph-empty">
+            <p>No tasks to display. Tasks in Triage, Todo, In Progress, or In Review columns will appear here.</p>
+          </div>
+        ) : (
+          <div
+            className="dependency-graph-scene"
+            style={{
+              width: `${bounds.width}rem`,
+              height: `${bounds.height}rem`,
+              transform: `translate(${pan.x}rem, ${pan.y}rem) scale(${scale})`,
+              transformOrigin: "top left",
+            }}
+          >
+            <svg className="dependency-graph-edges" viewBox={`0 0 ${bounds.width} ${bounds.height}`}>
+              {edgesForRender.map((edge) => (
+                <line
+                  key={`${edge.from}-${edge.to}`}
+                  x1={edge.renderX1}
+                  y1={edge.renderY1}
+                  x2={edge.renderX2}
+                  y2={edge.renderY2}
+                  className={`dependency-graph-edge${relatedTaskIds ? relatedTaskIds.has(edge.from) && relatedTaskIds.has(edge.to) ? " is-related" : " is-dimmed" : ""}`}
+                />
+              ))}
+            </svg>
+
+            {positionedForRender.map((node) => (
+              <div
+                key={node.task.id}
+                className={`dependency-graph-node${selectedTaskId === node.task.id ? " is-selected" : ""}${relatedTaskIds ? relatedTaskIds.has(node.task.id) ? " is-related" : " is-dimmed" : ""}`}
+                style={{
+                  width: `${NODE_WIDTH_REM}rem`,
+                  minHeight: `${NODE_HEIGHT_REM}rem`,
+                  transform: `translate(${node.renderX}rem, ${node.renderY}rem)`,
+                }}
+                onPointerDown={(event) => handlePointerDownOnNode(node.task.id, event)}
+                onPointerEnter={() => setHoveredTaskId(node.task.id)}
+                onPointerLeave={() => setHoveredTaskId((current) => (current === node.task.id ? null : current))}
+              >
+                {context.renderTaskCard(node.task)}
+              </div>
             ))}
-          </svg>
-
-          {positionedForRender.map((node) => (
-            <div
-              key={node.task.id}
-              className={`dependency-graph-node${selectedTaskId === node.task.id ? " is-selected" : ""}${relatedTaskIds ? relatedTaskIds.has(node.task.id) ? " is-related" : " is-dimmed" : ""}`}
-              style={{
-                width: `${NODE_WIDTH_REM}rem`,
-                minHeight: `${NODE_HEIGHT_REM}rem`,
-                transform: `translate(${node.renderX}rem, ${node.renderY}rem)`,
-              }}
-              onPointerDown={(event) => handlePointerDownOnNode(node.task.id, event)}
-              onPointerEnter={() => setHoveredTaskId(node.task.id)}
-              onPointerLeave={() => setHoveredTaskId((current) => (current === node.task.id ? null : current))}
-            >
-              {context.renderTaskCard(node.task)}
-            </div>
-          ))}
-        </div>
+          </div>
+        )}
       </div>
     </section>
   );