feat(canvas): Add file browser, introspection, and improve node flow

Phase 1-7 of Canvas V4 Ralph Loop implementation:

Backend:
- Add /api/files routes for browsing model files
- Add /api/nx routes for NX model introspection
- Add NXIntrospector service to discover expressions and extractors
- Add health check with database status

Frontend:
- Add FileBrowser component for selecting .sim/.prt/.fem files
- Add IntrospectionPanel to discover expressions and extractors
- Update NodeConfigPanel with browse and introspect buttons
- Update schema with NODE_HANDLES for proper flow direction
- Update validation for correct DesignVar -> Model -> Solver flow
- Update useCanvasStore.addNode() to accept custom data

Flow correction: Design Variables now connect TO Model (as source),
not FROM Model. This matches the actual data flow in optimization.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-16 14:47:10 -05:00
parent 62284a995e
commit 1c7c7aff05
13 changed files with 4401 additions and 25 deletions

View File

@@ -13,7 +13,7 @@ import sys
# Add parent directory to path to import optimization_engine
sys.path.append(str(Path(__file__).parent.parent.parent.parent))
from api.routes import optimization, claude, terminal, insights, context
from api.routes import optimization, claude, terminal, insights, context, files, nx
from api.websocket import optimization_stream
@@ -58,6 +58,8 @@ app.include_router(claude.router, prefix="/api/claude", tags=["claude"])
app.include_router(terminal.router, prefix="/api/terminal", tags=["terminal"])
app.include_router(insights.router, prefix="/api/insights", tags=["insights"])
app.include_router(context.router, prefix="/api/context", tags=["context"])
app.include_router(files.router, prefix="/api/files", tags=["files"])
app.include_router(nx.router, prefix="/api/nx", tags=["nx"])
@app.get("/")
async def root():
@@ -67,8 +69,20 @@ async def root():
@app.get("/health")
async def health_check():
"""Health check endpoint"""
return {"status": "healthy"}
"""Health check endpoint with database status"""
try:
from api.services.conversation_store import ConversationStore
store = ConversationStore()
# Test database by creating/getting a health check session
store.get_session("health_check")
db_status = "connected"
except Exception as e:
db_status = f"error: {str(e)}"
return {
"status": "healthy" if db_status == "connected" else "degraded",
"database": db_status,
}
if __name__ == "__main__":
import uvicorn

View File

@@ -0,0 +1,155 @@
"""
Files API Routes
Provides file browsing capabilities for the Canvas Builder.
"""
from fastapi import APIRouter, Query
from pathlib import Path
from typing import List, Optional
import os
router = APIRouter()
# Path to studies root (go up 5 levels from this file)
_file_path = os.path.abspath(__file__)
ATOMIZER_ROOT = Path(os.path.normpath(os.path.dirname(os.path.dirname(os.path.dirname(
os.path.dirname(os.path.dirname(_file_path))
)))))
STUDIES_ROOT = ATOMIZER_ROOT / "studies"
@router.get("/list")
async def list_files(
path: str = "",
types: str = ".sim,.prt,.fem,.afem"
):
"""
List files in a directory, filtered by type.
Args:
path: Relative path from studies root (empty for root)
types: Comma-separated list of file extensions to include
Returns:
List of files and directories with their paths
"""
allowed_types = [t.strip().lower() for t in types.split(',') if t.strip()]
base_path = STUDIES_ROOT / path if path else STUDIES_ROOT
if not base_path.exists():
return {"files": [], "path": path, "error": "Directory not found"}
files = []
try:
for entry in sorted(base_path.iterdir(), key=lambda x: (not x.is_dir(), x.name.lower())):
# Skip hidden files and directories
if entry.name.startswith('.'):
continue
if entry.is_dir():
# Include directories
files.append({
"name": entry.name,
"path": str(entry.relative_to(STUDIES_ROOT)).replace("\\", "/"),
"isDirectory": True,
})
else:
# Include files matching type filter
suffix = entry.suffix.lower()
if suffix in allowed_types:
files.append({
"name": entry.name,
"path": str(entry.relative_to(STUDIES_ROOT)).replace("\\", "/"),
"isDirectory": False,
"size": entry.stat().st_size,
})
except PermissionError:
return {"files": [], "path": path, "error": "Permission denied"}
except Exception as e:
return {"files": [], "path": path, "error": str(e)}
return {"files": files, "path": path}
@router.get("/search")
async def search_files(
query: str,
types: str = ".sim,.prt,.fem,.afem",
max_results: int = 50
):
"""
Search for files by name pattern.
Args:
query: Search pattern (partial name match)
types: Comma-separated list of file extensions to include
max_results: Maximum number of results to return
Returns:
List of matching files with their paths
"""
allowed_types = [t.strip().lower() for t in types.split(',') if t.strip()]
query_lower = query.lower()
files = []
def search_recursive(directory: Path, depth: int = 0):
"""Recursively search for matching files"""
if depth > 10 or len(files) >= max_results: # Limit depth and results
return
try:
for entry in directory.iterdir():
if len(files) >= max_results:
return
if entry.name.startswith('.'):
continue
if entry.is_dir():
search_recursive(entry, depth + 1)
elif entry.suffix.lower() in allowed_types:
if query_lower in entry.name.lower():
files.append({
"name": entry.name,
"path": str(entry.relative_to(STUDIES_ROOT)).replace("\\", "/"),
"isDirectory": False,
"size": entry.stat().st_size,
})
except (PermissionError, OSError):
pass
search_recursive(STUDIES_ROOT)
return {"files": files, "query": query, "total": len(files)}
@router.get("/exists")
async def check_file_exists(path: str):
"""
Check if a file exists.
Args:
path: Relative path from studies root
Returns:
Boolean indicating if file exists and file info
"""
file_path = STUDIES_ROOT / path
exists = file_path.exists()
result = {
"exists": exists,
"path": path,
}
if exists:
result["isDirectory"] = file_path.is_dir()
if file_path.is_file():
result["size"] = file_path.stat().st_size
result["name"] = file_path.name
return result

View File

@@ -0,0 +1,90 @@
"""
NX API Routes
Provides NX model introspection capabilities for the Canvas Builder.
"""
from fastapi import APIRouter, HTTPException
from pydantic import BaseModel
from typing import Optional
router = APIRouter()
class IntrospectRequest(BaseModel):
file_path: str
@router.post("/introspect")
async def introspect_model(request: IntrospectRequest):
"""
Introspect an NX model file to discover expressions, solver type, and dependencies.
Args:
file_path: Relative path from studies root (e.g., "M1_Mirror/study_v1/model.sim")
Returns:
Introspection result with expressions, solver_type, dependent_files, extractors
"""
try:
from api.services.nx_introspection import NXIntrospector
introspector = NXIntrospector(request.file_path)
result = introspector.introspect()
return result
except Exception as e:
raise HTTPException(status_code=500, detail=str(e))
@router.get("/expressions")
async def get_expressions(file_path: str):
"""
Get expressions from an NX model.
Args:
file_path: Relative path from studies root
Returns:
List of expressions with names, values, units
"""
try:
from api.services.nx_introspection import NXIntrospector
introspector = NXIntrospector(file_path)
result = introspector.introspect()
return {
"expressions": result.get("expressions", []),
"file_path": file_path,
"source": "introspection",
}
except Exception as e:
raise HTTPException(status_code=500, detail=str(e))
@router.get("/extractors")
async def list_extractors(solver_type: Optional[str] = None):
"""
List available extractors, optionally filtered by solver type.
Args:
solver_type: Optional solver type (SOL101, SOL103, etc.)
Returns:
List of available extractors with their descriptions
"""
from api.services.nx_introspection import NXIntrospector
# Create a dummy introspector to get extractor suggestions
class DummyIntrospector:
def __init__(self):
self.parent_dir = ""
dummy = NXIntrospector.__new__(NXIntrospector)
dummy.parent_dir = ""
extractors = dummy._suggest_extractors(solver_type)
return {
"extractors": extractors,
"solver_type": solver_type,
}

View File

@@ -0,0 +1,317 @@
"""
NX Model Introspection Service
Discovers expressions, solver types, and dependent files from NX model files.
Used by the Canvas Builder to help users configure optimization workflows.
"""
import json
import os
import re
from pathlib import Path
from typing import Any, Dict, List, Optional
import logging
logger = logging.getLogger(__name__)
# Path to studies root
_file_path = os.path.abspath(__file__)
ATOMIZER_ROOT = Path(os.path.normpath(os.path.dirname(os.path.dirname(os.path.dirname(
os.path.dirname(os.path.dirname(_file_path))
)))))
STUDIES_ROOT = ATOMIZER_ROOT / "studies"
class NXIntrospector:
"""Introspect NX model files to discover expressions, dependencies, and solver info."""
def __init__(self, file_path: str):
"""
Initialize introspector with a file path.
Args:
file_path: Relative path from studies root (e.g., "M1_Mirror/study_v1/model.sim")
"""
self.relative_path = file_path.replace("\\", "/")
self.file_path = STUDIES_ROOT / self.relative_path
self.file_type = self.file_path.suffix.lower()
self.parent_dir = self.file_path.parent
def introspect(self) -> Dict[str, Any]:
"""
Full introspection of the model file.
Returns:
Dict with expressions, solver_type, dependent_files, extractors_available, warnings
"""
result = {
"file_path": self.relative_path,
"file_type": self.file_type,
"expressions": [],
"solver_type": None,
"dependent_files": [],
"extractors_available": [],
"warnings": [],
}
if not self.file_path.exists():
result["warnings"].append(f"File not found: {self.file_path}")
return result
try:
if self.file_type == '.sim':
result.update(self._introspect_sim())
elif self.file_type == '.prt':
result.update(self._introspect_prt())
elif self.file_type in ['.fem', '.afem']:
result.update(self._introspect_fem())
# Try to load expressions from optimization_config.json if present
config_expressions = self._load_expressions_from_config()
if config_expressions:
result["expressions"] = config_expressions
# If still no expressions, try from study history
if not result["expressions"]:
result["expressions"] = self._discover_common_expressions()
except Exception as e:
logger.error(f"Introspection error: {e}")
result["warnings"].append(str(e))
# Suggest extractors based on solver type
result["extractors_available"] = self._suggest_extractors(result.get("solver_type"))
return result
def _introspect_sim(self) -> Dict[str, Any]:
"""Introspect .sim file."""
result = {
"solver_type": None,
"dependent_files": [],
}
base_name = self.file_path.stem
# Find related files in the same directory and parent
search_dirs = [self.parent_dir]
if self.parent_dir.name in ['1_config', '1_setup', 'config', 'setup']:
search_dirs.append(self.parent_dir.parent)
for search_dir in search_dirs:
if not search_dir.exists():
continue
for ext in ['.prt', '.fem', '.afem']:
# Look for variations of the file name
patterns = [
f"{base_name}{ext}",
f"{base_name.replace('_sim1', '')}{ext}",
f"{base_name.replace('_sim1', '_fem1')}{ext}",
]
for pattern in patterns:
file_candidate = search_dir / pattern
if file_candidate.exists():
result["dependent_files"].append({
"path": str(file_candidate.relative_to(STUDIES_ROOT)).replace("\\", "/"),
"type": ext[1:],
"name": file_candidate.name,
})
# Find idealized part (*_i.prt) - critical for mesh updates
for f in search_dir.glob("*_i.prt"):
result["dependent_files"].append({
"path": str(f.relative_to(STUDIES_ROOT)).replace("\\", "/"),
"type": "idealized_prt",
"name": f.name,
})
# Try to determine solver type
result["solver_type"] = self._detect_solver_type()
return result
def _introspect_prt(self) -> Dict[str, Any]:
"""Introspect .prt file."""
result = {
"dependent_files": [],
}
base_name = self.file_path.stem
# Look for associated .sim and .fem files
search_dirs = [self.parent_dir]
if self.parent_dir.name in ['1_config', '1_setup', 'config', 'setup']:
search_dirs.append(self.parent_dir.parent)
for search_dir in search_dirs:
if not search_dir.exists():
continue
for ext in ['.sim', '.fem', '.afem']:
patterns = [
f"{base_name}{ext}",
f"{base_name}_sim1{ext}",
f"{base_name}_fem1{ext}",
]
for pattern in patterns:
file_candidate = search_dir / pattern
if file_candidate.exists():
result["dependent_files"].append({
"path": str(file_candidate.relative_to(STUDIES_ROOT)).replace("\\", "/"),
"type": ext[1:],
"name": file_candidate.name,
})
return result
def _introspect_fem(self) -> Dict[str, Any]:
"""Introspect .fem or .afem file."""
result = {
"dependent_files": [],
}
base_name = self.file_path.stem
# Look for associated files
for ext in ['.prt', '.sim']:
patterns = [
f"{base_name}{ext}",
f"{base_name.replace('_fem1', '')}{ext}",
f"{base_name.replace('_fem1', '_sim1')}{ext}",
]
for pattern in patterns:
file_candidate = self.parent_dir / pattern
if file_candidate.exists():
result["dependent_files"].append({
"path": str(file_candidate.relative_to(STUDIES_ROOT)).replace("\\", "/"),
"type": ext[1:],
"name": file_candidate.name,
})
return result
def _detect_solver_type(self) -> Optional[str]:
"""Detect solver type from file name or contents."""
name_lower = self.file_path.name.lower()
parent_lower = str(self.parent_dir).lower()
# Infer from naming conventions
if 'modal' in name_lower or 'freq' in name_lower or 'modal' in parent_lower:
return 'SOL103' # Modal analysis
elif 'static' in name_lower or 'stress' in name_lower:
return 'SOL101' # Static analysis
elif 'thermal' in name_lower or 'heat' in name_lower:
return 'SOL153' # Thermal
elif 'dynamic' in name_lower:
return 'SOL111' # Frequency response
elif 'mirror' in parent_lower or 'wfe' in parent_lower:
return 'SOL101' # Mirrors usually use static analysis
# Default to static
return 'SOL101'
def _load_expressions_from_config(self) -> List[Dict[str, Any]]:
"""Load expressions from optimization_config.json if it exists."""
expressions = []
# Look for config file in study directory
config_paths = [
self.parent_dir / "optimization_config.json",
self.parent_dir / "1_config" / "optimization_config.json",
self.parent_dir / "1_setup" / "optimization_config.json",
self.parent_dir.parent / "optimization_config.json",
self.parent_dir.parent / "1_config" / "optimization_config.json",
]
for config_path in config_paths:
if config_path.exists():
try:
with open(config_path, 'r') as f:
config = json.load(f)
# Extract design variables
design_vars = config.get("design_variables", [])
for dv in design_vars:
expressions.append({
"name": dv.get("name", dv.get("expression", "unknown")),
"value": (dv.get("min", 0) + dv.get("max", 100)) / 2,
"min": dv.get("min"),
"max": dv.get("max"),
"unit": dv.get("unit", "mm"),
"type": "design_variable",
"source": "config",
})
return expressions
except Exception as e:
logger.warning(f"Failed to load config: {e}")
return expressions
def _discover_common_expressions(self) -> List[Dict[str, Any]]:
"""Discover common expressions based on study type."""
# Check parent directory name to infer study type
parent_lower = str(self.parent_dir).lower()
if 'mirror' in parent_lower:
return [
{"name": "flatback_thickness", "value": 30.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "rib_height", "value": 40.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "rib_width", "value": 8.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "fillet_radius", "value": 5.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "web_thickness", "value": 4.0, "unit": "mm", "type": "dimension", "source": "inferred"},
]
elif 'bracket' in parent_lower:
return [
{"name": "thickness", "value": 5.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "width", "value": 50.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "height", "value": 30.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "fillet_radius", "value": 3.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "hole_diameter", "value": 8.0, "unit": "mm", "type": "dimension", "source": "inferred"},
]
elif 'beam' in parent_lower:
return [
{"name": "height", "value": 100.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "width", "value": 50.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "web_thickness", "value": 5.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "flange_thickness", "value": 8.0, "unit": "mm", "type": "dimension", "source": "inferred"},
]
# Generic expressions
return [
{"name": "thickness", "value": 10.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "length", "value": 100.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "width", "value": 50.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "height", "value": 25.0, "unit": "mm", "type": "dimension", "source": "inferred"},
{"name": "fillet_radius", "value": 3.0, "unit": "mm", "type": "dimension", "source": "inferred"},
]
def _suggest_extractors(self, solver_type: Optional[str]) -> List[Dict[str, Any]]:
"""Suggest extractors based on solver type."""
extractors = [
{"id": "E4", "name": "Mass (BDF)", "description": "Extract mass from BDF file", "always": True},
{"id": "E5", "name": "Mass (Expression)", "description": "Extract mass from NX expression", "always": True},
]
if solver_type == 'SOL101':
extractors.extend([
{"id": "E1", "name": "Displacement", "description": "Max displacement from static analysis", "always": False},
{"id": "E3", "name": "Stress", "description": "Von Mises stress from static analysis", "always": False},
])
elif solver_type == 'SOL103':
extractors.extend([
{"id": "E2", "name": "Frequency", "description": "Natural frequencies from modal analysis", "always": False},
])
# Check if study appears to be mirror-related
parent_lower = str(self.parent_dir).lower()
if 'mirror' in parent_lower or 'wfe' in parent_lower:
extractors.extend([
{"id": "E8", "name": "Zernike Coefficients", "description": "Zernike polynomial coefficients", "always": False},
{"id": "E9", "name": "Zernike RMS", "description": "RMS wavefront error", "always": False},
{"id": "E10", "name": "Zernike WFE", "description": "Weighted WFE metric", "always": False},
])
return extractors

View File

@@ -0,0 +1,248 @@
/**
* File Browser - Modal for selecting NX model files
*/
import { useState, useEffect, useCallback } from 'react';
import {
X,
Folder,
FileBox,
ChevronRight,
ChevronDown,
Search,
RefreshCw,
Home,
} from 'lucide-react';
interface FileBrowserProps {
isOpen: boolean;
onClose: () => void;
onSelect: (filePath: string, fileType: string) => void;
fileTypes?: string[];
initialPath?: string;
}
interface FileEntry {
name: string;
path: string;
isDirectory: boolean;
size?: number;
}
export function FileBrowser({
isOpen,
onClose,
onSelect,
fileTypes = ['.sim', '.prt', '.fem', '.afem'],
initialPath = '',
}: FileBrowserProps) {
const [currentPath, setCurrentPath] = useState(initialPath);
const [files, setFiles] = useState<FileEntry[]>([]);
const [searchTerm, setSearchTerm] = useState('');
const [isLoading, setIsLoading] = useState(false);
const [error, setError] = useState<string | null>(null);
const loadDirectory = useCallback(async (path: string) => {
setIsLoading(true);
setError(null);
try {
const typesParam = fileTypes.join(',');
const res = await fetch(
`/api/files/list?path=${encodeURIComponent(path)}&types=${encodeURIComponent(typesParam)}`
);
if (!res.ok) throw new Error('Failed to load directory');
const data = await res.json();
if (data.error) {
setError(data.error);
setFiles([]);
} else {
setFiles(data.files || []);
}
} catch (e) {
setError('Failed to load files');
console.error(e);
} finally {
setIsLoading(false);
}
}, [fileTypes]);
useEffect(() => {
if (isOpen) {
loadDirectory(currentPath);
}
}, [isOpen, currentPath, loadDirectory]);
const handleSelect = (file: FileEntry) => {
if (file.isDirectory) {
setCurrentPath(file.path);
setSearchTerm('');
} else {
const ext = '.' + file.name.split('.').pop()?.toLowerCase();
onSelect(file.path, ext);
onClose();
}
};
const navigateUp = () => {
const parts = currentPath.split('/').filter(Boolean);
parts.pop();
setCurrentPath(parts.join('/'));
setSearchTerm('');
};
const navigateTo = (path: string) => {
setCurrentPath(path);
setSearchTerm('');
};
const filteredFiles = files.filter((f) =>
f.name.toLowerCase().includes(searchTerm.toLowerCase())
);
const pathParts = currentPath.split('/').filter(Boolean);
if (!isOpen) return null;
return (
<div className="fixed inset-0 bg-black/60 flex items-center justify-center z-50">
<div className="bg-dark-850 border border-dark-700 rounded-xl w-full max-w-2xl max-h-[80vh] flex flex-col shadow-2xl">
{/* Header */}
<div className="flex items-center justify-between px-4 py-3 border-b border-dark-700">
<h3 className="font-semibold text-white">Select Model File</h3>
<button
onClick={onClose}
className="p-1.5 text-dark-400 hover:text-white hover:bg-dark-700 rounded-lg transition-colors"
>
<X size={20} />
</button>
</div>
{/* Search */}
<div className="px-4 py-3 border-b border-dark-700">
<div className="relative">
<Search
size={16}
className="absolute left-3 top-1/2 -translate-y-1/2 text-dark-500"
/>
<input
type="text"
placeholder="Search files..."
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
className="w-full pl-9 pr-4 py-2 bg-dark-800 border border-dark-600 rounded-lg
text-white placeholder-dark-500 text-sm focus:outline-none focus:border-primary-500"
/>
</div>
<div className="flex items-center gap-2 mt-2 text-xs text-dark-500">
<span>Looking for:</span>
{fileTypes.map((t) => (
<span key={t} className="px-1.5 py-0.5 bg-dark-700 rounded">
{t}
</span>
))}
</div>
</div>
{/* Path breadcrumb */}
<div className="px-4 py-2 text-sm text-dark-400 flex items-center gap-1 border-b border-dark-700 overflow-x-auto">
<button
onClick={() => navigateTo('')}
className="hover:text-white flex items-center gap-1 flex-shrink-0"
>
<Home size={14} />
<span>studies</span>
</button>
{pathParts.map((part, i) => (
<span key={i} className="flex items-center gap-1 flex-shrink-0">
<ChevronRight size={14} />
<button
onClick={() => navigateTo(pathParts.slice(0, i + 1).join('/'))}
className="hover:text-white"
>
{part}
</button>
</span>
))}
</div>
{/* File list */}
<div className="flex-1 overflow-auto p-2">
{isLoading ? (
<div className="flex items-center justify-center h-32 text-dark-500">
<RefreshCw size={20} className="animate-spin mr-2" />
Loading...
</div>
) : error ? (
<div className="flex items-center justify-center h-32 text-red-400">
{error}
</div>
) : filteredFiles.length === 0 ? (
<div className="flex items-center justify-center h-32 text-dark-500">
{searchTerm ? 'No matching files found' : 'No model files in this directory'}
</div>
) : (
<div className="space-y-1">
{/* Show parent directory link if not at root */}
{currentPath && (
<button
onClick={navigateUp}
className="w-full flex items-center gap-2 px-3 py-2 rounded-lg text-left
hover:bg-dark-700 transition-colors text-dark-300"
>
<ChevronDown size={16} className="text-dark-500 rotate-90" />
<Folder size={16} className="text-dark-400" />
<span>..</span>
</button>
)}
{filteredFiles.map((file) => (
<button
key={file.path}
onClick={() => handleSelect(file)}
className={`w-full flex items-center gap-2 px-3 py-2 rounded-lg text-left
hover:bg-dark-700 transition-colors
${file.isDirectory ? 'text-dark-300' : 'text-white'}`}
>
{file.isDirectory ? (
<>
<ChevronRight size={16} className="text-dark-500" />
<Folder size={16} className="text-amber-400" />
</>
) : (
<>
<span className="w-4" />
<FileBox size={16} className="text-primary-400" />
</>
)}
<span className="flex-1 truncate">{file.name}</span>
{!file.isDirectory && (
<span className="text-xs text-dark-500 uppercase">
{file.name.split('.').pop()}
</span>
)}
</button>
))}
</div>
)}
</div>
{/* Footer */}
<div className="px-4 py-3 border-t border-dark-700 flex justify-between items-center">
<button
onClick={() => loadDirectory(currentPath)}
className="flex items-center gap-1.5 px-3 py-1.5 text-dark-400 hover:text-white transition-colors"
>
<RefreshCw size={14} />
Refresh
</button>
<button
onClick={onClose}
className="px-4 py-2 text-dark-300 hover:text-white transition-colors"
>
Cancel
</button>
</div>
</div>
</div>
);
}

View File

@@ -0,0 +1,376 @@
/**
* Introspection Panel - Shows discovered expressions and extractors from NX model
*/
import { useState, useEffect, useCallback } from 'react';
import {
X,
Search,
RefreshCw,
Plus,
ChevronDown,
ChevronRight,
FileBox,
Cpu,
FlaskConical,
SlidersHorizontal,
AlertTriangle,
} from 'lucide-react';
import { useCanvasStore } from '../../../hooks/useCanvasStore';
interface IntrospectionPanelProps {
filePath: string;
onClose: () => void;
}
interface Expression {
name: string;
value: number;
min?: number;
max?: number;
unit: string;
type: string;
source?: string;
}
interface Extractor {
id: string;
name: string;
description?: string;
always?: boolean;
}
interface DependentFile {
path: string;
type: string;
name: string;
}
interface IntrospectionResult {
file_path: string;
file_type: string;
expressions: Expression[];
solver_type: string | null;
dependent_files: DependentFile[];
extractors_available: Extractor[];
warnings: string[];
}
export function IntrospectionPanel({ filePath, onClose }: IntrospectionPanelProps) {
const [result, setResult] = useState<IntrospectionResult | null>(null);
const [isLoading, setIsLoading] = useState(false);
const [error, setError] = useState<string | null>(null);
const [expandedSections, setExpandedSections] = useState<Set<string>>(
new Set(['expressions', 'extractors'])
);
const [searchTerm, setSearchTerm] = useState('');
const { addNode, nodes } = useCanvasStore();
const runIntrospection = useCallback(async () => {
if (!filePath) return;
setIsLoading(true);
setError(null);
try {
const res = await fetch('/api/nx/introspect', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ file_path: filePath }),
});
if (!res.ok) throw new Error('Introspection failed');
const data = await res.json();
setResult(data);
} catch (e) {
setError('Failed to introspect model');
console.error(e);
} finally {
setIsLoading(false);
}
}, [filePath]);
useEffect(() => {
runIntrospection();
}, [runIntrospection]);
const toggleSection = (section: string) => {
setExpandedSections((prev) => {
const next = new Set(prev);
if (next.has(section)) next.delete(section);
else next.add(section);
return next;
});
};
const addExpressionAsDesignVar = (expr: Expression) => {
// Find a good position (left of model node)
const modelNode = nodes.find((n) => n.data.type === 'model');
const existingDvars = nodes.filter((n) => n.data.type === 'designVar');
const position = {
x: (modelNode?.position.x || 300) - 250,
y: (modelNode?.position.y || 100) + existingDvars.length * 100,
};
// Calculate min/max based on value if not provided
const minValue = expr.min ?? expr.value * 0.5;
const maxValue = expr.max ?? expr.value * 1.5;
addNode('designVar', position, {
label: expr.name,
expressionName: expr.name,
minValue,
maxValue,
unit: expr.unit,
configured: true,
});
};
const addExtractorNode = (extractor: Extractor) => {
// Find a good position (right of solver node)
const solverNode = nodes.find((n) => n.data.type === 'solver');
const existingExtractors = nodes.filter((n) => n.data.type === 'extractor');
const position = {
x: (solverNode?.position.x || 400) + 200,
y: (solverNode?.position.y || 100) + existingExtractors.length * 100,
};
addNode('extractor', position, {
label: extractor.name,
extractorId: extractor.id,
extractorName: extractor.name,
configured: true,
});
};
const filteredExpressions =
result?.expressions.filter((e) =>
e.name.toLowerCase().includes(searchTerm.toLowerCase())
) || [];
return (
<div className="bg-dark-850 border border-dark-700 rounded-xl w-80 max-h-[70vh] flex flex-col shadow-xl">
{/* Header */}
<div className="flex items-center justify-between px-4 py-3 border-b border-dark-700">
<div className="flex items-center gap-2">
<Search size={16} className="text-primary-400" />
<span className="font-medium text-white text-sm">Model Introspection</span>
</div>
<div className="flex items-center gap-1">
<button
onClick={runIntrospection}
disabled={isLoading}
className="p-1.5 text-dark-400 hover:text-white hover:bg-dark-700 rounded transition-colors"
title="Refresh"
>
<RefreshCw size={14} className={isLoading ? 'animate-spin' : ''} />
</button>
<button
onClick={onClose}
className="p-1.5 text-dark-400 hover:text-white hover:bg-dark-700 rounded transition-colors"
>
<X size={14} />
</button>
</div>
</div>
{/* Search */}
<div className="px-4 py-2 border-b border-dark-700">
<input
type="text"
placeholder="Filter expressions..."
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
className="w-full px-3 py-1.5 bg-dark-800 border border-dark-600 rounded-lg
text-sm text-white placeholder-dark-500 focus:outline-none focus:border-primary-500"
/>
</div>
{/* Content */}
<div className="flex-1 overflow-auto">
{isLoading ? (
<div className="flex items-center justify-center h-32 text-dark-500">
<RefreshCw size={20} className="animate-spin mr-2" />
Analyzing model...
</div>
) : error ? (
<div className="p-4 text-red-400 text-sm">{error}</div>
) : result ? (
<div className="p-2 space-y-2">
{/* Solver Type */}
{result.solver_type && (
<div className="p-2 bg-dark-800 rounded-lg">
<div className="flex items-center gap-2 text-sm">
<Cpu size={14} className="text-violet-400" />
<span className="text-dark-300">Solver:</span>
<span className="text-white font-medium">{result.solver_type}</span>
</div>
</div>
)}
{/* Expressions Section */}
<div className="border border-dark-700 rounded-lg overflow-hidden">
<button
onClick={() => toggleSection('expressions')}
className="w-full flex items-center justify-between px-3 py-2 bg-dark-800 hover:bg-dark-750 transition-colors"
>
<div className="flex items-center gap-2">
<SlidersHorizontal size={14} className="text-emerald-400" />
<span className="text-sm font-medium text-white">
Expressions ({filteredExpressions.length})
</span>
</div>
{expandedSections.has('expressions') ? (
<ChevronDown size={14} className="text-dark-400" />
) : (
<ChevronRight size={14} className="text-dark-400" />
)}
</button>
{expandedSections.has('expressions') && (
<div className="p-2 space-y-1 max-h-48 overflow-y-auto">
{filteredExpressions.length === 0 ? (
<p className="text-xs text-dark-500 text-center py-2">
No expressions found
</p>
) : (
filteredExpressions.map((expr) => (
<div
key={expr.name}
className="flex items-center justify-between p-2 bg-dark-850 rounded hover:bg-dark-750 group transition-colors"
>
<div className="flex-1 min-w-0">
<p className="text-sm text-white truncate">{expr.name}</p>
<p className="text-xs text-dark-500">
{expr.value} {expr.unit}
{expr.source === 'inferred' && (
<span className="ml-1 text-amber-500">(inferred)</span>
)}
</p>
</div>
<button
onClick={() => addExpressionAsDesignVar(expr)}
className="p-1.5 text-dark-500 hover:text-primary-400 hover:bg-dark-700 rounded
opacity-0 group-hover:opacity-100 transition-all"
title="Add as Design Variable"
>
<Plus size={14} />
</button>
</div>
))
)}
</div>
)}
</div>
{/* Extractors Section */}
<div className="border border-dark-700 rounded-lg overflow-hidden">
<button
onClick={() => toggleSection('extractors')}
className="w-full flex items-center justify-between px-3 py-2 bg-dark-800 hover:bg-dark-750 transition-colors"
>
<div className="flex items-center gap-2">
<FlaskConical size={14} className="text-cyan-400" />
<span className="text-sm font-medium text-white">
Available Extractors ({result.extractors_available.length})
</span>
</div>
{expandedSections.has('extractors') ? (
<ChevronDown size={14} className="text-dark-400" />
) : (
<ChevronRight size={14} className="text-dark-400" />
)}
</button>
{expandedSections.has('extractors') && (
<div className="p-2 space-y-1 max-h-48 overflow-y-auto">
{result.extractors_available.map((ext) => (
<div
key={ext.id}
className="flex items-center justify-between p-2 bg-dark-850 rounded hover:bg-dark-750 group transition-colors"
>
<div className="flex-1 min-w-0">
<p className="text-sm text-white">{ext.name}</p>
<p className="text-xs text-dark-500">
{ext.id}
{ext.description && ` - ${ext.description}`}
</p>
</div>
<button
onClick={() => addExtractorNode(ext)}
className="p-1.5 text-dark-500 hover:text-primary-400 hover:bg-dark-700 rounded
opacity-0 group-hover:opacity-100 transition-all"
title="Add Extractor"
>
<Plus size={14} />
</button>
</div>
))}
</div>
)}
</div>
{/* Dependent Files */}
{result.dependent_files.length > 0 && (
<div className="border border-dark-700 rounded-lg overflow-hidden">
<button
onClick={() => toggleSection('files')}
className="w-full flex items-center justify-between px-3 py-2 bg-dark-800 hover:bg-dark-750 transition-colors"
>
<div className="flex items-center gap-2">
<FileBox size={14} className="text-amber-400" />
<span className="text-sm font-medium text-white">
Dependent Files ({result.dependent_files.length})
</span>
</div>
{expandedSections.has('files') ? (
<ChevronDown size={14} className="text-dark-400" />
) : (
<ChevronRight size={14} className="text-dark-400" />
)}
</button>
{expandedSections.has('files') && (
<div className="p-2 space-y-1 max-h-32 overflow-y-auto">
{result.dependent_files.map((file) => (
<div
key={file.path}
className="flex items-center gap-2 p-2 bg-dark-850 rounded"
>
<FileBox size={14} className="text-dark-400 flex-shrink-0" />
<div className="flex-1 min-w-0">
<p className="text-sm text-white truncate">{file.name}</p>
<p className="text-xs text-dark-500">{file.type}</p>
</div>
</div>
))}
</div>
)}
</div>
)}
{/* Warnings */}
{result.warnings.length > 0 && (
<div className="p-2 bg-amber-500/10 border border-amber-500/30 rounded-lg">
<div className="flex items-center gap-1.5 mb-1">
<AlertTriangle size={12} className="text-amber-400" />
<p className="text-xs text-amber-400 font-medium">Warnings</p>
</div>
{result.warnings.map((w, i) => (
<p key={i} className="text-xs text-amber-300">
{w}
</p>
))}
</div>
)}
</div>
) : (
<div className="flex items-center justify-center h-32 text-dark-500 text-sm">
Select a model to introspect
</div>
)}
</div>
</div>
);
}

View File

@@ -1,5 +1,9 @@
import { useState } from 'react';
import { FolderSearch, Microscope } from 'lucide-react';
import { useCanvasStore } from '../../../hooks/useCanvasStore';
import { ExpressionSelector } from './ExpressionSelector';
import { FileBrowser } from './FileBrowser';
import { IntrospectionPanel } from './IntrospectionPanel';
import {
ModelNodeData,
SolverNodeData,
@@ -24,6 +28,9 @@ export function NodeConfigPanel({ nodeId }: NodeConfigPanelProps) {
const { nodes, updateNodeData, deleteSelected } = useCanvasStore();
const node = nodes.find((n) => n.id === nodeId);
const [showFileBrowser, setShowFileBrowser] = useState(false);
const [showIntrospection, setShowIntrospection] = useState(false);
if (!node) return null;
const { data } = node;
@@ -63,15 +70,24 @@ export function NodeConfigPanel({ nodeId }: NodeConfigPanelProps) {
<>
<div>
<label className={labelClass}>
File Path
Model File
</label>
<input
type="text"
value={(data as ModelNodeData).filePath || ''}
onChange={(e) => handleChange('filePath', e.target.value)}
placeholder="path/to/model.prt"
className={`${inputClass} font-mono text-sm`}
/>
<div className="flex gap-2">
<input
type="text"
value={(data as ModelNodeData).filePath || ''}
onChange={(e) => handleChange('filePath', e.target.value)}
placeholder="path/to/model.sim"
className={`${inputClass} font-mono text-sm flex-1`}
/>
<button
onClick={() => setShowFileBrowser(true)}
className="px-3 py-2 bg-dark-700 hover:bg-dark-600 rounded-lg text-dark-300 hover:text-white transition-colors"
title="Browse files"
>
<FolderSearch size={18} />
</button>
</div>
</div>
<div>
<label className={labelClass}>
@@ -86,8 +102,21 @@ export function NodeConfigPanel({ nodeId }: NodeConfigPanelProps) {
<option value="prt">Part (.prt)</option>
<option value="fem">FEM (.fem)</option>
<option value="sim">Simulation (.sim)</option>
<option value="afem">Assembled FEM (.afem)</option>
</select>
</div>
{/* Introspect Button */}
{(data as ModelNodeData).filePath && (
<button
onClick={() => setShowIntrospection(true)}
className="w-full flex items-center justify-center gap-2 px-3 py-2.5 bg-primary-500/20
hover:bg-primary-500/30 border border-primary-500/30 rounded-lg
text-primary-400 text-sm font-medium transition-colors"
>
<Microscope size={16} />
Introspect Model
</button>
)}
</>
)}
@@ -385,6 +414,27 @@ export function NodeConfigPanel({ nodeId }: NodeConfigPanelProps) {
</>
)}
</div>
{/* File Browser Modal */}
<FileBrowser
isOpen={showFileBrowser}
onClose={() => setShowFileBrowser(false)}
onSelect={(path, fileType) => {
handleChange('filePath', path);
handleChange('fileType', fileType.replace('.', ''));
}}
fileTypes={['.sim', '.prt', '.fem', '.afem']}
/>
{/* Introspection Panel */}
{showIntrospection && (data as ModelNodeData).filePath && (
<div className="fixed top-20 right-96 z-40">
<IntrospectionPanel
filePath={(data as ModelNodeData).filePath!}
onClose={() => setShowIntrospection(false)}
/>
</div>
)}
</div>
);
}

View File

@@ -15,7 +15,7 @@ interface CanvasState {
onNodesChange: (changes: NodeChange[]) => void;
onEdgesChange: (changes: EdgeChange[]) => void;
onConnect: (connection: Connection) => void;
addNode: (type: NodeType, position: { x: number; y: number }) => void;
addNode: (type: NodeType, position: { x: number; y: number }, data?: Partial<CanvasNodeData>) => void;
updateNodeData: (nodeId: string, data: Partial<CanvasNodeData>) => void;
selectNode: (nodeId: string | null) => void;
selectEdge: (edgeId: string | null) => void;
@@ -112,12 +112,14 @@ export const useCanvasStore = create<CanvasState>((set, get) => ({
set({ edges: addEdge(connection, get().edges) });
},
addNode: (type, position) => {
addNode: (type, position, customData) => {
const newNode: Node<CanvasNodeData> = {
id: getNodeId(),
type,
position,
data: getDefaultData(type),
data: customData
? { ...getDefaultData(type), ...customData } as CanvasNodeData
: getDefaultData(type),
};
set({ nodes: [...get().nodes, newNode] });
},

View File

@@ -89,14 +89,63 @@ export interface CanvasEdge {
targetHandle?: string;
}
// Valid connections
// Valid connections - defines what a node can connect TO (as source)
// Flow: DesignVar -> Model -> Solver -> Extractor -> Objective/Constraint -> Algorithm -> Surrogate
export const VALID_CONNECTIONS: Record<NodeType, NodeType[]> = {
model: ['solver', 'designVar'],
solver: ['extractor'],
designVar: ['model'],
extractor: ['objective', 'constraint'],
objective: ['algorithm'],
constraint: ['algorithm'],
algorithm: ['surrogate'],
surrogate: [],
model: ['solver'], // Model outputs to Solver
solver: ['extractor'], // Solver outputs to Extractor
designVar: ['model'], // DesignVar outputs to Model (expressions feed into model)
extractor: ['objective', 'constraint'], // Extractor outputs to Objective/Constraint
objective: ['algorithm'], // Objective outputs to Algorithm
constraint: ['algorithm'], // Constraint outputs to Algorithm
algorithm: ['surrogate'], // Algorithm outputs to Surrogate
surrogate: [], // Surrogate is terminal
};
// Node handle configuration for proper flow direction
export interface HandleConfig {
id: string;
label?: string;
}
export interface NodeHandleConfig {
inputs: HandleConfig[];
outputs: HandleConfig[];
}
// Define handles for each node type
// Flow: DesignVar(s) -> Model -> Solver -> Extractor(s) -> Objective(s) -> Algorithm
export const NODE_HANDLES: Record<NodeType, NodeHandleConfig> = {
model: {
inputs: [{ id: 'params', label: 'Parameters' }], // Receives from DesignVars
outputs: [{ id: 'sim', label: 'Simulation' }], // Sends to Solver
},
solver: {
inputs: [{ id: 'model', label: 'Model' }], // Receives from Model
outputs: [{ id: 'results', label: 'Results' }], // Sends to Extractors
},
designVar: {
inputs: [], // No inputs - this is a source
outputs: [{ id: 'value', label: 'Value' }], // Sends to Model
},
extractor: {
inputs: [{ id: 'results', label: 'Results' }], // Receives from Solver
outputs: [{ id: 'value', label: 'Value' }], // Sends to Objective/Constraint
},
objective: {
inputs: [{ id: 'value', label: 'Value' }], // Receives from Extractor
outputs: [{ id: 'objective', label: 'Objective' }], // Sends to Algorithm
},
constraint: {
inputs: [{ id: 'value', label: 'Value' }], // Receives from Extractor
outputs: [{ id: 'constraint', label: 'Constraint' }], // Sends to Algorithm
},
algorithm: {
inputs: [{ id: 'objectives', label: 'Objectives' }], // Receives from Objectives/Constraints
outputs: [{ id: 'algo', label: 'Algorithm' }], // Sends to Surrogate
},
surrogate: {
inputs: [{ id: 'algo', label: 'Algorithm' }], // Receives from Algorithm
outputs: [], // No outputs - this is a sink
},
};

View File

@@ -74,13 +74,68 @@ export function validateGraph(
}
}
// Check connectivity
// Check connectivity - verify proper flow direction
// Design Variables should connect TO Model (as source -> target)
const modelNodes = nodes.filter(n => n.data.type === 'model');
for (const dvar of designVars) {
const connectsToModel = edges.some(e =>
e.source === dvar.id && modelNodes.some(m => m.id === e.target)
);
if (!connectsToModel) {
warnings.push(`${dvar.data.label} is not connected to a Model`);
}
}
// Model should connect TO Solver
const solverNodes = nodes.filter(n => n.data.type === 'solver');
for (const model of modelNodes) {
const connectsToSolver = edges.some(e =>
e.source === model.id && solverNodes.some(s => s.id === e.target)
);
if (!connectsToSolver) {
errors.push(`${model.data.label} is not connected to a Solver`);
}
}
// Solver should connect TO Extractors
for (const solver of solverNodes) {
const connectsToExtractor = edges.some(e =>
e.source === solver.id && extractors.some(ex => ex.id === e.target)
);
if (!connectsToExtractor) {
warnings.push(`${solver.data.label} is not connected to any Extractor`);
}
}
// Extractors should connect TO Objectives or Constraints
const objectives = nodes.filter(n => n.data.type === 'objective');
const constraints = nodes.filter(n => n.data.type === 'constraint');
for (const extractor of extractors) {
const connectsToObjective = edges.some(e =>
e.source === extractor.id &&
(objectives.some(obj => obj.id === e.target) || constraints.some(c => c.id === e.target))
);
if (!connectsToObjective) {
warnings.push(`${extractor.data.label} is not connected to any Objective or Constraint`);
}
}
// Objectives should connect TO Algorithm
const algorithmNodes = nodes.filter(n => n.data.type === 'algorithm');
for (const obj of objectives) {
const hasIncoming = edges.some(e => e.target === obj.id);
const hasIncoming = edges.some(e =>
extractors.some(ex => ex.id === e.source) && e.target === obj.id
);
if (!hasIncoming) {
errors.push(`${obj.data.label} has no connected extractor`);
}
const connectsToAlgorithm = edges.some(e =>
e.source === obj.id && algorithmNodes.some(a => a.id === e.target)
);
if (!connectsToAlgorithm) {
warnings.push(`${obj.data.label} is not connected to an Algorithm`);
}
}
return {