mirror of
https://github.com/johndoe6345789/metabuilder.git
synced 2026-04-26 06:44:58 +00:00
johndoe6345789
a2b7f70f06
New WorkflowUI project: Production-grade visual workflow editor built with modern tech stack for MetaBuilder's DAG executor system. ### Frontend Stack - Next.js 14 (server-side rendering, API routes) - React 18 with TypeScript strict mode - Redux + Redux Toolkit (centralized state management) - React Flow (DAG visualization and manipulation) - FakeMUI (Material UI compatible components) - SCSS (scoped component styling) - IndexedDB with Dexie (offline-first storage) ### Backend Stack - Flask (lightweight Python backend) - SQLAlchemy (ORM for persistence) - CORS support for cross-origin requests - RESTful API for workflow CRUD ### Architecture - Offline-first with IndexedDB storage - Sync queue for changes when offline - Redux store for centralized state - React Flow for visual DAG editing - Multi-tenant support throughout ### Components - Dashboard: List and manage workflows - Editor: Visual DAG editor with canvas controls - Node Library: Browse and add node types - Properties Panel: Edit node parameters - Execution History: View past executions - Node Types: Playwright testing, Storybook documentation ### Database - IndexedDB with 5 tables: workflows, executions, nodeTypes, drafts, syncQueue - Indexes for fast queries: tenantId, name, category - Sync queue for offline changes ### API Endpoints - Workflows CRUD - Node registry - Workflow execution - Execution history - Workflow validation - Health checks ### Features - Drag-and-drop node creation - Visual connection drawing - Zoom, pan, minimap controls - Undo/redo support - Auto-layout algorithms - Workflow validation (DAG constraints) - Export/import workflows - Version control integration ### Structure ``` workflowui/ ├── src/ │ ├── app/ # Next.js pages │ ├── components/ # React components │ ├── store/ # Redux slices │ ├── services/ # API services │ ├── db/ # IndexedDB operations │ ├── types/ # TypeScript definitions │ ├── utils/ # Utilities │ └── styles/ # Global styles ├── backend/ # Flask server ├── stories/ # Storybook components ├── workflows/ # Example workflows └── scripts/ # Build/setup scripts ``` ### Development - Hot reload with Next.js dev server - Redux DevTools integration - Storybook for component development - TypeScript strict mode - Jest testing framework ### Production Ready - Optimized builds - Code splitting - Performance monitoring - Error tracking - Multi-tenant isolation Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
63 lines
1.8 KiB
JSON
63 lines
1.8 KiB
JSON
{
|
|
"name": "workflowui",
|
|
"version": "1.0.0",
|
|
"description": "Visual workflow editor UI - Modern n8n-like interface for MetaBuilder workflows",
|
|
"private": true,
|
|
"scripts": {
|
|
"dev": "next dev",
|
|
"build": "next build",
|
|
"start": "next start",
|
|
"lint": "next lint",
|
|
"type-check": "tsc --noEmit",
|
|
"db:init": "node scripts/init-db.js",
|
|
"db:migrate": "node scripts/migrate-db.js",
|
|
"backend": "python backend/server.py",
|
|
"dev:all": "concurrently \"npm run dev\" \"npm run backend\"",
|
|
"test": "jest",
|
|
"test:watch": "jest --watch",
|
|
"storybook": "storybook dev -p 6006",
|
|
"storybook:build": "storybook build"
|
|
},
|
|
"dependencies": {
|
|
"react": "^18.2.0",
|
|
"react-dom": "^18.2.0",
|
|
"next": "^14.0.0",
|
|
"redux": "^4.2.1",
|
|
"react-redux": "^8.1.3",
|
|
"@reduxjs/toolkit": "^1.9.7",
|
|
"react-flow-renderer": "^11.10.1",
|
|
"@reactflow/core": "^11.10.1",
|
|
"@reactflow/background": "^11.3.1",
|
|
"@reactflow/controls": "^11.2.1",
|
|
"@reactflow/minimap": "^11.7.1",
|
|
"@reactflow/node-resizer": "^2.2.1",
|
|
"@reactflow/system": "^11.10.1",
|
|
"@fakemui/react": "^1.0.0",
|
|
"@mui/material": "^5.14.0",
|
|
"@mui/icons-material": "^5.14.0",
|
|
"dexie": "^3.2.4",
|
|
"zustand": "^4.4.0",
|
|
"axios": "^1.6.0",
|
|
"json-editor-ace": "^1.1.0",
|
|
"react-json-editor-ajrm": "^2.5.13",
|
|
"classnames": "^2.3.2",
|
|
"uuid": "^9.0.0",
|
|
"date-fns": "^2.30.0",
|
|
"lodash-es": "^4.17.21"
|
|
},
|
|
"devDependencies": {
|
|
"@types/react": "^18.2.0",
|
|
"@types/react-dom": "^18.2.0",
|
|
"@types/node": "^20.0.0",
|
|
"@types/lodash-es": "^4.17.0",
|
|
"typescript": "^5.2.0",
|
|
"sass": "^1.67.0",
|
|
"@storybook/react": "^7.5.0",
|
|
"@storybook/addon-essentials": "^7.5.0",
|
|
"jest": "^29.7.0",
|
|
"@testing-library/react": "^14.0.0",
|
|
"@testing-library/jest-dom": "^6.1.0",
|
|
"concurrently": "^8.2.0"
|
|
}
|
|
}
|