Fix proxying

frontend/src/App.tsx

@@ -12,6 +12,31 @@ import type {
 
 const DEBOUNCE_MS = 150;
 
+// Detect if running through VS Code web proxy and construct API base URL
+function getApiBaseUrl(): string {
+  const { hostname, pathname, href } = window.location;
+
+  // Check pathname for /proxy/PORT pattern
+  const pathMatch = pathname.match(/^(\/proxy\/)(\d+)/);
+  if (pathMatch) {
+    return `${pathMatch[1]}8001`;
+  }
+
+  // Check full href in case proxy rewrites pathname
+  const hrefMatch = href.match(/(\/proxy\/)\d+/);
+  if (hrefMatch) {
+    return `${hrefMatch[1]}8001`;
+  }
+
+  // If not localhost, assume we're behind a proxy and need explicit backend port
+  if (hostname !== 'localhost' && hostname !== '127.0.0.1') {
+    return '/proxy/8001';
+  }
+
+  // Local development - webpack proxies /api to :8001
+  return '';
+}
+
 export default function App() {
   const [filters, setFilters] = useState<FiltersType>(DEFAULT_FILTERS);
   const [data, setData] = useState<HexagonData[]>([]);
@@ -49,7 +74,7 @@ export default function App() {
           max_price: filters.maxPrice.toString(),
           bounds: boundsStr,
         });
-        const res = await fetch(`/api/hexagons?${params}`, {
+        const res = await fetch(`${getApiBaseUrl()}/api/hexagons?${params}`, {
           signal: abortControllerRef.current.signal,
         });
         const json: ApiResponse = await res.json();

frontend/webpack.config.js

@@ -7,6 +7,7 @@ module.exports = {
     path: path.resolve(__dirname, 'dist'),
     filename: 'bundle.js',
     clean: true,
+    publicPath: './',
   },
   resolve: {
     extensions: ['.ts', '.tsx', '.js', '.jsx'],
@@ -31,6 +32,8 @@ module.exports = {
   ],
   devServer: {
     port: 3000,
+    allowedHosts: 'all',
+    historyApiFallback: true,
     proxy: [
       {
         context: ['/api'],