create-brainerce-store 1.28.0 → 1.28.4

package/templates/nextjs/base/src/app/layout.tsx.ejs

@@ -60,6 +60,7 @@ export default async function RootLayout({
         <script
           type="application/ld+json"
           nonce={nonce}
+          suppressHydrationWarning
           dangerouslySetInnerHTML={{
             __html: JSON.stringify(organizationJsonLd)
               .replace(/</g, '\\u003c')
@@ -133,6 +134,7 @@ export default async function RootLayout({
         <script
           type="application/ld+json"
           nonce={nonce}
+          suppressHydrationWarning
           dangerouslySetInnerHTML={{
             __html: JSON.stringify(organizationJsonLd)
               .replace(/</g, '\\u003c')

package/templates/nextjs/base/src/components/checkout/payment-step.tsx

@@ -76,8 +76,8 @@ export function PaymentStep({ checkoutId, className }: PaymentStepProps) {
   // but we re-check here so the component is safe to render in any context.
   if (!isValidCheckoutId(checkoutId)) {
     return (
-      <div className={cn('rounded-md border border-destructive/50 p-4', className)}>
-        <p className="text-sm text-destructive">{t('paymentError')}</p>
+      <div className={cn('border-destructive/50 rounded-md border p-4', className)}>
+        <p className="text-destructive text-sm">{t('paymentError')}</p>
       </div>
     );
   }

package/templates/nextjs/base/src/components/layout/language-switcher.tsx.ejs

@@ -29,18 +29,25 @@ const LOCALE_NAMES: Record<string, string> = {
   vi: 'Tiếng Việt',
 };
 
+const defaultLocale = '<%= defaultLocale %>';
+
 export function LanguageSwitcher() {
   const pathname = usePathname();
-  const currentLocale = pathname.split('/')[1] || '<%= defaultLocale %>';
+  const firstSeg = pathname.split('/')[1];
+  const currentLocale = supportedLocales.includes(firstSeg as (typeof supportedLocales)[number])
+    ? firstSeg
+    : defaultLocale;
 
   function switchLocale(newLocale: string) {
+    // Strip any existing locale segment, then re-add only if the new one
+    // isn't the default — matches the as-needed prefix scheme in middleware.
     const segments = pathname.split('/');
     if (supportedLocales.includes(segments[1] as (typeof supportedLocales)[number])) {
-      segments[1] = newLocale;
-    } else {
-      segments.splice(1, 0, newLocale);
+      segments.splice(1, 1);
     }
-    window.location.href = segments.join('/');
+    const bare = segments.join('/') || '/';
+    window.location.href =
+      newLocale === defaultLocale ? bare : `/${newLocale}${bare === '/' ? '' : bare}`;
   }
 
   if (supportedLocales.length <= 1) return null;

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

@@ -64,11 +64,13 @@ export async function ProductJsonLd({ product, url, currency = 'USD' }: ProductJ
       <script
         type="application/ld+json"
         nonce={nonce}
+        suppressHydrationWarning
         dangerouslySetInnerHTML={{ __html: serializeJsonLd(productJsonLd) }}
       />
       <script
         type="application/ld+json"
         nonce={nonce}
+        suppressHydrationWarning
         dangerouslySetInnerHTML={{ __html: serializeJsonLd(breadcrumbJsonLd) }}
       />
     </>

package/templates/nextjs/base/src/lib/navigation.tsx.ejs

@@ -14,12 +14,25 @@ function getLocale(pathname: string): string {
   return supportedLocales.includes(segment) ? segment : defaultLocale;
 }
 
-function localizePath(path: string, locale: string): string {
+function stripLocale(path: string): string {
   if (!path.startsWith('/')) return path;
-  // Don't double-prefix
   const firstSeg = path.split('/')[1];
-  if (supportedLocales.includes(firstSeg)) return path;
-  return `/${locale}${path}`;
+  if (supportedLocales.includes(firstSeg)) {
+    return path.slice(`/${firstSeg}`.length) || '/';
+  }
+  return path;
+}
+
+// As-needed locale prefix:
+//   defaultLocale → no prefix (/foo)
+//   other locale  → /{locale}/foo
+// Any incoming path is first stripped of an existing locale segment so we
+// never double-prefix even if callers already localized.
+function localizePath(path: string, locale: string): string {
+  if (!path.startsWith('/')) return path;
+  const bare = stripLocale(path);
+  if (locale === defaultLocale) return bare;
+  return bare === '/' ? `/${locale}` : `/${locale}${bare}`;
 }
 
 /**

package/templates/nextjs/base/src/middleware.ts.ejs

@@ -20,9 +20,15 @@ function generateNonce(): string {
 }
 
 function buildCsp(nonce: string): string {
+  const isDev = process.env.NODE_ENV === 'development';
+  // Next dev uses webpack's eval-source-map devtool, which requires 'unsafe-eval'
+  // to execute module code. Prod builds never eval, so this only loosens dev.
+  const scriptSrc = isDev
+    ? `script-src 'self' 'nonce-${nonce}' 'strict-dynamic' 'unsafe-eval'`
+    : `script-src 'self' 'nonce-${nonce}' 'strict-dynamic'`;
   return [
     "default-src 'self'",
-    `script-src 'self' 'nonce-${nonce}' 'strict-dynamic'`,
+    scriptSrc,
     "style-src 'self' 'unsafe-inline' https://cdn.meshulam.co.il",
     "img-src 'self' data: blob: https:",
     "font-src 'self' data:",
@@ -61,25 +67,48 @@ export function middleware(request: NextRequest) {
 
   const pathnameLocale = getLocaleFromPath(pathname);
 
-  // Redirect to default locale if no locale prefix
-  if (!pathnameLocale) {
-    const url = request.nextUrl.clone();
-    url.pathname = `/${defaultLocale}${pathname}`;
-    return applyCspHeaders(NextResponse.redirect(url), nonce);
-  }
-
-  // Auth protection (with locale prefix)
-  const pathWithoutLocale = pathname.replace(`/${pathnameLocale}`, '') || '/';
+  // As-needed locale routing:
+  //   /foo            → rewrite to /{defaultLocale}/foo (URL stays clean)
+  //   /{default}/foo  → 308-redirect to /foo (canonical, avoids duplicate content)
+  //   /{other}/foo    → proceed as-is
+  //
+  // Effective locale used for auth/header is `defaultLocale` for clean URLs
+  // and the explicit prefix otherwise.
+  const effectiveLocale = pathnameLocale || defaultLocale;
+  const pathWithoutLocale = pathnameLocale
+    ? pathname.slice(`/${pathnameLocale}`.length) || '/'
+    : pathname;
+
+  // Auth protection — check before any rewrite/redirect so the login
+  // redirect lands on the correct canonical URL.
   const isProtected = PROTECTED_PATHS.some((p) => pathWithoutLocale.startsWith(p));
   if (isProtected) {
     const token = request.cookies.get(TOKEN_COOKIE);
     if (!token?.value) {
-      const loginUrl = new URL(`/${pathnameLocale}/login`, request.url);
-      return applyCspHeaders(NextResponse.redirect(loginUrl), nonce);
+      const loginPath =
+        effectiveLocale === defaultLocale ? '/login' : `/${effectiveLocale}/login`;
+      return applyCspHeaders(NextResponse.redirect(new URL(loginPath, request.url)), nonce);
     }
   }
 
-  // Set locale header for server components + forward nonce
+  // Canonicalize: strip the default-locale prefix so /en/foo → /foo.
+  if (pathnameLocale === defaultLocale) {
+    const url = request.nextUrl.clone();
+    url.pathname = pathWithoutLocale;
+    return applyCspHeaders(NextResponse.redirect(url, 308), nonce);
+  }
+
+  // No locale prefix → rewrite internally to /{defaultLocale}/...
+  // so the [locale] segment resolves; URL in the bar stays unprefixed.
+  if (!pathnameLocale) {
+    const url = request.nextUrl.clone();
+    url.pathname = `/${defaultLocale}${pathname === '/' ? '' : pathname}`;
+    const response = NextResponse.rewrite(url, { request: { headers: requestHeaders } });
+    response.headers.set('x-locale', defaultLocale);
+    return applyCspHeaders(response, nonce);
+  }
+
+  // Non-default locale prefix → proceed as-is.
   const response = NextResponse.next({ request: { headers: requestHeaders } });
   response.headers.set('x-locale', pathnameLocale);
   return applyCspHeaders(response, nonce);
@@ -105,9 +134,15 @@ function generateNonce(): string {
 }
 
 function buildCsp(nonce: string): string {
+  const isDev = process.env.NODE_ENV === 'development';
+  // Next dev uses webpack's eval-source-map devtool, which requires 'unsafe-eval'
+  // to execute module code. Prod builds never eval, so this only loosens dev.
+  const scriptSrc = isDev
+    ? `script-src 'self' 'nonce-${nonce}' 'strict-dynamic' 'unsafe-eval'`
+    : `script-src 'self' 'nonce-${nonce}' 'strict-dynamic'`;
   return [
     "default-src 'self'",
-    `script-src 'self' 'nonce-${nonce}' 'strict-dynamic'`,
+    scriptSrc,
     "style-src 'self' 'unsafe-inline' https://cdn.meshulam.co.il",
     "img-src 'self' data: blob: https:",
     "font-src 'self' data:",