@cimplify/cli 0.5.1 → 0.5.3

package/templates/storefront-bakery/app/.well-known/ucp/route.ts

@@ -5,48 +5,70 @@ import { NextResponse } from "next/server";
  *
  * Agents — Claude, ChatGPT, Gemini, MCP clients — probe
  * `https://<your-domain>/.well-known/ucp` to learn what commerce
- * capabilities your storefront supports. We forward the request to
- * Cimplify, which returns the canonical manifest; the response body
- * tells agents to make subsequent UCP calls directly to
- * `api.cimplify.io/ucp/v1/<handle>/*` (no per-request proxy here).
- *
- * Edge-cached for an hour because capabilities change rarely.
+ * capabilities your storefront supports. We resolve the business's
+ * UCP handle from the public key (via the storefront API), then forward
+ * to Cimplify for the canonical manifest. Edge-cached for an hour
+ * because capabilities change rarely.
  */
-const UCP_API_BASE =
-  process.env.NEXT_PUBLIC_CIMPLIFY_API_URL || "https://api.cimplify.io";
-
+const UCP_API_BASE = "https://api.cimplify.io";
+const STOREFRONT_API_BASE =
+  process.env.NODE_ENV === "production"
+    ? "https://storefronts.cimplify.io"
+    : "http://127.0.0.1:8787";
 
 export async function GET() {
-  const businessHandle = process.env.NEXT_PUBLIC_CIMPLIFY_BUSINESS_HANDLE;
-
-  if (!businessHandle) {
+  const publicKey = process.env.NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY;
+  if (!publicKey) {
     return NextResponse.json(
       {
-        error: "NEXT_PUBLIC_CIMPLIFY_BUSINESS_HANDLE not set",
+        error: "NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY not set",
         remediation:
-          "Set NEXT_PUBLIC_CIMPLIFY_BUSINESS_HANDLE in .env.local (and your deployment env) to your business handle.",
+          "Set NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY in .env.local (and your deployment env).",
       },
       { status: 500 },
     );
   }
 
   try {
-    const response = await fetch(
-      `${UCP_API_BASE}/ucp/v1/${businessHandle}/manifest`,
+    // Step 1 — resolve the business handle from the public key.
+    const businessResp = await fetch(`${STOREFRONT_API_BASE}/api/v1/business`, {
+      headers: { "X-API-Key": publicKey, "Content-Type": "application/json" },
+      next: { revalidate: 3600 },
+    });
+
+    if (!businessResp.ok) {
+      return NextResponse.json(
+        { error: `Failed to resolve business: ${businessResp.status}` },
+        { status: businessResp.status },
+      );
+    }
+
+    const businessJson = await businessResp.json();
+    const handle: string | undefined = businessJson?.data?.handle;
+    if (!handle) {
+      return NextResponse.json(
+        { error: "Business has no handle configured" },
+        { status: 500 },
+      );
+    }
+
+    // Step 2 — fetch the canonical UCP manifest.
+    const manifestResp = await fetch(
+      `${UCP_API_BASE}/ucp/v1/${handle}/manifest`,
       {
         headers: { "Content-Type": "application/json" },
         next: { revalidate: 3600 },
       },
     );
 
-    if (!response.ok) {
+    if (!manifestResp.ok) {
       return NextResponse.json(
-        { error: `Upstream UCP manifest fetch failed: ${response.status}` },
-        { status: response.status },
+        { error: `Upstream UCP manifest fetch failed: ${manifestResp.status}` },
+        { status: manifestResp.status },
       );
     }
 
-    const manifest = await response.json();
+    const manifest = await manifestResp.json();
     return NextResponse.json(manifest, {
       headers: {
         "Content-Type": "application/json",

package/templates/storefront-bakery/app/layout.tsx

@@ -8,6 +8,7 @@ import { ProductModal } from "@/components/product-modal";
 import { CartDrawer } from "@/components/cart-drawer";
 import { Suspense } from "react";
 import { brand } from "@/lib/brand";
+import { getSiteUrl } from "@/lib/site-url";
 
 const inter = Inter({
   subsets: ["latin"],
@@ -21,42 +22,46 @@ const playfair = Playfair_Display({
   display: "swap",
 });
 
-const SITE_URL =
-  process.env.NEXT_PUBLIC_SITE_URL?.trim() || "https://example.com";
-
-export const metadata: Metadata = {
-  metadataBase: new URL(SITE_URL),
-  title: {
-    default: brand.name,
-    template: `%s — ${brand.name}`,
-  },
-  description: brand.description,
-  openGraph: {
-    type: "website",
-    siteName: brand.name,
-    locale: brand.locale,
-  },
-  twitter: { card: "summary_large_image" },
-};
+export async function generateMetadata(): Promise<Metadata> {
+  const siteUrl = await getSiteUrl();
+  return {
+    metadataBase: new URL(siteUrl),
+    title: {
+      default: brand.name,
+      template: `%s — ${brand.name}`,
+    },
+    description: brand.description,
+    openGraph: {
+      type: "website",
+      siteName: brand.name,
+      locale: brand.locale,
+    },
+    twitter: { card: "summary_large_image" },
+  };
+}
 
-const ORGANIZATION_LD = {
-  "@context": "https://schema.org",
-  "@type": brand.schemaType,
-  name: brand.name,
-  url: SITE_URL,
-  description: brand.description,
-  email: brand.contact.email,
-  telephone: brand.contact.phoneTel,
-  address: {
-    "@type": "PostalAddress",
-    streetAddress: brand.contact.streetAddress,
-    addressLocality: brand.contact.city,
-    addressCountry: brand.contact.countryCode,
-  },
-  sameAs: brand.socials.map((s) => s.href),
-};
+async function organizationLd() {
+  const siteUrl = await getSiteUrl();
+  return {
+    "@context": "https://schema.org",
+    "@type": brand.schemaType,
+    name: brand.name,
+    url: siteUrl,
+    description: brand.description,
+    email: brand.contact.email,
+    telephone: brand.contact.phoneTel,
+    address: {
+      "@type": "PostalAddress",
+      streetAddress: brand.contact.streetAddress,
+      addressLocality: brand.contact.city,
+      addressCountry: brand.contact.countryCode,
+    },
+    sameAs: brand.socials.map((s) => s.href),
+  };
+}
 
-export default function RootLayout({ children }: { children: React.ReactNode }) {
+export default async function RootLayout({ children }: { children: React.ReactNode }) {
+  const ld = await organizationLd();
   return (
     <html lang="en" suppressHydrationWarning className={`${inter.variable} ${playfair.variable}`}>
       <body
@@ -65,7 +70,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
       >
         <script
           type="application/ld+json"
-          dangerouslySetInnerHTML={{ __html: JSON.stringify(ORGANIZATION_LD) }}
+          dangerouslySetInnerHTML={{ __html: JSON.stringify(ld) }}
         />
         <Providers>
           <Header />

package/templates/storefront-bakery/app/llms.txt/route.ts

@@ -1,11 +1,9 @@
 import { cacheTag, cacheLife } from "next/cache";
 import { getServerClient, tags, type Product } from "@cimplify/sdk/server";
 import { brand } from "@/lib/brand";
+import { getSiteUrl } from "@/lib/site-url";
 
-const SITE_URL =
-  process.env.NEXT_PUBLIC_SITE_URL?.trim() || "https://example.com";
-
-async function buildLlmsTxt(): Promise<string> {
+async function buildLlmsTxt(SITE_URL: string): Promise<string> {
   "use cache";
   cacheTag(tags.products(), tags.categories(), tags.collections());
   cacheLife("hours");
@@ -84,7 +82,7 @@ async function buildLlmsTxt(): Promise<string> {
  * into context windows.
  */
 export async function GET(): Promise<Response> {
-  const body = await buildLlmsTxt();
+  const body = await buildLlmsTxt(await getSiteUrl());
   return new Response(body, {
     headers: {
       "Content-Type": "text/plain; charset=utf-8",

package/templates/storefront-bakery/app/opensearch.xml/route.ts

@@ -1,7 +1,5 @@
 import { brand } from "@/lib/brand";
-
-const SITE_URL =
-  process.env.NEXT_PUBLIC_SITE_URL?.trim() || "https://example.com";
+import { getSiteUrl } from "@/lib/site-url";
 
 /**
  * OpenSearch description document — lets browsers add this site to the
@@ -9,14 +7,15 @@ const SITE_URL =
  * domain, they get an inline search box that hits /search?q=...
  */
 export async function GET(): Promise<Response> {
+  const siteUrl = await getSiteUrl();
   const xml = `<?xml version="1.0" encoding="UTF-8"?>
 <OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/">
   <ShortName>${escapeXml(brand.shortName)}</ShortName>
   <Description>Search ${escapeXml(brand.name)}</Description>
   <InputEncoding>UTF-8</InputEncoding>
-  <Url type="text/html" method="get" template="${SITE_URL}/search?q={searchTerms}" />
-  <Url type="application/opensearchdescription+xml" rel="self" template="${SITE_URL}/opensearch.xml" />
-  <moz:SearchForm>${SITE_URL}/search</moz:SearchForm>
+  <Url type="text/html" method="get" template="${siteUrl}/search?q={searchTerms}" />
+  <Url type="application/opensearchdescription+xml" rel="self" template="${siteUrl}/opensearch.xml" />
+  <moz:SearchForm>${siteUrl}/search</moz:SearchForm>
 </OpenSearchDescription>
 `;
   return new Response(xml, {

package/templates/storefront-bakery/app/robots.ts

@@ -1,9 +1,8 @@
 import type { MetadataRoute } from "next";
+import { getSiteUrl } from "@/lib/site-url";
 
-const SITE_URL =
-  process.env.NEXT_PUBLIC_SITE_URL?.trim() || "https://example.com";
-
-export default function robots(): MetadataRoute.Robots {
+export default async function robots(): Promise<MetadataRoute.Robots> {
+  const siteUrl = await getSiteUrl();
   return {
     rules: [
       {
@@ -12,7 +11,7 @@ export default function robots(): MetadataRoute.Robots {
         disallow: ["/cart", "/checkout", "/orders/", "/api/"],
       },
     ],
-    sitemap: `${SITE_URL}/sitemap.xml`,
-    host: SITE_URL,
+    sitemap: `${siteUrl}/sitemap.xml`,
+    host: siteUrl,
   };
 }

package/templates/storefront-bakery/app/sitemap.ts

@@ -1,8 +1,6 @@
 import type { MetadataRoute } from "next";
 import { getServerClient, type Product } from "@cimplify/sdk/server";
-
-const SITE_URL =
-  process.env.NEXT_PUBLIC_SITE_URL?.trim() || "https://example.com";
+import { getSiteUrl } from "@/lib/site-url";
 
 const STATIC_ROUTES: { path: string; priority: number; changeFrequency: "daily" | "weekly" | "monthly" }[] = [
   { path: "/", priority: 1.0, changeFrequency: "daily" },
@@ -15,6 +13,7 @@ const STATIC_ROUTES: { path: string; priority: number; changeFrequency: "daily"
 
 export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
   const now = new Date();
+  const siteUrl = await getSiteUrl();
   const client = getServerClient();
 
   const [productsRes, categoriesRes, collectionsRes] = await Promise.all([
@@ -28,7 +27,7 @@ export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
   const collections = collectionsRes.ok ? collectionsRes.value : [];
 
   const staticEntries: MetadataRoute.Sitemap = STATIC_ROUTES.map((r) => ({
-    url: `${SITE_URL}${r.path}`,
+    url: `${siteUrl}${r.path}`,
     lastModified: now,
     changeFrequency: r.changeFrequency,
     priority: r.priority,
@@ -38,21 +37,21 @@ export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
   // shop pages). Emit those as deep-linkable URLs so search engines and LLMs
   // can index each product canonically.
   const productEntries: MetadataRoute.Sitemap = products.map((p: Product) => ({
-    url: `${SITE_URL}/shop?product=${encodeURIComponent(p.slug ?? p.id)}`,
+    url: `${siteUrl}/shop?product=${encodeURIComponent(p.slug ?? p.id)}`,
     lastModified: p.updated_at ? new Date(p.updated_at) : now,
     changeFrequency: "weekly",
     priority: 0.7,
   }));
 
   const categoryEntries: MetadataRoute.Sitemap = categories.map((c) => ({
-    url: `${SITE_URL}/categories/${c.slug}`,
+    url: `${siteUrl}/categories/${c.slug}`,
     lastModified: now,
     changeFrequency: "weekly",
     priority: 0.6,
   }));
 
   const collectionEntries: MetadataRoute.Sitemap = collections.map((c) => ({
-    url: `${SITE_URL}/collections/${c.slug}`,
+    url: `${siteUrl}/collections/${c.slug}`,
     lastModified: now,
     changeFrequency: "weekly",
     priority: 0.6,

package/templates/storefront-bakery/components/providers.tsx

@@ -4,21 +4,12 @@ import { useMemo, type ReactNode } from "react";
 import { createCimplifyClient } from "@cimplify/sdk";
 import { CimplifyProvider, CartDrawerProvider } from "@cimplify/sdk/react";
 
-/**
- * Boots the Cimplify SDK client once on the client-side and exposes it via
- * <CimplifyProvider/>.
- *
- * Base-URL resolution:
- *   1) If NEXT_PUBLIC_CIMPLIFY_API_URL is set, use it verbatim.
- *   2) Otherwise use the current origin so requests flow through the
- *      Next.js rewrite in `next.config.ts` to the mock at :8787 (no CORS).
- *   3) Fall back to 127.0.0.1:8787 only during SSR, when there's no window.
- */
+// Same-origin client — every request goes through the Next.js rewrite in
+// next.config.ts, so no CORS preflight ever hits the browser.
 export function Providers({ children }: { children: ReactNode }) {
   const client = useMemo(() => {
     const baseUrl =
-      process.env.NEXT_PUBLIC_CIMPLIFY_API_URL?.trim() ||
-      (typeof window !== "undefined" ? window.location.origin : "http://127.0.0.1:8787");
+      typeof window !== "undefined" ? window.location.origin : "http://127.0.0.1:8787";
     const publicKey = process.env.NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY ?? "mock-dev";
     return createCimplifyClient({
       baseUrl,

package/templates/storefront-bakery/lib/site-url.ts

@@ -0,0 +1,29 @@
+import { headers } from "next/headers";
+
+/**
+ * Canonical absolute URL for this storefront, derived at request time.
+ *
+ * Resolution order:
+ *   1. `NEXT_PUBLIC_SITE_URL` — set when you need a fixed canonical
+ *      (multiple domains, www-vs-apex preference, etc.).
+ *   2. The request `Host` header — works automatically on every deploy,
+ *      including preview URLs and custom domains.
+ *   3. `https://example.com` — only ever returned during prerender of
+ *      a page that has no live request (rare in App Router).
+ */
+export async function getSiteUrl(): Promise<string> {
+  const explicit = process.env.NEXT_PUBLIC_SITE_URL?.trim();
+  if (explicit) return explicit;
+
+  try {
+    const h = await headers();
+    const host = h.get("host");
+    if (host) {
+      const isLocal = host.startsWith("localhost") || host.startsWith("127.");
+      return `${isLocal ? "http" : "https"}://${host}`;
+    }
+  } catch {
+    // `headers()` is unavailable in some build contexts — fall through.
+  }
+  return "https://example.com";
+}

package/templates/storefront-bakery/next.config.ts

@@ -1,18 +1,12 @@
 import type { NextConfig } from "next";
 
-const MOCK_URL = process.env.NEXT_PUBLIC_CIMPLIFY_API_URL?.trim() || "http://127.0.0.1:8787";
+// Same-origin proxy target for the storefront API. Local mock in dev,
+// hosted Cimplify in prod.
+const STOREFRONT_URL =
+  process.env.NODE_ENV === "production"
+    ? "https://storefronts.cimplify.io"
+    : "http://127.0.0.1:8787";
 
-/**
- * Same-origin proxy to the Cimplify mock so the browser never makes a
- * cross-origin request in dev (no CORS preflights, no flaky `Origin`
- * mismatches). The SDK's base URL stays empty/relative — requests go to
- * `/api/v1/...` on the Next origin, then this rewrite forwards them to
- * the mock at `127.0.0.1:8787`.
- *
- * In production, point `NEXT_PUBLIC_CIMPLIFY_API_URL` at your Cimplify
- * host and the rewrite continues to work the same way (or remove it and
- * pass the absolute URL through `<CimplifyProvider/>`).
- */
 const nextConfig: NextConfig = {
   // Enable Next 16's `cacheComponents` mode so we can use `'use cache'` +
   // `cacheTag` / `cacheLife` for SSR caching. Cached chrome streams first,
@@ -20,10 +14,10 @@ const nextConfig: NextConfig = {
   cacheComponents: true,
   async rewrites() {
     return [
-      { source: "/api/v1/:path*", destination: `${MOCK_URL}/api/v1/:path*` },
-      { source: "/img/:path*", destination: `${MOCK_URL}/img/:path*` },
-      { source: "/elements/:path*", destination: `${MOCK_URL}/elements/:path*` },
-      { source: "/_mock/:path*", destination: `${MOCK_URL}/_mock/:path*` },
+      { source: "/api/v1/:path*", destination: `${STOREFRONT_URL}/api/v1/:path*` },
+      { source: "/img/:path*", destination: `${STOREFRONT_URL}/img/:path*` },
+      { source: "/elements/:path*", destination: `${STOREFRONT_URL}/elements/:path*` },
+      { source: "/_mock/:path*", destination: `${STOREFRONT_URL}/_mock/:path*` },
     ];
   },
   images: {

package/templates/storefront-fashion/.env.example

@@ -1,22 +1,13 @@
-# Cimplify API base URL.
-# Dev: leave empty so the SDK uses the current origin (localhost:3000),
-# which Next.js rewrites to the mock at 127.0.0.1:8787 (see next.config.ts).
-# Production: set to your Cimplify host (e.g. https://api.cimplify.io).
-NEXT_PUBLIC_CIMPLIFY_API_URL=
-
-# Tenant public key. The mock accepts any value.
+# Your tenant public key. Get it from the desk's Developers tab in
+# production; the mock accepts any value during local dev.
 NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY=mock-dev
 
-# Business id used by the mock seed (fashion: Studio FRX).
+# Mock seed for local dev — picks which fixture business to serve. The
+# scaffold sets this to the right one for your template, so you only
+# need to change it when previewing other industries against the mock.
 NEXT_PUBLIC_CIMPLIFY_BUSINESS_ID=bus_studio_frx
 
-# Canonical public site URL — used by sitemap.xml, robots.txt, llms.txt,
-# and OpenGraph metadata. Set this on production deploys; `cimplify env push`
-# wires it into your linked project.
-NEXT_PUBLIC_SITE_URL=https://example.com
-
-# Business handle (human-readable slug, e.g. "akua-bakery"). Used by the
-# UCP manifest endpoint at /.well-known/ucp so AI agents (Claude / ChatGPT /
-# Gemini) can discover this storefront's commerce capabilities. Set this
-# on production deploys; leave empty in dev unless you're testing UCP.
-NEXT_PUBLIC_CIMPLIFY_BUSINESS_HANDLE=
+# Optional. Forces a fixed canonical URL for sitemap.xml, robots.txt,
+# OpenGraph, and llms.txt. Leave unset and the storefront derives the
+# canonical from the request `Host` header automatically.
+# NEXT_PUBLIC_SITE_URL=

package/templates/storefront-fashion/README.md

@@ -66,12 +66,10 @@ cimplify init my-store --template grocery    # coming soon
 
 ```diff
 # .env.local
-- NEXT_PUBLIC_CIMPLIFY_API_URL=http://127.0.0.1:8787
-+ NEXT_PUBLIC_CIMPLIFY_API_URL=https://api.cimplify.io
 - NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY=mock-dev
 + NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY=<your tenant key>
-- NEXT_PUBLIC_CIMPLIFY_BUSINESS_ID=bus_currents_electronics
+- NEXT_PUBLIC_CIMPLIFY_BUSINESS_ID=bus_studio_frx
 + NEXT_PUBLIC_CIMPLIFY_BUSINESS_ID=<your business id>
 ```
 
-Deploy with `cimplify deploy --prod` after linking the project. See [`cimplify` CLI docs](https://docs.cimplify.io/cli/deploy). `next.config.ts` already whitelists the SDK image hosts under `images.remotePatterns`.
+Deploy with `cimplify deploy --prod` after linking the project. See [`cimplify` CLI docs](https://www.cimplify.dev/docs/cli). `next.config.ts` already whitelists the SDK image hosts under `images.remotePatterns`.

package/templates/storefront-fashion/app/.well-known/ucp/route.ts

@@ -5,48 +5,70 @@ import { NextResponse } from "next/server";
  *
  * Agents — Claude, ChatGPT, Gemini, MCP clients — probe
  * `https://<your-domain>/.well-known/ucp` to learn what commerce
- * capabilities your storefront supports. We forward the request to
- * Cimplify, which returns the canonical manifest; the response body
- * tells agents to make subsequent UCP calls directly to
- * `api.cimplify.io/ucp/v1/<handle>/*` (no per-request proxy here).
- *
- * Edge-cached for an hour because capabilities change rarely.
+ * capabilities your storefront supports. We resolve the business's
+ * UCP handle from the public key (via the storefront API), then forward
+ * to Cimplify for the canonical manifest. Edge-cached for an hour
+ * because capabilities change rarely.
  */
-const UCP_API_BASE =
-  process.env.NEXT_PUBLIC_CIMPLIFY_API_URL || "https://api.cimplify.io";
-
+const UCP_API_BASE = "https://api.cimplify.io";
+const STOREFRONT_API_BASE =
+  process.env.NODE_ENV === "production"
+    ? "https://storefronts.cimplify.io"
+    : "http://127.0.0.1:8787";
 
 export async function GET() {
-  const businessHandle = process.env.NEXT_PUBLIC_CIMPLIFY_BUSINESS_HANDLE;
-
-  if (!businessHandle) {
+  const publicKey = process.env.NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY;
+  if (!publicKey) {
     return NextResponse.json(
       {
-        error: "NEXT_PUBLIC_CIMPLIFY_BUSINESS_HANDLE not set",
+        error: "NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY not set",
         remediation:
-          "Set NEXT_PUBLIC_CIMPLIFY_BUSINESS_HANDLE in .env.local (and your deployment env) to your business handle.",
+          "Set NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY in .env.local (and your deployment env).",
       },
       { status: 500 },
     );
   }
 
   try {
-    const response = await fetch(
-      `${UCP_API_BASE}/ucp/v1/${businessHandle}/manifest`,
+    // Step 1 — resolve the business handle from the public key.
+    const businessResp = await fetch(`${STOREFRONT_API_BASE}/api/v1/business`, {
+      headers: { "X-API-Key": publicKey, "Content-Type": "application/json" },
+      next: { revalidate: 3600 },
+    });
+
+    if (!businessResp.ok) {
+      return NextResponse.json(
+        { error: `Failed to resolve business: ${businessResp.status}` },
+        { status: businessResp.status },
+      );
+    }
+
+    const businessJson = await businessResp.json();
+    const handle: string | undefined = businessJson?.data?.handle;
+    if (!handle) {
+      return NextResponse.json(
+        { error: "Business has no handle configured" },
+        { status: 500 },
+      );
+    }
+
+    // Step 2 — fetch the canonical UCP manifest.
+    const manifestResp = await fetch(
+      `${UCP_API_BASE}/ucp/v1/${handle}/manifest`,
       {
         headers: { "Content-Type": "application/json" },
         next: { revalidate: 3600 },
       },
     );
 
-    if (!response.ok) {
+    if (!manifestResp.ok) {
       return NextResponse.json(
-        { error: `Upstream UCP manifest fetch failed: ${response.status}` },
-        { status: response.status },
+        { error: `Upstream UCP manifest fetch failed: ${manifestResp.status}` },
+        { status: manifestResp.status },
       );
     }
 
-    const manifest = await response.json();
+    const manifest = await manifestResp.json();
     return NextResponse.json(manifest, {
       headers: {
         "Content-Type": "application/json",

package/templates/storefront-fashion/app/layout.tsx

@@ -6,6 +6,7 @@ import { Header } from "@/components/header";
 import { Footer } from "@/components/footer";
 import { CartDrawer } from "@/components/cart-drawer";
 import { brand } from "@/lib/brand";
+import { getSiteUrl } from "@/lib/site-url";
 
 const inter = Inter({
   subsets: ["latin"],
@@ -20,42 +21,46 @@ const anton = Anton({
   display: "swap",
 });
 
-const SITE_URL =
-  process.env.NEXT_PUBLIC_SITE_URL?.trim() || "https://example.com";
-
-export const metadata: Metadata = {
-  metadataBase: new URL(SITE_URL),
-  title: {
+export async function generateMetadata(): Promise<Metadata> {
+  const siteUrl = await getSiteUrl();
+  return {
+    metadataBase: new URL(siteUrl),
+    title: {
     default: brand.name,
     template: `%s — ${brand.name}`,
-  },
-  description: brand.description,
-  openGraph: {
+    },
+    description: brand.description,
+    openGraph: {
     type: "website",
     siteName: brand.name,
     locale: brand.locale,
-  },
-  twitter: { card: "summary_large_image" },
-};
+    },
+    twitter: { card: "summary_large_image" },
+  };
+}
 
-const ORGANIZATION_LD = {
-  "@context": "https://schema.org",
-  "@type": brand.schemaType,
-  name: brand.name,
-  url: SITE_URL,
-  description: brand.description,
-  email: brand.contact.email,
-  telephone: brand.contact.phoneTel,
-  address: {
+async function organizationLd() {
+  const siteUrl = await getSiteUrl();
+  return {
+    "@context": "https://schema.org",
+    "@type": brand.schemaType,
+    name: brand.name,
+    url: siteUrl,
+    description: brand.description,
+    email: brand.contact.email,
+    telephone: brand.contact.phoneTel,
+    address: {
     "@type": "PostalAddress",
     streetAddress: brand.contact.streetAddress,
     addressLocality: brand.contact.city,
     addressCountry: brand.contact.countryCode,
-  },
-  sameAs: brand.socials.map((s) => s.href),
-};
+    },
+    sameAs: brand.socials.map((s) => s.href),
+  };
+}
 
-export default function RootLayout({ children }: { children: React.ReactNode }) {
+export default async function RootLayout({ children }: { children: React.ReactNode }) {
+  const ld = await organizationLd();
   return (
     <html lang="en" suppressHydrationWarning className={`${inter.variable} ${anton.variable}`}>
       <body
@@ -64,7 +69,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
       >
         <script
           type="application/ld+json"
-          dangerouslySetInnerHTML={{ __html: JSON.stringify(ORGANIZATION_LD) }}
+          dangerouslySetInnerHTML={{ __html: JSON.stringify(ld) }}
         />
         <Providers>
           <Header />