{"version":3,"file":"AsyncCallTreeViewer-CMfYLp-3.js","sources":["../../components/features/AsyncCallTreeViewer.tsx"],"sourcesContent":["\n\nimport React, { useState, useMemo } from 'react';\nimport { ChartBarIcon } from '../icons/FeatureIcons.tsx';\n\ninterface CallNode {\n    name: string;\n    duration: number;\n    children?: CallNode[];\n}\n\nconst exampleJson = `{\n    \"name\": \"startApp\",\n    \"duration\": 500,\n    \"children\": [\n        {\n            \"name\": \"fetchUserData\",\n            \"duration\": 300,\n            \"children\": [\n                { \"name\": \"authenticate\", \"duration\": 100 },\n                { \"name\": \"fetchProfile\", \"duration\": 150 }\n            ]\n        },\n        {\n            \"name\": \"loadInitialAssets\",\n            \"duration\": 450,\n            \"children\": [\n                { \"name\": \"loadImage.png\", \"duration\": 200 },\n                { \"name\": \"loadScript.js\", \"duration\": 250 }\n            ]\n        }\n    ]\n}`;\n\n\nconst TreeNode: React.FC<{ node: CallNode, level: number, maxDuration: number }> = ({ node, level, maxDuration }) => {\n    const [isOpen, setIsOpen] = React.useState(true);\n    const hasChildren = node.children && node.children.length > 0;\n\n    return (\n        <div className=\"my-1\">\n            <div\n                className=\"flex items-center p-2 rounded-md hover:bg-gray-100\"\n                style={{ paddingLeft: `${level * 20 + 8}px` }}\n            >\n                {hasChildren && (\n                    <button onClick={() => setIsOpen(!isOpen)} className={`mr-2 text-text-secondary w-4 h-4 flex-shrink-0 transform transition-transform ${isOpen ? 'rotate-90' : ''}`}>\n                       ▶\n                    </button>\n                )}\n                 {!hasChildren && <div className=\"w-6 mr-2 flex-shrink-0\" />}\n                 <div className=\"flex-grow flex items-center justify-between gap-4\">\n                    <span className=\"truncate\">{node.name}</span>\n                    <div className=\"flex items-center gap-2 flex-shrink-0\">\n                         <div className=\"w-24 h-4 bg-gray-200 rounded-full overflow-hidden\">\n                            <div className=\"h-4 bg-primary\" style={{ width: `${(node.duration / maxDuration) * 100}%` }}/>\n                         </div>\n                        <span className=\"text-primary w-16 text-right\">{node.duration.toFixed(0)}ms</span>\n                    </div>\n                </div>\n            </div>\n            {isOpen && hasChildren && (\n                <div>\n                    {node.children!.map((child, index) => (\n                        <TreeNode key={index} node={child} level={level + 1} maxDuration={maxDuration} />\n                    ))}\n                </div>\n            )}\n        </div>\n    );\n};\n\n\nexport const AsyncCallTreeViewer: React.FC = () => {\n    const [jsonInput, setJsonInput] = useState(exampleJson);\n    const [error, setError] = useState('');\n\n    const { treeData, maxDuration } = useMemo(() => {\n        try {\n            const data: CallNode = JSON.parse(jsonInput);\n             let max = 0;\n            const findMax = (node: CallNode) => {\n                if (node.duration > max) max = node.duration;\n                if (node.children) node.children.forEach(findMax);\n            };\n            findMax(data);\n            setError('');\n            return { treeData: data, maxDuration: max };\n        } catch (e) {\n            setError('Invalid JSON format.');\n            return { treeData: null, maxDuration: 0 };\n        }\n    }, [jsonInput]);\n\n    return (\n        <div className=\"h-full flex flex-col p-4 sm:p-6 lg:p-8 text-text-primary\">\n            <header className=\"mb-6\">\n                <h1 className=\"text-3xl flex items-center\">\n                    <ChartBarIcon />\n                    <span className=\"ml-3\">Async Call Tree Viewer</span>\n                </h1>\n                <p className=\"text-text-secondary mt-1\">Paste a JSON structure to visualize an asynchronous function call tree.</p>\n            </header>\n            <div className=\"flex-grow flex flex-col gap-4 min-h-0\">\n                <div className=\"flex flex-col h-2/5 min-h-[200px]\">\n                    <label htmlFor=\"json-input\" className=\"text-sm font-medium text-text-secondary mb-2\">JSON Input</label>\n                    <textarea\n                        id=\"json-input\"\n                        value={jsonInput}\n                        onChange={e => setJsonInput(e.target.value)}\n                        className={`flex-grow p-4 bg-surface border ${error ? 'border-red-500' : 'border-border'} rounded-md resize-y font-mono text-sm`}\n                        spellCheck=\"false\"\n                    />\n                    {error && <p className=\"text-red-500 text-xs mt-1\">{error}</p>}\n                </div>\n                <div className=\"flex flex-col flex-grow min-h-0\">\n                    <label className=\"text-sm font-medium text-text-secondary mb-2\">Visual Tree</label>\n                    <div className=\"flex-grow bg-surface p-4 rounded-lg text-sm overflow-y-auto border border-border\">\n                        {treeData ? <TreeNode node={treeData} level={0} maxDuration={maxDuration} /> : <div className=\"text-text-secondary\">{error || 'Enter valid JSON to see the tree.'}</div>}\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};"],"names":["exampleJson","TreeNode","node","level","maxDuration","isOpen","setIsOpen","React","hasChildren","jsxs","jsx","child","index","AsyncCallTreeViewer","jsonInput","setJsonInput","useState","error","setError","treeData","useMemo","data","max","findMax","ChartBarIcon","e"],"mappings":"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"}