@symbo.ls/mermaid 3.14.0

package/src/render.js

@@ -0,0 +1,411 @@
+/**
+ * Pure project → HTML renderer.
+ *
+ * Runtime-agnostic: takes project JSON + render options and returns a
+ * complete HTML document. Used by both the Express server (./server.js)
+ * and Cloudflare Worker handlers (in @symbo.ls/mermaid-server).
+ *
+ * Optional brender SSR is loaded lazily and silently skipped if missing.
+ */
+
+import log from './utils/logger.js';
+import replaceVariablesInFileSync from './utils/vartranformer.js';
+import { getBundleScript, getSmblsIife } from './bundle.js';
+import { deepDestringifyFunctions } from './utils/deepDestringify.js';
+import { transpile } from './utils/funcql-transpile.js';
+import { normalizeRoute, resolvePageRoute } from './route.js';
+import { generateMetaTags, getPageMetadata, getImportMapScript } from '@symbo.ls/utils';
+
+// ── Optional brender SSR ────────────────────────────────────────────────────
+const BRENDER_ENABLED = process.env.BRENDER !== 'false';
+let renderRoute = null;
+let generateSitemap = null;
+let prefetchPageData = null;
+if (BRENDER_ENABLED) {
+  try {
+    const brender = await import('@symbo.ls/brender');
+    renderRoute = brender.renderRoute;
+    generateSitemap = brender.generateSitemap;
+    prefetchPageData = brender.prefetchPageData;
+  } catch (err) {
+    log.debug(`[MERMAID] Brender not available: ${err.message}`);
+  }
+}
+
+export { generateSitemap, prefetchPageData };
+
+// ── Default HTML template ───────────────────────────────────────────────────
+// Inlined so the plugin works in any runtime (Node, CF Workers, browser).
+// Mirrors src/template.html — keep in sync.
+export const DEFAULT_TEMPLATE_HTML = `<!doctype html>
+<html>
+  <head>
+    '\${{{ META }}}'
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta charset="UTF-8" />
+    '\${{{ IMPORTMAP }}}'
+  </head>
+  <body>
+    <div data-ssr>'\${{{ BODY }}}'</div>
+    <script>
+      window.process = { env: { NODE_ENV: '\${{{ NODE_ENV }}}' } };
+    </script>
+    <script>
+      '\${{{ SMBLS_IIFE }}}';
+    </script>
+    <script>
+      '\${{{ BUNDLE }}}';
+    </script>
+    '\${{{ EDITOR }}}'
+  </body>
+</html>`;
+
+/**
+ * Walk an object tree and convert function-like strings to funcql schemas.
+ * Used in environments where eval/Function is unavailable (CF Workers).
+ * Non-transpilable functions are replaced with null.
+ */
+export function transpileFunctionStrings(obj, target = Array.isArray(obj) ? [] : {}) {
+  for (const prop in obj) {
+    if (!Object.prototype.hasOwnProperty.call(obj, prop)) continue;
+    const value = obj[prop];
+    if (typeof value === 'string') {
+      const t = value.trim();
+      const isFn =
+        (t.startsWith('(') && t.includes('=>')) ||
+        t.startsWith('function') ||
+        t.startsWith('async ');
+      if (isFn) {
+        const result = transpile(value);
+        target[prop] = result ? result.schema : null;
+      } else {
+        target[prop] = value;
+      }
+    } else if (Array.isArray(value)) {
+      target[prop] = value.map((item) => {
+        if (typeof item === 'string') {
+          const t = item.trim();
+          const isFn =
+            (t.startsWith('(') && t.includes('=>')) ||
+            t.startsWith('function') ||
+            t.startsWith('async ');
+          if (isFn) {
+            const r = transpile(item);
+            return r ? r.schema : null;
+          }
+        }
+        if (item && typeof item === 'object') return transpileFunctionStrings(item);
+        return item;
+      });
+    } else if (value && typeof value === 'object' && !Array.isArray(value)) {
+      target[prop] = transpileFunctionStrings(value);
+    } else {
+      target[prop] = value;
+    }
+  }
+  return target;
+}
+
+/**
+ * Render project data into a full HTML document string.
+ *
+ * @param {object} data — project JSON
+ * @param {object} options
+ * @param {string} options.appkey — appkey identifier (for metadata, comments)
+ * @param {string} options.pathname — request pathname
+ * @param {string} [options.channel='production'] — 'production' | 'staging' | 'development'
+ * @param {boolean} [options.isProd=false] — controls SEO indexing (custom domains only)
+ * @param {object} [options.req] — full request object (Express-like) for getBundleScript context
+ * @param {object} [options.query] — query params (when no req available)
+ * @param {string} [options.userId] — auth user id, injects window.__SYMBOLS_AUTH__
+ * @param {string} [options.smblsIife] — preloaded smbls IIFE source (overrides default loader)
+ * @param {string} [options.editorBundle] — preview-editor bundle to inject (non-prod only)
+ * @param {string} [options.analyzedScript] — analytics tracking <script> to inject
+ * @param {string} [options.indexHtml] — override index.html template
+ * @param {object} [options.ssrCache] — pre-computed SSR cache (skips runtime brender)
+ * @param {object} [options.ProjectDataService] — used by getBundleScript for shared-lib merging
+ * @returns {Promise<{ html: string, status: number, contentType: string }>}
+ */
+export async function renderProjectHtml(data, options = {}) {
+  const {
+    appkey,
+    pathname = '/',
+    channel = 'production',
+    isProd = false,
+    req,
+    query,
+    userId,
+    smblsIife: smblsIifeOverride,
+    editorBundle,
+    analyzedScript = '',
+    indexHtml: indexHtmlOverride,
+    ssrCache,
+    ProjectDataService,
+  } = options;
+
+  if (!data) {
+    return { html: '', status: 404, contentType: 'text/html' };
+  }
+
+  // Inject owner/key from appkey when missing (used by metadata fallback)
+  if (typeof appkey === 'string' && appkey.includes('/')) {
+    const [owner, key] = appkey.split('/');
+    if (!data.key) data.key = key;
+    if (!data.owner) data.owner = owner;
+  }
+
+  const route = normalizeRoute(pathname);
+  const resolved = resolvePageRoute(data.pages, pathname);
+  const shouldBrender = channel === 'production' || channel === 'staging';
+
+  // ── Brender / SSR ─────────────────────────────────────────────────────────
+  let prerenderedBody = '';
+  let brenderStyles = '';
+  let brenderResult = null;
+  let destringifiedData = null;
+  let hydrationScript = '';
+
+  if (ssrCache && shouldBrender) {
+    prerenderedBody = ssrCache.html || '';
+    const styleParts = [];
+    if (ssrCache.fontLinks) styleParts.push(ssrCache.fontLinks);
+    const globalStyles = [ssrCache.globalCSS || '', ssrCache.resetCss || '']
+      .filter(Boolean)
+      .join('\n');
+    if (globalStyles) styleParts.push(`<style>${globalStyles}</style>`);
+    if (ssrCache.css) styleParts.push(`<style data-emotion="smbls">${ssrCache.css}</style>`);
+    brenderStyles = styleParts.join('\n');
+
+    const hydrationParts = [];
+    if (ssrCache.ssrTranslations) {
+      const config = data.config || data.settings || {};
+      const polyglotCfg = config.polyglot || data.polyglot;
+      const storagePrefix = polyglotCfg?.storagePrefix || '';
+      const storageLangKey = polyglotCfg?.storageLangKey || '';
+      const seedEntries = [];
+      for (const lang in ssrCache.ssrTranslations) {
+        const map = ssrCache.ssrTranslations[lang];
+        if (map && typeof map === 'object') {
+          seedEntries.push(
+            `localStorage.setItem(${JSON.stringify(storagePrefix + lang)},${JSON.stringify(JSON.stringify(map))})`,
+          );
+        }
+      }
+      if (storageLangKey) {
+        const defaultLang = polyglotCfg?.defaultLang || 'en';
+        seedEntries.push(
+          `if(!localStorage.getItem(${JSON.stringify(storageLangKey)}))` +
+            `localStorage.setItem(${JSON.stringify(storageLangKey)},${JSON.stringify(defaultLang)})`,
+        );
+      }
+      if (seedEntries.length) {
+        hydrationParts.push(`<script>try{${seedEntries.join(';')}}catch(e){}</script>`);
+      }
+    }
+    hydrationParts.push('<script>window.__BRENDER__=true</script>');
+    hydrationScript = hydrationParts.join('\n');
+
+    brenderResult = {
+      metadata: ssrCache.metadata,
+      prefetchedState: ssrCache.prefetchedState,
+      activeLang: ssrCache.activeLang,
+    };
+  } else if (renderRoute && shouldBrender) {
+    try {
+      const renderPath = resolved ? resolved.route : route;
+      log.debug(`[MERMAID] Running brender for route: ${renderPath}`);
+
+      // Detect eval availability (blocked in CF Workers).
+      let canDestringify = false;
+      try {
+        // eslint-disable-next-line no-eval
+        (0, eval)('1');
+        canDestringify = true;
+      } catch {
+        /* eval blocked */
+      }
+
+      destringifiedData = canDestringify
+        ? deepDestringifyFunctions(data)
+        : transpileFunctionStrings(data);
+
+      brenderResult = await renderRoute(destringifiedData, {
+        route: renderPath,
+        pathname: route,
+      });
+
+      if (brenderResult) {
+        prerenderedBody = brenderResult.html || '';
+        const parts = [];
+        if (brenderResult.fontLinks) parts.push(brenderResult.fontLinks);
+
+        const globalCSS = brenderResult.globalCSS || {};
+        const globalStyles = [
+          globalCSS.rootRule || '',
+          brenderResult.resetCss || '',
+          globalCSS.keyframeRules || '',
+        ]
+          .filter(Boolean)
+          .join('\n');
+        if (globalStyles) parts.push(`<style>${globalStyles}</style>`);
+        if (brenderResult.css)
+          parts.push(`<style data-emotion="smbls">${brenderResult.css}</style>`);
+        brenderStyles = parts.join('\n');
+
+        // Hydration signals
+        const hydrationParts = [];
+
+        if (brenderResult.ssrTranslations) {
+          const config = destringifiedData?.config || {};
+          const polyglotCfg = config.polyglot || destringifiedData?.polyglot;
+          const storagePrefix = polyglotCfg?.storagePrefix || '';
+          const storageLangKey = polyglotCfg?.storageLangKey || '';
+          const seedEntries = [];
+          for (const lang in brenderResult.ssrTranslations) {
+            const map = brenderResult.ssrTranslations[lang];
+            if (map && typeof map === 'object') {
+              seedEntries.push(
+                `localStorage.setItem(${JSON.stringify(storagePrefix + lang)},${JSON.stringify(JSON.stringify(map))})`,
+              );
+            }
+          }
+          if (storageLangKey) {
+            const defaultLang = polyglotCfg?.defaultLang || 'en';
+            seedEntries.push(
+              `if(!localStorage.getItem(${JSON.stringify(storageLangKey)}))` +
+                `localStorage.setItem(${JSON.stringify(storageLangKey)},${JSON.stringify(defaultLang)})`,
+            );
+          }
+          if (seedEntries.length) {
+            hydrationParts.push(`<script>try{${seedEntries.join(';')}}catch(e){}</script>`);
+          }
+        }
+
+        // Embed BR registry for true DOM-adoption hydration (Express path only;
+        // CF worker variant skipped historically). Only when destringifyable.
+        if (
+          canDestringify &&
+          brenderResult.brRegistry &&
+          Object.keys(brenderResult.brRegistry).length
+        ) {
+          hydrationParts.push(
+            `<script>window.__BR_REGISTRY__=${JSON.stringify(brenderResult.brRegistry)}</script>`,
+          );
+        }
+
+        hydrationParts.push('<script>window.__BRENDER__=true</script>');
+        hydrationScript = hydrationParts.join('\n');
+
+        log.debug(
+          `[MERMAID] Brender completed: body=${prerenderedBody.length}b, registry=${Object.keys(brenderResult.brRegistry || {}).length}`,
+        );
+      }
+    } catch (brenderError) {
+      log.warn(`[MERMAID] Brender failed, falling back to client render: ${brenderError.message}`);
+    }
+  }
+
+  // ── Bundle script ─────────────────────────────────────────────────────────
+  const bundle = getBundleScript(appkey, data, req, { ProjectDataService });
+
+  // ── Importmap ─────────────────────────────────────────────────────────────
+  const importmap = getImportMapScript(data, data?.settings?.cdnProvider || 'skypack');
+
+  // ── HTML template ─────────────────────────────────────────────────────────
+  const indexHtmlFromFiles = data?.files && data.files['index.html'];
+  const indexHtml = indexHtmlOverride || indexHtmlFromFiles?.code || DEFAULT_TEMPLATE_HTML;
+
+  // ── Auth context ──────────────────────────────────────────────────────────
+  const authScript = userId
+    ? `<script>window.__SYMBOLS_AUTH__=${JSON.stringify({ userId })}</script>`
+    : '';
+
+  // ── Metadata ──────────────────────────────────────────────────────────────
+  const prefetchedState = brenderResult?.prefetchedState;
+  const config = data.config || data.settings || {};
+  const polyglot = config.polyglot || data.polyglot;
+  const activeLang = brenderResult?.activeLang || polyglot?.defaultLang || 'en';
+  const ssrContext =
+    prefetchedState && Object.keys(prefetchedState).length
+      ? { state: prefetchedState, lang: activeLang, actualPathname: pathname }
+      : { actualPathname: pathname };
+
+  const pageMetadata =
+    brenderResult?.metadata && Object.keys(brenderResult.metadata).length
+      ? brenderResult.metadata
+      : getPageMetadata(data, resolved ? resolved.route : route, ssrContext, {
+          isProduction: isProd,
+          channel,
+        });
+  const metaTags = generateMetaTags(pageMetadata, isProd);
+
+  // ── smbls IIFE ────────────────────────────────────────────────────────────
+  const smblsIife = smblsIifeOverride || getSmblsIife();
+  if (!smblsIife) {
+    log.error('[MERMAID] smbls IIFE bundle not available');
+    return {
+      html: 'Internal Server Error: smbls bundle not found',
+      status: 500,
+      contentType: 'text/plain',
+    };
+  }
+
+  // ── Editor + analytics injection ──────────────────────────────────────────
+  const shouldInjectEditor = editorBundle && !isProd;
+  const editorScript = shouldInjectEditor
+    ? `<script defer type="text/javascript">${editorBundle}</script>`
+    : '';
+
+  const envComment = isProd
+    ? `<!-- built with symbols.app -->\n`
+    : `<!-- symbols | ${appkey} | ${channel} | ${shouldBrender ? 'ssr' : 'csr'} | noindex -->\n`;
+
+  const html = replaceVariablesInFileSync(
+    envComment + indexHtml,
+    {
+      META: metaTags + '\n' + brenderStyles + '\n' + hydrationScript + '\n' + authScript,
+      BUNDLE: bundle,
+      BODY: prerenderedBody,
+      SMBLS_IIFE: smblsIife,
+      NODE_ENV: "'" + (process.env.NODE_ENV || 'development') + "'",
+      IMPORTMAP: importmap,
+      EDITOR: editorScript + analyzedScript,
+    },
+    { allowScript: true },
+  );
+
+  return { html, status: 200, contentType: 'text/html' };
+}
+
+/**
+ * Render the "project not published" 404 fallback page.
+ */
+export function renderNotPublishedHtml(appkey, channel = 'production') {
+  const envLabel = channel !== 'production' ? ` (${channel})` : '';
+  return `<!doctype html>
+<html>
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="robots" content="noindex">
+  <title>Not Published</title>
+  <style>
+    * { margin: 0; padding: 0; box-sizing: border-box; }
+    body { min-height: 100vh; display: flex; align-items: center; justify-content: center; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; background: #0a0a0a; color: #fafafa; }
+    .container { text-align: center; max-width: 480px; padding: 2rem; }
+    h1 { font-size: 1.25rem; font-weight: 500; margin-bottom: 0.75rem; }
+    p { color: #888; font-size: 0.875rem; line-height: 1.6; }
+    a { color: #888; text-decoration: underline; text-underline-offset: 2px; }
+    a:hover { color: #fafafa; }
+    .env { display: inline-block; font-size: 0.75rem; color: #555; background: #1a1a1a; padding: 0.2rem 0.5rem; border-radius: 4px; margin-top: 1rem; }
+  </style>
+</head>
+<body>
+  <div class="container">
+    <h1>This project hasn't been published yet${envLabel}</h1>
+    <p>Run <code>smbls publish</code> to deploy your project, or visit <a href="https://symbols.app">symbols.app</a> to get started.</p>
+    <span class="env">${appkey}${envLabel}</span>
+  </div>
+</body>
+</html>`;
+}

package/src/route.js

@@ -0,0 +1,80 @@
+/**
+ * Route helpers — pathname → page resolution.
+ *
+ * Pure functions, runtime-agnostic. Used by both the Express server
+ * and Cloudflare Worker variants of mermaid.
+ */
+
+/**
+ * Normalize a pathname for page matching:
+ *  - strip trailing slash (except root '/')
+ *  - ensure leading slash
+ */
+export function normalizeRoute(pathname) {
+  let route = pathname || '/';
+  if (!route.startsWith('/')) route = '/' + route;
+  if (route.length > 1 && route.endsWith('/')) route = route.slice(0, -1);
+  return route;
+}
+
+/**
+ * Extract :params from a dynamic route pattern.
+ *   extractRouteParams('/podcast/:id', '/podcast/abc') → { id: 'abc' }
+ */
+export function extractRouteParams(pattern, pathname) {
+  const patternParts = pattern.split('/');
+  const pathParts = pathname.split('/');
+  const params = {};
+  for (let i = 0; i < patternParts.length; i++) {
+    if (patternParts[i].startsWith(':')) {
+      params[patternParts[i].slice(1)] = pathParts[i];
+    }
+  }
+  return params;
+}
+
+/**
+ * Resolve a route against available pages.
+ * Tries exact match first, then dynamic routes (with :params), then '/' fallback.
+ * Returns { route, fallback, params? } or null if no pages exist.
+ */
+export function resolvePageRoute(pages, pathname) {
+  if (!pages || !Object.keys(pages).length) return null;
+
+  const route = normalizeRoute(pathname);
+
+  // Exact match
+  if (pages[route]) return { route, fallback: false };
+
+  // Dynamic route match (e.g. /podcast/:id matches /podcast/abc-123)
+  const segments = route.split('/');
+  for (const pageRoute of Object.keys(pages)) {
+    if (!pageRoute.includes(':')) continue;
+    const pageSegments = pageRoute.split('/');
+    if (pageSegments.length !== segments.length) continue;
+    let match = true;
+    for (let i = 0; i < pageSegments.length; i++) {
+      if (pageSegments[i].startsWith(':')) continue;
+      if (pageSegments[i] !== segments[i]) {
+        match = false;
+        break;
+      }
+    }
+    if (match) {
+      return {
+        route: pageRoute,
+        fallback: false,
+        params: extractRouteParams(pageRoute, route),
+      };
+    }
+  }
+
+  // Fallback to root
+  if (route !== '/' && pages['/']) return { route: '/', fallback: true };
+
+  return null;
+}
+
+// Static asset extensions — skip SSR for these
+export const STATIC_EXT =
+  /\.(js|mjs|css|map|png|jpe?g|gif|svg|ico|webp|avif|woff2?|ttf|eot|otf|json|xml|txt|webmanifest|mp4|webm|mp3|ogg|wav|pdf)$/i;

package/src/server.js

@@ -0,0 +1,190 @@
+/**
+ * Express factory for the mermaid runner.
+ *
+ * Self-sustaining: pass `jsonPath` to serve a project from a local JSON file
+ * with no infrastructure dependencies. Or inject a `getProjectData` callback
+ * to source data from KV / API / database / anywhere.
+ *
+ *   import { createMermaidApp } from '@symbo.ls/mermaid';
+ *
+ *   // From a JSON file:
+ *   const app = createMermaidApp({ jsonPath: './app.json' });
+ *
+ *   // From a custom data source (e.g. KV worker):
+ *   const app = createMermaidApp({
+ *     async getProjectData(req, { appkey }) {
+ *       return { data: await myKv.fetch(appkey), channel: 'production' };
+ *     },
+ *   });
+ *
+ *   app.listen(3333);
+ */
+
+import path from 'path';
+import fs from 'fs';
+import express from 'express';
+import cors from 'cors';
+import log from './utils/logger.js';
+import { STATIC_EXT } from './route.js';
+import { renderProjectHtml, renderNotPublishedHtml, generateSitemap } from './render.js';
+
+/**
+ * Load project data from a local JSON file (or app.json inside a directory).
+ */
+export function loadJsonData(jsonPath) {
+  const resolved = path.resolve(jsonPath);
+  let filePath = resolved;
+
+  if (fs.existsSync(resolved) && fs.statSync(resolved).isDirectory()) {
+    filePath = path.join(resolved, 'app.json');
+  }
+
+  if (!fs.existsSync(filePath)) {
+    throw new Error(`JSON data file not found: ${filePath}`);
+  }
+
+  const raw = fs.readFileSync(filePath, 'utf8');
+  const data = JSON.parse(raw);
+  log.info(`[MERMAID] Loaded project data from ${filePath}`);
+  return data;
+}
+
+function normalizeAppkey(rawAppkey, req) {
+  if (typeof rawAppkey !== 'string') return rawAppkey;
+
+  // When renderUrl includes its own query, split and merge nested params
+  if (rawAppkey.includes('?') && req) {
+    const [baseAppkey, nestedQuery] = rawAppkey.split('?');
+    rawAppkey = baseAppkey.replace(/\/$/, '');
+
+    try {
+      const nestedParams = new URLSearchParams(nestedQuery);
+      for (const [key, value] of nestedParams.entries()) {
+        if (req.query[key] === undefined) req.query[key] = value;
+      }
+    } catch (err) {
+      log.warn(`[MERMAID] Failed to parse nested query in renderUrl: ${err.message}`);
+    }
+  }
+
+  // Strip scheme, port, leading www., trailing slash
+  return rawAppkey
+    .replace(/^https?:\/\//, '')
+    .split(':')[0]
+    .replace(/^www\./, '')
+    .replace(/\/$/, '');
+}
+
+/**
+ * Create an Express app that serves Symbols projects.
+ *
+ * @param {object} options
+ * @param {string} [options.jsonPath] — local JSON file (or directory containing app.json)
+ * @param {string} [options.appkeyOverride] — force a specific appkey for all requests
+ * @param {string} [options.channel='production'] — channel for JSON-mode rendering
+ * @param {Function} [options.getProjectData] — async (req, ctx) → { data, appkey?, channel?, isProd? }
+ * @param {boolean} [options.cors=true] — enable CORS middleware
+ * @param {object} [options.editor] — { bundle: string } to inject preview-editor for non-prod
+ * @returns {express.Application}
+ */
+export function createMermaidApp(options = {}) {
+  const {
+    jsonPath,
+    appkeyOverride,
+    channel: defaultChannel = 'production',
+    getProjectData,
+    cors: enableCors = true,
+    editor,
+  } = options;
+
+  // Pre-load JSON data if a path is provided
+  let jsonData = null;
+  if (jsonPath) jsonData = loadJsonData(jsonPath);
+
+  const app = express();
+
+  if (enableCors) app.use(cors({ origin: '*', methods: 'GET, POST' }));
+  app.use(express.json());
+
+  app.get('/health', (_req, res) =>
+    res.send({ alive: true, service: 'mermaid', version: '3.14.0' }),
+  );
+
+  app.get('*', async (req, res) => {
+    try {
+      const pathname = req.originalUrl.split('?')[0];
+
+      // Skip static asset requests
+      if (STATIC_EXT.test(pathname)) {
+        if (pathname === '/favicon.ico') return res.status(204).end();
+        return res.status(404).send('Not Found');
+      }
+
+      // Resolve appkey from override / renderUrl / Host header
+      let rawAppkey = appkeyOverride || req.query.renderUrl || req.headers.host;
+      rawAppkey = normalizeAppkey(rawAppkey, req);
+
+      let data = null;
+      let appkey = rawAppkey;
+      let channel = defaultChannel;
+      let isProd = false;
+
+      if (jsonData) {
+        data = jsonData;
+        log.debug('[MERMAID] Using local JSON data');
+      } else if (getProjectData) {
+        const result = await getProjectData(req, { appkey: rawAppkey });
+        if (result) {
+          data = result.data;
+          if (result.appkey) appkey = result.appkey;
+          if (result.channel) channel = result.channel;
+          if (typeof result.isProd === 'boolean') isProd = result.isProd;
+        }
+      }
+
+      if (!appkey) {
+        return res.send(
+          'Hello, this is Mermaid (Symbols runner). Read developer documentation at https://symbols.app/developers',
+        );
+      }
+
+      if (!data) {
+        log.warn(`[MERMAID] Project not found for appkey: ${appkey}`);
+        return res.status(404).type('html').send(renderNotPublishedHtml(appkey, channel));
+      }
+
+      // Sitemap
+      if (pathname === '/sitemap.xml') {
+        if (generateSitemap && data.pages && Object.keys(data.pages).length) {
+          const baseUrl = `https://${appkey}`;
+          const sitemap = generateSitemap(baseUrl, data.pages);
+          return res.type('application/xml').send(sitemap);
+        }
+        return res.status(404).send('No sitemap available');
+      }
+
+      const userId = req.headers['x-user-id'] || '';
+
+      const result = await renderProjectHtml(data, {
+        appkey,
+        pathname,
+        channel,
+        isProd,
+        req,
+        userId,
+        editorBundle: editor?.bundle,
+      });
+
+      return res
+        .status(result.status)
+        .set({ host: 'https://' + appkey + '/' })
+        .type(result.contentType === 'text/html' ? 'html' : result.contentType)
+        .send(result.html);
+    } catch (error) {
+      log.error(`[MERMAID] Error in request: ${error}`);
+      return res.status(500).send('Internal Server Error');
+    }
+  });
+
+  return app;
+}