AutoNAS

Next.js 14 + React 18 + TypeScript frontend for AutoNAS Neural Architecture Search.

File Structure

frontend/
├── app/
│   ├── layout.tsx          # Root layout + header
│   ├── page.tsx            # Main 3-column page (with error boundaries)
│   ├── not-found.tsx       # Custom 404 page
│   ├── providers.tsx       # React Query provider
│   └── globals.css         # Global styles + animations
├── components/            # ✅ All components complete
│   ├── ChatInterface.tsx
│   ├── ArchitectureViz.tsx
│   ├── EvaluationDashboard.tsx
│   ├── RLMonitor.tsx
│   ├── ErrorBoundary.tsx   # Error boundaries for graceful errors
│   └── LoadingStates.tsx   # Loading/error/empty state components
├── hooks/                 # ✅ Custom hooks
│   ├── useWebSocket.ts     # WebSocket with auto-reconnect
│   ├── useRLProgress.ts    # RL metrics with React Query
│   └── useApiWithState.ts  # Generic API state management
└── lib/
    ├── api.ts              # Enhanced with error interceptors
    ├── types.ts
    ├── websocket.ts
    ├── utils.ts
    └── mockData.ts

Getting Started

# Install dependencies
npm install

# Run development server
npm run dev

# Build for production
npm run build

Open http://localhost:3000 to view the app.

API Configuration

Set environment variables in .env.local:

NEXT_PUBLIC_API_URL=http://localhost:8000
NEXT_PUBLIC_WS_URL=ws://localhost:8000

Features

• Chat Interface: Real-time messaging with simulated AI responses
• Architecture Visualizer: Interactive DAG with ReactFlow
• Evaluation Dashboard: Sortable table + Pareto frontier chart
• RL Learning Monitor: Live learning curves with Recharts
• WebSocket Support: Ready for real-time backend integration with auto-reconnect
• Error Handling: Component-level error boundaries with graceful fallbacks
• Loading States: Comprehensive loading/error/empty state components
• API Error Management: User-friendly error messages with axios interceptors
• Responsive Design: 3-column layout with custom scrollbars
• Type-Safe: Full TypeScript coverage with zero any types
• Production Ready: Builds with zero errors (155 kB optimized)