brain-of-reese/frontend/assets/brand.js

/* Brain of Reese — brand layer (phase 39).
 *
 * One env var (BOR_APP_NAME) drives the display name everywhere. This
 * small CLASSIC script is the single owner of the resolution — it is not
 * a module, so its top level runs at parse time: window.BOR_BRAND is
 * readable from the first line of the page's module scripts (modules
 * execute after parsing, so a module could not guarantee this).
 *
 * Contract (phase 39 locked decisions — A11 no CDN, runtime fetch):
 *   • window.BOR_BRAND = "Brain of Reese" synchronously — the default
 *     name renders immediately, no blank flash;
 *   • Phase 59: window.BOR_DOCS_REPO_CONFIGURED = false synchronously
 *     (inert until proven) and window.BOR_CONFIG_PROMISE — the SAME
 *     fetch's promise, exposed at parse time so the chat page's boot
 *     (app.js) can await it BEFORE rendering any bubble; the "Save as
 *     doc" gating flag is then final, and a restored conversation of a
 *     configured admin never misses (or flashes) the button. The
 *     promise NEVER rejects — the error arm warns and resolves null;
 *   • fetch("/api/config", { cache: "no-store" }) — on success the
 *     docs flag is set from cfg.docs_repo_configured, and on a
 *     non-empty app_name, window.BOR_BRAND is updated and the name is
 *     applied to the DOM:
 *       1. document.title — global replace of the literal;
 *       2. every .brand-text node — a name starting "Brain of " keeps
 *          the current look (Brain of <strong>rest</strong>), any other
 *          name renders plain (no bold); the name is HTML-escaped (an
 *          operator-controlled string must not inject markup);
 *       3. a TreeWalker over the document's text nodes — the literal is
 *          replaced (the index empty-state h1 "Hey! I'm Brain of
 *          Reese." and any other prose); script/style text nodes are
 *          skipped so page source is never mutated;
 *       4. an attribute pass — the aria-label / placeholder / meta
 *          content attributes containing the literal (the #messages
 *          aria-label, the input label, the meta descriptions).
 *   • fetch failure / empty name → the default stays + console.warn
 *     (the loadHealth house style: progressive enhancement, the page
 *     never breaks).
 *
 * No-op property: with BOR_APP_NAME unset the /api/config answer IS the
 * literal, so every replacement below is a byte-identical no-op.
 */

/* The synchronous default — set BEFORE any fetch, so module scripts
   reading window.BOR_BRAND at evaluation time always find a value. */
window.BOR_BRAND = "Brain of Reese";

/* Phase 59 (owner-locked 2026-08-31, TODO.md L3): the docs-push flag —
   surfaced the way app_name is (a window global, inert until the boot
   fetch proves otherwise). false = the "Save as doc" action is hidden
   for everyone (BOR_DOCS_REPO empty — the feature is off). */
window.BOR_DOCS_REPO_CONFIGURED = false;

/* The literal the DOM passes replace — the default name. The page
   scripts' own `window.BOR_BRAND || "Brain of Reese"` fallbacks stay in
   sync with it. */
const BRAND_LITERAL = "Brain of Reese";

/* The name is operator-controlled: HTML-escape it before it touches
   innerHTML (the markdown.js escape pattern — local on purpose, no
   cross-module import for a 5-line helper). */
function escapeHTML(s) {
  return String(s).replace(/[&<>"']/g, (c) => ({
    "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;",
  }[c]));
}

/* The /api/config fetch — started at TOP LEVEL (parse time) so
   window.BOR_CONFIG_PROMISE exists before the page's module scripts
   evaluate (app.js's boot awaits it, above). Phase 59: the flag lands
   here, the moment the answer arrives — before any DOM pass. The
   promise NEVER rejects: the error arm warns (the loadHealth house
   style — the page never breaks) and resolves to null, so the default
   name + false flag stand. */
const BOR_CONFIG_PROMISE = fetch("/api/config", { cache: "no-store" })
  .then((r) => (r.ok ? r.json() : Promise.reject(new Error(`HTTP ${r.status}`))))
  .then(
    (cfg) => {
      window.BOR_DOCS_REPO_CONFIGURED = cfg?.docs_repo_configured === true;
      return cfg;
    },
    (err) => {
      // Fetch failure (or a non-JSON body): the default name stays —
      // the page never breaks (the loadHealth house style).
      console.warn("brand: /api/config did not answer — keeping the default name.", err);
      return null;
    },
  );
window.BOR_CONFIG_PROMISE = BOR_CONFIG_PROMISE;

function applyBrand() {
  BOR_CONFIG_PROMISE.then((cfg) => {
    const name = typeof cfg?.app_name === "string" ? cfg.app_name.trim() : "";
    if (!name) return; // empty / missing: the default stands
    window.BOR_BRAND = name;

    // 1. The document title (global replace of the literal — covers
    //    every page's static "<…> · Brain of Reese" titles).
    document.title = document.title.replaceAll(BRAND_LITERAL, name);

    // 2. The header brand on every page: a name starting "Brain of "
    //    keeps the bold split (the current look), anything else
    //    renders plain — the name is always escaped.
    for (const el of document.querySelectorAll(".brand-text")) {
      if (name.startsWith("Brain of ")) {
        const rest = name.slice("Brain of ".length);
        el.innerHTML = `Brain of <strong>${escapeHTML(rest)}</strong>`;
      } else {
        el.textContent = name;
      }
    }

    // 3. Prose: a TreeWalker over the body's text nodes replaces the
    //    literal (the empty-state h1, any other copy). Text nodes
    //    inside <script>/<style> are rejected — the page source must
    //    never be rewritten.
    const walker = document.createTreeWalker(
      document.body,
      NodeFilter.SHOW_TEXT,
      {
        acceptNode(node) {
          const tag = node.parentElement ? node.parentElement.tagName : "";
          return tag === "SCRIPT" || tag === "STYLE"
            ? NodeFilter.FILTER_REJECT
            : NodeFilter.FILTER_ACCEPT;
        },
      },
    );
    const nodes = [];
    while (walker.nextNode()) nodes.push(walker.currentNode);
    for (const node of nodes) {
      if (node.nodeValue && node.nodeValue.includes(BRAND_LITERAL)) {
        node.nodeValue = node.nodeValue.replaceAll(BRAND_LITERAL, name);
      }
    }

    // 4. Attributes: the #messages aria-label, the composer input
    //    label, the meta descriptions — aria-label / placeholder /
    //    meta content only, each replaced in place.
    for (const el of document.querySelectorAll(
      "[aria-label], [placeholder], meta[content]",
    )) {
      for (const attr of ["aria-label", "placeholder"]) {
        const v = el.getAttribute(attr);
        if (v && v.includes(BRAND_LITERAL)) {
          el.setAttribute(attr, v.replaceAll(BRAND_LITERAL, name));
        }
      }
      if (el.tagName === "META") {
        const v = el.getAttribute("content");
        if (v && v.includes(BRAND_LITERAL)) {
          el.setAttribute("content", v.replaceAll(BRAND_LITERAL, name));
        }
      }
    }
  });
}

/* The DOM passes run once the document is ready AND the config is
   settled (applyBrand awaits the parse-time promise) — the fetch may
   resolve before or after DOMContentLoaded; both orderings apply the
   brand exactly once. */
if (document.readyState === "loading") {
  document.addEventListener("DOMContentLoaded", applyBrand);
} else {
  applyBrand();
}