feat: Add Protocol 13 adaptive optimization, Plotly charts, and dashboard improvements

## Protocol 13: Adaptive Multi-Objective Optimization
- Iterative FEA + Neural Network surrogate workflow
- Initial FEA sampling, NN training, NN-accelerated search
- FEA validation of top NN predictions, retraining loop
- adaptive_state.json tracks iteration history and best values
- M1 mirror study (V11) with 103 FEA, 3000 NN trials

## Dashboard Visualization Enhancements
- Added Plotly.js interactive charts (parallel coords, Pareto, convergence)
- Lazy loading with React.lazy() for performance
- Code splitting: plotly.js-basic-dist (~1MB vs 3.5MB)
- Chart library toggle (Recharts default, Plotly on-demand)
- ExpandableChart component for full-screen modal views
- ConsoleOutput component for real-time log viewing

## Documentation
- Protocol 13 detailed documentation
- Dashboard visualization guide
- Plotly components README
- Updated run-optimization skill with Mode 5 (adaptive)

## Bug Fixes
- Fixed TypeScript errors in dashboard components
- Fixed Card component to accept ReactNode title
- Removed unused imports across components

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Antoine
2025-12-04 07:41:54 -05:00
parent e74f1ccf36
commit 8cbdbcad78
270 changed files with 15471 additions and 517 deletions

View File

@@ -1,17 +1,17 @@
import { useRef, useState, Suspense } from 'react';
import { Canvas, useFrame } from '@react-three/fiber';
import { OrbitControls, Stage, useGLTF } from '@react-three/drei';
import { OrbitControls, Stage } from '@react-three/drei';
import { Card } from '../common/Card';
import { Button } from '../common/Button';
import { Maximize2, RotateCcw } from 'lucide-react';
// Placeholder component for the mesh
// In a real implementation, this would load the GLTF/OBJ file converted from Nastran
const Model = ({ path }: { path?: string }) => {
const Model = ({ path: _path }: { path?: string }) => {
// For now, we'll render a simple box to demonstrate the viewer
const meshRef = useRef<any>();
useFrame((state, delta) => {
useFrame((_state, delta) => {
if (meshRef.current) {
meshRef.current.rotation.y += delta * 0.2;
}
@@ -30,7 +30,7 @@ interface MeshViewerProps {
resultField?: string;
}
export const MeshViewer = ({ modelPath, resultField }: MeshViewerProps) => {
export const MeshViewer = ({ modelPath, resultField: _resultField }: MeshViewerProps) => {
const [autoRotate, setAutoRotate] = useState(true);
return (

View File

@@ -2,7 +2,7 @@ import { useState } from 'react';
import { Card } from '../common/Card';
import { Button } from '../common/Button';
import { Input } from '../common/Input';
import { FileText, Download, Plus, Trash2, MoveUp, MoveDown } from 'lucide-react';
import { Download, Plus, Trash2, MoveUp, MoveDown } from 'lucide-react';
interface ReportSection {
id: string;