reroute-js 0.30.2 → 0.31.0

package/README.md

@@ -1588,7 +1588,6 @@ new Elysia()
 # Browser telemetry packages
 bun add @opentelemetry/api \
   @opentelemetry/auto-instrumentations-web \
-  @opentelemetry/context-zone \
   @opentelemetry/exporter-trace-otlp-http \
   @opentelemetry/instrumentation \
   @opentelemetry/resources \

package/cli/bin.d.ts

@@ -1,5 +1,5 @@
 /**
- * reroute-js v0.30.2
+ * reroute-js v0.31.0
  *
  * @license MIT
  * @copyright 2025 stewones <hi@stewan.io>

package/cli/bin.js

@@ -1,7 +1,7 @@
 #!/usr/bin/env bun
 // @bun
 /**
- * reroute-js v0.30.2
+ * reroute-js v0.31.0
  *
  * @license MIT
  * @copyright 2025 stewones <hi@stewan.io>
@@ -48,7 +48,7 @@ async function getVersionString() {
 }
 async function getVersion() {
   if (true) {
-    return "0.30.2";
+    return "0.31.0";
   }
   const possiblePaths = [
     path.join(import.meta.dir, "../../../../package.json"),
@@ -66,7 +66,7 @@ async function getVersion() {
 }
 async function getCommit() {
   if (true) {
-    return "c247d2d";
+    return "6490560";
   }
   return "dev";
 }
@@ -3748,7 +3748,8 @@ async function renderOGImageToPNG(Component, props, options = {}) {
     const element = createElement(Component, props);
     const imageResponse = new ImageResponse(element, {
       width,
-      height
+      height,
+      fonts: options.fonts
     });
     const arrayBuffer = await imageResponse.arrayBuffer();
     return Buffer.from(arrayBuffer);
@@ -6211,6 +6212,24 @@ async function scan404Files(dir, base = "") {
   }
   return files;
 }
+async function scanOgFiles(dir, base = "") {
+  const files = [];
+  const entries = await readdir5(dir, { withFileTypes: true });
+  for (const entry of entries) {
+    const fullPath = join9(dir, entry.name);
+    const relativePath = join9(base, entry.name);
+    if (entry.isDirectory()) {
+      if (entry.name === "content")
+        continue;
+      const nested = await scanOgFiles(fullPath, relativePath);
+      files.push(...nested);
+    } else if (entry.isFile()) {
+      if (/^\[og]\.(tsx|ts)$/.test(entry.name))
+        files.push(relativePath);
+    }
+  }
+  return files;
+}
 function fileToRoute(filePath) {
   const isLayout = filePath.endsWith("[layout].tsx") || filePath.endsWith("[layout].ts") || filePath.endsWith("[layout].md") || filePath.endsWith("[layout].mdx");
   let routePath = filePath.replace(/\.(tsx|ts|md|mdx)$/, "");
@@ -7153,6 +7172,19 @@ async function generate(cwd, args = [], options = {}) {
     const appPath = config2.options.app.startsWith(".") ? `../${config2.options.app}` : config2.options.app;
     indexLines.push(`import AppComponent from '${appPath}';`);
   }
+  if (config2.ogImage?.defaultTemplate && config2.ogImage.defaultTemplate !== "default") {
+    const ogTemplatePath = config2.ogImage.defaultTemplate.startsWith(".") ? `../${config2.ogImage.defaultTemplate}` : config2.ogImage.defaultTemplate;
+    indexLines.push(`import OGTemplate from '${ogTemplatePath}';`);
+  }
+  const ogFiles = await scanOgFiles(join9(cwd, ROUTES_DIR));
+  const ogImports = [];
+  for (let i = 0;i < ogFiles.length; i++) {
+    const ogFile = ogFiles[i];
+    const importName = `OGRoute${i}`;
+    const importPath = `../src/client/routes/${ogFile.replace(/\.(tsx|ts)$/, "")}`;
+    indexLines.push(`import ${importName} from '${importPath}';`);
+    ogImports.push({ path: ogFile, name: importName });
+  }
   indexLines.push("");
   indexLines.push("export const bundle = {");
   indexLines.push("  layouts,");
@@ -7165,12 +7197,31 @@ async function generate(cwd, args = [], options = {}) {
   if (config2.options?.app) {
     indexLines.push("  AppComponent,");
   }
+  if (config2.ogImage?.defaultTemplate && config2.ogImage.defaultTemplate !== "default") {
+    indexLines.push("  OGTemplate,");
+  }
   indexLines.push("} as const;");
   if (config2.options?.app) {
     indexLines.push("");
     indexLines.push("// Set global for compiled binary SSR support");
     indexLines.push("(globalThis as any).__REROUTE_APP_COMPONENT__ = AppComponent;");
   }
+  if (config2.ogImage?.defaultTemplate && config2.ogImage.defaultTemplate !== "default") {
+    indexLines.push("");
+    indexLines.push("// Set global for compiled binary OG template support");
+    indexLines.push("(globalThis as any).__REROUTE_OG_TEMPLATE__ = OGTemplate;");
+  }
+  if (ogImports.length > 0) {
+    indexLines.push("");
+    indexLines.push("// Route-specific OG templates for compiled binary support");
+    indexLines.push("(globalThis as any).__REROUTE_OG_ROUTES__ = {");
+    for (const { path: path3, name } of ogImports) {
+      const routePath = path3.replace(/\/?\[og]\.(tsx|ts)$/, "").replace(/\\/g, "/");
+      const normalizedPath = routePath ? `/${routePath}` : "/";
+      indexLines.push(`  '${normalizedPath}': ${name},`);
+    }
+    indexLines.push("};");
+  }
   const templatePath = join9(cwd, "src", "client", "index.html");
   try {
     const templateContent = await Bun.file(templatePath).text();
@@ -102560,6 +102611,17 @@ function cleanDistFolder(cwd) {
     rmSync(distDir, { recursive: true });
   }
 }
+async function cleanRerouteFolder(cwd) {
+  const rerouteDir = join13(cwd, ".reroute");
+  if (existsSync9(rerouteDir)) {
+    process.stdout.write(colorizeLogPrefixAnsi(`[reroute/build] Cleaning .reroute folder...
+`));
+    rmSync(rerouteDir, { recursive: true, force: true });
+    await new Promise((resolve2) => setTimeout(resolve2, 100));
+    process.stdout.write(colorizeLogPrefixAnsi(`[reroute/build] ✓ .reroute folder cleaned
+`));
+  }
+}
 function createOutputHandler(genBuffer) {
   return (data) => {
     const text = genBuffer.current + data.toString();
@@ -102616,7 +102678,12 @@ async function copyAssets(cwd) {
   }
 }
 async function buildBundle(cwd, buildArgs) {
-  const external = ["sharp", "@opentelemetry/*", ...buildArgs.externalArgs];
+  const external = [
+    "sharp",
+    "@opentelemetry/*",
+    "@vercel/og",
+    ...buildArgs.externalArgs
+  ];
   const buildResult = await Bun.build({
     entrypoints: [join13(cwd, ".reroute/entry.ts")],
     target: "bun",
@@ -102701,6 +102768,7 @@ async function build(args) {
   try {
     const buildStartTime = performance.now();
     cleanDistFolder(cwd);
+    await cleanRerouteFolder(cwd);
     const rerouteCmd = getRerouteCommand3();
     const useShell = rerouteCmd.includes(" ");
     await runGenCommand(rerouteCmd, useShell, buildArgs.noCompression);
@@ -104986,24 +105054,46 @@ __export(exports_og, {
 import { spawn as spawn5 } from "node:child_process";
 import { readdir as readdir7 } from "node:fs/promises";
 import { join as join16 } from "node:path";
-async function findAvailablePort() {
-  const server2 = Bun.serve({
-    port: 0,
-    fetch: () => new Response("test")
-  });
-  const port = server2.port;
-  server2.stop();
-  if (!port) {
-    throw new Error("Failed to allocate port");
+function getPortFromConfig(baseUrl) {
+  if (!baseUrl)
+    return 3000;
+  try {
+    const url = new URL(baseUrl);
+    return url.port ? parseInt(url.port, 10) : url.protocol === "https:" ? 443 : 80;
+  } catch {
+    return 3000;
   }
-  return port;
 }
-async function startServer(cwd) {
-  const port = await findAvailablePort();
-  console.log(`\uD83D\uDE80 Starting server on port ${port}...`);
-  const proc = spawn5("reroute", ["start"], {
+async function killProcessOnPort(port) {
+  try {
+    const proc = spawn5("bunx", ["kill-port", String(port)], {
+      stdio: "ignore"
+    });
+    await new Promise((resolve2) => {
+      proc.on("close", () => resolve2());
+    });
+  } catch {}
+}
+async function isServerRunning(port) {
+  try {
+    const response = await fetch(`http://localhost:${port}`, {
+      signal: AbortSignal.timeout(1000)
+    });
+    return response.ok || response.status < 500;
+  } catch {
+    return false;
+  }
+}
+async function ensureServer(cwd, port) {
+  const alreadyRunning = await isServerRunning(port);
+  if (alreadyRunning) {
+    console.log(`✅ Dev server already running at http://localhost:${port}
+`);
+    return { port, process: null, wasAlreadyRunning: true };
+  }
+  console.log(`\uD83D\uDE80 Starting dev server on port ${port}...`);
+  const proc = spawn5("reroute", ["dev"], {
     cwd,
-    env: { ...process.env, PORT: String(port) },
     stdio: ["ignore", "pipe", "pipe"],
     detached: false
   });
@@ -105012,7 +105102,7 @@ async function startServer(cwd) {
   proc.stderr?.on("data", (data) => {
     errorOutput += data.toString();
   });
-  for (let i = 0;i < 40; i++) {
+  for (let i = 0;i < 60; i++) {
     await Bun.sleep(500);
     try {
       const response = await fetch(`http://localhost:${port}`, {
@@ -105034,9 +105124,9 @@ async function startServer(cwd) {
       console.error(`
 Error output:`, errorOutput);
     }
-    throw new Error("Server failed to start within 20 seconds");
+    throw new Error("Server failed to start within 30 seconds");
   }
-  return { port, process: proc };
+  return { port, process: proc, wasAlreadyRunning: false };
 }
 async function scanForOgTemplates(dir, base, routes) {
   try {
@@ -105079,11 +105169,24 @@ async function addContentRoutes(routesPath, routes) {
   } catch {}
 }
 async function findRoutesWithOG(cwd) {
-  const routesPath = join16(cwd, ROUTES_DIR2);
   const routes = [];
-  await scanForOgTemplates(routesPath, "", routes);
-  await addContentRoutes(routesPath, routes);
-  return routes.sort();
+  try {
+    const manifestPath = join16(cwd, ".reroute", "manifest.json");
+    const manifestFile = Bun.file(manifestPath);
+    const manifest = await manifestFile.json();
+    if (manifest.staticRoutes && Array.isArray(manifest.staticRoutes)) {
+      routes.push(...manifest.staticRoutes);
+    }
+    if (manifest.contentRoutes && Array.isArray(manifest.contentRoutes)) {
+      routes.push(...manifest.contentRoutes);
+    }
+  } catch {
+    console.warn("⚠️  .reroute/manifest.json not found, scanning routes directory...");
+    const routesPath = join16(cwd, ROUTES_DIR2);
+    await scanForOgTemplates(routesPath, "", routes);
+    await addContentRoutes(routesPath, routes);
+  }
+  return Array.from(new Set(routes)).sort();
 }
 function openInBrowser(url) {
   const platform = process.platform;
@@ -105114,30 +105217,41 @@ ogImage: {
 `);
   const routes = await findRoutesWithOG(cwd);
   if (routes.length === 0) {
-    console.error("❌ No routes with [og].tsx templates found");
+    console.error("❌ No routes found for OG image generation");
     console.log(`
-Create an [og].tsx file in your routes directory to generate OG images.`);
+Make sure you have:`);
+    console.log("  1. Routes defined in src/client/routes/");
+    console.log("  2. Run `reroute dev` or `reroute build` first to generate .reroute/manifest.json");
+    console.log(`
+Or create [og].tsx files in your routes for custom OG templates.`);
     process.exit(1);
   }
-  console.log(`Found ${routes.length} route(s):
+  console.log(`Found ${routes.length} route(s) with OG images
 `);
+  const port = getPortFromConfig(config2.ogImage?.baseUrl);
   let server2;
   try {
-    server2 = await startServer(cwd);
+    server2 = await ensureServer(cwd, port);
   } catch (error) {
     console.error("❌ Failed to start server:", error);
-    console.log("\nMake sure your server is configured and can start with `bun run start`");
+    console.log("\nMake sure your dev server can start with `reroute dev`");
     process.exit(1);
   }
-  const { port, process: serverProcess } = server2;
+  const { process: serverProcess } = server2;
   const cleanup = () => {
     console.log(`
 
-\uD83D\uDED1 Shutting down server...`);
-    try {
-      serverProcess.kill("SIGTERM");
-    } catch {}
-    process.exit(0);
+\uD83D\uDED1 Shutting down dev server...`);
+    if (serverProcess) {
+      try {
+        serverProcess.kill("SIGTERM");
+      } catch {}
+    }
+    killProcessOnPort(port).then(() => {
+      process.exit(0);
+    }).catch(() => {
+      process.exit(0);
+    });
   };
   process.on("SIGINT", cleanup);
   process.on("SIGTERM", cleanup);
@@ -105160,7 +105274,7 @@ Create an [og].tsx file in your routes directory to generate OG images.`);
     parent: screen,
     top: "center",
     left: "center",
-    width: "80%",
+    width: "95%",
     height: "80%",
     border: {
       type: "line"
@@ -105177,8 +105291,15 @@ Create an [og].tsx file in your routes directory to generate OG images.`);
     keys: true,
     vi: true,
     mouse: true,
-    label: " Select a route to preview its OG image ",
-    items: routes
+    scrollbar: {
+      ch: " ",
+      style: {
+        bg: "blue"
+      }
+    },
+    label: ` Select a route to preview its OG image (${routes.length} routes) `,
+    items: routes,
+    tags: true
   });
   const statusBox = blessed.box({
     parent: screen,
@@ -105192,12 +105313,11 @@ Create an [og].tsx file in your routes directory to generate OG images.`);
       bg: "blue"
     }
   });
-  let openedCount = 0;
   list.on("select", (_item, index) => {
     const selectedRoute = routes[index];
     const ogUrl = `http://localhost:${port}/__reroute_og${selectedRoute === "/" ? "/index" : selectedRoute}.png`;
-    openedCount++;
-    statusBox.setContent(` Opened: ${selectedRoute} (${openedCount} preview${openedCount > 1 ? "s" : ""}) | Press Enter for more | q/Esc to quit `);
+    const displayUrl = ogUrl.length > 120 ? `${ogUrl.substring(0, 117)}...` : ogUrl;
+    statusBox.setContent(` Opening: ${displayUrl} | Press Enter for more | q/Esc to quit `);
     screen.render();
     openInBrowser(ogUrl);
   });
@@ -105314,7 +105434,7 @@ async function getVersionString2() {
 }
 async function getVersion2() {
   if (true) {
-    return "0.30.2";
+    return "0.31.0";
   }
   const possiblePaths = [
     path3.join(import.meta.dir, "../../../package.json"),
@@ -105331,10 +105451,10 @@ async function getVersion2() {
 }
 async function getCommit2() {
   if (true) {
-    return "c247d2d";
+    return "6490560";
   }
   return "dev";
 }
 main();
 
-//# debugId=CC6F7F9CBCC6CB6B64756E2164756E21
+//# debugId=9B655B997A9BB54164756E2164756E21