configure mcp, refactors

.cursor/mcp.json

@@ -0,0 +1,11 @@
+{
+  "mcpServers": {
+    "shadcn": {
+      "command": "npx",
+      "args": [
+        "shadcn@latest",
+        "mcp"
+      ]
+    }
+  }
+}

package.json

@@ -15,11 +15,10 @@
     "clsx": "^2.1.1",
     "js-yaml": "^4.1.0",
     "lucide-react": "^0.577.0",
-    "monaco-editor": "^0.55.1",
+    "monaco-editor": "^0.53.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "reactflow": "^11.0.0",
-    "shadcn": "^3.8.5",
     "tailwind-merge": "^3.5.0",
     "tailwindcss-animate": "^1.0.7"
   },
@@ -27,11 +26,12 @@
     "@types/node": "^25.3.3",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
-    "@vitejs/plugin-react": "^3.0.0",
+    "@vitejs/plugin-react": "^5.1.4",
     "autoprefixer": "^10.4.0",
     "postcss": "^8.4.0",
+    "shadcn": "^4.0.0",
     "tailwindcss": "^3.4.0",
     "typescript": "^5.0.0",
-    "vite": "^4.0.0"
+    "vite": "^7.3.1"
   }
 }

src/App.tsx

@@ -14,8 +14,8 @@ import ReactFlow, {
   NodeChange,
   EdgeChange,
 } from 'reactflow'
-import ConfigNode from './components/ConfigNode'
-import RenderingNode from './components/RenderingNode'
+import ConfigNode from './components/graph/ConfigNode'
+import RenderingNode from './components/graph/RenderingNode'
 import FlowContext from './lib/flowContext'
 import {
   ContextMenu,

src/components/graph/ConfigNode.tsx

@@ -1,14 +1,14 @@
 import React, { memo, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react'
 import { Handle, Position } from 'reactflow'
 import Editor, { loader } from '@monaco-editor/react'
-import FlowContext from '../lib/flowContext'
+import FlowContext from '../../lib/flowContext'
 import {
     BaseNode,
     BaseNodeContent,
     BaseNodeFooter,
     BaseNodeHeader,
     BaseNodeHeaderTitle,
-} from './base-node'
+} from './BaseNode'
 import { Pencil } from 'lucide-react'
 
 // Ensure Monaco can load its web workers under Vite by pointing to a CDN

src/components/graph/RenderingNode.tsx

@@ -1,15 +1,15 @@
 import { memo, useContext, useEffect, useMemo, useState } from 'react'
 import { Handle, Position } from 'reactflow'
 import yaml from 'js-yaml'
-import FlowContext from '../lib/flowContext'
-import { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia } from './ui/empty'
+import FlowContext from '../../lib/flowContext'
+import { Empty, EmptyHeader, EmptyTitle, EmptyDescription, EmptyContent, EmptyMedia } from '../ui/empty'
 import {
     BaseNode,
     BaseNodeContent,
     BaseNodeFooter,
     BaseNodeHeader,
     BaseNodeHeaderTitle,
-} from './base-node'
+} from './BaseNode'
 import { Rocket } from 'lucide-react'
 
 type Props = {