feat: connect frontend to HuggingFace Space backend

- VITE_API_BASE_URL in web/.env.example now points to HF Space
- Fix fallback from localhost:8000 → localhost:7860 in all pages
- Add vite proxy so local dev frontend → local Docker backend
- web/.env (localhost:7860) for local dev, excluded from git

web/.env.example

@@ -1,5 +1,11 @@
 # AgentIC Web Frontend Environment Variables
 
-# The public URL of your fastAPI backend (running via ngrok or cloud server)
-# If left blank, it defaults to http://localhost:8000
-VITE_API_BASE_URL=https://exultingly-subchorionic-chante.ngrok-free.dev
+# Production: HuggingFace Space URL
+# VITE_API_BASE_URL=https://vxkyyy-agentIC.hf.space
+
+# Local development: Docker container
+# VITE_API_BASE_URL=http://localhost:7860
+
+# If left blank, the Vite proxy handles it automatically during local dev
+# and falls back to http://localhost:7860
+VITE_API_BASE_URL=

web/.gitignore

@@ -11,6 +11,9 @@ node_modules
 dist
 dist-ssr
 *.local
+.env
+.env.*
+!.env.example
 
 # Editor directories and files
 .vscode/*

web/src/App.tsx

@@ -26,7 +26,7 @@ const App = () => {
   }, [theme]);
 
   useEffect(() => {
-    const API_BASE_URL = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:8000').replace(/\/$/, '');
+    const API_BASE_URL = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:7860').replace(/\/$/, '');
     axios.get(`${API_BASE_URL}/designs`)
       .then(res => {
         const data = res.data?.designs || [];

web/src/components/BuildMonitor.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useRef } from 'react';
 import { motion } from 'framer-motion';
 import axios from 'axios';
 
-const API = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:8000').replace(/\/$/, '');
+const API = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:7860').replace(/\/$/, '');
 
 const STATES_DISPLAY: Record<string, { label: string; icon: string }> = {
     INIT: { label: 'Initializing Workspace', icon: '🔧' },

web/src/pages/Dashboard.tsx

@@ -17,7 +17,7 @@ export const Dashboard: React.FC<DashboardProps> = ({ selectedDesign }) => {
         if (!selectedDesign) return;
         setLoading(true);
 
-        const API_BASE_URL = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:8000').replace(/\/$/, '');
+        const API_BASE_URL = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:7860').replace(/\/$/, '');
 
         // Fetch Quick Metrics
         axios.get(`${API_BASE_URL}/metrics/${selectedDesign}`)

web/src/pages/DesignStudio.tsx

@@ -5,7 +5,7 @@ import { BuildMonitor } from '../components/BuildMonitor';
 import { ChipSummary } from '../components/ChipSummary';
 import { fetchEventSource } from '@microsoft/fetch-event-source';
 
-const API = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:8000').replace(/\/$/, '');
+const API = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:7860').replace(/\/$/, '');
 
 type Phase = 'prompt' | 'building' | 'done';
 

web/src/pages/Documentation.tsx

@@ -3,7 +3,7 @@ import axios from 'axios';
 import ReactMarkdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
 
-const API = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:8000').replace(/\/$/, '');
+const API = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:7860').replace(/\/$/, '');
 
 interface DocItem {
   id: string;

web/src/pages/HumanInLoopBuild.tsx

@@ -6,7 +6,7 @@ import { StageProgressBar } from '../components/StageProgressBar';
 import { ApprovalCard } from '../components/ApprovalCard';
 import '../hitl.css';
 
-const API = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:8000').replace(/\/$/, '');
+const API = (import.meta.env.VITE_API_BASE_URL || 'http://localhost:7860').replace(/\/$/, '');
 
 const PIPELINE_STAGES = [
     'INIT', 'SPEC', 'RTL_GEN', 'RTL_FIX', 'VERIFICATION', 'FORMAL_VERIFY',

web/vite.config.ts

@@ -4,4 +4,14 @@ import react from '@vitejs/plugin-react'
 // https://vite.dev/config/
 export default defineConfig({
   plugins: [react()],
+  server: {
+    proxy: {
+      // When VITE_API_BASE_URL is not set, proxy /api/* to the local Docker backend
+      '/api': {
+        target: 'http://localhost:7860',
+        changeOrigin: true,
+        rewrite: (path) => path.replace(/^\/api/, ''),
+      },
+    },
+  },
 })