@mcp-graph-workflow/mcp-graph 5.20.1 → 5.22.0

package/dist/web/dashboard/dist/assets/graph-tab-H8UjUBJg.js

@@ -1 +0,0 @@
-import{r as s,j as e,a as re}from"./index-CW7bjrwy.js";import{u as oe,a as de,i as ce,B as ie,C as xe}from"./style-Cca8j3c-.js";import{b as ue,a as pe,g as W,t as me,s as he,c as fe,d as be,W as ge,e as je,N as Ne}from"./graph-utils-CpifDP5W.js";import{A as ye,S as L,a as ve,N as _,E as Ce}from"./constants-lq4BIQN3.js";import"./index-C9AGF8Ai.js";import"./index-BPPSD6wP.js";const ke=s.memo(function({statuses:h,types:f,direction:y,onStatusToggle:b,onTypeToggle:m,onDirectionChange:o,onClear:u,visibleNodeCount:c,totalNodeCount:i,onExpandAll:v,onCollapseAll:p}){return e.jsxs("div",{className:"flex flex-wrap items-center gap-3 px-4 py-2 border-b border-edge bg-surface-alt text-xs",children:[e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsx("span",{className:"font-medium text-muted",children:"Status:"}),ye.map(r=>e.jsxs("label",{className:"flex items-center gap-1 cursor-pointer",children:[e.jsx("input",{type:"checkbox",checked:h.has(r),onChange:()=>b(r),className:"w-3 h-3"}),e.jsx("span",{className:"w-2 h-2 rounded-full inline-block",style:{background:L[r]}}),e.jsx("span",{children:r.replace("_"," ")})]},r))]}),e.jsx("div",{className:"w-px h-4 bg-edge"}),e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsx("span",{className:"font-medium text-muted",children:"Type:"}),ve.map(r=>e.jsxs("label",{className:"flex items-center gap-1 cursor-pointer",children:[e.jsx("input",{type:"checkbox",checked:f.has(r),onChange:()=>m(r),className:"w-3 h-3"}),e.jsx("span",{className:"w-2 h-2 rounded-full inline-block",style:{background:_[r]}}),e.jsx("span",{children:r.replace("_"," ")})]},r))]}),e.jsx("div",{className:"w-px h-4 bg-edge"}),e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsx("span",{className:"font-medium text-muted",children:"Layout:"}),e.jsxs("select",{value:y,onChange:r=>o(r.target.value),className:"bg-surface border border-edge rounded px-1 py-0.5 text-xs",children:[e.jsx("option",{value:"TB",children:"Top → Down"}),e.jsx("option",{value:"LR",children:"Left → Right"})]})]}),e.jsx("div",{className:"w-px h-4 bg-edge"}),e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsx("button",{onClick:v,className:"px-2 py-0.5 rounded border border-edge hover:bg-surface-elevated transition-colors",title:i>100?`Warning: ${i} nodes — may be slow`:"Expand all nodes",children:"Expand All"}),e.jsx("button",{onClick:p,className:"px-2 py-0.5 rounded border border-edge hover:bg-surface-elevated transition-colors",children:"Collapse All"})]}),e.jsx("div",{className:"w-px h-4 bg-edge"}),e.jsxs("span",{className:"text-muted",children:["Showing ",c," of ",i]}),e.jsx("button",{onClick:u,className:"text-muted hover:text-foreground underline",children:"Clear"})]})}),Se=s.memo(function({tree:h,expandedIds:f,selectedNodeId:y,onToggleExpand:b,onSelectNode:m}){const[o,u]=s.useState(!1),c=s.useCallback(()=>u(i=>!i),[]);return o?e.jsx("div",{className:"w-8 border-r border-edge bg-surface-alt flex flex-col items-center pt-2",children:e.jsx("button",{onClick:c,className:"text-xs text-muted hover:text-foreground p-1",title:"Show tree panel",children:"▸"})}):e.jsxs("div",{className:"w-64 border-r border-edge bg-surface-alt flex flex-col min-h-0",children:[e.jsxs("div",{className:"flex items-center justify-between px-3 py-2 border-b border-edge",children:[e.jsx("span",{className:"text-xs font-medium text-muted",children:"Hierarchy"}),e.jsx("button",{onClick:c,className:"text-xs text-muted hover:text-foreground",title:"Collapse panel",children:"◂"})]}),e.jsx("div",{className:"overflow-y-auto flex-1 py-1",children:h.length===0?e.jsx("div",{className:"px-3 py-4 text-xs text-muted text-center",children:"No nodes"}):h.map(i=>e.jsx($,{item:i,depth:0,expandedIds:f,selectedNodeId:y,onToggleExpand:b,onSelectNode:m},i.node.id))})]})});function $({item:l,depth:h,expandedIds:f,selectedNodeId:y,onToggleExpand:b,onSelectNode:m}){const{node:o,children:u}=l,c=f.has(o.id),i=y===o.id,v=u.length>0,p=L[o.status]||"#9e9e9e",r=_[o.type]||"#6c757d",j=s.useCallback(n=>{n.stopPropagation(),b(o.id)},[o.id,b]),C=s.useCallback(()=>{m(o.id)},[o.id,m]);return e.jsxs(e.Fragment,{children:[e.jsxs("button",{onClick:C,className:`w-full text-left flex items-center gap-1 px-2 py-1 text-xs hover:bg-surface-elevated transition-colors ${i?"bg-surface-elevated font-semibold":""}`,style:{paddingLeft:`${h*16+8}px`},children:[v?e.jsx("span",{onClick:j,className:"w-4 text-center text-muted hover:text-foreground cursor-pointer shrink-0",children:c?"▾":"▸"}):e.jsx("span",{className:"w-4 shrink-0"}),e.jsx("span",{className:"w-2 h-2 rounded-full shrink-0",style:{background:p},title:o.status.replace("_"," ")}),e.jsx("span",{className:"text-[9px] px-1 rounded shrink-0",style:{background:`${r}20`,color:r},children:o.type.slice(0,3)}),e.jsx("span",{className:"truncate",children:o.title}),v&&e.jsx("span",{className:"text-[9px] text-muted ml-auto shrink-0",children:u.length})]}),c&&u.map(n=>e.jsx($,{item:n,depth:h+1,expandedIds:f,selectedNodeId:y,onToggleExpand:b,onSelectNode:m},n.node.id))]})}const I=50,we=s.memo(function({nodes:h,allNodes:f=[],onNodeClick:y}){const b=s.useMemo(()=>{const t=new Map;for(const g of f)t.set(g.id,g.title);return t},[f]),[m,o]=s.useState("priority"),[u,c]=s.useState("asc"),[i,v]=s.useState(""),[p,r]=s.useState(0),j=s.useMemo(()=>{if(!i)return h;const t=i.toLowerCase();return h.filter(g=>g.title.toLowerCase().includes(t)||g.type.toLowerCase().includes(t)||g.status.toLowerCase().includes(t)||(g.sprint||"").toLowerCase().includes(t))},[h,i]),C=s.useMemo(()=>[...j].sort((t,g)=>{const w=t[m]??"",E=g[m]??"",N=typeof w=="number"?w-E:String(w).localeCompare(String(E));return u==="asc"?N:-N}),[j,m,u]),n=Math.max(1,Math.ceil(C.length/I)),S=s.useMemo(()=>C.slice(p*I,(p+1)*I),[C,p]),k=t=>{m===t?c(g=>g==="asc"?"desc":"asc"):(o(t),c("asc"))},T=[{key:"title",label:"Title"},{key:"type",label:"Type"},{key:"status",label:"Status"},{key:"priority",label:"Priority"},{key:"xpSize",label:"Size"},{key:"sprint",label:"Sprint"},{key:"parentId",label:"Parent"}];return e.jsxs("div",{className:"border-t border-edge",children:[e.jsx("div",{className:"px-4 py-2 bg-surface-alt",children:e.jsx("input",{type:"text",placeholder:"Search nodes...",value:i,onChange:t=>v(t.target.value),className:"w-full max-w-xs px-2 py-1 text-sm border border-edge rounded bg-surface"})}),e.jsx("div",{className:"overflow-x-auto max-h-64",children:e.jsxs("table",{className:"w-full text-sm",children:[e.jsx("thead",{children:e.jsx("tr",{className:"bg-surface-elevated",children:T.map(t=>e.jsxs("th",{onClick:()=>k(t.key),className:"px-3 py-1.5 text-left text-xs font-medium text-muted cursor-pointer hover:text-foreground",children:[t.label,m===t.key&&(u==="asc"?" ↑":" ↓")]},t.key))})}),e.jsx("tbody",{children:S.length===0?e.jsx("tr",{children:e.jsx("td",{colSpan:7,className:"px-3 py-4 text-center text-muted",children:"No nodes found"})}):S.map(t=>e.jsxs("tr",{onClick:()=>y(t),className:"border-t border-edge hover:bg-surface-alt cursor-pointer",children:[e.jsx("td",{className:"px-3 py-1.5 max-w-[200px] truncate",children:t.title}),e.jsx("td",{className:"px-3 py-1.5",children:e.jsx("span",{className:"text-[10px] px-1.5 py-0.5 rounded font-medium",style:{background:`${_[t.type]}20`,color:_[t.type]},children:t.type})}),e.jsx("td",{className:"px-3 py-1.5",children:e.jsx("span",{className:"text-[10px] px-1.5 py-0.5 rounded-full font-medium",style:{background:`${L[t.status]}20`,color:L[t.status]},children:t.status.replace("_"," ")})}),e.jsx("td",{className:"px-3 py-1.5 text-center",children:t.priority}),e.jsx("td",{className:"px-3 py-1.5 text-center",children:t.xpSize||"-"}),e.jsx("td",{className:"px-3 py-1.5",children:t.sprint||"-"}),e.jsx("td",{className:"px-3 py-1.5 max-w-[150px] truncate text-muted",children:t.parentId?b.get(t.parentId)??"-":"-"})]},t.id))})]})}),n>1&&e.jsxs("div",{className:"flex items-center justify-between px-4 py-1.5 bg-surface-alt border-t border-edge text-xs text-muted",children:[e.jsxs("span",{children:[C.length," nodes"]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("button",{disabled:p===0,onClick:()=>r(t=>Math.max(0,t-1)),className:"px-2 py-0.5 rounded border border-edge disabled:opacity-30",children:"Prev"}),e.jsxs("span",{children:[p+1,"/",n]}),e.jsx("button",{disabled:p>=n-1,onClick:()=>r(t=>Math.min(n-1,t+1)),className:"px-2 py-0.5 rounded border border-edge disabled:opacity-30",children:"Next"})]})]})]})}),Te=["depends_on","blocks","parent_of","child_of","related_to","priority_over","implements","derived_from"];function Ee({fromId:l,toId:h,fromTitle:f,toTitle:y,onCreated:b,onCancel:m}){const[o,u]=s.useState("depends_on"),[c,i]=s.useState(""),[v,p]=s.useState(!1),[r,j]=s.useState(null),C=s.useCallback(async()=>{p(!0),j(null);try{await re.createEdge({from:l,to:h,relationType:o,reason:c.trim()||void 0}),b()}catch(n){j(n instanceof Error?n.message:"Failed to create edge")}finally{p(!1)}},[l,h,o,c,b]);return e.jsx("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/50",children:e.jsxs("div",{className:"bg-surface border border-edge rounded-lg shadow-xl w-96 p-4",children:[e.jsx("h3",{className:"text-sm font-bold mb-3",children:"Create Relationship"}),e.jsxs("div",{className:"space-y-3 text-sm",children:[e.jsxs("div",{children:[e.jsx("label",{className:"text-xs text-muted block mb-1",children:"From"}),e.jsx("div",{className:"text-xs bg-surface-elevated px-2 py-1.5 rounded truncate",children:f??l})]}),e.jsxs("div",{children:[e.jsx("label",{className:"text-xs text-muted block mb-1",children:"To"}),e.jsx("div",{className:"text-xs bg-surface-elevated px-2 py-1.5 rounded truncate",children:y??h})]}),e.jsxs("div",{children:[e.jsx("label",{className:"text-xs text-muted block mb-1",children:"Relation Type"}),e.jsx("select",{value:o,onChange:n=>u(n.target.value),className:"w-full text-xs px-2 py-1.5 rounded bg-surface-elevated border border-edge focus:outline-none focus:border-accent",children:Te.map(n=>{const S=Ce[n];return e.jsx("option",{value:n,children:S.label},n)})})]}),e.jsxs("div",{children:[e.jsx("label",{className:"text-xs text-muted block mb-1",children:"Reason (optional)"}),e.jsx("input",{type:"text",value:c,onChange:n=>i(n.target.value),placeholder:"Why this relationship exists...",className:"w-full text-xs px-2 py-1.5 rounded bg-surface-elevated border border-edge focus:outline-none focus:border-accent"})]}),r&&e.jsx("div",{className:"text-xs text-danger bg-surface-elevated px-2 py-1.5 rounded",children:r})]}),e.jsxs("div",{className:"flex justify-end gap-2 mt-4",children:[e.jsx("button",{onClick:m,className:"text-xs px-3 py-1.5 rounded bg-surface-elevated hover:bg-edge transition-colors",children:"Cancel"}),e.jsx("button",{onClick:C,disabled:v,className:"text-xs px-3 py-1.5 rounded bg-accent text-white font-medium disabled:opacity-50 hover:opacity-90 transition-opacity",children:v?"Creating...":"Create"})]})]})})}const Le={workflowNode:je},_e={workflowEdge:ge},Pe={hideAttribution:!0};function De({graph:l}){var R,F;const[h,f,y]=oe([]),[b,m,o]=de([]),[u,c]=s.useState(null),[i,v]=s.useState("TB"),[p,r]=s.useState(new Set),[j,C]=s.useState(new Set),[n,S]=s.useState(new Set),[k,T]=s.useState(null),t=s.useDeferredValue(p),g=s.useDeferredValue(j),w=s.useDeferredValue(i),E=s.useRef(null),N=s.useMemo(()=>ue(l.nodes,l.edges),[l.nodes,l.edges]),G=s.useMemo(()=>pe(l.nodes,N),[l.nodes,N]),P=s.useCallback(a=>{S(x=>{const d=new Set(x);return d.has(a)?d.delete(a):d.add(a),d})},[]),V=s.useCallback(()=>{const a=new Set;for(const[x]of N)a.add(x);S(a)},[N]),B=s.useCallback(()=>{S(new Set)},[]),M=s.useCallback((a,x,d)=>{const te=W(l.nodes,n,N),z=me(te,{statuses:a,types:x},N,n,P),D=z.map(ne=>ne.id);if(he(E.current,D)&&d===w)return;E.current=D;const ae=new Set(D),le=fe(l.edges,ae),O=be(z,le,d);f(O.nodes),m(O.edges)},[l,f,m,w,n,N,P]);s.useEffect(()=>{M(t,g,w)},[l,M,t,g,w]);const H=s.useCallback((a,x)=>{c(x.data.sourceNode)},[]),Y=s.useCallback(a=>{c(a)},[]),Z=s.useCallback(a=>{const x=l.nodes.find(d=>d.id===a);x&&c(x)},[l.nodes]),K=s.useCallback(a=>{const x=l.nodes.find(d=>d.id===a);x&&c(x)},[l.nodes]),U=s.useCallback(a=>{a.source&&a.target&&a.source!==a.target&&T({fromId:a.source,toId:a.target})},[]),q=s.useCallback(()=>{T(null)},[]),J=s.useCallback(a=>{r(x=>{const d=new Set(x);return d.has(a)?d.delete(a):d.add(a),d})},[]),Q=s.useCallback(a=>{C(x=>{const d=new Set(x);return d.has(a)?d.delete(a):d.add(a),d})},[]),X=s.useCallback(()=>{r(new Set),C(new Set)},[]),A=s.useMemo(()=>W(l.nodes,n,N).filter(x=>!(p.size&&!p.has(x.status)||j.size&&!j.has(x.type))),[l.nodes,n,N,p,j]),ee=k?(R=l.nodes.find(a=>a.id===k.fromId))==null?void 0:R.title:void 0,se=k?(F=l.nodes.find(a=>a.id===k.toId))==null?void 0:F.title:void 0;return e.jsxs("div",{className:"flex flex-col h-full",children:[e.jsx(ke,{statuses:p,types:j,direction:i,onStatusToggle:J,onTypeToggle:Q,onDirectionChange:v,onClear:X,visibleNodeCount:A.length,totalNodeCount:l.nodes.length,onExpandAll:V,onCollapseAll:B}),e.jsxs("div",{className:"flex flex-1 min-h-0",children:[e.jsx(Se,{tree:G,expandedIds:n,selectedNodeId:(u==null?void 0:u.id)??null,onToggleExpand:P,onSelectNode:K}),e.jsx("div",{className:"flex-1 relative",children:l.nodes.length===0?e.jsx("div",{className:"flex items-center justify-center h-full text-muted",children:e.jsxs("div",{className:"text-center",children:[e.jsx("p",{className:"text-lg mb-2",children:"No nodes in graph"}),e.jsx("p",{className:"text-sm",children:"Import a PRD to get started"})]})}):e.jsxs(ce,{nodes:h,edges:b,onNodesChange:y,onEdgesChange:o,onNodeClick:H,onConnect:U,nodeTypes:Le,edgeTypes:_e,nodesDraggable:!1,nodesConnectable:!0,fitView:!0,minZoom:.1,maxZoom:2,proOptions:Pe,children:[e.jsx(ie,{gap:16,size:1}),e.jsx(xe,{showInteractive:!1})]})}),u&&e.jsx(Ne,{node:u,edges:l.edges,allNodes:l.nodes,childrenMap:N,onClose:()=>c(null),onNodeNavigate:Z})]}),e.jsx(we,{nodes:A,allNodes:l.nodes,onNodeClick:Y}),k&&e.jsx(Ee,{fromId:k.fromId,toId:k.toId,fromTitle:ee,toTitle:se,onCreated:q,onCancel:()=>T(null)})]})}function We({graph:l}){return e.jsx("div",{className:"h-full",children:e.jsx(De,{graph:l})})}export{We as GraphTab};