From 41a5ed52583aecfd61b423a4be3a5fb5bb74daf0 Mon Sep 17 00:00:00 2001
From: SakshiKekre <sakshi.kekre@gmail.com>
Date: Tue, 2 Jun 2026 10:34:36 -0700
Subject: [PATCH] Enable multizone embedding via prefixed asset URLs

The chat is being embedded on policyengine.org/uk/chat as a multizone
child (see policyengine-app-v2 PR #1036). Vercel rewrites are the
mechanism; cross-origin iframes blank out for Next.js apps per
CLAUDE.md.

For the rewrites to work end-to-end, the chat's static asset URLs
need to live under a prefixed path so the website can proxy them
back through policyengine.org. Matches the household-api-docs zone
pattern (which uses the same /_zones/<name> convention).

Two coordinated files:

- frontend/next.config.js: assetPrefix '/_zones/uk-chat' in production
  builds. Dev server stays unprefixed for local development.
- frontend/vercel.json: rewrite /_zones/uk-chat/_next/:path* back to
  /_next/:path* so the chat host serves the prefixed URLs that the
  generated HTML references, without needing basePath (which would
  break the standalone preview URL).

Pages still live at "/" on the chat host, so direct previews
(policyengine-uk-chat.vercel.app) keep working unchanged.
---
 frontend/next.config.js | 32 +++++++++++++++++++++++++++-----
 frontend/vercel.json    |  8 ++++++++
 2 files changed, 35 insertions(+), 5 deletions(-)
 create mode 100644 frontend/vercel.json

diff --git a/frontend/next.config.js b/frontend/next.config.js
index c10e07d..75eb753 100644
--- a/frontend/next.config.js
+++ b/frontend/next.config.js
@@ -1,6 +1,28 @@
-/** @type {import('next').NextConfig} */
-const nextConfig = {
-  output: "standalone",
-};
+const { PHASE_DEVELOPMENT_SERVER } = require("next/constants");
 
-module.exports = nextConfig;
+/**
+ * Multizone embedding via assetPrefix.
+ *
+ * The chat is embedded on policyengine.org/uk/chat as a multizone child
+ * (see policyengine-app-v2 PR #1036). Static asset URLs in the generated
+ * HTML get the "/_zones/uk-chat" prefix so the website (policyengine.org)
+ * can proxy them back from the chat host via a Vercel rewrite:
+ *
+ *   /uk/chat                         → chat-host/
+ *   /_zones/uk-chat/_next/:path*     → chat-host/_zones/uk-chat/_next/:path*
+ *
+ * On the chat host, `vercel.json` rewrites the prefixed asset URLs back to
+ * the unprefixed paths Next.js actually serves from. Pages still live at "/"
+ * so the standalone preview URL (policyengine-uk-chat.vercel.app) keeps
+ * working. Matches the household-api-docs zone pattern.
+ *
+ * Dev server runs without the prefix so local development stays simple.
+ */
+module.exports = (phase) => {
+  const isDev = phase === PHASE_DEVELOPMENT_SERVER;
+  /** @type {import('next').NextConfig} */
+  return {
+    output: "standalone",
+    assetPrefix: isDev ? undefined : "/_zones/uk-chat",
+  };
+};
diff --git a/frontend/vercel.json b/frontend/vercel.json
new file mode 100644
index 0000000..d600892
--- /dev/null
+++ b/frontend/vercel.json
@@ -0,0 +1,8 @@
+{
+  "rewrites": [
+    {
+      "source": "/_zones/uk-chat/_next/:path*",
+      "destination": "/_next/:path*"
+    }
+  ]
+}