Refactors server layout, sets up local dev proxy

Moves webhook logic to a dedicated module for clearer organization
Adds a development proxy to simplify frontend-backend integration

Author: mbertelsen

.gitignore

@@ -2,6 +2,7 @@ import path from "path";
 import fs from "fs";
 import express, { Request, Response, NextFunction } from "express";
 import cors from "cors";
+import { registerWebhookRoutes } from './webhook';
 
 const app = express();
 // Prefer explicit PORT, then WEBSITES_PORT (used by Azure App Service), then default to 4000
@@ -35,217 +36,9 @@ app.post("/api/logout", (_req: Request, res: Response) => {
   res.json({ ok: true });
 });
 
-// Event Grid webhook for per-user webhook paths.
-// Example: POST /api/webhook/<user-unique-path>
-// If WEBHOOK_ALLOWED_KEYS is set (comma-separated), the :userPath must be present there.
-app.post("/api/webhook/:userPath", (req: Request, res: Response) => {
-  const userPath = req.params.userPath;
+// Register webhook-related routes (event store, SSE, diagnostics)
+registerWebhookRoutes(app);
 
-  // Optional allow-list: comma separated keys in env var WEBHOOK_ALLOWED_KEYS
-  const allowed = process.env.WEBHOOK_ALLOWED_KEYS;
-  if (allowed) {
-    const allowedSet = new Set(allowed.split(",").map(s => s.trim()).filter(Boolean));
-    if (!allowedSet.has(userPath)) {
-      console.warn(`Rejected webhook for unknown key: ${userPath}`);
-      return res.status(404).json({ error: "unknown webhook path" });
-    }
-  }
-
-  // Event Grid usually sends an array, but some proxies or transports may send a single
-  // object. Normalize to an array for easier handling.
-  const events = Array.isArray(req.body) ? req.body : req.body ? [req.body] : [];
-
-  // Save last request for diagnostics
-  try {
-    lastWebhookDiagnostics.set(userPath, { headers: req.headers, body: events });
-  } catch (err) {
-    // ignore
-  }
-
-  // Diagnostic: log aeg-event-type header when present (helps Azure debugging)
-  try {
-    const aeg = String(req.header('aeg-event-type') || '');
-    if (aeg) console.log(`aeg-event-type: ${aeg}`);
-  } catch (err) {
-    // ignore
-  }
-
-  // Helper: extract validation code from an event object in a forgiving way.
-  const extractValidationCode = (ev: any): string | undefined => {
-    if (!ev) return undefined;
-    // Common places: ev.data.validationCode (case variants)
-    const data = ev.data || ev.Data || ev.DATA || ev;
-    if (data && typeof data === 'object') {
-      for (const key of Object.keys(data)) {
-        if (key.toLowerCase() === 'validationcode' && data[key]) return String(data[key]);
-      }
-    }
-    // Some transports may put the code at the top-level
-    for (const key of Object.keys(ev)) {
-      if (key.toLowerCase() === 'validationcode' && ev[key]) return String(ev[key]);
-    }
-    return undefined;
-  };
-
-  // Event Grid subscription validation can arrive as:
-  // - an event in the array with eventType matching expected strings
-  // - header-based flows where 'aeg-event-type' tells us it's a validation attempt
-  // Try to find any validation code in the incoming payloads.
-  const validationEvent = events.find((e: any) => {
-    if (!e) return false;
-    const et = (e.eventType || e.EventType || '').toString();
-    return (
-      et === 'Microsoft.EventGrid.SubscriptionValidationEvent' ||
-      et === 'Microsoft.EventGridSubscriptionValidationEvent' ||
-      et === 'Microsoft.EventGrid.SubscriptionValidation' ||
-      et.toLowerCase().includes('subscriptionvalidation')
-    );
-  });
-
-  if (validationEvent) {
-    const code = extractValidationCode(validationEvent) || (validationEvent.data && validationEvent.data.validationCode) || undefined;
-    console.log(`EventGrid subscription validation (event) for ${userPath}:`, validationEvent?.data || validationEvent, '=> code=', code);
-    if (code) return res.status(200).json({ validationResponse: code });
-  }
-
-  // Also handle the header-based SubscriptionValidation flow: check aeg header and try first event
-  const aegHeader = (req.header('aeg-event-type') || '').toString();
-  if (aegHeader && aegHeader.toLowerCase().includes('subscriptionvalidation') && events.length > 0) {
-    const maybe = events[0] as any;
-    const code = extractValidationCode(maybe);
-    console.log(`EventGrid header-based validation for ${userPath}: aeg=${aegHeader} =>`, maybe, '=> code=', code);
-    if (code) return res.status(200).json({ validationResponse: code });
-  }
-
-  // Normal events: log and ack
-  try {
-    console.log(`Received ${events.length} event(s) for webhook ${userPath}`);
-    // For debugging include a small sample of events
-    console.log(JSON.stringify(events.map((e: any) => ({ id: e.id, eventType: e.eventType })), null, 2));
-  } catch (err) {
-    console.warn('Failed to log events', (err as Error).message);
-  }
-
-  // Append events to in-memory store for this path
-  try {
-    const now = new Date().toISOString();
-    const records: EventRecord[] = events.map((e: any) => ({
-      id: e.id,
-      eventType: e.eventType,
-      timestamp: e.eventTime || now,
-      data: e.data,
-      raw: e,
-    }));
-
-    const existing = eventStore.get(userPath) || [];
-    // Newest at start
-    const combined = [...records.reverse(), ...existing];
-    // Trim to cap
-    const trimmed = combined.slice(0, EVENT_STORE_CAP);
-    eventStore.set(userPath, trimmed);
-  } catch (err) {
-    console.warn('Failed to store events in memory', (err as Error).message);
-  }
-
-  // Notify any SSE clients connected to this webhook path
-  try {
-    for (const e of events) {
-      const payload = {
-        id: e.id,
-        eventType: e.eventType,
-        timestamp: e.eventTime || new Date().toISOString(),
-        data: e.data,
-        raw: e,
-      };
-      sendSseToPath(userPath, payload);
-    }
-  } catch (err) {
-    console.warn('Failed to broadcast SSE', (err as Error).message);
-  }
-
-  // TODO: integrate with persistence / user properties: look up which user has this key
-  // and forward/enqueue events appropriately.
-
-  return res.status(200).json({ received: events.length });
-});
-
-// In-memory event store per webhook path (newest items at start). This is ephemeral and
-// will be lost if the server restarts. We keep a modest cap per path.
-type EventRecord = {
-  id?: string;
-  eventType: string;
-  timestamp: string; // ISO
-  data: any;
-  raw: any;
-};
-
-const EVENT_STORE_CAP = 200;
-const eventStore = new Map<string, EventRecord[]>();
-
-// For debugging: store last request headers and body per path
-const lastWebhookDiagnostics = new Map<string, { headers: any; body: any }>();
-
-// SSE clients per webhook path
-const sseClients = new Map<string, Set<Response>>();
-
-function sendSseToPath(userPath: string, payload: any) {
-  const clients = sseClients.get(userPath);
-  if (!clients) return;
-  const data = typeof payload === 'string' ? payload : JSON.stringify(payload);
-  for (const res of clients) {
-    try {
-      res.write(`data: ${data}\n\n`);
-    } catch (err) {
-      console.warn('Failed to write SSE to client', (err as Error).message);
-    }
-  }
-}
-
-// Return events for a specific webhook path (newest first). No auth is enforced here;
-// possession of the path acts as the access key. If you want stronger auth, wire this
-// up to your user system and verify ownership.
-app.get('/api/webhook/:userPath/events', (_req: Request, res: Response) => {
-  const userPath = _req.params.userPath;
-  const list = eventStore.get(userPath) || [];
-  return res.json({ count: list.length, events: list });
-});
-
-// Diagnostic endpoint to inspect last webhook request for a path
-app.get('/__diag/webhook/:userPath', (_req: Request, res: Response) => {
-  const userPath = _req.params.userPath;
-  const diag = lastWebhookDiagnostics.get(userPath) || null;
-  const stored = eventStore.get(userPath) || [];
-  return res.json({ lastRequest: diag, storedCount: stored.length });
-});
-
-// Server-Sent Events stream for a webhook path.
-app.get('/api/webhook/:userPath/stream', (req: Request, res: Response) => {
-  const userPath = req.params.userPath;
-
-  // Set SSE headers
-  res.writeHead(200, {
-    'Content-Type': 'text/event-stream',
-    'Cache-Control': 'no-cache',
-    Connection: 'keep-alive',
-  });
-
-  // Send an initial comment to establish the stream
-  res.write(': connected\n\n');
-
-  // Register client
-  const set = sseClients.get(userPath) || new Set<Response>();
-  set.add(res);
-  sseClients.set(userPath, set);
-
-  req.on('close', () => {
-    // Remove client when they disconnect
-    const clients = sseClients.get(userPath);
-    if (clients) {
-      clients.delete(res);
-      if (clients.size === 0) sseClients.delete(userPath);
-    }
-  });
-});
 
 // Serve static frontend if present in the final image at '../editor-dist'
 const staticPath = path.join(__dirname, "..", "editor-dist");
@@ -262,6 +55,26 @@ if (fs.existsSync(staticPath)) {
 
   app.use(express.static(staticPath));
 
+  // Lightweight request logging for debugging static asset requests
+  app.use((req: Request, _res: Response, next: NextFunction) => {
+    if (req.method === 'GET' && (req.path === '/' || req.path === '/index.html' || req.path === '/env-config.js')) {
+      console.log(`Static request for ${req.path} (accept: ${req.headers.accept})`);
+    }
+    next();
+  });
+
+  // Ensure root and env-config are served directly (helps when clients send non-standard Accept headers)
+  app.get('/', (_req: Request, res: Response) => {
+    if (fs.existsSync(FRONTEND_INDEX)) return res.sendFile(FRONTEND_INDEX);
+    return res.status(500).send('Frontend index.html missing in image.');
+  });
+
+  app.get('/env-config.js', (_req: Request, res: Response) => {
+    const file = path.join(staticPath, 'env-config.js');
+    if (fs.existsSync(file)) return res.sendFile(file);
+    return res.status(404).send('// env-config not found');
+  });
+
   // SPA fallback: only serve index.html for GET requests that accept HTML,
   // and explicitly exclude API and diagnostic routes so API clients get JSON.
   app.get("/*", (req: Request, res: Response, next: NextFunction) => {