eclipsa 0.1.7 → 0.1.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eclipsa",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "homepage": "https://github.com/pnsk-lab/eclipsa",
   "bugs": {
     "url": "https://github.com/pnsk-lab/eclipsa/issues"
@@ -63,7 +63,7 @@
     }
   },
   "dependencies": {
-    "@eclipsa/optimizer": "^0.1.7",
+    "@eclipsa/optimizer": "^0.1.8",
     "fast-glob": "^3.3.2",
     "hono": "^4.6.4"
   },

package/vite/mod.mjs

@@ -877,6 +877,27 @@ const RESUME_PAYLOAD_PLACEHOLDER = "__ECLIPSA_RESUME_PAYLOAD__";
 const ROUTE_MANIFEST_PLACEHOLDER = "__ECLIPSA_ROUTE_MANIFEST__";
 const APP_HOOKS_PLACEHOLDER = "__ECLIPSA_APP_HOOKS__";
 const replaceHeadPlaceholder = (html, placeholder, value) => html.replaceAll(placeholder, value);
+const replaceResumePayloadPlaceholderValue = (value, replacements) => {
+	if (typeof value === "string") return replacements[value] ?? value;
+	if (Array.isArray(value)) {
+		let changed = false;
+		const next = value.map((entry) => {
+			const replaced = replaceResumePayloadPlaceholderValue(entry, replacements);
+			if (replaced !== entry) changed = true;
+			return replaced;
+		});
+		return changed ? next : value;
+	}
+	if (!value || typeof value !== "object") return value;
+	let changed = false;
+	const next = {};
+	for (const [key, entry] of Object.entries(value)) {
+		const replaced = replaceResumePayloadPlaceholderValue(entry, replacements);
+		if (replaced !== entry) changed = true;
+		next[key] = replaced;
+	}
+	return changed ? next : value;
+};
 const splitHtmlForStreaming = (html) => {
 	const bodyCloseIndex = html.lastIndexOf("</body>");
 	if (bodyCloseIndex >= 0) return {
@@ -1163,6 +1184,10 @@ const createDevApp = async (init) => {
 		const [pageModule, ...layoutModules] = modules;
 		const { default: Page } = pageModule;
 		const Layouts = layoutModules.map((module) => module.default);
+		const serializeAppResumePayload = (payload) => serializeResumePayload(replaceResumePayloadPlaceholderValue(payload, {
+			[ROUTE_MANIFEST_PLACEHOLDER]: JSON.stringify(routeManifest),
+			[APP_HOOKS_PLACEHOLDER]: JSON.stringify(appHooksManifest)
+		}));
 		const metadata = composeRouteMetadata([...layoutModules.map((module) => module.metadata ?? null), pageModule.metadata ?? null], {
 			params,
 			url: getRequestUrl(c.req.raw)
@@ -1230,7 +1255,7 @@ const createDevApp = async (init) => {
 			resolvePendingLoaders: async (container) => resolvePendingLoaders(container, c),
 			symbols: symbolUrls
 		});
-		const { prefix, suffix } = splitHtmlForStreaming(replaceHeadPlaceholder(replaceHeadPlaceholder(replaceHeadPlaceholder(html, RESUME_PAYLOAD_PLACEHOLDER, serializeResumePayload(payload)), ROUTE_MANIFEST_PLACEHOLDER, escapeJSONScriptText(JSON.stringify(routeManifest))), APP_HOOKS_PLACEHOLDER, escapeJSONScriptText(JSON.stringify(appHooksManifest))));
+		const { prefix, suffix } = splitHtmlForStreaming(replaceHeadPlaceholder(replaceHeadPlaceholder(replaceHeadPlaceholder(html, RESUME_PAYLOAD_PLACEHOLDER, serializeAppResumePayload(payload)), ROUTE_MANIFEST_PLACEHOLDER, escapeJSONScriptText(JSON.stringify(routeManifest))), APP_HOOKS_PLACEHOLDER, escapeJSONScriptText(JSON.stringify(appHooksManifest))));
 		const encoder = new TextEncoder();
 		return new Response(new ReadableStream({ start(controller) {
 			controller.enqueue(encoder.encode(prefix));
@@ -1240,9 +1265,9 @@ const createDevApp = async (init) => {
 					latestPayload = chunk.payload;
 					const templateId = `eclipsa-suspense-template-${chunk.boundaryId}`;
 					const payloadId = `eclipsa-suspense-payload-${chunk.boundaryId}`;
-					controller.enqueue(encoder.encode(`<template id="${templateId}">${chunk.html}</template><script id="${payloadId}" type="application/eclipsa-resume+json">${serializeResumePayload(chunk.payload)}<\/script><script>window.__eclipsa_stream.enqueue({boundaryId:${JSON.stringify(chunk.boundaryId)},payloadScriptId:${JSON.stringify(payloadId)},templateId:${JSON.stringify(templateId)}})<\/script>`));
+					controller.enqueue(encoder.encode(`<template id="${templateId}">${chunk.html}</template><script id="${payloadId}" type="application/eclipsa-resume+json">${serializeAppResumePayload(chunk.payload)}<\/script><script>window.__eclipsa_stream.enqueue({boundaryId:${JSON.stringify(chunk.boundaryId)},payloadScriptId:${JSON.stringify(payloadId)},templateId:${JSON.stringify(templateId)}})<\/script>`));
 				}
-				controller.enqueue(encoder.encode(`<script id="${RESUME_FINAL_STATE_ELEMENT_ID}" type="application/eclipsa-resume+json">${serializeResumePayload(latestPayload)}<\/script>${suffix}`));
+				controller.enqueue(encoder.encode(`<script id="${RESUME_FINAL_STATE_ELEMENT_ID}" type="application/eclipsa-resume+json">${serializeAppResumePayload(latestPayload)}<\/script>${suffix}`));
 				controller.close();
 			})().catch((error) => {
 				controller.error(error);
@@ -2308,7 +2333,47 @@ const resolvePreflightTarget = (pathname) => {
   return null;
 };
 
-const replaceHeadPlaceholder = (html, placeholder, value) => html.replace(placeholder, value);
+const replaceHeadPlaceholder = (html, placeholder, value) => html.replaceAll(placeholder, value);
+const replaceResumePayloadPlaceholderValue = (value, replacements) => {
+  if (typeof value === "string") {
+    return replacements[value] ?? value;
+  }
+  if (Array.isArray(value)) {
+    let changed = false;
+    const next = value.map((entry) => {
+      const replaced = replaceResumePayloadPlaceholderValue(entry, replacements);
+      if (replaced !== entry) {
+        changed = true;
+      }
+      return replaced;
+    });
+    return changed ? next : value;
+  }
+  if (!value || typeof value !== "object") {
+    return value;
+  }
+  let changed = false;
+  const next = {};
+  for (const [key, entry] of Object.entries(value)) {
+    const replaced = replaceResumePayloadPlaceholderValue(entry, replacements);
+    if (replaced !== entry) {
+      changed = true;
+    }
+    next[key] = replaced;
+  }
+  return changed ? next : value;
+};
+const createResumePayloadPlaceholderReplacements = (pathname, payload) => ({
+  [ROUTE_MANIFEST_PLACEHOLDER]: JSON.stringify(routeManifest),
+  [APP_HOOKS_PLACEHOLDER]: JSON.stringify(appHooksManifest),
+  [CHUNK_CACHE_PLACEHOLDER]: createChunkCacheRegistrationScript(pathname, payload),
+});
+const serializeAppResumePayload = (pathname, payload) => serializeResumePayload(
+  replaceResumePayloadPlaceholderValue(
+    payload,
+    createResumePayloadPlaceholderReplacements(pathname, payload),
+  ),
+);
 const splitHtmlForStreaming = (html) => {
   const bodyCloseIndex = html.lastIndexOf("</body>");
   if (bodyCloseIndex >= 0) {
@@ -2498,7 +2563,7 @@ const renderRouteResponse = async (route, pathname, params, c, moduleUrl, status
   const shellHtml = replaceHeadPlaceholder(
     replaceHeadPlaceholder(
         replaceHeadPlaceholder(
-          replaceHeadPlaceholder(html, RESUME_PAYLOAD_PLACEHOLDER, serializeResumePayload(payload)),
+          replaceHeadPlaceholder(html, RESUME_PAYLOAD_PLACEHOLDER, serializeAppResumePayload(pathname, payload)),
           CHUNK_CACHE_PLACEHOLDER,
           escapeInlineScriptText(createChunkCacheRegistrationScript(pathname, payload)),
         ),
@@ -2524,7 +2589,7 @@ const renderRouteResponse = async (route, pathname, params, c, moduleUrl, status
             controller.enqueue(
               encoder.encode(
                 "<template id=\\"" + templateId + "\\">" + chunk.html + "</template>" +
-                  "<script id=\\"" + payloadId + "\\" type=\\"application/eclipsa-resume+json\\">" + serializeResumePayload(chunk.payload) + "<\/script>" +
+                  "<script id=\\"" + payloadId + "\\" type=\\"application/eclipsa-resume+json\\">" + serializeAppResumePayload(pathname, chunk.payload) + "<\/script>" +
                   "<script>window.__eclipsa_stream.enqueue({boundaryId:" + JSON.stringify(chunk.boundaryId) + ",payloadScriptId:" + JSON.stringify(payloadId) + ",templateId:" + JSON.stringify(templateId) + "})<\/script>",
               ),
             );
@@ -2532,7 +2597,7 @@ const renderRouteResponse = async (route, pathname, params, c, moduleUrl, status
 
           controller.enqueue(
             encoder.encode(
-              "<script id=\\"" + RESUME_FINAL_STATE_ELEMENT_ID + "\\" type=\\"application/eclipsa-resume+json\\">" + serializeResumePayload(latestPayload) + "<\/script>" +
+              "<script id=\\"" + RESUME_FINAL_STATE_ELEMENT_ID + "\\" type=\\"application/eclipsa-resume+json\\">" + serializeAppResumePayload(pathname, latestPayload) + "<\/script>" +
                 "<script>" + escapeInlineScriptText(createChunkCacheRegistrationScript(pathname, latestPayload)) + "<\/script>" +
                 suffix,
             ),