@mondaydotcomorg/z2h-cli 0.12.0 → 0.13.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mondaydotcomorg/z2h-cli",
-  "version": "0.12.0",
+  "version": "0.13.0",
   "bin": "./bin/z2h-cli.js",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",

package/src/templates/app/CLAUDE.md

@@ -38,9 +38,9 @@ When a request needs data, follow `z2h:coding-standards-mf` §0: write a `runQue
 - This folder is **standalone** — not part of any monorepo, no git initialized.
 - `src/index.tsx` default-exports the React component the host MF loads.
 - `package.json` wires the `z2h-cli` for `build` / `start` / `deploy`.
-- `.zth/` is an auto-generated shadow workspace — never edit it by hand; `npx z2h-cli clean` wipes it.
-- Local dev: `npx z2h-cli dev` → opens at `https://bigbrain.me/bigbrain-vibe/<app>?zth_local=<port>`.
-- Production: `npx z2h-cli deploy` → live at `https://bigbrain.me/bigbrain-vibe/<app>`.
+- `.zth/` is an auto-generated shadow workspace — never edit it by hand; `z2h-cli clean` wipes it.
+- Local dev: `z2h-cli dev` → opens at `https://bigbrain.me/bigbrain-vibe/<app>?zth_local=<port>`.
+- Production: `z2h-cli deploy` → live at `https://bigbrain.me/bigbrain-vibe/<app>`.
 - There is no git, no PR, no CI. The gate is: lint pass → typecheck pass → user previews and approves.
 
 ---
@@ -54,8 +54,8 @@ Apps are **private by default** — only you can view them. After the first depl
 To change visibility at any time:
 
 ```
-npx z2h-cli grant --public   # open to all monday.com employees
-npx z2h-cli revoke --public  # back to private
+z2h-cli grant --public   # open to all monday.com employees
+z2h-cli revoke --public  # back to private
 ```
 
 ---

package/src/templates/app/html-index.tsx.tmpl

@@ -1,18 +1,30 @@
-// HTML-embed entrypoint. Renders src/page.html in an iframe, with the file
-// imported via Vite's `?url` suffix so Vite's dev server hosts it at
-// /src/page.html (and copies it to /assets/ at build time). Same-origin
-// (the URL lives under whatever host is rendering the app), so the page's
-// fetch() calls carry bigbrain.me auth cookies normally.
-//
-// The iframe gives the page its own document — scripts execute natively,
-// CSS/JS is fully isolated from the host React app, no script reinjection
-// logic needed.
-import React from 'react';
+import React, { useRef, useEffect } from 'react';
+import { getBigBrainAPI } from '@mondaydotcomorg/trident-runtime';
 import pageUrl from './page.html?url';
 
+const BACKEND_SUBDOMAIN = 'bigbrain-zth';
+
+function getBackendBaseUrl(): string | null {
+  const base = getBigBrainAPI()?.contextService?.bigbrainBaseUrl;
+  return base ? base.replace('//', `//${BACKEND_SUBDOMAIN}.`) : null;
+}
+
 export default function __APP_COMPONENT__() {
+  const iframeRef = useRef<HTMLIFrameElement>(null);
+  useEffect(() => {
+    const handleMessage = (event: MessageEvent) => {
+      if (!iframeRef.current || event.source !== iframeRef.current.contentWindow) return;
+      if (event.data?.type !== 'z2h:getConfig') return;
+      const baseUrl = getBackendBaseUrl();
+      if (!baseUrl) return;
+      (event.source as Window).postMessage({ type: 'z2h:config', baseUrl }, event.origin);
+    };
+    window.addEventListener('message', handleMessage);
+    return () => window.removeEventListener('message', handleMessage);
+  }, []);
   return (
     <iframe
+      ref={iframeRef}
       src={pageUrl}
       title="App"
       style={{ width: '100vw', height: '100vh', border: 'none', display: 'block' }}