@fatdoge/wtree 0.1.1 → 0.1.3

package/api/ui/startUiDev.ts

@@ -1,29 +1,10 @@
-import os from 'node:os'
 import path from 'node:path'
-import fs from 'node:fs'
 import { fileURLToPath } from 'node:url'
-import { createServer } from 'vite'
-import type { ViteDevServer } from 'vite'
+import express from 'express'
+import serveStatic from 'serve-static'
 import { createApiApp } from '../createApiApp.js'
 import { openPath } from '../core/open.js'
 
-function findUiRoot(fromDir: string) {
-  let cur = fromDir
-  for (let i = 0; i < 10; i += 1) {
-    const indexHtml = path.join(cur, 'index.html')
-    const viteConfig = path.join(cur, 'vite.config.ts')
-    if (exists(indexHtml) && exists(viteConfig)) return cur
-    const parent = path.dirname(cur)
-    if (parent === cur) break
-    cur = parent
-  }
-  return fromDir
-}
-
-function exists(p: string) {
-  return fs.existsSync(p)
-}
-
 export type UiDevHandle = {
   uiUrl: string
   close: () => Promise<void>
@@ -43,29 +24,100 @@ export async function startUiDevServer(options: {
   await new Promise<void>((resolve) => apiServer.once('listening', () => resolve()))
   const apiAddress = apiServer.address()
   const apiPort = typeof apiAddress === 'object' && apiAddress ? apiAddress.port : 0
+  
+  // Set API URL for UI to consume
   process.env.WTUI_API_URL = `http://127.0.0.1:${apiPort}`
-  process.env.VITE_WTUI_API_URL = process.env.WTUI_API_URL
 
+  // Setup static file serving for UI
   const here = path.dirname(fileURLToPath(import.meta.url))
-  const uiRoot = findUiRoot(path.resolve(here, '..', '..'))
-  const prevCwd = process.cwd()
-  process.chdir(uiRoot)
+  // In production (dist-node/api/ui), UI assets are in ../../dist
+  const distPath = path.resolve(here, '..', '..', 'dist')
+  
+  const uiApp = express()
+  
+  // Proxy API requests to the API server
+  uiApp.use('/api', (req, res) => {
+    // Basic proxy implementation since we are in the same process
+    // But since we have createApiApp, we can just mount it?
+    // Actually createApiApp returns an express app, we can mount it directly.
+    // However, createApiApp includes cors and body parsers which might conflict if mounted twice?
+    // Let's just use the apiApp directly for API requests if possible, 
+    // but here we are starting a separate UI server.
+    // A better approach: merge them into one server.
+    res.redirect(`http://127.0.0.1:${apiPort}/api${req.url}`)
+  })
 
-  const vite: ViteDevServer = await createServer({
-    root: uiRoot,
-    configFile: path.join(uiRoot, 'vite.config.ts'),
-    cacheDir: path.join(os.tmpdir(), 'wtui-vite-cache'),
-    server: {
-      host: '127.0.0.1',
-      port: uiPort,
-      strictPort: false,
-    },
-    clearScreen: false,
-    appType: 'spa',
+  // Serve static files
+  uiApp.use(serveStatic(distPath))
+  
+  // SPA fallback
+  uiApp.get('*', (req, res) => {
+    res.sendFile(path.join(distPath, 'index.html'))
+  })
+
+  // Start UI server
+  // Note: We need to inject the API URL into the HTML or provide it via an endpoint
+  // The current UI implementation uses relative paths /api/..., so we need to proxy /api
+  // Let's rewrite the logic to use a single server for both API and UI
+  
+  const combinedApp = express()
+  
+  // 1. API routes
+  combinedApp.use('/api', createApiApp(() => repoRoot))
+  
+  // 2. Static files
+  combinedApp.use(serveStatic(distPath))
+  
+  // 3. SPA fallback
+  combinedApp.get('*', (req, res) => {
+    res.sendFile(path.join(distPath, 'index.html'))
   })
 
-  await vite.listen()
-  const url = vite.resolvedUrls?.local?.[0] || `http://127.0.0.1:${uiPort}/`
+  // Close the temporary apiServer we created earlier since we are using combinedApp now
+  apiServer.close()
+
+  // Use port 0 if uiPort is not specified or if user wants random port (handled by caller passing 0?)
+  // If uiPort is 5173 (default), we might want to try it, and failover?
+  // But standard express behavior for port 0 is random port.
+  // If user explicitly passed a port, we should use it and fail if taken.
+  // If default (5173), we should probably try it, but if taken, maybe random?
+  // Let's implement simple retry logic or just use random port if default fails?
+  // The current error EADDRINUSE suggests we are forcing 5173.
+  
+  // Let's modify the logic: 
+  // If user provided a specific port (not default 5173 logic), use it.
+  // If we are using default 5173, we can try it, but to be safe and avoid conflicts, 
+  // maybe we should just use port 0 (random) by default unless specified?
+  // Or keep 5173 as preference but fallback to 0 if busy.
+  
+  let finalPort = uiPort
+  let combinedServer: ReturnType<typeof combinedApp.listen>
+
+  try {
+    combinedServer = await startServer(combinedApp, uiPort)
+  } catch (e: unknown) {
+    const err = e as { code?: string }
+    if (err.code === 'EADDRINUSE' && uiPort === 5173 && !options.uiPort) {
+      // Retry with random port if default port 5173 is taken and user didn't force it
+      combinedServer = await startServer(combinedApp, 0)
+      const addr = combinedServer.address()
+      if (typeof addr === 'object' && addr) {
+        finalPort = addr.port
+      }
+    } else {
+      throw e
+    }
+  }
+  
+  // const combinedServer = combinedApp.listen(uiPort, '127.0.0.1')
+  // await new Promise<void>((resolve) => combinedServer.once('listening', () => resolve()))
+  
+  const address = combinedServer.address()
+  if (typeof address === 'object' && address) {
+    finalPort = address.port
+  }
+  
+  const url = `http://127.0.0.1:${finalPort}/`
 
   if (open) {
     openPath(url)
@@ -74,9 +126,15 @@ export async function startUiDevServer(options: {
   return {
     uiUrl: url,
     close: async () => {
-      await vite.close()
-      await new Promise<void>((resolve) => apiServer.close(() => resolve()))
-      process.chdir(prevCwd)
+      await new Promise<void>((resolve) => combinedServer.close(() => resolve()))
     },
   }
 }
+
+function startServer(app: express.Express, port: number): Promise<ReturnType<typeof app.listen>> {
+  return new Promise((resolve, reject) => {
+    const server = app.listen(port, '127.0.0.1')
+    server.once('listening', () => resolve(server))
+    server.once('error', (err) => reject(err))
+  })
+}

package/dist-node/api/ui/startUiDev.js

@@ -1,27 +1,9 @@
-import os from 'node:os';
 import path from 'node:path';
-import fs from 'node:fs';
 import { fileURLToPath } from 'node:url';
-import { createServer } from 'vite';
+import express from 'express';
+import serveStatic from 'serve-static';
 import { createApiApp } from '../createApiApp.js';
 import { openPath } from '../core/open.js';
-function findUiRoot(fromDir) {
-    let cur = fromDir;
-    for (let i = 0; i < 10; i += 1) {
-        const indexHtml = path.join(cur, 'index.html');
-        const viteConfig = path.join(cur, 'vite.config.ts');
-        if (exists(indexHtml) && exists(viteConfig))
-            return cur;
-        const parent = path.dirname(cur);
-        if (parent === cur)
-            break;
-        cur = parent;
-    }
-    return fromDir;
-}
-function exists(p) {
-    return fs.existsSync(p);
-}
 export async function startUiDevServer(options) {
     const repoRoot = options.repoRoot;
     const open = options.open !== false;
@@ -31,35 +13,97 @@ export async function startUiDevServer(options) {
     await new Promise((resolve) => apiServer.once('listening', () => resolve()));
     const apiAddress = apiServer.address();
     const apiPort = typeof apiAddress === 'object' && apiAddress ? apiAddress.port : 0;
+    // Set API URL for UI to consume
     process.env.WTUI_API_URL = `http://127.0.0.1:${apiPort}`;
-    process.env.VITE_WTUI_API_URL = process.env.WTUI_API_URL;
+    // Setup static file serving for UI
     const here = path.dirname(fileURLToPath(import.meta.url));
-    const uiRoot = findUiRoot(path.resolve(here, '..', '..'));
-    const prevCwd = process.cwd();
-    process.chdir(uiRoot);
-    const vite = await createServer({
-        root: uiRoot,
-        configFile: path.join(uiRoot, 'vite.config.ts'),
-        cacheDir: path.join(os.tmpdir(), 'wtui-vite-cache'),
-        server: {
-            host: '127.0.0.1',
-            port: uiPort,
-            strictPort: false,
-        },
-        clearScreen: false,
-        appType: 'spa',
+    // In production (dist-node/api/ui), UI assets are in ../../dist
+    const distPath = path.resolve(here, '..', '..', 'dist');
+    const uiApp = express();
+    // Proxy API requests to the API server
+    uiApp.use('/api', (req, res) => {
+        // Basic proxy implementation since we are in the same process
+        // But since we have createApiApp, we can just mount it?
+        // Actually createApiApp returns an express app, we can mount it directly.
+        // However, createApiApp includes cors and body parsers which might conflict if mounted twice?
+        // Let's just use the apiApp directly for API requests if possible, 
+        // but here we are starting a separate UI server.
+        // A better approach: merge them into one server.
+        res.redirect(`http://127.0.0.1:${apiPort}/api${req.url}`);
+    });
+    // Serve static files
+    uiApp.use(serveStatic(distPath));
+    // SPA fallback
+    uiApp.get('*', (req, res) => {
+        res.sendFile(path.join(distPath, 'index.html'));
+    });
+    // Start UI server
+    // Note: We need to inject the API URL into the HTML or provide it via an endpoint
+    // The current UI implementation uses relative paths /api/..., so we need to proxy /api
+    // Let's rewrite the logic to use a single server for both API and UI
+    const combinedApp = express();
+    // 1. API routes
+    combinedApp.use('/api', createApiApp(() => repoRoot));
+    // 2. Static files
+    combinedApp.use(serveStatic(distPath));
+    // 3. SPA fallback
+    combinedApp.get('*', (req, res) => {
+        res.sendFile(path.join(distPath, 'index.html'));
     });
-    await vite.listen();
-    const url = vite.resolvedUrls?.local?.[0] || `http://127.0.0.1:${uiPort}/`;
+    // Close the temporary apiServer we created earlier since we are using combinedApp now
+    apiServer.close();
+    // Use port 0 if uiPort is not specified or if user wants random port (handled by caller passing 0?)
+    // If uiPort is 5173 (default), we might want to try it, and failover?
+    // But standard express behavior for port 0 is random port.
+    // If user explicitly passed a port, we should use it and fail if taken.
+    // If default (5173), we should probably try it, but if taken, maybe random?
+    // Let's implement simple retry logic or just use random port if default fails?
+    // The current error EADDRINUSE suggests we are forcing 5173.
+    // Let's modify the logic: 
+    // If user provided a specific port (not default 5173 logic), use it.
+    // If we are using default 5173, we can try it, but to be safe and avoid conflicts, 
+    // maybe we should just use port 0 (random) by default unless specified?
+    // Or keep 5173 as preference but fallback to 0 if busy.
+    let finalPort = uiPort;
+    let combinedServer;
+    try {
+        combinedServer = await startServer(combinedApp, uiPort);
+    }
+    catch (e) {
+        const err = e;
+        if (err.code === 'EADDRINUSE' && uiPort === 5173 && !options.uiPort) {
+            // Retry with random port if default port 5173 is taken and user didn't force it
+            combinedServer = await startServer(combinedApp, 0);
+            const addr = combinedServer.address();
+            if (typeof addr === 'object' && addr) {
+                finalPort = addr.port;
+            }
+        }
+        else {
+            throw e;
+        }
+    }
+    // const combinedServer = combinedApp.listen(uiPort, '127.0.0.1')
+    // await new Promise<void>((resolve) => combinedServer.once('listening', () => resolve()))
+    const address = combinedServer.address();
+    if (typeof address === 'object' && address) {
+        finalPort = address.port;
+    }
+    const url = `http://127.0.0.1:${finalPort}/`;
     if (open) {
         openPath(url);
     }
     return {
         uiUrl: url,
         close: async () => {
-            await vite.close();
-            await new Promise((resolve) => apiServer.close(() => resolve()));
-            process.chdir(prevCwd);
+            await new Promise((resolve) => combinedServer.close(() => resolve()));
         },
     };
 }
+function startServer(app, port) {
+    return new Promise((resolve, reject) => {
+        const server = app.listen(port, '127.0.0.1');
+        server.once('listening', () => resolve(server));
+        server.once('error', (err) => reject(err));
+    });
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fatdoge/wtree",
   "private": false,
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "CLI + UI tool for managing git worktrees",
   "keywords": [
     "git",
@@ -67,6 +67,7 @@
     "react-dom": "^18.3.1",
     "react-i18next": "^16.5.7",
     "react-router-dom": "^7.3.0",
+    "serve-static": "^2.2.1",
     "tailwind-merge": "^3.0.2",
     "tailwindcss": "^3.4.17",
     "vite": "^6.3.5",
@@ -81,6 +82,7 @@
     "@types/node": "^22.15.30",
     "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",
+    "@types/serve-static": "^2.2.0",
     "@vercel/node": "^5.3.6",
     "babel-plugin-react-dev-locator": "^1.0.0",
     "concurrently": "^9.2.0",