@bamptee/aia-code 0.10.0 → 1.0.1

package/src/ui/public/main.js

@@ -0,0 +1,119 @@
+import React from 'react';
+import { createRoot } from 'react-dom/client';
+import { Dashboard } from '/components/dashboard.js';
+import { FeatureDetail } from '/components/feature-detail.js';
+import { ConfigView } from '/components/config-view.js';
+
+// --- API client ---
+export const api = {
+  async get(path) {
+    const res = await fetch(`/api${path}`);
+    if (!res.ok) throw new Error((await res.json()).error || res.statusText);
+    return res.json();
+  },
+  async post(path, body = {}) {
+    const res = await fetch(`/api${path}`, {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(body),
+    });
+    if (!res.ok) throw new Error((await res.json()).error || res.statusText);
+    return res.json();
+  },
+  async put(path, body = {}) {
+    const res = await fetch(`/api${path}`, {
+      method: 'PUT',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(body),
+    });
+    if (!res.ok) throw new Error((await res.json()).error || res.statusText);
+    return res.json();
+  },
+};
+
+// --- SSE stream helper ---
+// POST with SSE response. Calls onLog(text) for each log chunk, returns { ok, error }.
+export async function streamPost(path, body, { onLog, onStatus }) {
+  const res = await fetch(`/api${path}`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(body),
+  });
+
+  const reader = res.body.getReader();
+  const decoder = new TextDecoder();
+  let buffer = '';
+  let result = { ok: true };
+
+  while (true) {
+    const { done, value } = await reader.read();
+    if (done) break;
+    buffer += decoder.decode(value, { stream: true });
+
+    const lines = buffer.split('\n');
+    buffer = lines.pop(); // keep incomplete line
+
+    let eventType = null;
+    for (const line of lines) {
+      if (line.startsWith('event: ')) {
+        eventType = line.slice(7);
+      } else if (line.startsWith('data: ') && eventType) {
+        try {
+          const data = JSON.parse(line.slice(6));
+          if (eventType === 'log' && onLog) {
+            onLog(data.text, data.type);
+          } else if (eventType === 'status' && onStatus) {
+            onStatus(data);
+          } else if (eventType === 'error') {
+            result = { ok: false, error: data.message };
+          } else if (eventType === 'done') {
+            result = { ok: true, ...data };
+          }
+        } catch {}
+        eventType = null;
+      }
+    }
+  }
+
+  return result;
+}
+
+// --- Simple hash router ---
+function useHashRoute() {
+  const [route, setRoute] = React.useState(window.location.hash || '#/');
+  React.useEffect(() => {
+    const handler = () => setRoute(window.location.hash || '#/');
+    window.addEventListener('hashchange', handler);
+    return () => window.removeEventListener('hashchange', handler);
+  }, []);
+  return route;
+}
+
+function parseRoute(hash) {
+  if (hash.startsWith('#/features/')) {
+    return { page: 'feature', name: decodeURIComponent(hash.slice('#/features/'.length)) };
+  }
+  if (hash === '#/config') return { page: 'config' };
+  return { page: 'dashboard' };
+}
+
+// --- App ---
+function App() {
+  const hash = useHashRoute();
+  const { page, name } = parseRoute(hash);
+
+  return React.createElement('div', { className: 'min-h-screen' },
+    React.createElement('nav', { className: 'border-b border-aia-border px-6 py-3 flex items-center gap-6' },
+      React.createElement('a', { href: '#/', className: 'text-aia-accent font-bold text-lg hover:text-sky-300' }, 'AIA'),
+      React.createElement('a', { href: '#/', className: 'text-slate-400 hover:text-slate-200 text-sm' }, 'Features'),
+      React.createElement('a', { href: '#/config', className: 'text-slate-400 hover:text-slate-200 text-sm' }, 'Config'),
+    ),
+    React.createElement('main', { className: 'max-w-6xl mx-auto p-6' },
+      page === 'dashboard' ? React.createElement(Dashboard) :
+      page === 'feature' ? React.createElement(FeatureDetail, { name }) :
+      page === 'config' ? React.createElement(ConfigView) : null
+    )
+  );
+}
+
+createRoot(document.getElementById('root')).render(React.createElement(App));

package/src/ui/router.js

@@ -0,0 +1,47 @@
+export function createRouter() {
+  const routes = [];
+
+  function add(method, pattern, handler) {
+    const keys = [];
+    const regex = new RegExp(
+      '^' + pattern.replace(/:([^/]+)/g, (_, key) => { keys.push(key); return '([^/]+)'; }) + '$'
+    );
+    routes.push({ method, regex, keys, handler });
+  }
+
+  function match(method, pathname) {
+    for (const route of routes) {
+      if (route.method !== method) continue;
+      const m = pathname.match(route.regex);
+      if (m) {
+        const params = {};
+        route.keys.forEach((key, i) => { params[key] = decodeURIComponent(m[i + 1]); });
+        return { handler: route.handler, params };
+      }
+    }
+    return null;
+  }
+
+  return { add, match, get: (p, h) => add('GET', p, h), post: (p, h) => add('POST', p, h), put: (p, h) => add('PUT', p, h), delete: (p, h) => add('DELETE', p, h) };
+}
+
+export async function parseBody(req) {
+  return new Promise((resolve, reject) => {
+    let body = '';
+    req.on('data', chunk => { body += chunk; });
+    req.on('end', () => {
+      try { resolve(body ? JSON.parse(body) : {}); }
+      catch (e) { reject(new Error('Invalid JSON body')); }
+    });
+    req.on('error', reject);
+  });
+}
+
+export function json(res, data, status = 200) {
+  res.writeHead(status, { 'Content-Type': 'application/json', 'Access-Control-Allow-Origin': '*' });
+  res.end(JSON.stringify(data));
+}
+
+export function error(res, message, status = 500) {
+  json(res, { error: message }, status);
+}

package/src/ui/server.js

@@ -0,0 +1,105 @@
+import { createServer } from 'node:http';
+import { createConnection } from 'node:net';
+import { createReadStream, existsSync } from 'node:fs';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { createRouter, parseBody, json, error } from './router.js';
+import { registerApiRoutes } from './api/index.js';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+const MIME_TYPES = {
+  '.html': 'text/html',
+  '.js': 'application/javascript',
+  '.css': 'text/css',
+  '.json': 'application/json',
+  '.svg': 'image/svg+xml',
+  '.png': 'image/png',
+  '.ico': 'image/x-icon',
+};
+
+function serveStatic(res, filePath) {
+  const ext = path.extname(filePath);
+  const mime = MIME_TYPES[ext] || 'application/octet-stream';
+
+  if (!existsSync(filePath)) {
+    // SPA fallback: serve index.html for non-API, non-file routes
+    const indexPath = path.join(__dirname, 'public', 'index.html');
+    if (existsSync(indexPath)) {
+      res.writeHead(200, { 'Content-Type': 'text/html' });
+      createReadStream(indexPath).pipe(res);
+      return;
+    }
+    res.writeHead(404);
+    res.end('Not found');
+    return;
+  }
+
+  res.writeHead(200, { 'Content-Type': mime });
+  createReadStream(filePath).pipe(res);
+}
+
+function isPortFree(port) {
+  return new Promise((resolve) => {
+    const socket = createConnection({ port, host: '127.0.0.1' });
+    socket.once('connect', () => { socket.destroy(); resolve(false); });
+    socket.once('error', () => { resolve(true); });
+  });
+}
+
+async function findFreePort(start = 3100, maxAttempts = 50) {
+  for (let port = start; port < start + maxAttempts; port++) {
+    if (await isPortFree(port)) return port;
+  }
+  throw new Error(`No free port found between ${start} and ${start + maxAttempts - 1}`);
+}
+
+export async function startServer(preferredPort, root = process.cwd()) {
+  const port = preferredPort ?? await findFreePort();
+
+  const router = createRouter();
+  registerApiRoutes(router, root);
+
+  const server = createServer(async (req, res) => {
+    // CORS preflight
+    if (req.method === 'OPTIONS') {
+      res.writeHead(204, {
+        'Access-Control-Allow-Origin': '*',
+        'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
+        'Access-Control-Allow-Headers': 'Content-Type',
+      });
+      res.end();
+      return;
+    }
+
+    const url = new URL(req.url, `http://${req.headers.host}`);
+    const pathname = url.pathname;
+
+    // API routes
+    if (pathname.startsWith('/api/')) {
+      const matched = router.match(req.method, pathname);
+      if (matched) {
+        try {
+          await matched.handler(req, res, { params: matched.params, query: Object.fromEntries(url.searchParams), root, parseBody: () => parseBody(req) });
+        } catch (err) {
+          error(res, err.message, 500);
+        }
+      } else {
+        error(res, 'Not found', 404);
+      }
+      return;
+    }
+
+    // Static files
+    let filePath = path.join(__dirname, 'public', pathname === '/' ? 'index.html' : pathname);
+    serveStatic(res, filePath);
+  });
+
+  return new Promise((resolve, reject) => {
+    server.on('error', reject);
+    server.listen(port, '127.0.0.1', () => {
+      console.log(`AIA UI running at http://127.0.0.1:${port}`);
+      resolve({ server, port });
+    });
+  });
+}