@shepai/cli 1.72.9-pr218.000ada0 → 1.72.9-pr220.e1bfec0

package/dist/src/presentation/web/components/features/features-canvas/features-canvas.d.ts

@@ -1,27 +1,19 @@
 import type { Connection, Edge, NodeChange } from '@xyflow/react';
 import type { FeatureNodeType } from '../../common/feature-node/index.js';
 import type { RepositoryNodeType } from '../../common/repository-node/index.js';
-import type { AddRepositoryNodeType } from '../../common/add-repository-node/index.js';
-export type CanvasNodeType = FeatureNodeType | RepositoryNodeType | AddRepositoryNodeType;
+export type CanvasNodeType = FeatureNodeType | RepositoryNodeType;
 export interface FeaturesCanvasProps {
     nodes: CanvasNodeType[];
     edges: Edge[];
     selectedFeatureId?: string | null;
     onNodesChange?: (changes: NodeChange<CanvasNodeType>[]) => void;
     onAddFeature?: () => void;
-    onNodeAction?: (nodeId: string) => void;
-    onNodeSettings?: (nodeId: string) => void;
     onNodeClick?: (event: React.MouseEvent, node: CanvasNodeType) => void;
     onPaneClick?: (event: React.MouseEvent) => void;
-    onRepositoryAdd?: (repoNodeId: string) => void;
-    onRepositoryClick?: (nodeId: string) => void;
-    onRepositoryDelete?: (repositoryId: string) => void;
-    onFeatureDelete?: (featureId: string) => void;
     onConnect?: (connection: Connection) => void;
-    onRepositorySelect?: (path: string) => void;
     onCanvasDrag?: () => void;
     toolbar?: React.ReactNode;
     emptyState?: React.ReactNode;
 }
-export declare function FeaturesCanvas({ nodes, edges, selectedFeatureId, onNodesChange, onAddFeature, onNodeAction, onNodeSettings, onConnect, onNodeClick, onPaneClick, onRepositoryAdd, onRepositoryClick, onRepositoryDelete, onFeatureDelete, onRepositorySelect, onCanvasDrag, toolbar, emptyState, }: FeaturesCanvasProps): import("react/jsx-runtime").JSX.Element;
+export declare function FeaturesCanvas({ nodes, edges, selectedFeatureId, onNodesChange, onAddFeature, onConnect, onNodeClick, onPaneClick, onCanvasDrag, toolbar, emptyState, }: FeaturesCanvasProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=features-canvas.d.ts.map

package/dist/src/presentation/web/components/features/features-canvas/features-canvas.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"features-canvas.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/features-canvas/features-canvas.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAKlE,OAAO,KAAK,EAAE,eAAe,EAAmB,MAAM,kCAAkC,CAAC;AAEzF,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAE9E,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,yCAAyC,CAAC;AAGrF,MAAM,MAAM,cAAc,GAAG,eAAe,GAAG,kBAAkB,GAAG,qBAAqB,CAAC;AAE1F,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,cAAc,CAAC,EAAE,KAAK,IAAI,CAAC;IAChE,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IACtE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAChD,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,kBAAkB,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,eAAe,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IAC7C,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,KAAK,EACL,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,cAAc,EACd,SAAS,EACT,WAAW,EACX,WAAW,EACX,eAAe,EACf,iBAAiB,EACjB,kBAAkB,EAClB,eAAe,EACf,kBAAkB,EAClB,YAAY,EACZ,OAAO,EACP,UAAU,GACX,EAAE,mBAAmB,2CAiIrB"}
+{"version":3,"file":"features-canvas.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/features-canvas/features-canvas.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAKlE,OAAO,KAAK,EAAE,eAAe,EAAmB,MAAM,kCAAkC,CAAC;AAEzF,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAG9E,MAAM,MAAM,cAAc,GAAG,eAAe,GAAG,kBAAkB,CAAC;AAElE,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,cAAc,CAAC,EAAE,KAAK,IAAI,CAAC;IAChE,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IACtE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAChD,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IAC7C,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,KAAK,EACL,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,SAAS,EACT,WAAW,EACX,WAAW,EACX,YAAY,EACZ,OAAO,EACP,UAAU,GACX,EAAE,mBAAmB,2CAmGrB"}

package/dist/src/presentation/web/components/features/features-canvas/features-canvas.js

@@ -1,19 +1,17 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useMemo } from 'react';
+import { useMemo, useCallback } from 'react';
 import { ReactFlow, Background, Controls } from '@xyflow/react';
 import { Plus } from 'lucide-react';
 import { Button } from '../../ui/button.js';
 import { EmptyState } from '../../common/empty-state/index.js';
 import { FeatureNode } from '../../common/feature-node/index.js';
 import { RepositoryNode } from '../../common/repository-node/index.js';
-import { AddRepositoryNode } from '../../common/add-repository-node/index.js';
 import { DependencyEdge } from './dependency-edge.js';
-export function FeaturesCanvas({ nodes, edges, selectedFeatureId, onNodesChange, onAddFeature, onNodeAction, onNodeSettings, onConnect, onNodeClick, onPaneClick, onRepositoryAdd, onRepositoryClick, onRepositoryDelete, onFeatureDelete, onRepositorySelect, onCanvasDrag, toolbar, emptyState, }) {
+export function FeaturesCanvas({ nodes, edges, selectedFeatureId, onNodesChange, onAddFeature, onConnect, onNodeClick, onPaneClick, onCanvasDrag, toolbar, emptyState, }) {
     const nodeTypes = useMemo(() => ({
         featureNode: FeatureNode,
         repositoryNode: RepositoryNode,
-        addRepositoryNode: AddRepositoryNode,
     }), []);
     const edgeTypes = useMemo(() => ({
         dependencyEdge: DependencyEdge,
@@ -29,44 +27,14 @@ export function FeaturesCanvas({ nodes, edges, selectedFeatureId, onNodesChange,
         });
         return !targetAlreadyHasRepo;
     }, [nodes, edges]);
-    const enrichedNodes = useMemo(() => nodes.map((node) => ({
-        ...node,
-        // React Flow passes `selected` as a prop to the node component
-        ...(node.type === 'featureNode' && {
-            selected: selectedFeatureId != null &&
-                node.data.featureId === selectedFeatureId,
-        }),
-        data: {
-            ...node.data,
-            showHandles: edges.length > 0,
-            ...(node.type === 'featureNode' && node.data.state !== 'creating'
-                ? {
-                    onAction: onNodeAction ? () => onNodeAction(node.id) : undefined,
-                    onSettings: onNodeSettings ? () => onNodeSettings(node.id) : undefined,
-                    onDelete: onFeatureDelete,
-                }
-                : {}),
-            ...(node.type === 'repositoryNode' && {
-                onAdd: onRepositoryAdd ? () => onRepositoryAdd(node.id) : undefined,
-                onClick: onRepositoryClick ? () => onRepositoryClick(node.id) : undefined,
-                onDelete: onRepositoryDelete,
-            }),
-            ...(node.type === 'addRepositoryNode' && {
-                onSelect: onRepositorySelect ? (path) => onRepositorySelect(path) : undefined,
-            }),
-        },
-    })), [
-        nodes,
-        edges.length,
-        selectedFeatureId,
-        onNodeAction,
-        onNodeSettings,
-        onFeatureDelete,
-        onRepositoryAdd,
-        onRepositoryClick,
-        onRepositoryDelete,
-        onRepositorySelect,
-    ]);
+    // Callbacks and showHandles are already injected into node.data by deriveGraph.
+    // Only selectedFeatureId highlighting needs to be applied here.
+    const enrichedNodes = useMemo(() => selectedFeatureId == null
+        ? nodes
+        : nodes.map((node) => node.type === 'featureNode' &&
+            node.data.featureId === selectedFeatureId
+            ? { ...node, selected: true }
+            : node), [nodes, selectedFeatureId]);
     if (nodes.length === 0) {
         if (emptyState) {
             return (_jsx("div", { "data-testid": "features-canvas-empty", className: "h-full w-full", children: emptyState }));

package/dist/src/presentation/web/components/features/features-canvas/features-canvas.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"features-canvas.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/features-canvas/features-canvas.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAOnD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,cAAc,CAcrC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAwKnC,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAKxB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAK5B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAWzB,CAAC;AA4DF,eAAO,MAAM,mCAAmC,EAAE,KAOjD,CAAC;AAkCF,eAAO,MAAM,gCAAgC,EAAE,KAS9C,CAAC;AAgEF,eAAO,MAAM,gCAAgC,EAAE,KAW9C,CAAC;AAuDF,eAAO,MAAM,oBAAoB,EAAE,KAUlC,CAAC;AA2GF,eAAO,MAAM,oCAAoC,EAAE,KAOlD,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KASvC,CAAC"}
+{"version":3,"file":"features-canvas.stories.d.ts","sourceRoot":"","sources":["../../../../../../../src/presentation/web/components/features/features-canvas/features-canvas.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAMnD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,cAAc,CAcrC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAwKnC,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAKxB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAK5B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KASzB,CAAC;AAoDF,eAAO,MAAM,mCAAmC,EAAE,KAKjD,CAAC;AA4BF,eAAO,MAAM,gCAAgC,EAAE,KAO9C,CAAC;AA0DF,eAAO,MAAM,gCAAgC,EAAE,KAS9C,CAAC;AAiDF,eAAO,MAAM,oBAAoB,EAAE,KAQlC,CAAC;AAqGF,eAAO,MAAM,oCAAoC,EAAE,KAKlD,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAMvC,CAAC"}

package/dist/src/presentation/web/components/features/features-canvas/features-canvas.stories.js

@@ -208,8 +208,6 @@ export const Interactive = {
             { id: 'e3-4', source: 'node-3', target: 'node-4' },
         ],
         onAddFeature: () => undefined,
-        onNodeAction: () => undefined,
-        onNodeSettings: () => undefined,
     },
 };
 const repoNode = {
@@ -220,15 +218,8 @@ const repoNode = {
         name: 'shep-ai/cli',
     },
 };
-const addRepoNode = {
-    id: 'add-repo',
-    type: 'addRepositoryNode',
-    position: { x: 50, y: 302 },
-    data: {},
-};
 const repoFeatureNodes = [
     repoNode,
-    addRepoNode,
     {
         id: 'feat-1',
         type: 'featureNode',
@@ -269,8 +260,6 @@ export const ConnectedRepositoryMultipleFeatures = {
     args: {
         nodes: repoFeatureNodes,
         edges: repoFeatureEdges,
-        onNodeAction: () => undefined,
-        onNodeSettings: () => undefined,
     },
 };
 // --- Story 1: Single repository connected to a single feature ---
@@ -281,12 +270,6 @@ const singleRepoSingleFeatureNodes = [
         position: { x: 50, y: 127 },
         data: { name: 'shep-ai/cli' },
     },
-    {
-        id: 'add-repo',
-        type: 'addRepositoryNode',
-        position: { x: 50, y: 267 },
-        data: {},
-    },
     {
         id: 'feat-1',
         type: 'featureNode',
@@ -309,8 +292,6 @@ export const ConnectedRepositorySingleFeature = {
         edges: [
             { id: 'e-repo-f1', source: 'repo-1', target: 'feat-1', type: 'straight', ...dashedEdge },
         ],
-        onNodeAction: () => undefined,
-        onNodeSettings: () => undefined,
     },
 };
 // --- Story 2: Single repository connected to multiple features (one-to-many) ---
@@ -321,12 +302,6 @@ const singleRepoMultiFeatNodes = [
         position: { x: 50, y: 162 },
         data: { name: 'shep-ai/cli' },
     },
-    {
-        id: 'add-repo',
-        type: 'addRepositoryNode',
-        position: { x: 50, y: 450 },
-        data: {},
-    },
     {
         id: 'feat-1',
         type: 'featureNode',
@@ -381,8 +356,6 @@ export const SingleRepositoryMultipleFeatures = {
             { id: 'e-r1-f2', source: 'repo-1', target: 'feat-2', ...dashedEdge },
             { id: 'e-r1-f3', source: 'repo-1', target: 'feat-3', ...dashedEdge },
         ],
-        onNodeAction: () => undefined,
-        onNodeSettings: () => undefined,
     },
 };
 // --- Story 3: Multiple repositories each with their own features ---
@@ -399,12 +372,6 @@ const multiRepoNodes = [
         position: { x: 50, y: 270 },
         data: { name: 'shep-ai/web' },
     },
-    {
-        id: 'add-repo',
-        type: 'addRepositoryNode',
-        position: { x: 50, y: 470 },
-        data: {},
-    },
     {
         id: 'feat-1',
         type: 'featureNode',
@@ -443,8 +410,6 @@ export const MultipleRepositories = {
             { id: 'e-r1-f1', source: 'repo-1', target: 'feat-1', ...dashedEdge },
             { id: 'e-r2-f2', source: 'repo-2', target: 'feat-2', ...dashedEdge },
         ],
-        onNodeAction: () => undefined,
-        onNodeSettings: () => undefined,
     },
 };
 // --- Story 4: Multiple repositories with mixed feature connections (dagre layout) ---
@@ -467,12 +432,6 @@ const mixedRepoFeatureNodesRaw = [
         position: { x: 0, y: 0 },
         data: { name: 'shep-ai/api' },
     },
-    {
-        id: 'add-repo',
-        type: 'addRepositoryNode',
-        position: { x: 0, y: 0 },
-        data: {},
-    },
     {
         id: 'feat-1',
         type: 'featureNode',
@@ -548,8 +507,6 @@ export const MultipleRepositoriesMixedConnections = {
     args: {
         nodes: mixedLayoutedNodes,
         edges: mixedLayoutedEdges,
-        onNodeAction: () => undefined,
-        onNodeSettings: () => undefined,
     },
 };
 export const InteractiveWithRepository = {
@@ -557,8 +514,5 @@ export const InteractiveWithRepository = {
         nodes: repoFeatureNodes,
         edges: repoFeatureEdges,
         onAddFeature: () => undefined,
-        onNodeAction: () => undefined,
-        onNodeSettings: () => undefined,
-        onRepositoryAdd: () => undefined,
     },
 };

package/dist/src/presentation/web/components/layouts/app-shell/app-shell.js

@@ -4,7 +4,7 @@ import { useCallback } from 'react';
 import { useRouter } from 'next/navigation';
 import { SidebarProvider, SidebarInset } from '../../ui/sidebar.js';
 import { AppSidebar } from '../../layouts/app-sidebar/index.js';
-import { AddRepositoryButton } from '../../common/add-repository-node/index.js';
+import { AddRepositoryButton } from '../../common/add-repository-button/index.js';
 import { ThemeToggle } from '../../common/theme-toggle/index.js';
 import { SoundToggle } from '../../common/sound-toggle/index.js';
 import { AgentEventsProvider } from '../../../hooks/agent-events-provider.js';

package/dist/src/presentation/web/hooks/use-graph-state.d.ts

@@ -0,0 +1,41 @@
+import type { Edge } from '@xyflow/react';
+import type { CanvasNodeType } from '../components/features/features-canvas/index.js';
+import type { FeatureNodeData } from '../components/common/feature-node/index.js';
+import type { RepositoryNodeData } from '../components/common/repository-node/index.js';
+import { type FeatureEntry, type GraphCallbacks } from '../lib/derive-graph.js';
+export type { GraphCallbacks } from '../lib/derive-graph.js';
+export interface UseGraphStateReturn {
+    /** Derived React Flow nodes (from domain Maps). */
+    nodes: CanvasNodeType[];
+    /** Derived React Flow edges (from domain Maps). */
+    edges: Edge[];
+    /**
+     * Reconcile domain Maps with fresh server data (new initialNodes/initialEdges).
+     * Preserves pending (creating) nodes unless a matching real feature appears.
+     */
+    reconcile: (newNodes: CanvasNodeType[], newEdges: Edge[]) => void;
+    /** Update a feature's state/lifecycle/name (e.g., from SSE events). */
+    updateFeature: (featureNodeId: string, updates: Partial<Pick<FeatureNodeData, 'state' | 'lifecycle' | 'name' | 'description'>>) => void;
+    /** Add a pending (optimistic) feature node (state='creating'). */
+    addPendingFeature: (nodeId: string, data: FeatureNodeData, parentNodeId?: string) => void;
+    /** Remove a pending feature node (e.g., on rollback). */
+    removePendingFeature: (nodeId: string) => void;
+    /** Remove a real feature node from the domain Map. */
+    removeFeature: (nodeId: string) => void;
+    /** Restore a previously removed feature (rollback). */
+    restoreFeature: (nodeId: string, entry: FeatureEntry) => void;
+    /** Add a repository node (may use a temp ID initially). */
+    addRepository: (nodeId: string, data: RepositoryNodeData) => void;
+    /** Remove a repository node. */
+    removeRepository: (nodeId: string) => void;
+    /** Replace a temp repo ID with the real one (atomic). */
+    replaceRepository: (tempId: string, realId: string, data: RepositoryNodeData) => void;
+    /** Stable lookup: get the repositoryPath for a feature node. */
+    getFeatureRepositoryPath: (featureNodeId: string) => string | undefined;
+    /** Stable lookup: get repository node data by nodeId. */
+    getRepositoryData: (nodeId: string) => RepositoryNodeData | undefined;
+    /** Update callbacks injected into node data (does NOT trigger re-render). */
+    setCallbacks: (callbacks: GraphCallbacks) => void;
+}
+export declare function useGraphState(initialNodes: CanvasNodeType[], initialEdges: Edge[]): UseGraphStateReturn;
+//# sourceMappingURL=use-graph-state.d.ts.map

package/dist/src/presentation/web/hooks/use-graph-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-graph-state.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/hooks/use-graph-state.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AACxE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAC9E,OAAO,EAEL,KAAK,YAAY,EAEjB,KAAK,cAAc,EACpB,MAAM,oBAAoB,CAAC;AAG5B,YAAY,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEzD,MAAM,WAAW,mBAAmB;IAClC,mDAAmD;IACnD,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,mDAAmD;IACnD,KAAK,EAAE,IAAI,EAAE,CAAC;IACd;;;OAGG;IACH,SAAS,EAAE,CAAC,QAAQ,EAAE,cAAc,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IAClE,uEAAuE;IACvE,aAAa,EAAE,CACb,aAAa,EAAE,MAAM,EACrB,OAAO,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,OAAO,GAAG,WAAW,GAAG,MAAM,GAAG,aAAa,CAAC,CAAC,KACpF,IAAI,CAAC;IACV,kEAAkE;IAClE,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1F,yDAAyD;IACzD,oBAAoB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,sDAAsD;IACtD,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,uDAAuD;IACvD,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAC9D,2DAA2D;IAC3D,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAClE,gCAAgC;IAChC,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,yDAAyD;IACzD,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IACtF,gEAAgE;IAChE,wBAAwB,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IACxE,yDAAyD;IACzD,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,kBAAkB,GAAG,SAAS,CAAC;IACtE,6EAA6E;IAC7E,YAAY,EAAE,CAAC,SAAS,EAAE,cAAc,KAAK,IAAI,CAAC;CACnD;AAuCD,wBAAgB,aAAa,CAC3B,YAAY,EAAE,cAAc,EAAE,EAC9B,YAAY,EAAE,IAAI,EAAE,GACnB,mBAAmB,CAwPrB"}

package/dist/src/presentation/web/hooks/use-graph-state.js

@@ -0,0 +1,230 @@
+'use client';
+import { useState, useMemo, useCallback, useRef } from 'react';
+import { deriveGraph, } from '../lib/derive-graph.js';
+import { layoutWithDagre, CANVAS_LAYOUT_DEFAULTS } from '../lib/layout-with-dagre.js';
+/** Parse initialNodes + initialEdges into domain Maps. */
+function parseMaps(initialNodes, initialEdges) {
+    // Build parentNodeId map from dependency edges
+    const parentByChild = new Map();
+    for (const edge of initialEdges) {
+        if (edge.type === 'dependencyEdge' || edge.id.startsWith('dep-')) {
+            parentByChild.set(edge.target, edge.source);
+        }
+    }
+    const featureMap = new Map();
+    const repoMap = new Map();
+    for (const node of initialNodes) {
+        if (node.type === 'featureNode') {
+            featureMap.set(node.id, {
+                nodeId: node.id,
+                data: node.data,
+                parentNodeId: parentByChild.get(node.id),
+            });
+        }
+        else if (node.type === 'repositoryNode') {
+            repoMap.set(node.id, {
+                nodeId: node.id,
+                data: node.data,
+            });
+        }
+    }
+    return { featureMap, repoMap };
+}
+export function useGraphState(initialNodes, initialEdges) {
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- intentional: parse only on mount (like useState initializer)
+    const init = useMemo(() => parseMaps(initialNodes, initialEdges), []);
+    const [featureMap, setFeatureMap] = useState(init.featureMap);
+    const [repoMap, setRepoMap] = useState(init.repoMap);
+    const [pendingMap, setPendingMap] = useState(new Map());
+    // Buffer for SSE updates that arrive before their feature is in featureMap.
+    // When reconcile adds new features, buffered updates are applied automatically.
+    const pendingUpdatesRef = useRef(new Map());
+    // Callbacks stored in a ref so changing them doesn't trigger re-render.
+    // The stable wrapper object reads from the ref so node closures always use latest callbacks.
+    const callbacksRef = useRef({});
+    const stableCallbacks = useMemo(() => ({
+        onNodeAction: (nodeId) => callbacksRef.current.onNodeAction?.(nodeId),
+        onNodeSettings: (nodeId) => callbacksRef.current.onNodeSettings?.(nodeId),
+        onFeatureDelete: (featureId) => callbacksRef.current.onFeatureDelete?.(featureId),
+        onRepositoryAdd: (nodeId) => callbacksRef.current.onRepositoryAdd?.(nodeId),
+        onRepositoryClick: (nodeId) => callbacksRef.current.onRepositoryClick?.(nodeId),
+        onRepositoryDelete: (repositoryId) => callbacksRef.current.onRepositoryDelete?.(repositoryId),
+    }), []);
+    // Stable refs for domain Maps (for use in callbacks without depending on state)
+    const featureMapRef = useRef(featureMap);
+    featureMapRef.current = featureMap;
+    const repoMapRef = useRef(repoMap);
+    repoMapRef.current = repoMap;
+    // Derived nodes/edges — only re-runs when domain Maps change (not callbacks)
+    const { nodes, edges } = useMemo(() => {
+        const derived = deriveGraph(featureMap, repoMap, pendingMap, stableCallbacks);
+        return layoutWithDagre(derived.nodes, derived.edges, CANVAS_LAYOUT_DEFAULTS);
+    }, [featureMap, repoMap, pendingMap, stableCallbacks]);
+    // --- Mutations ---
+    const reconcile = useCallback((newNodes, newEdges) => {
+        const { featureMap: newFeatureMap, repoMap: newRepoMap } = parseMaps(newNodes, newEdges);
+        setFeatureMap((currentFeatureMap) => {
+            // Preserve pending (creating) nodes unless matched by name+repositoryPath from newFeatureMap
+            const pendingEntries = [...currentFeatureMap.entries()].filter(([, e]) => e.data.state === 'creating');
+            const merged = new Map(newFeatureMap);
+            // Keep pending nodes that don't have a real counterpart in new data
+            for (const [tempId, pendingEntry] of pendingEntries) {
+                const matched = [...newFeatureMap.values()].some((e) => e.data.name === pendingEntry.data.name &&
+                    e.data.repositoryPath === pendingEntry.data.repositoryPath);
+                if (!matched) {
+                    merged.set(tempId, pendingEntry);
+                }
+            }
+            // Apply any buffered SSE updates to features that now exist in the map
+            for (const [nodeId, updates] of pendingUpdatesRef.current) {
+                const entry = merged.get(nodeId);
+                if (entry) {
+                    merged.set(nodeId, { ...entry, data: { ...entry.data, ...updates } });
+                    pendingUpdatesRef.current.delete(nodeId);
+                }
+            }
+            return merged;
+        });
+        // Clean pendingMap entries that now have a real counterpart in server data
+        setPendingMap((currentPendingMap) => {
+            if (currentPendingMap.size === 0)
+                return currentPendingMap;
+            let changed = false;
+            const next = new Map(currentPendingMap);
+            for (const [tempId, pendingEntry] of currentPendingMap) {
+                const matched = [...newFeatureMap.values()].some((e) => e.data.name === pendingEntry.data.name &&
+                    e.data.repositoryPath === pendingEntry.data.repositoryPath);
+                if (matched) {
+                    next.delete(tempId);
+                    changed = true;
+                }
+            }
+            return changed ? next : currentPendingMap;
+        });
+        setRepoMap(newRepoMap);
+    }, []);
+    const updateFeature = useCallback((featureNodeId, updates) => {
+        setFeatureMap((prev) => {
+            const entry = prev.get(featureNodeId);
+            if (!entry) {
+                // Feature not yet in map — buffer update for when reconcile adds it
+                pendingUpdatesRef.current.set(featureNodeId, {
+                    ...pendingUpdatesRef.current.get(featureNodeId),
+                    ...updates,
+                });
+                return prev;
+            }
+            // Clear any buffered update for this feature since it's now in the map
+            pendingUpdatesRef.current.delete(featureNodeId);
+            // Skip if no actual change (prevents unnecessary re-renders on event replay)
+            const stateUnchanged = updates.state === undefined || updates.state === entry.data.state;
+            const lifecycleUnchanged = updates.lifecycle === undefined || updates.lifecycle === entry.data.lifecycle;
+            const nameUnchanged = updates.name === undefined || updates.name === entry.data.name;
+            const descUnchanged = updates.description === undefined || updates.description === entry.data.description;
+            if (stateUnchanged && lifecycleUnchanged && nameUnchanged && descUnchanged) {
+                return prev;
+            }
+            const next = new Map(prev);
+            next.set(featureNodeId, { ...entry, data: { ...entry.data, ...updates } });
+            return next;
+        });
+        // Also check pendingMap
+        setPendingMap((prev) => {
+            const entry = prev.get(featureNodeId);
+            if (!entry)
+                return prev;
+            const stateUnchanged = updates.state === undefined || updates.state === entry.data.state;
+            const lifecycleUnchanged = updates.lifecycle === undefined || updates.lifecycle === entry.data.lifecycle;
+            const nameUnchanged = updates.name === undefined || updates.name === entry.data.name;
+            const descUnchanged = updates.description === undefined || updates.description === entry.data.description;
+            if (stateUnchanged && lifecycleUnchanged && nameUnchanged && descUnchanged)
+                return prev;
+            const next = new Map(prev);
+            next.set(featureNodeId, { ...entry, data: { ...entry.data, ...updates } });
+            return next;
+        });
+    }, []);
+    const addPendingFeature = useCallback((nodeId, data, parentNodeId) => {
+        setPendingMap((prev) => {
+            const next = new Map(prev);
+            next.set(nodeId, { nodeId, data, parentNodeId });
+            return next;
+        });
+    }, []);
+    const removePendingFeature = useCallback((nodeId) => {
+        setPendingMap((prev) => {
+            if (!prev.has(nodeId))
+                return prev;
+            const next = new Map(prev);
+            next.delete(nodeId);
+            return next;
+        });
+    }, []);
+    const removeFeature = useCallback((nodeId) => {
+        setFeatureMap((prev) => {
+            if (!prev.has(nodeId))
+                return prev;
+            const next = new Map(prev);
+            next.delete(nodeId);
+            return next;
+        });
+    }, []);
+    const restoreFeature = useCallback((nodeId, entry) => {
+        setFeatureMap((prev) => {
+            const next = new Map(prev);
+            next.set(nodeId, entry);
+            return next;
+        });
+    }, []);
+    const addRepository = useCallback((nodeId, data) => {
+        setRepoMap((prev) => {
+            const next = new Map(prev);
+            next.set(nodeId, { nodeId, data });
+            return next;
+        });
+    }, []);
+    const removeRepository = useCallback((nodeId) => {
+        setRepoMap((prev) => {
+            if (!prev.has(nodeId))
+                return prev;
+            const next = new Map(prev);
+            next.delete(nodeId);
+            return next;
+        });
+    }, []);
+    const replaceRepository = useCallback((tempId, realId, data) => {
+        setRepoMap((prev) => {
+            if (!prev.has(tempId))
+                return prev;
+            const next = new Map(prev);
+            next.delete(tempId);
+            next.set(realId, { nodeId: realId, data });
+            return next;
+        });
+    }, []);
+    const getFeatureRepositoryPath = useCallback((featureNodeId) => {
+        return featureMapRef.current.get(featureNodeId)?.data.repositoryPath;
+    }, []);
+    const getRepositoryData = useCallback((nodeId) => {
+        return repoMapRef.current.get(nodeId)?.data;
+    }, []);
+    const setCallbacks = useCallback((callbacks) => {
+        callbacksRef.current = callbacks;
+    }, []);
+    return {
+        nodes,
+        edges,
+        reconcile,
+        updateFeature,
+        addPendingFeature,
+        removePendingFeature,
+        removeFeature,
+        restoreFeature,
+        addRepository,
+        removeRepository,
+        replaceRepository,
+        getFeatureRepositoryPath,
+        getRepositoryData,
+        setCallbacks,
+    };
+}

package/dist/src/presentation/web/lib/derive-graph.d.ts

@@ -0,0 +1,52 @@
+/**
+ * derive-graph.ts
+ *
+ * Pure client-side derivation: domain Maps → React Flow nodes + edges.
+ * All edges are derived from domain relationships (repositoryPath matching,
+ * parentNodeId) — never stored independently.
+ */
+import type { Edge } from '@xyflow/react';
+import type { CanvasNodeType } from '../components/features/features-canvas/index.js';
+import type { FeatureNodeData } from '../components/common/feature-node/index.js';
+import type { RepositoryNodeData } from '../components/common/repository-node/index.js';
+/** A feature node entry stored in the domain Map. */
+export interface FeatureEntry {
+    nodeId: string;
+    data: FeatureNodeData;
+    /** If set, this feature connects to a parent feature via a dependency edge (no repo→feature edge). */
+    parentNodeId?: string;
+}
+/** A repository node entry stored in the domain Map. */
+export interface RepoEntry {
+    nodeId: string;
+    data: RepositoryNodeData;
+}
+/** Stable callbacks passed by the consumer, injected into derived node data. */
+export interface GraphCallbacks {
+    /** Called when the user triggers an action on a feature node (e.g., adds a sub-feature). */
+    onNodeAction?: (nodeId: string) => void;
+    /** Called when the user opens settings/details on a feature node. */
+    onNodeSettings?: (nodeId: string) => void;
+    /** Called when the user deletes a feature. */
+    onFeatureDelete?: (featureId: string) => void;
+    /** Called when the user clicks the "+" add-feature button on a repo node. */
+    onRepositoryAdd?: (repoNodeId: string) => void;
+    /** Called when the user clicks a repo node to navigate to its detail page. */
+    onRepositoryClick?: (repoNodeId: string) => void;
+    /** Called when the user deletes a repository. */
+    onRepositoryDelete?: (repositoryId: string) => void;
+}
+/**
+ * Derives React Flow nodes and edges from domain Maps.
+ *
+ * - Feature nodes without a parentNodeId → repo→feature edge (matched by repositoryPath)
+ * - Feature nodes without a parentNodeId but with no matching repo → virtual repo node
+ * - Feature nodes with a parentNodeId → dependency edge (parentNodeId→nodeId)
+ * - Pending feature nodes (creating state) from pendingMap → same rules, no action callbacks
+ * - Callbacks are injected into node data via closures
+ */
+export declare function deriveGraph(featureMap: Map<string, FeatureEntry>, repoMap: Map<string, RepoEntry>, pendingMap: Map<string, FeatureEntry>, callbacks?: GraphCallbacks): {
+    nodes: CanvasNodeType[];
+    edges: Edge[];
+};
+//# sourceMappingURL=derive-graph.d.ts.map

package/dist/src/presentation/web/lib/derive-graph.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"derive-graph.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/lib/derive-graph.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AACxE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAC9E,qDAAqD;AACrD,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,eAAe,CAAC;IACtB,sGAAsG;IACtG,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wDAAwD;AACxD,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,kBAAkB,CAAC;CAC1B;AAED,gFAAgF;AAChF,MAAM,WAAW,cAAc;IAC7B,4FAA4F;IAC5F,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,qEAAqE;IACrE,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,8CAA8C;IAC9C,eAAe,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,6EAA6E;IAC7E,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,8EAA8E;IAC9E,iBAAiB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,iDAAiD;IACjD,kBAAkB,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;CACrD;AAED;;;;;;;;GAQG;AACH,wBAAgB,WAAW,CACzB,UAAU,EAAE,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,EACrC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,SAAS,CAAC,EAC/B,UAAU,EAAE,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,EACrC,SAAS,CAAC,EAAE,cAAc,GACzB;IAAE,KAAK,EAAE,cAAc,EAAE,CAAC;IAAC,KAAK,EAAE,IAAI,EAAE,CAAA;CAAE,CAyH5C"}