create-brainerce-store 1.65.0 → 1.67.0

package/templates/nextjs/base/src/components/seo/article-json-ld.tsx

@@ -1,59 +1,60 @@
-import type { BlogPost } from 'brainerce';
-import { buildArticleJsonLd, buildBreadcrumbJsonLd } from 'brainerce';
-import { getNonce } from '@/core/lib/nonce';
-
-interface ArticleJsonLdProps {
-  post: BlogPost;
-  url: string;
-  /** Store display name — feeds Article.publisher (and the author fallback). */
-  organizationName?: string;
-}
-
-/**
- * Article + BreadcrumbList structured data for a blog post page.
- *
- * Uses the SDK builders for the schema shape, but renders the <script> here so
- * we can attach the CSP nonce (the SDK's jsonLdScriptProps can't).
- */
-export async function ArticleJsonLd({ post, url, organizationName }: ArticleJsonLdProps) {
-  const nonce = await getNonce();
-  const baseUrl = process.env.NEXT_PUBLIC_SITE_URL || '';
-
-  const articleJsonLd = buildArticleJsonLd(post, {
-    siteUrl: baseUrl,
-    path: url,
-    organizationName,
-  });
-
-  const breadcrumbJsonLd = buildBreadcrumbJsonLd([
-    { name: 'Home', url: baseUrl || '/' },
-    { name: 'Blog', url: `${baseUrl}/blog` },
-    { name: post.title, url },
-  ]);
-
-  return (
-    <>
-      <script
-        type="application/ld+json"
-        nonce={nonce}
-        suppressHydrationWarning
-        dangerouslySetInnerHTML={{ __html: serializeJsonLd(articleJsonLd) }}
-      />
-      <script
-        type="application/ld+json"
-        nonce={nonce}
-        suppressHydrationWarning
-        dangerouslySetInnerHTML={{ __html: serializeJsonLd(breadcrumbJsonLd) }}
-      />
-    </>
-  );
-}
-
-// Escape `<`, `>`, `&` so AI-generated article copy can't break out of the
-// <script> element or inject HTML.
-function serializeJsonLd(value: unknown): string {
-  return JSON.stringify(value)
-    .replace(/</g, '\\u003c')
-    .replace(/>/g, '\\u003e')
-    .replace(/&/g, '\\u0026');
-}
+import type { BlogPost } from 'brainerce';
+import { buildArticleJsonLd, buildBreadcrumbJsonLd } from 'brainerce';
+import { getNonce } from '@/core/lib/nonce';
+import { getCanonicalSiteUrl } from '@/core/lib/site-url';
+
+interface ArticleJsonLdProps {
+  post: BlogPost;
+  url: string;
+  /** Store display name — feeds Article.publisher (and the author fallback). */
+  organizationName?: string;
+}
+
+/**
+ * Article + BreadcrumbList structured data for a blog post page.
+ *
+ * Uses the SDK builders for the schema shape, but renders the <script> here so
+ * we can attach the CSP nonce (the SDK's jsonLdScriptProps can't).
+ */
+export async function ArticleJsonLd({ post, url, organizationName }: ArticleJsonLdProps) {
+  const nonce = await getNonce();
+  const baseUrl = await getCanonicalSiteUrl();
+
+  const articleJsonLd = buildArticleJsonLd(post, {
+    siteUrl: baseUrl,
+    path: url,
+    organizationName,
+  });
+
+  const breadcrumbJsonLd = buildBreadcrumbJsonLd([
+    { name: 'Home', url: baseUrl || '/' },
+    { name: 'Blog', url: `${baseUrl}/blog` },
+    { name: post.title, url },
+  ]);
+
+  return (
+    <>
+      <script
+        type="application/ld+json"
+        nonce={nonce}
+        suppressHydrationWarning
+        dangerouslySetInnerHTML={{ __html: serializeJsonLd(articleJsonLd) }}
+      />
+      <script
+        type="application/ld+json"
+        nonce={nonce}
+        suppressHydrationWarning
+        dangerouslySetInnerHTML={{ __html: serializeJsonLd(breadcrumbJsonLd) }}
+      />
+    </>
+  );
+}
+
+// Escape `<`, `>`, `&` so AI-generated article copy can't break out of the
+// <script> element or inject HTML.
+function serializeJsonLd(value: unknown): string {
+  return JSON.stringify(value)
+    .replace(/</g, '\\u003c')
+    .replace(/>/g, '\\u003e')
+    .replace(/&/g, '\\u0026');
+}

package/templates/nextjs/base/src/components/seo/category-json-ld.tsx

@@ -1,61 +1,60 @@
-import type { CategoryDetail } from 'brainerce';
-import { buildCollectionPageJsonLd, buildBreadcrumbJsonLd } from 'brainerce';
-import { getNonce } from '@/core/lib/nonce';
-
-interface CategoryJsonLdProps {
-  category: CategoryDetail;
-  url: string;
-}
-
-/**
- * CollectionPage + BreadcrumbList structured data for a category (collection)
- * landing page. NEVER emit Product markup on a listing page — Google's Product
- * rich results are single-product only (see ProductJsonLd for PDPs).
- *
- * Uses the SDK builders for the schema shape, but renders the <script> here so
- * we can attach the CSP nonce (the SDK's jsonLdScriptProps can't).
- */
-export async function CategoryJsonLd({ category, url }: CategoryJsonLdProps) {
-  const nonce = await getNonce();
-  const baseUrl = process.env.NEXT_PUBLIC_SITE_URL || '';
-
-  const collectionJsonLd = buildCollectionPageJsonLd(category, { siteUrl: baseUrl, path: url });
-
-  // Breadcrumb: Home → ancestor categories → this category.
-  const crumbs: Array<{ name: string; url: string }> = [
-    { name: 'Home', url: baseUrl || '/' },
-  ];
-  for (const ancestor of category.breadcrumb) {
-    if (ancestor.slug) {
-      crumbs.push({ name: ancestor.name, url: `${baseUrl}/category/${ancestor.slug}` });
-    }
-  }
-  crumbs.push({ name: category.name, url });
-  const breadcrumbJsonLd = buildBreadcrumbJsonLd(crumbs);
-
-  return (
-    <>
-      <script
-        type="application/ld+json"
-        nonce={nonce}
-        suppressHydrationWarning
-        dangerouslySetInnerHTML={{ __html: serializeJsonLd(collectionJsonLd) }}
-      />
-      <script
-        type="application/ld+json"
-        nonce={nonce}
-        suppressHydrationWarning
-        dangerouslySetInnerHTML={{ __html: serializeJsonLd(breadcrumbJsonLd) }}
-      />
-    </>
-  );
-}
-
-// Escape `<`, `>`, `&` so merchant-authored category copy can't break out of
-// the <script> element or inject HTML.
-function serializeJsonLd(value: unknown): string {
-  return JSON.stringify(value)
-    .replace(/</g, '\\u003c')
-    .replace(/>/g, '\\u003e')
-    .replace(/&/g, '\\u0026');
-}
+import type { CategoryDetail } from 'brainerce';
+import { buildCollectionPageJsonLd, buildBreadcrumbJsonLd } from 'brainerce';
+import { getNonce } from '@/core/lib/nonce';
+import { getCanonicalSiteUrl } from '@/core/lib/site-url';
+
+interface CategoryJsonLdProps {
+  category: CategoryDetail;
+  url: string;
+}
+
+/**
+ * CollectionPage + BreadcrumbList structured data for a category (collection)
+ * landing page. NEVER emit Product markup on a listing page — Google's Product
+ * rich results are single-product only (see ProductJsonLd for PDPs).
+ *
+ * Uses the SDK builders for the schema shape, but renders the <script> here so
+ * we can attach the CSP nonce (the SDK's jsonLdScriptProps can't).
+ */
+export async function CategoryJsonLd({ category, url }: CategoryJsonLdProps) {
+  const nonce = await getNonce();
+  const baseUrl = await getCanonicalSiteUrl();
+
+  const collectionJsonLd = buildCollectionPageJsonLd(category, { siteUrl: baseUrl, path: url });
+
+  // Breadcrumb: Home → ancestor categories → this category.
+  const crumbs: Array<{ name: string; url: string }> = [{ name: 'Home', url: baseUrl || '/' }];
+  for (const ancestor of category.breadcrumb) {
+    if (ancestor.slug) {
+      crumbs.push({ name: ancestor.name, url: `${baseUrl}/category/${ancestor.slug}` });
+    }
+  }
+  crumbs.push({ name: category.name, url });
+  const breadcrumbJsonLd = buildBreadcrumbJsonLd(crumbs);
+
+  return (
+    <>
+      <script
+        type="application/ld+json"
+        nonce={nonce}
+        suppressHydrationWarning
+        dangerouslySetInnerHTML={{ __html: serializeJsonLd(collectionJsonLd) }}
+      />
+      <script
+        type="application/ld+json"
+        nonce={nonce}
+        suppressHydrationWarning
+        dangerouslySetInnerHTML={{ __html: serializeJsonLd(breadcrumbJsonLd) }}
+      />
+    </>
+  );
+}
+
+// Escape `<`, `>`, `&` so merchant-authored category copy can't break out of
+// the <script> element or inject HTML.
+function serializeJsonLd(value: unknown): string {
+  return JSON.stringify(value)
+    .replace(/</g, '\\u003c')
+    .replace(/>/g, '\\u003e')
+    .replace(/&/g, '\\u0026');
+}

package/templates/nextjs/base/src/components/seo/product-json-ld.tsx

@@ -1,6 +1,7 @@
 import type { Product, ShippingSummaryEntry } from 'brainerce';
-import { buildProductJsonLd, buildBreadcrumbJsonLd } from 'brainerce';
+import { buildProductJsonLd, buildBreadcrumbJsonLd, buildProductFaqJsonLd } from 'brainerce';
 import { getNonce } from '@/core/lib/nonce';
+import { getCanonicalSiteUrl } from '@/core/lib/site-url';
 import { resolveCurrency } from '@/core/lib/resolve-currency';
 
 interface ProductJsonLdProps {
@@ -27,7 +28,7 @@ export async function ProductJsonLd({ product, url, currency, shipping }: Produc
   // lives in exactly one place across all server-side currency reads.
   const resolvedCurrency = resolveCurrency(null, currency);
   const nonce = await getNonce();
-  const baseUrl = process.env.NEXT_PUBLIC_SITE_URL || '';
+  const baseUrl = await getCanonicalSiteUrl();
 
   const productJsonLd = buildProductJsonLd(product, {
     siteUrl: baseUrl,
@@ -42,6 +43,11 @@ export async function ProductJsonLd({ product, url, currency, shipping }: Produc
     { name: product.name, url },
   ]);
 
+  // FAQPage from the product's Q&A — null (no script) when the product has
+  // none. The visible FAQ section on the PDP renders the SAME pairs; this is
+  // corroboration for engines, never a substitute for visible text.
+  const faqJsonLd = buildProductFaqJsonLd(product);
+
   return (
     <>
       <script
@@ -56,6 +62,14 @@ export async function ProductJsonLd({ product, url, currency, shipping }: Produc
         suppressHydrationWarning
         dangerouslySetInnerHTML={{ __html: serializeJsonLd(breadcrumbJsonLd) }}
       />
+      {faqJsonLd ? (
+        <script
+          type="application/ld+json"
+          nonce={nonce}
+          suppressHydrationWarning
+          dangerouslySetInnerHTML={{ __html: serializeJsonLd(faqJsonLd) }}
+        />
+      ) : null}
     </>
   );
 }

package/templates/nextjs/base/src/core/lib/brainerce.server.ts

@@ -0,0 +1,81 @@
+import { BrainerceClient } from 'brainerce';
+import { cache } from 'react';
+import { SALES_CHANNEL_ID } from '@/core/lib/brainerce';
+import { pickPublicStoreInfo, type PublicStoreInfo } from '@/core/lib/store-info';
+import { getRequestOrigin } from '@/core/lib/site-url';
+
+/**
+ * SERVER-ONLY half of the SDK wiring. Kept apart from `brainerce.ts` on
+ * purpose: everything here reaches `next/headers` (to resolve the request's
+ * origin), and ~30 client components import `getClient` from `brainerce.ts`.
+ * A single shared module would drag `next/headers` into the client bundle and
+ * fail the build outright — which is exactly what happened when these two
+ * functions still lived there.
+ *
+ * Import from here in Server Components, `generateMetadata`, route handlers,
+ * `sitemap.ts` / `robots.ts`. Never from a `'use client'` file.
+ */
+
+/**
+ * Server-side client — calls the backend directly (no proxy needed for public
+ * data). Used by Server Components for SSR data fetching.
+ *
+ * ⛔ ASYNC on purpose. The backend compares the `Origin` we send against the
+ * domain configured on the sales channel, and a LIVE channel rejects both a
+ * mismatched Origin AND a missing one with 403. The correct value is only
+ * knowable from the request when no `SITE_URL` is configured — the norm for
+ * AI-builder deploys — so resolving it needs an await. This previously read
+ * `process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000'`, which sent
+ * localhost from every such deploy, so every SSR call failed the moment the
+ * channel went Live.
+ */
+export async function getServerClient(locale?: string): Promise<BrainerceClient> {
+  const apiUrl = process.env.BRAINERCE_API_URL || 'https://api.brainerce.com';
+  const client = new BrainerceClient({
+    salesChannelId: SALES_CHANNEL_ID,
+    baseUrl: apiUrl,
+    origin: await getRequestOrigin(),
+  });
+  if (locale) {
+    client.setLocale(locale);
+  }
+  return client;
+}
+
+/**
+ * Server-side cached fetch of store info, used to seed `<StoreProvider>` at
+ * SSR so client components don't render with `null` storeInfo and bake the
+ * wrong currency symbol into the HTML Googlebot indexes.
+ *
+ * Two cache layers:
+ *   - React `cache()` dedupes calls within a single request render so the
+ *     layout + `generateMetadata` share one fetch.
+ *   - Next.js `fetch({ next: { revalidate, tags } })` caches the response
+ *     across requests for ~60s and lets the dashboard bust the cache via
+ *     `revalidateTag('store-info')` on store-config save.
+ *
+ * Returns `null` on hard failure so the provider's client-side `useEffect`
+ * fallback can take over — behaviour identical to pre-SSR-hydration.
+ *
+ * Bypasses {@link getServerClient} on purpose: the SDK's internal `fetch`
+ * does not forward `next:` options, so it cannot participate in the Next.js
+ * Data Cache today. Switch back to the SDK once it accepts `fetchOptions`.
+ */
+export const fetchStoreInfo = cache(async (locale?: string): Promise<PublicStoreInfo | null> => {
+  const apiUrl = process.env.BRAINERCE_API_URL || 'https://api.brainerce.com';
+  const siteOrigin = await getRequestOrigin();
+  const url = `${apiUrl}/api/vc/${encodeURIComponent(SALES_CHANNEL_ID)}/info`;
+  try {
+    const res = await fetch(url, {
+      headers: {
+        Origin: siteOrigin,
+        ...(locale ? { 'Accept-Language': locale } : {}),
+      },
+      next: { revalidate: 60, tags: ['store-info'] },
+    });
+    if (!res.ok) return null;
+    return pickPublicStoreInfo(await res.json());
+  } catch {
+    return null;
+  }
+});

package/templates/nextjs/base/src/core/lib/brainerce.ts.ejs

@@ -1,110 +1,60 @@
-import { BrainerceClient } from 'brainerce';
-import { cache } from 'react';
-import { pickPublicStoreInfo, type PublicStoreInfo } from '@/core/lib/store-info';
-
-// Read either env var name. The new one is preferred; the old one is a soft
-// alias kept for backwards compatibility — both are accepted by the SDK.
-const SALES_CHANNEL_ID =
-  process.env.NEXT_PUBLIC_BRAINERCE_SALES_CHANNEL_ID ||
-  process.env.NEXT_PUBLIC_BRAINERCE_CONNECTION_ID ||
-  '<%= connectionId %>';
-
-// Singleton SDK client — routes through same-origin BFF proxy for httpOnly cookie auth
-let clientInstance: BrainerceClient | null = null;
-
-export function getClient(): BrainerceClient {
-  if (!clientInstance) {
-    clientInstance = new BrainerceClient({
-      salesChannelId: SALES_CHANNEL_ID,
-      baseUrl: '/api/store', // same-origin proxy handles auth via httpOnly cookie
-      proxyMode: true, // skip client-side token checks; proxy adds Authorization header
-    });
-  }
-  return clientInstance;
-}
-<% if (i18nEnabled) { %>
-
-/** Initialize client with a specific locale for translated content */
-export function initClientWithLocale(locale: string): BrainerceClient {
-  const client = getClient();
-  client.setLocale(locale);
-  return client;
-}
-<% } %>
-
-// Cart ID helpers (not a security token — safe in localStorage)
-const CART_ID_KEY = 'brainerce_cart_id';
-
-export function getStoredCartId(): string | null {
-  if (typeof window === 'undefined') return null;
-  return localStorage.getItem(CART_ID_KEY);
-}
-
-export function setStoredCartId(cartId: string | null): void {
-  if (typeof window === 'undefined') return;
-  if (cartId) {
-    localStorage.setItem(CART_ID_KEY, cartId);
-  } else {
-    localStorage.removeItem(CART_ID_KEY);
-  }
-}
-
-// Initialize client (no token hydration — auth handled by httpOnly cookie)
-export function initClient(): BrainerceClient {
-  return getClient();
-}
-
-// Server-side client — calls backend directly (no proxy needed for public data)
-// Used by Server Components for SSR data fetching (generateMetadata, page rendering)
-export function getServerClient(locale?: string): BrainerceClient {
-  const apiUrl = process.env.BRAINERCE_API_URL || 'https://api.brainerce.com';
-  const client = new BrainerceClient({
-    salesChannelId: SALES_CHANNEL_ID,
-    baseUrl: apiUrl,
-    origin: process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000',
-  });
-  if (locale) {
-    client.setLocale(locale);
-  }
-  return client;
-}
-
-/**
- * Server-side cached fetch of store info, used to seed `<StoreProvider>` at
- * SSR so client components don't render with `null` storeInfo and bake the
- * wrong currency symbol into the HTML Googlebot indexes.
- *
- * Two cache layers:
- *   - React `cache()` dedupes calls within a single request render so the
- *     layout + `generateMetadata` share one fetch.
- *   - Next.js `fetch({ next: { revalidate, tags } })` caches the response
- *     across requests for ~60s and lets the dashboard bust the cache via
- *     `revalidateTag('store-info')` on store-config save.
- *
- * Returns `null` on hard failure so the provider's client-side `useEffect`
- * fallback can take over — behaviour identical to pre-SSR-hydration.
- *
- * Bypasses {@link getServerClient} on purpose: the SDK's internal `fetch`
- * does not forward `next:` options, so it cannot participate in the Next.js
- * Data Cache today. Switch back to the SDK once it accepts `fetchOptions`.
- */
-export const fetchStoreInfo = cache(
-  async (locale?: string): Promise<PublicStoreInfo | null> => {
-    const apiUrl = process.env.BRAINERCE_API_URL || 'https://api.brainerce.com';
-    const siteOrigin = process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000';
-    const url = `${apiUrl}/api/vc/${encodeURIComponent(SALES_CHANNEL_ID)}/info`;
-    try {
-      const res = await fetch(url, {
-        headers: {
-          Origin: siteOrigin,
-          ...(locale ? { 'Accept-Language': locale } : {}),
-        },
-        next: { revalidate: 60, tags: ['store-info'] },
-      });
-      if (!res.ok) return null;
-      return pickPublicStoreInfo(await res.json());
-    } catch {
-      return null;
-    }
-  },
-);
+import { BrainerceClient } from 'brainerce';
+
+/**
+ * CLIENT-SAFE half of the SDK wiring — imported by ~30 `'use client'`
+ * components. Nothing here may reach `next/headers` or any server-only API,
+ * or the client bundle fails to build. The server half lives in
+ * `brainerce.server.ts`.
+ */
+
+// Read either env var name. The new one is preferred; the old one is a soft
+// alias kept for backwards compatibility — both are accepted by the SDK.
+export const SALES_CHANNEL_ID =
+  process.env.NEXT_PUBLIC_BRAINERCE_SALES_CHANNEL_ID ||
+  process.env.NEXT_PUBLIC_BRAINERCE_CONNECTION_ID ||
+  '<%= connectionId %>';
+
+// Singleton SDK client — routes through same-origin BFF proxy for httpOnly cookie auth
+let clientInstance: BrainerceClient | null = null;
+
+export function getClient(): BrainerceClient {
+  if (!clientInstance) {
+    clientInstance = new BrainerceClient({
+      salesChannelId: SALES_CHANNEL_ID,
+      baseUrl: '/api/store', // same-origin proxy handles auth via httpOnly cookie
+      proxyMode: true, // skip client-side token checks; proxy adds Authorization header
+    });
+  }
+  return clientInstance;
+}
+<% if (i18nEnabled) { %>
+
+/** Initialize client with a specific locale for translated content */
+export function initClientWithLocale(locale: string): BrainerceClient {
+  const client = getClient();
+  client.setLocale(locale);
+  return client;
+}
+<% } %>
+
+// Cart ID helpers (not a security token — safe in localStorage)
+const CART_ID_KEY = 'brainerce_cart_id';
+
+export function getStoredCartId(): string | null {
+  if (typeof window === 'undefined') return null;
+  return localStorage.getItem(CART_ID_KEY);
+}
+
+export function setStoredCartId(cartId: string | null): void {
+  if (typeof window === 'undefined') return;
+  if (cartId) {
+    localStorage.setItem(CART_ID_KEY, cartId);
+  } else {
+    localStorage.removeItem(CART_ID_KEY);
+  }
+}
+
+// Initialize client (no token hydration — auth handled by httpOnly cookie)
+export function initClient(): BrainerceClient {
+  return getClient();
+}