@zyrab/domo-ssg 0.6.0 → 0.7.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zyrab/domo-ssg",
-  "version": "0.6.0",
+  "version": "0.7.1",
   "description": "A Static Site Generator (SSG) for Domo-based projects.",
   "main": "src/index.js",
   "type": "module",
@@ -17,13 +17,13 @@
   "author": "Zyrab",
   "license": "MIT",
   "peerDependencies": {
-    "@zyrab/domo": "^1.4.0",
     "@zyrab/domo-og": "0.2.1",
+    "@zyrab/domo": "^1.5.0",
     "@zyrab/domo-router": "^0.3.1"
   },
   "devDependencies": {
     "esbuild": "^0.20.0",
-    "@zyrab/domo": "^1.4.0"
+    "@zyrab/domo": "^1.5.0"
   },
   "publishConfig": {
     "access": "public"

package/src/Registry.js

@@ -0,0 +1,17 @@
+// src/registry.js
+class BuildRegistry {
+  constructor() {
+    this.routePaths = {};
+  }
+
+  setRoutes(routes) {
+    this.routePaths = routes;
+  }
+
+  getRoute(name) {
+    return this.routePaths[name];
+  }
+}
+
+// Export a single instance to be shared across the build process
+export const registry = new BuildRegistry();

package/src/config.js

@@ -10,10 +10,15 @@ export async function loadConfig() {
 
   const defaultConfig = {
     outDir: "./dist",
+    scanDir: "./src",
     routesFile: "./routes.js",
     layout: "./layout.js",
     lang: "en",
     author: "Zyrab",
+    assetsDir: [
+      { current: "src/assets", final: "assets" },
+      { current: "src/styles", final: "styles" },
+    ],
     exclude: ["css", "js", "assets", "robots.txt", "admin"],
     baseUrl: "http://localhost:3000",
   };

package/src/event-extraction.js

@@ -1,107 +1,162 @@
 /**
  * @file event_extraction.js
- * @description Logic for extracting events, state, and references for SSG/SPA bundling.
  */
-
 import { createHash } from "crypto";
+import { resolve } from "path";
+import { registry } from "./Registry.js";
+import { formatComponentName } from "./utils.js";
+
+const indent = (code, spaces = 2) =>
+  code
+    .split("\n")
+    .map((line) => " ".repeat(spaces) + line)
+    .join("\n");
+
+function destructureFunction(fnSource) {
+  const match =
+    fnSource.match(/^(?:async\s+)?(?:\([^)]*\)|[a-zA-Z0-9_$]+)\s*=>\s*\{?([\s\S]*?)\}?$/) ||
+    fnSource.match(/^(?:async\s+)?function\s*[^(]*\([^)]*\)\s*\{([\s\S]*)\}$/);
+
+  const nameMatch = fnSource.match(/function\s+([a-zA-Z0-9_$]+)/);
+
+  return {
+    name: nameMatch ? nameMatch[1] : null,
+    body: match ? match[1].trim() : fnSource.trim(),
+  };
+}
 
 /**
- * Normalizes a function for the client.
- * Handlers will use 'state' and 'target' identifiers which are
- * consistently minified by esbuild alongside the listener scope.
+ * NEW HELPER: Analyzes ANY handler (event or ref) and figures out
+ * if it needs to be imported, inlined as a closure, or stringified.
  */
-function transformHandler(handlerInfo) {
-  const { type, selector, handler, name } = handlerInfo;
-  let body = "";
-  let fnSource = handler.toString();
-
-  const isExternal = handlerInfo.path !== null;
-
-  if (isExternal) {
-    // If it's a named function from an external file, we just call it.
-    body = `${name}(e${type !== "direct" ? ", target" : ""});`;
-  } else {
-    // Extract body from anonymous/inline function
-    const match =
-      fnSource.match(/^(?:async\s+)?(?:\([^)]*\)|[a-zA-Z0-9_$]+)\s*=>\s*\{?([\s\S]*?)\}?$/) ||
-      fnSource.match(/^(?:async\s+)?function\s*[^(]*\([^)]*\)\s*\{([\s\S]*)\}$/);
-    body = match ? match[1].trim() : fnSource;
-  }
+function resolveDependency(handlerObj) {
+  const { handler, path: providedPath, name: providedName } = handlerObj;
+  const fnSource = handler.toString();
+  const { name: extractedName, body } = destructureFunction(fnSource);
 
-  // Wrap in blocks to isolate 'target'.
-  if (type === "closest") {
-    return `{\n    const target = e.target.closest("${selector}");\n    if (target) {\n      ${body}\n    }\n  }`;
-  }
+  let funcName = providedName || handler.name || extractedName;
 
-  if (type === "match") {
-    return `{\n    if (e.target.matches("${selector}")) {\n      const target = e.target;\n      ${body}\n    }\n  }`;
+  // Ignore auto-inferred object keys like "#box" or ".btn"
+  if (funcName && !/^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(funcName)) {
+    funcName = null;
   }
 
-  return body;
-}
-function transformRef(refInfo) {
-  const { handler, name } = refInfo;
-  let fnSource = handler.toString();
+  let resolvedPath = providedPath;
 
-  // Extract the body of the ref callback
-  const match =
-    fnSource.match(/^(?:async\s+)?(?:\([^)]*\)|[a-zA-Z0-9_$]+)\s*=>\s*\{?([\s\S]*?)\}?$/) ||
-    fnSource.match(/^(?:async\s+)?function\s*[^(]*\([^)]*\)\s*\{([\s\S]*)\}$/);
-  const body = match ? match[1].trim() : fnSource;
+  // Registry lookup
+  if (!resolvedPath && funcName) {
+    const fileKey = formatComponentName(funcName);
+    const lookupPath = registry.getRoute(fileKey);
+    if (lookupPath) resolvedPath = lookupPath;
+  }
 
-  return `{\n    const el = document.getElementById("${refInfo.id}");\n    if (el) {\n      const callback = (el) => { ${body} };\n      callback(el);\n    }\n  }`;
+  return { funcName, resolvedPath, fnSource, body };
 }
 
-/**
- * Generates the ESM content for a specific element's events.
- */
-export function generateElementScript(id, events, states, refs) {
+export function generateElementScript(id, events = [], states = {}, refs = []) {
   const imports = new Map();
+  const closureFunctions = [];
   const listeners = [];
-  const refLogics = [];
+  let matchCounter = 0;
 
+  // 1. Process Events
   events.forEach(({ event, handlers }) => {
-    const logicBlocks = handlers
-      .map((h) => {
-        if (h.path) {
-          if (!imports.has(h.path)) imports.set(h.path, new Set());
-          imports.get(h.path).add(h.name);
+    const logicLines = [];
+
+    handlers.forEach((h) => {
+      const { type, selector } = h;
+
+      // Use our new smart helper!
+      const { funcName, resolvedPath, fnSource, body } = resolveDependency(h);
+
+      // Register imports or closures globally for this file BEFORE writing logic
+      if (resolvedPath) {
+        if (!imports.has(resolvedPath)) imports.set(resolvedPath, new Set());
+        imports.get(resolvedPath).add(funcName);
+      } else if (funcName) {
+        closureFunctions.push(fnSource);
+      }
+
+      // ---> BUILD THE LOGIC LINES <---
+      if (type === "closest") {
+        const matchVar = `match${++matchCounter}`;
+        logicLines.push(`const ${matchVar} = e.target.closest("${selector}");`);
+
+        if (resolvedPath || funcName) {
+          logicLines.push(`if (${matchVar}) ${funcName}(e, ${matchVar});`);
+        } else {
+          const adjustedBody = body.replace(/\btarget\b/g, matchVar);
+          logicLines.push(`if (${matchVar}) {\n${indent(adjustedBody, 2)}\n}`);
         }
-        return transformHandler(h);
-      })
-      .join("\n    ");
-
-    // We inject the state declaration as a plain string at the top of the listener.
-    // Because esbuild parses this whole block, it will minify the identifier 'state'
-    // to the same name used in the 'logicBlocks' (e.g., const n = ...; n.toggled = ...).
-    const stateInclusion =
-      states && Object.keys(states).length
-        ? Object.entries(states)
-            .map(([key, val]) => `let ${key} = ${JSON.stringify(val)};`)
-            .join("\n")
-        : "";
-
-    listeners.push(
-      `${stateInclusion}\n  document.getElementById("${id}").addEventListener("${event}", async (e) => {${logicBlocks}\n  });`,
-    );
-  });
-  refs.forEach((r) => {
-    refLogics.push(transformRef({ ...r, id }));
+      } else if (type === "match") {
+        const matchExpr = `e.target.matches("${selector}")`;
+
+        if (resolvedPath || funcName) {
+          logicLines.push(`if (${matchExpr}) ${funcName}(e, e.target);`);
+        } else {
+          const adjustedBody = body.replace(/\btarget\b/g, "e.target");
+          logicLines.push(`if (${matchExpr}) {\n${indent(adjustedBody, 2)}\n}`);
+        }
+      } else if (type === "direct") {
+        // THIS COVERS YOUR .on() METHODS
+        if (resolvedPath || funcName) {
+          logicLines.push(`${funcName}(e);`);
+        } else {
+          logicLines.push(body);
+        }
+      }
+    });
+
+    const handlerBody = `async function(e) { e.pre\n${indent(logicLines.join("\n"), 1)}\n}`;
+    listeners.push(`document.querySelector('[data-domo-id="${id}"]').addEventListener("${event}", ${handlerBody});`);
   });
 
+  // 2. Process Refs (Now using the exact same smart lookup!)
+  const refLogics = refs
+    .map((r) => {
+      const { funcName, resolvedPath, fnSource, body } = resolveDependency(r);
+
+      // Track imports/closures just like events
+      if (resolvedPath) {
+        if (!imports.has(resolvedPath)) imports.set(resolvedPath, new Set());
+        imports.get(resolvedPath).add(funcName);
+      } else if (funcName) {
+        closureFunctions.push(fnSource);
+      }
+
+      // Output the Ref logic
+      if (resolvedPath || funcName) {
+        // If it's a named/imported function, pass the element to it: myRefFunction(el)
+        return `{\n  const el = document.querySelector('[data-domo-id="${id}"]');\n  if (el) ${funcName}(el);\n}`;
+      } else {
+        // If anonymous, inline the body
+        return `{\n  const el = document.querySelector('[data-domo-id="${id}"]');\n  if (el) {\n${indent(body, 4)}\n  }\n}`;
+      }
+    })
+    .join("\n");
+
+  // 3. Assemble State
+  const stateInclusion = Object.entries(states)
+    .map(([key, val]) => `let ${key} = ${JSON.stringify(val)};`)
+    .join("\n");
+
+  // 4. Assemble Imports
   let importStr = "";
-
   for (const [path, names] of imports) {
-    importStr += `import { ${[...names].join(", ")} } from "${path}";\n`;
+    const absolutePath = resolve(process.cwd(), path).replace(/\\/g, "/");
+    importStr += `import { ${[...names].join(", ")} } from "${absolutePath}";\n`;
   }
-  const combinedLogic = [...refLogics, ...listeners].join("\n");
 
-  return `${importStr}\n(function() {\n${combinedLogic}\n})();`;
+  // 5. Final Assembly
+  const closures = closureFunctions.length
+    ? `\n\n// Inline Functions\n${indent(closureFunctions.join("\n\n"), 2)}`
+    : "";
+
+  const combinedLogic = [stateInclusion, refLogics, ...listeners].filter(Boolean).join("\n\n");
+
+  return `${importStr}{\n${indent(combinedLogic, 2)}${closures}\n}`.trim();
 }
 
-/**
- * Hash helper for caching
- */
 export function getHash(content) {
   return createHash("sha1").update(content).digest("hex").slice(0, 8);
 }

package/src/event-utils.js

@@ -1,8 +1,11 @@
 import { writeFileSync, mkdirSync, existsSync, rmSync, readFileSync } from "fs";
-import { join, dirname, relative } from "path";
+import { join, dirname, resolve } from "path";
 import { fileURLToPath, pathToFileURL } from "url";
 import { build } from "esbuild";
+import { createRequire } from "module";
 import { generateElementScript, getHash } from "./event-extraction.js";
+import { registry } from "./Registry.js";
+import { formatComponentName } from "./utils.js";
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
 const require = createRequire(import.meta.url);
@@ -24,14 +27,16 @@ const cache = {
 };
 
 /**
- * Plugin to convert imports of 'domo' into the global 'Domo' variable
+ * Converts a function name to your file naming convention based on strict patterns.
+ * @param {string} funcName - e.g., "createHeader", "createPreviewPage", "copyCode"
+ * @returns {string} - e.g., "header", "preview-page", "handle-copy-code"
  */
-const makeDomoExternalPlugin = {
-  name: "domo-external",
+const rewriteDomoPlugin = {
+  name: "rewrite-domo",
   setup(build) {
-    // Intercept any import relating to domo
-    build.onResolve({ filter: /^domo$|^@zyrab\/domo/ }, (args) => {
-      return { path: args.path, external: true };
+    build.onResolve({ filter: /^@zyrab\/domo$|^domo$/ }, (args) => {
+      // Points the browser to your pre-bundled runtime
+      return { path: "/js/domo.runtime.js", external: true };
     });
   },
 };
@@ -53,13 +58,22 @@ export function collectMetadata(node, out = { events: [], islands: [] }) {
     });
   }
 
-  if (el?._island) {
-    out.islands.push({
-      id: el._attr["data-domo-id"] || el._attr["id"],
-      path: el.__file,
-    });
-  }
+  if (el?._island && el?.__island) {
+    const rawName = el.__island.name; // e.g., "createPreviewPage"
+    const fileKey = formatComponentName(rawName); // "preview-page"
 
+    // Look up the exact file path from your singleton
+    const filePath = registry.getRoute(fileKey);
+
+    if (!filePath) {
+      console.warn(`[Domo-SSG] Could not find file for island component: ${rawName}`);
+    } else {
+      out.islands.push({
+        id: el._attr["data-domo-id"] || el._attr["id"],
+        path: filePath,
+      });
+    }
+  }
   if (Array.isArray(el?._child)) {
     for (const child of el._child) {
       collectMetadata(child, out);
@@ -81,9 +95,8 @@ async function bundleRuntime(outputDir) {
   await build({
     entryPoints: [DOMO_CLIENT_SOURCE],
     bundle: true,
-    minify: false,
-    format: "iife",
-    globalName: "Domo",
+    minify: true,
+    format: "esm",
     outfile: out,
     platform: "browser",
   });
@@ -113,9 +126,13 @@ async function bundleEvents(metadata, jsDir, tempDir) {
   await build({
     entryPoints: [entry],
     bundle: true,
-    minify: false,
-    format: "iife",
+    minify: true,
+    format: "esm",
     outfile: join(jsDir, file),
+    packages: "external",
+
+    plugins: [rewriteDomoPlugin], // Injects our Domo rewrite
+
     platform: "browser",
   });
 
@@ -125,62 +142,76 @@ async function bundleEvents(metadata, jsDir, tempDir) {
   return file;
 }
 
-/**
- * Bundle islands (deduped by CONTENT, not path)
- */
 async function bundleIslands(metadata, jsDir, tempDir) {
-  const results = [];
   const islandsToBundle = metadata.islands.filter((i) => i.path);
+  if (islandsToBundle.length === 0) return [];
+
+  const entryPoints = {};
+
+  // Create wrappers for the islands
+  for (const island of islandsToBundle) {
+    const { path: filePath, id } = island;
+    const content = readFileSync(filePath, "utf8");
+    const hash = getHash(content);
+
+    const entryPath = join(tempDir, `${hash}.entry.js`);
+    const absolutePath = resolve(process.cwd(), filePath).replace(/\\/g, "/");
+
+    const wrapper = `
+      import Island from "${absolutePath}";
+
+      const el = document.querySelector('[data-domo-id="${id}"]');
+      if (el) {
+        const instance = Island();
+        if (instance && instance._isDomo) {
+          el.appendChild(instance.build());
+        } else if (instance instanceof DocumentFragment || instance instanceof HTMLElement) {
+          el.appendChild(instance);
+        }
+      }
+    `;
 
-  await Promise.all(
-    islandsToBundle.map(async (island) => {
-      const { path: filePath, id } = island;
-      const content = readFileSync(filePath, "utf8");
-      const hash = getHash(content);
+    writeFileSync(entryPath, wrapper, "utf8");
 
-      if (cache.islands.has(hash)) {
-        results.push({ path: filePath, file: cache.islands.get(hash) });
-        return;
-      }
+    // Outputs to: dist/js/islands/hash.js
+    entryPoints[`islands/${hash}`] = entryPath;
+  }
 
-      const file = `${hash}.island.js`;
-      const entryPath = join(tempDir, `${hash}.island.entry.js`);
-
-      // wrapper: hydrate island at the correct element
-      const wrapper = `
-            import Island from "${filePath.replace(/\\/g, "/")}";
-
-            (function() {
-              const el = document.querySelector('[data-domo-id="${id}"]');
-              if (el) {
-                const instance = Island();
-                if (instance && instance._isDomo) {
-                  const built = instance.build();
-                  el.replaceWith(built);
-                }
-              }
-            })();
-            `;
-
-      writeFileSync(entryPath, wrapper, "utf8");
-
-      await build({
-        entryPoints: [entryPath],
-        bundle: true,
-        minify: false,
-        format: "iife",
-        outfile: join(jsDir, file),
-        platform: "browser",
-        plugins: [makeDomoExternalPlugin],
-      });
+  // 2. The Modern esbuild Call
+  const result = await build({
+    entryPoints,
+    bundle: true,
+    splitting: true,
+    minify: true,
+    format: "esm",
+    outdir: jsDir,
+
+    // --> THE MAGIC BULLET FOR NPM PACKAGES <--
+    packages: "external",
+
+    plugins: [rewriteDomoPlugin], // Injects our Domo rewrite
 
-      rmSync(entryPath);
-      cache.islands.set(hash, file);
-      results.push({ path: filePath, file });
-    }),
-  );
+    // Tells esbuild how to name the shared files so it looks like your project
+    // instead of random chunk strings
+    chunkNames: "components/[name]-[hash]",
 
-  return results;
+    metafile: true,
+    platform: "browser",
+  });
+
+  // Clean up temp files
+  Object.values(entryPoints).forEach((entryPath) => rmSync(entryPath));
+
+  // Extract generated paths for injection
+  const allGeneratedPaths = Object.keys(result.metafile.outputs).map((filePath) => {
+    const relativeToDist = filePath.replace(/\\/g, "/").split("/").slice(1).join("/");
+    let path = `/${relativeToDist}`;
+
+    // 3. Remove "js/" specifically if it appears immediately after the leading slash
+    // This transforms "/js/main.js" -> "/main.js"
+    return path.replace(/^\/js\//, "/");
+  });
+  return allGeneratedPaths.filter((path) => path.endsWith(".js"));
 }
 /**
  * Main orchestrator
@@ -204,5 +235,5 @@ export async function writeJs(content, outputDir) {
     bundleIslands(metadata, jsDir, tempDir),
   ]);
 
-  return [runtime, events, ...islands.map((i) => i.file)].filter(Boolean);
+  return [runtime, events, ...islands].filter(Boolean);
 }

package/src/file-utils.js

@@ -1,6 +1,7 @@
 // src/file-utils.js
 import fs from "fs";
 import path from "path";
+import { existsSync, cpSync } from "fs";
 
 /**
  * Ensures that the directory for a given file path exists.
@@ -46,3 +47,42 @@ export function cleanOutputDir(outputDir, exclude) {
     fs.mkdirSync(outputDir, { recursive: true });
   }
 }
+
+/**
+ * Recursively copies a folder from source to destination.
+ */
+export function copyStaticFolder(srcPath, destPath) {
+  if (!existsSync(srcPath)) {
+    return; // If the folder doesn't exist, just silently skip it
+  }
+
+  try {
+    // cpSync copies the whole folder and its contents synchronously
+    cpSync(srcPath, destPath, { recursive: true });
+    console.log(`[Domo-SSG] Copied static folder: ${srcPath} -> ${destPath}`);
+  } catch (error) {
+    console.error(`[Domo-SSG] Failed to copy ${srcPath}:`, error);
+  }
+}
+
+export function scanRoutes(dir) {
+  const entries = fs.readdirSync(dir, { withFileTypes: true });
+
+  const routes = {};
+
+  for (const entry of entries) {
+    const fullPath = path.join(dir, entry.name);
+
+    if (entry.isDirectory()) {
+      Object.assign(routes, scanRoutes(fullPath));
+    } else {
+      if (!entry.name.endsWith(".js")) continue;
+
+      const fileName = path.basename(entry.name, ".js");
+
+      routes[fileName] = fullPath;
+    }
+  }
+
+  return routes;
+}

package/src/index.js

@@ -1,19 +1,24 @@
 // src/index.js
 import { pathToFileURL } from "url";
 import { loadConfig } from "./config.js";
-import { cleanOutputDir } from "./file-utils.js";
+import { cleanOutputDir, copyStaticFolder, scanRoutes } from "./file-utils.js";
 import { generateSitemap } from "./sitemap.js";
 import { buildRoutes } from "./route-traversal.js";
+import { registry } from "./Registry.js";
+import { join } from "path";
 
 async function main() {
   const config = await loadConfig();
+  const routePaths = scanRoutes(config.scanDir);
 
+  registry.setRoutes(routePaths);
   const { routes } = await import(pathToFileURL(config.routesFile).href);
   const { renderLayout } = await import(pathToFileURL(config.layout).href);
 
   console.log("[Domo-SSG] Starting Domo SSG build...");
 
   cleanOutputDir(config.outDir, config.exclude);
+  config.assetsDir.forEach((f) => copyStaticFolder(join(process.cwd(), f.current), join(config.outDir, f.final)));
 
   await buildRoutes(routes, renderLayout);
 
@@ -26,3 +31,55 @@ main().catch((error) => {
   console.error("[Domo-SSG] build failed:", error);
   process.exit(1);
 });
+
+// import { writeFileSync } from "fs";
+// import { build } from "esbuild";
+
+// // Your existing plugin to cleanly handle Domo
+// const rewriteDomoPlugin = {
+//   name: "rewrite-domo",
+//   setup(build) {
+//     build.onResolve({ filter: /^@zyrab\/domo$|^domo$/ }, () => {
+//       return { path: "/js/domo.runtime.js", external: true };
+//     });
+//   },
+// };
+
+// export async function preBundleAssets(routePaths, outputDir) {
+//   // Grab all file paths from your registry/scanner
+//   const allSourceFiles = Object.values(routePaths);
+
+//   const result = await build({
+//     entryPoints: allSourceFiles,
+//     outdir: join(outputDir, "js"),
+//     entryNames: "[dir]/[name]-[hash]", // e.g., islands/header-A1B2C.js
+//     format: "esm",
+//     bundle: true,
+//     splitting: true,
+//     minify: true, // Minify everything!
+//     metafile: true,
+//     packages: "external",
+//     plugins: [rewriteDomoPlugin],
+//   });
+
+//   // --- GENERATE THE MANIFEST ---
+//   const manifest = {};
+//   const outputs = result.metafile.outputs;
+
+//   for (const [outputPath, info] of Object.entries(outputs)) {
+//     // If this output file was generated from an entry point, map it!
+//     if (info.entryPoint) {
+//       // Normalize paths for lookup
+//       const originalPath = info.entryPoint.replace(/\\/g, "/");
+//       const finalBrowserPath = `/${outputPath.replace(/\\/g, "/").split("/").slice(1).join("/")}`;
+
+//       manifest[originalPath] = finalBrowserPath;
+//     }
+//   }
+
+//   // Save manifest so the SSG can use it
+//   writeFileSync(join(outputDir, "manifest.json"), JSON.stringify(manifest, null, 2));
+//   console.log("[Domo-SSG] Client assets pre-bundled. Manifest generated.");
+
+//   return manifest;
+// }

package/src/utils.js

@@ -40,3 +40,33 @@ export async function tryGenerateOgImage(routeMeta, ogOutputPath, path) {
     }
   }
 }
+
+export function formatComponentName(funcName) {
+  if (!funcName) return "";
+
+  // Helper to turn camelCase or PascalCase into kebab-case
+  const toKebab = (str) => {
+    return str
+      .replace(/([a-z0-9])([A-Z])/g, "$1-$2")
+      .toLowerCase()
+      .replace(/^-/, ""); // Catch accidental leading dashes
+  };
+
+  // Rule 1: UI Components (Start with "create")
+  if (funcName.startsWith("create")) {
+    const strippedName = funcName.replace(/^create/, "");
+    return toKebab(strippedName);
+  }
+
+  // Rule 2: Handlers (Everything else gets a "handle-" prefix)
+  else {
+    const baseName = toKebab(funcName);
+
+    // Just a safety check in case you occasionally name the function "handleSomething"
+    if (baseName.startsWith("handle-")) {
+      return baseName;
+    }
+
+    return `handle-${baseName}`;
+  }
+}