Spaces:
Running
Running
| import{r as m,j as e,R as h}from"./react-B-lWpQRQ.js";import{aq as p}from"./index-DyMS-nC-.js";import"./@braintree-DY5JYOZd.js";import"./react-dom-CU2yWD-Y.js";import"./scheduler-DYLXRpC5.js";import"./@google-xfXoiafW.js";import"./idb-Dob3nYDb.js";import"./axe-core-CA05Kxsw.js";import"./marked-CesSW9Du.js";import"./@mermaid-js-Ce0__7Tp.js";import"./langium-B_PGe6V2.js";import"./vscode-jsonrpc-2tvYB2ki.js";import"./chevrotain-D5DQZOif.js";import"./@chevrotain-DMYZVohV.js";import"./lodash-es-CKTcnrxn.js";import"./chevrotain-allstar-eFSt8-qu.js";import"./vscode-languageserver-types-NoPvPymt.js";import"./vscode-languageserver-textdocument-CKBVUiR3.js";import"./vscode-uri-CoxP0whD.js";const u=`{ | |
| "name": "startApp", | |
| "duration": 500, | |
| "children": [ | |
| { | |
| "name": "fetchUserData", | |
| "duration": 300, | |
| "children": [ | |
| { "name": "authenticate", "duration": 100 }, | |
| { "name": "fetchProfile", "duration": 150 } | |
| ] | |
| }, | |
| { | |
| "name": "loadInitialAssets", | |
| "duration": 450, | |
| "children": [ | |
| { "name": "loadImage.png", "duration": 200 }, | |
| { "name": "loadScript.js", "duration": 250 } | |
| ] | |
| } | |
| ] | |
| }`,x=({node:t,level:i,maxDuration:r})=>{const[a,o]=h.useState(!0),n=t.children&&t.children.length>0;return e.jsxs("div",{className:"my-1",children:[e.jsxs("div",{className:"flex items-center p-2 rounded-md hover:bg-gray-100",style:{paddingLeft:`${i*20+8}px`},children:[n&&e.jsx("button",{onClick:()=>o(!a),className:`mr-2 text-text-secondary w-4 h-4 flex-shrink-0 transform transition-transform ${a?"rotate-90":""}`,children:"▶"}),!n&&e.jsx("div",{className:"w-6 mr-2 flex-shrink-0"}),e.jsxs("div",{className:"flex-grow flex items-center justify-between gap-4",children:[e.jsx("span",{className:"truncate",children:t.name}),e.jsxs("div",{className:"flex items-center gap-2 flex-shrink-0",children:[e.jsx("div",{className:"w-24 h-4 bg-gray-200 rounded-full overflow-hidden",children:e.jsx("div",{className:"h-4 bg-primary",style:{width:`${t.duration/r*100}%`}})}),e.jsxs("span",{className:"text-primary w-16 text-right",children:[t.duration.toFixed(0),"ms"]})]})]})]}),a&&n&&e.jsx("div",{children:t.children.map((s,l)=>e.jsx(x,{node:s,level:i+1,maxDuration:r},l))})]})},R=()=>{const[t,i]=m.useState(u),[r,a]=m.useState(""),{treeData:o,maxDuration:n}=m.useMemo(()=>{try{const s=JSON.parse(t);let l=0;const d=c=>{c.duration>l&&(l=c.duration),c.children&&c.children.forEach(d)};return d(s),a(""),{treeData:s,maxDuration:l}}catch{return a("Invalid JSON format."),{treeData:null,maxDuration:0}}},[t]);return e.jsxs("div",{className:"h-full flex flex-col p-4 sm:p-6 lg:p-8 text-text-primary",children:[e.jsxs("header",{className:"mb-6",children:[e.jsxs("h1",{className:"text-3xl flex items-center",children:[e.jsx(p,{}),e.jsx("span",{className:"ml-3",children:"Async Call Tree Viewer"})]}),e.jsx("p",{className:"text-text-secondary mt-1",children:"Paste a JSON structure to visualize an asynchronous function call tree."})]}),e.jsxs("div",{className:"flex-grow flex flex-col gap-4 min-h-0",children:[e.jsxs("div",{className:"flex flex-col h-2/5 min-h-[200px]",children:[e.jsx("label",{htmlFor:"json-input",className:"text-sm font-medium text-text-secondary mb-2",children:"JSON Input"}),e.jsx("textarea",{id:"json-input",value:t,onChange:s=>i(s.target.value),className:`flex-grow p-4 bg-surface border ${r?"border-red-500":"border-border"} rounded-md resize-y font-mono text-sm`,spellCheck:"false"}),r&&e.jsx("p",{className:"text-red-500 text-xs mt-1",children:r})]}),e.jsxs("div",{className:"flex flex-col flex-grow min-h-0",children:[e.jsx("label",{className:"text-sm font-medium text-text-secondary mb-2",children:"Visual Tree"}),e.jsx("div",{className:"flex-grow bg-surface p-4 rounded-lg text-sm overflow-y-auto border border-border",children:o?e.jsx(x,{node:o,level:0,maxDuration:n}):e.jsx("div",{className:"text-text-secondary",children:r||"Enter valid JSON to see the tree."})})]})]})]})};export{R as AsyncCallTreeViewer}; | |
| //# sourceMappingURL=AsyncCallTreeViewer-1EkgwVJg.js.map | |