@decocms/nextjs 7.28.0-beta.2 → 7.28.0-beta.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decocms/nextjs",
-  "version": "7.28.0-beta.2",
+  "version": "7.28.0-beta.3",
   "type": "module",
   "engines": {
     "node": ">=24"
@@ -29,8 +29,8 @@
     "lint:unused": "knip"
   },
   "dependencies": {
-    "@decocms/blocks": "7.28.0-beta.2",
-    "@decocms/blocks-admin": "7.28.0-beta.2"
+    "@decocms/blocks": "7.28.0-beta.3",
+    "@decocms/blocks-admin": "7.28.0-beta.3"
   },
   "peerDependencies": {
     "next": ">=15.0.0",

package/src/DecoPageRenderer.test.tsx

@@ -1,6 +1,6 @@
+import { registerSectionsSync } from "@decocms/blocks/cms";
 import { renderToString } from "react-dom/server";
 import { describe, expect, it } from "vitest";
-import { registerSectionsSync } from "@decocms/blocks/cms";
 import { DecoPageRenderer } from "./DecoPageRenderer";
 
 function Hero({ label }: { label?: string }) {
@@ -16,8 +16,18 @@ describe("DecoPageRenderer (next)", () => {
 
     const element = await DecoPageRenderer({
       sections: [
-        { key: "site/sections/NextPageA.tsx", component: "site/sections/NextPageA.tsx", props: { label: "first" }, index: 0 } as any,
-        { key: "site/sections/NextPageB.tsx", component: "site/sections/NextPageB.tsx", props: { label: "second" }, index: 1 } as any,
+        {
+          key: "site/sections/NextPageA.tsx",
+          component: "site/sections/NextPageA.tsx",
+          props: { label: "first" },
+          index: 0,
+        } as any,
+        {
+          key: "site/sections/NextPageB.tsx",
+          component: "site/sections/NextPageB.tsx",
+          props: { label: "second" },
+          index: 1,
+        } as any,
       ],
       pagePath: "/",
     });

package/src/DecoPageRenderer.tsx

@@ -1,8 +1,8 @@
 import type { DeferredSection, ResolvedSection } from "@decocms/blocks/cms";
 import { resolveDeferredSection } from "@decocms/blocks/cms";
-import { SectionRenderer } from "./SectionRenderer";
-import { DeferredSectionBoundary } from "./DeferredSection";
 import { cloneElement, type ReactElement, type ReactNode } from "react";
+import { DeferredSectionBoundary } from "./DeferredSection";
+import { SectionRenderer } from "./SectionRenderer";
 
 interface DecoPageRendererProps {
   sections: ResolvedSection[];
@@ -19,7 +19,9 @@ type PageItem =
 
 function mergeSections(resolved: ResolvedSection[], deferred: DeferredSection[]): PageItem[] {
   const items: PageItem[] = [];
-  resolved.forEach((section, i) => items.push({ type: "eager", section, sort: section.index ?? i }));
+  resolved.forEach((section, i) =>
+    items.push({ type: "eager", section, sort: section.index ?? i }),
+  );
   for (const d of deferred) items.push({ type: "deferred", deferred: d, sort: d.index });
   items.sort((a, b) => a.sort - b.sort);
   return items;
@@ -54,10 +56,12 @@ export async function DecoPageRenderer({
   for (const d of deferredSections) {
     deferredPromises.set(
       d.index,
-      resolveDeferredSection(d.component, d.rawProps ?? {}, pagePath, matcherCtx).then((resolved) => {
-        if (!resolved) return null;
-        return { ...resolved, index: d.index };
-      }),
+      resolveDeferredSection(d.component, d.rawProps ?? {}, pagePath, matcherCtx).then(
+        (resolved) => {
+          if (!resolved) return null;
+          return { ...resolved, index: d.index };
+        },
+      ),
     );
   }
 

package/src/DecoRootLayout.tsx

@@ -1,6 +1,6 @@
-import type { ReactNode } from "react";
 import { LiveControls } from "@decocms/blocks/hooks";
 import { ANALYTICS_SCRIPT } from "@decocms/blocks/sdk/analytics";
+import type { ReactNode } from "react";
 
 function buildDecoEventsBootstrap(account?: string): string {
   const accountJson = JSON.stringify(account ?? "");

package/src/DeferredSection.test.tsx

@@ -1,6 +1,6 @@
+import { registerSectionsSync } from "@decocms/blocks/cms";
 import { renderToString } from "react-dom/server";
 import { describe, expect, it } from "vitest";
-import { registerSectionsSync } from "@decocms/blocks/cms";
 import { DeferredSectionBoundary } from "./DeferredSection";
 
 function Hero({ label }: { label?: string }) {

package/src/DeferredSection.tsx

@@ -1,6 +1,6 @@
-import { Suspense, type ReactNode } from "react";
 import type { DeferredSection, ResolvedSection } from "@decocms/blocks/cms";
 import { SectionErrorBoundary } from "@decocms/blocks/hooks";
+import { type ReactNode, Suspense } from "react";
 import { SectionRenderer } from "./SectionRenderer";
 
 interface DeferredSectionBoundaryProps {

package/src/SectionRenderer.test.tsx

@@ -1,6 +1,6 @@
+import { registerSection, registerSections, registerSectionsSync } from "@decocms/blocks/cms";
 import { renderToString } from "react-dom/server";
 import { beforeEach, describe, expect, it, vi } from "vitest";
-import { registerSection, registerSections, registerSectionsSync } from "@decocms/blocks/cms";
 import { SectionRenderer } from "./SectionRenderer";
 
 function Hero({ label }: { label?: string }) {

package/src/SectionRenderer.tsx

@@ -1,11 +1,7 @@
-import { createElement, type ReactNode } from "react";
-import {
-  getSection,
-  getSectionOptions,
-  getSyncComponent,
-} from "@decocms/blocks/cms";
 import type { ResolvedSection } from "@decocms/blocks/cms";
+import { getSection, getSectionOptions, getSyncComponent } from "@decocms/blocks/cms";
 import { SectionErrorBoundary } from "@decocms/blocks/hooks";
+import { createElement, type ReactNode } from "react";
 import { ClientOnlySection } from "./ClientOnlySection";
 
 interface SectionRendererProps {

package/src/createDecoPage.draft.test.tsx

@@ -42,7 +42,7 @@ function seedPublishedHome() {
 afterEach(() => {
   cookiesMock.mockClear();
   connectionMock.mockClear();
-  delete process.env.DECO_DRAFT_PREVIEW_HOST;
+  delete process.env.DECO_ALLOWED_PREVIEW_HOSTS;
   delete process.env.DECO_SANDBOX_ORIGIN_SUFFIXES;
 });
 
@@ -75,7 +75,7 @@ describe("createDecoPage — draft preview gate", () => {
   });
 
   it("reads cookies() once the feature is fully configured", async () => {
-    process.env.DECO_DRAFT_PREVIEW_HOST = "preview.example";
+    process.env.DECO_ALLOWED_PREVIEW_HOSTS = "preview.example";
     seedPublishedHome();
 
     const { default: Page } = createDecoPage({ siteName: "test-site" });

package/src/createDecoPage.test.tsx

@@ -1,6 +1,6 @@
+import { registerSections, setBlocks } from "@decocms/blocks/cms";
 import { renderToString } from "react-dom/server";
 import { describe, expect, it } from "vitest";
-import { registerSections, setBlocks } from "@decocms/blocks/cms";
 import { createDecoPage } from "./createDecoPage";
 
 function Hero({ label }: { label?: string }) {
@@ -58,8 +58,6 @@ describe("createDecoPage (next)", () => {
 
     const { default: Page } = createDecoPage({ siteName: "test-site" });
 
-    await expect(
-      Page({ params: Promise.resolve({ slug: ["missing"] }) }),
-    ).rejects.toThrow();
+    await expect(Page({ params: Promise.resolve({ slug: ["missing"] }) })).rejects.toThrow();
   });
 });

package/src/createDecoPage.tsx

@@ -90,7 +90,7 @@ export function createDecoPage({ siteName }: CreateDecoPageOptions) {
    *     first wins for both. So this must be awaited at the top of BOTH, not
    *     just the page. `cache()` here makes the second call free.
    *
-   * Gated on `isDraftPreviewEnabled()` (DECO_DRAFT_PREVIEW_HOST non-empty) — a
+   * Gated on `isDraftPreviewEnabled()` (DECO_ALLOWED_PREVIEW_HOSTS non-empty) — a
    * plain env read, not a dynamic API —
    * so sites that never opt in behave exactly as before. That gate is doing
    * real work: `cookies()` and `searchParams` are both dynamic, and touching

package/src/draft.ts

@@ -106,7 +106,7 @@ export function selectDraftPointer(
  * `cookies()`. There is deliberately no request header in the path: the page
  * owns the decision, so a draft keeps working on routes the middleware matcher
  * never sees, and there is one less forgeable input to reason about. (The
- * pointer was never a secret — the sandbox handle is the capability — so a
+ * pointer was never a secret — the draft id (the token's authority) is the capability — so a
  * client supplying one directly is equivalent to typing the query param.)
  *
  * Returns whether a draft was bound, so callers can surface an explicit
@@ -122,7 +122,7 @@ export async function ensureDraft(searchParams?: DraftSearchParams): Promise<boo
 
   // Host gate, checked only once a pointer exists (headers() is a dynamic
   // API): the same build may serve the preview domain and the production
-  // domain, and only hosts named in DECO_DRAFT_PREVIEW_HOST may render
+  // domain, and only hosts named in DECO_ALLOWED_PREVIEW_HOSTS may render
   // drafts — production stays published no matter what the URL carries.
   const requestHeaders = await headers();
   const host = requestHeaders.get("x-forwarded-host") ?? requestHeaders.get("host");

package/src/draftMiddleware.test.ts

@@ -6,10 +6,10 @@ import { applyDraft, prepareDraft, rewriteToDraftRoute } from "./draftMiddleware
 
 beforeEach(() => {
   // The middleware is host-gated; these tests run as the allowed host.
-  process.env.DECO_DRAFT_PREVIEW_HOST = "site.example";
+  process.env.DECO_ALLOWED_PREVIEW_HOSTS = "site.example";
 });
 afterEach(() => {
-  delete process.env.DECO_DRAFT_PREVIEW_HOST;
+  delete process.env.DECO_ALLOWED_PREVIEW_HOSTS;
 });
 
 function request(url: string, cookie?: string): NextRequest {
@@ -21,17 +21,21 @@ function request(url: string, cookie?: string): NextRequest {
 
 describe("prepareDraft", () => {
   it("reads the pointer from the param", () => {
-    expect(prepareDraft(request("https://site.example/p?__draft=abc@v1")).pointer).toBe("abc@v1");
+    expect(prepareDraft(request("https://site.example/p?__draft=abc.localhost@v1")).pointer).toBe(
+      "abc.localhost@v1",
+    );
   });
 
   it("reads the pointer from the cookie on a plain navigation", () => {
-    expect(prepareDraft(request("https://site.example/p", "abc@v1")).pointer).toBe("abc@v1");
+    expect(prepareDraft(request("https://site.example/p", "abc.localhost@v1")).pointer).toBe(
+      "abc.localhost@v1",
+    );
   });
 
   it("is inert on a host outside the allowlist — the production domain", () => {
     // Same build, different Host: no cookie, no rewrite, nothing touched.
     const req = request("https://fila.com.br/p?__draft=abc@v1");
-    process.env.DECO_DRAFT_PREVIEW_HOST = "fila.vtex.app";
+    process.env.DECO_ALLOWED_PREVIEW_HOSTS = "fila.vtex.app";
     expect(prepareDraft(req)).toEqual({ pointer: null, setCookie: null, clearCookie: false });
     expect(rewriteToDraftRoute(req, prepareDraft(req))).toBeNull();
   });
@@ -40,7 +44,7 @@ describe("prepareDraft", () => {
     // There is no request-header path any more; the page reads searchParams
     // and cookies itself, so a forged header is simply not an input.
     const req = new NextRequest(new URL("https://site.example/p"), {
-      headers: { "x-deco-draft": "attacker@v1" },
+      headers: { "x-deco-draft": "attacker.localhost@v1" },
     });
     expect(prepareDraft(req).pointer).toBeNull();
   });
@@ -48,11 +52,11 @@ describe("prepareDraft", () => {
 
 describe("applyDraft", () => {
   it("sets a partitioned cross-site cookie when entering draft mode", () => {
-    const decision = prepareDraft(request("https://site.example/p?__draft=abc@v1"));
+    const decision = prepareDraft(request("https://site.example/p?__draft=abc.localhost@v1"));
     const res = applyDraft(NextResponse.next(), decision);
 
     const setCookie = res.headers.get("set-cookie") ?? "";
-    expect(setCookie).toContain(`${DRAFT_COOKIE}=abc%40v1`);
+    expect(setCookie).toContain(`${DRAFT_COOKIE}=abc.localhost%40v1`);
     // The preview iframe is cross-site, so these attributes are what make the
     // cookie survive at all — not hardening extras.
     expect(setCookie).toMatch(/SameSite=None/i);
@@ -64,7 +68,7 @@ describe("applyDraft", () => {
   it("marks a draft response uncacheable and unindexable", () => {
     // With the pointer in a cookie, draft and published share a URL — a CDN
     // keyed on URL alone would serve unpublished content to a real visitor.
-    const decision = prepareDraft(request("https://site.example/p", "abc@v1"));
+    const decision = prepareDraft(request("https://site.example/p", "abc.localhost@v1"));
     const res = applyDraft(NextResponse.next(), decision);
 
     expect(res.headers.get("cache-control")).toBe("no-store, private");
@@ -83,7 +87,9 @@ describe("applyDraft", () => {
   });
 
   it("clears the cookie on ?__draft=off", () => {
-    const decision = prepareDraft(request("https://site.example/p?__draft=off", "abc@v1"));
+    const decision = prepareDraft(
+      request("https://site.example/p?__draft=off", "abc.localhost@v1"),
+    );
     expect(decision.clearCookie).toBe(true);
 
     const res = applyDraft(NextResponse.next(), decision);
@@ -98,16 +104,16 @@ describe("applyDraft", () => {
 
 describe("rewriteToDraftRoute", () => {
   it("rewrites a drafted request onto the dynamic draft route", () => {
-    const req = request("https://site.example/blog/hello?__draft=abc@v1");
+    const req = request("https://site.example/blog/hello?__draft=abc.localhost@v1");
     const res = rewriteToDraftRoute(req, prepareDraft(req));
     const target = new URL(res?.headers.get("x-middleware-rewrite") ?? "");
     expect(target.pathname).toBe("/_draft/blog/hello");
     // The pointer must survive: the draft page reads it from searchParams.
-    expect(target.searchParams.get("__draft")).toBe("abc@v1");
+    expect(target.searchParams.get("__draft")).toBe("abc.localhost@v1");
   });
 
   it("rewrites a cookie-only navigation too", () => {
-    const req = request("https://site.example/blog/hello", "abc@v1");
+    const req = request("https://site.example/blog/hello", "abc.localhost@v1");
     const res = rewriteToDraftRoute(req, prepareDraft(req));
     expect(new URL(res?.headers.get("x-middleware-rewrite") ?? "").pathname).toBe(
       "/_draft/blog/hello",
@@ -122,12 +128,12 @@ describe("rewriteToDraftRoute", () => {
   });
 
   it("never nests the prefix when middleware re-runs on the rewritten URL", () => {
-    const req = request("https://site.example/_draft/blog/hello?__draft=abc@v1");
+    const req = request("https://site.example/_draft/blog/hello?__draft=abc.localhost@v1");
     expect(rewriteToDraftRoute(req, prepareDraft(req))).toBeNull();
   });
 
   it("does not rewrite when leaving draft mode", () => {
-    const req = request("https://site.example/blog/hello?__draft=off", "abc@v1");
+    const req = request("https://site.example/blog/hello?__draft=off", "abc.localhost@v1");
     expect(rewriteToDraftRoute(req, prepareDraft(req))).toBeNull();
   });
 });

package/src/draftMiddleware.ts

@@ -40,13 +40,11 @@ import {
 const INERT: DraftMiddlewareDecision = { pointer: null, setCookie: null, clearCookie: false };
 
 export function prepareDraft(request: NextRequest): DraftMiddlewareDecision {
-  // Host gate first: on a host not named in DECO_DRAFT_PREVIEW_HOST the
+  // Host gate first: on a host not named in DECO_ALLOWED_PREVIEW_HOSTS the
   // decision is inert — no cookie written, no rewrite, no headers touched —
   // so the production domain behaves as if the feature didn't exist.
   const host =
-    request.headers.get("x-forwarded-host") ??
-    request.headers.get("host") ??
-    request.nextUrl.host;
+    request.headers.get("x-forwarded-host") ?? request.headers.get("host") ?? request.nextUrl.host;
   if (!isDraftHostAllowed(host)) return INERT;
   return decideDraft(new URL(request.url), request.cookies.get(DRAFT_COOKIE)?.value ?? null);
 }