From d76ff063c8dee7bb9c2b7c9bfea627fef49fa0cd Mon Sep 17 00:00:00 2001
From: Olivier <olivier.butler@gmail.com>
Date: Thu, 28 Aug 2025 05:30:14 -0700
Subject: [PATCH] feat(ui): move layout run helper to layout-service

---
 src/server.mjs                         | 1 -
 src/ui/App.js                          | 2 +-
 src/ui/{main.mjs => layout-service.js} | 2 +-
 src/ui/readme.md                       | 2 +-
 src/ui/rendering-pipeline.md           | 4 ++--
 webpack.config.js                      | 2 ++
 6 files changed, 7 insertions(+), 6 deletions(-)
 rename src/ui/{main.mjs => layout-service.js} (93%)

diff --git a/src/server.mjs b/src/server.mjs
index 6bc5738..88425e6 100644
--- a/src/server.mjs
+++ b/src/server.mjs
@@ -26,7 +26,6 @@ const server = http.createServer(async (req, res) => {
   if (u.pathname === "/") return streamFile(path.join(UI_DIST_DIR, "index.html"), "text/html", res);
   if (u.pathname === "/bundle.js") return streamFile(path.join(UI_DIST_DIR, "bundle.js"), "text/javascript", res);
   if (u.pathname === "/preview.mjs") return streamFile(path.join(UI_DIR, "preview.mjs"), "text/javascript", res);
-  if (u.pathname === "/main.mjs") return streamFile(path.join(UI_DIR, "main.mjs"), "text/javascript", res);
   if (u.pathname === "/presets.mjs") return streamFile(path.join(UI_DIR, "presets.mjs"), "text/javascript", res);
   if (u.pathname === "/render-preview-frame.mjs") return streamFile(path.join(UI_DIR, "render-preview-frame.mjs"), "text/javascript", res);
   if (u.pathname === "/render-scene.mjs") return streamFile(path.join(__dirname, "render-scene.mjs"), "text/javascript", res);
diff --git a/src/ui/App.js b/src/ui/App.js
index 3802c7b..5424d82 100644
--- a/src/ui/App.js
+++ b/src/ui/App.js
@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useState } from 'react';
-import { run as defaultRun } from './main.mjs';
+import { run as defaultRun } from './layout-service.js';
 import { WebSocketProvider } from './WebSocketContext.js';
 import { ParamsProvider } from './ParamsContext.js';
 import ControlPanel from './ControlPanel.js';
diff --git a/src/ui/main.mjs b/src/ui/layout-service.js
similarity index 93%
rename from src/ui/main.mjs
rename to src/ui/layout-service.js
index 861ede6..6a1e123 100644
--- a/src/ui/main.mjs
+++ b/src/ui/layout-service.js
@@ -1,4 +1,4 @@
-// Rendering is handled by a React component; this module only manages layout and handlers.
+// Layout fetching and runtime handlers for the UI.
 
 function setStatus(doc, msg){
   const el = doc.getElementById("status");
diff --git a/src/ui/readme.md b/src/ui/readme.md
index b13ef31..53ff9e6 100644
--- a/src/ui/readme.md
+++ b/src/ui/readme.md
@@ -4,7 +4,7 @@ Browser interface providing a live preview above a panel of controls.
 
 
 - `index.html` – UI control layout and React mount point for the preview.
-- `main.mjs` – fetches layouts and exposes handlers used by the React app.
+- `layout-service.js` – fetches layouts and exposes handlers used by the React app.
 - `App.js` – top-level React component that invokes `run` and provides context. Optional `runFunction`, `renderFrame`, `shouldAnimate`, `ParamsProviderComponent`, and `WebSocketProviderComponent` props enable injecting test doubles.
 - `CanvasPreview.js` – React component rendering preview canvases and driving the frame loop. Custom `renderFrame` and `shouldAnimate` props allow deterministic frame tests.
 - `main.js` – React entry rendering `<App />`.
diff --git a/src/ui/rendering-pipeline.md b/src/ui/rendering-pipeline.md
index 767a8e0..460f727 100644
--- a/src/ui/rendering-pipeline.md
+++ b/src/ui/rendering-pipeline.md
@@ -7,8 +7,8 @@ The browser preview converts runtime parameters into per-wall frame buffers.
    right `Float32Array` buffers using `renderFrames`.
 3. The buffers are drawn onto paired `<canvas>` elements and optional layout
    overlays.
-4. Layout JSON files are fetched once per side and cached in `main.mjs` to
-   avoid repeated network requests when React reinitializes runtime helpers.
+4. Layout JSON files are fetched once per side and cached in `layout-service.js`
+   to avoid repeated network requests when React reinitializes runtime helpers.
 
 The loop is stateless outside the provided `getParams` callback so React's
 state updates do not spawn extra animation frames.
diff --git a/webpack.config.js b/webpack.config.js
index c0969bd..bf4bb04 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -6,6 +6,8 @@ const currentDirectory = dirname(fileURLToPath(import.meta.url));
 
 export default {
   context: resolve(currentDirectory, 'src/ui'),
+  // main.js mounts the React app; layout-service.js handles layout fetching
+  // and runtime helpers that were previously in main.mjs.
   entry: './main.js',
   output: {
     filename: 'bundle.js',