create-brainerce-store 1.86.1 → 1.88.0

package/templates/nextjs/base/src/ui/cart/coupon-input.tsx

@@ -1,134 +1,138 @@
-'use client';
-
-import { useState } from 'react';
-import { Tag } from 'lucide-react';
-import type { Cart } from 'brainerce';
-import { getClient } from '@/core/lib/brainerce';
-import { useTranslations } from '@/core/lib/translations';
-import { LoadingSpinner } from '@/ui/shared/loading-spinner';
-import { Button } from '@/components/ui/button';
-import { Input } from '@/components/ui/input';
-import { cn } from '@/core/lib/utils';
-
-interface CouponInputProps {
-  cart: Cart;
-  /** When provided, uses applyCheckoutCoupon/removeCheckoutCoupon instead of
-   *  applyCoupon/removeCoupon. Always pass this when a checkout session exists. */
-  checkoutId?: string;
-  onUpdate: () => void;
-  className?: string;
-}
-
-export function CouponInput({ cart, checkoutId, onUpdate, className }: CouponInputProps) {
-  const t = useTranslations('coupon');
-  const tc = useTranslations('common');
-  const [code, setCode] = useState('');
-  const [applying, setApplying] = useState(false);
-  const [removing, setRemoving] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  const appliedCoupon = cart.couponCode || null;
-
-  async function handleApply() {
-    const trimmed = code.trim();
-    if (!trimmed || applying) return;
-
-    try {
-      setApplying(true);
-      setError(null);
-      const client = getClient();
-      if (checkoutId) {
-        await client.applyCheckoutCoupon(checkoutId, trimmed);
-      } else {
-        await client.applyCoupon(cart.id, trimmed);
-      }
-      setCode('');
-      onUpdate();
-    } catch (err) {
-      const message = err instanceof Error ? err.message : t('invalidCode');
-      setError(message);
-    } finally {
-      setApplying(false);
-    }
-  }
-
-  async function handleRemove() {
-    if (removing) return;
-
-    try {
-      setRemoving(true);
-      setError(null);
-      const client = getClient();
-      if (checkoutId) {
-        await client.removeCheckoutCoupon(checkoutId);
-      } else {
-        await client.removeCoupon(cart.id);
-      }
-      onUpdate();
-    } catch (err) {
-      console.error('Failed to remove coupon:', err);
-    } finally {
-      setRemoving(false);
-    }
-  }
-
-  // Show applied coupon
-  if (appliedCoupon) {
-    return (
-      <div className={cn('space-y-2', className)}>
-        <div className="bg-muted flex items-center justify-between rounded px-3 py-2">
-          <div className="flex items-center gap-2">
-            <Tag className="text-primary h-4 w-4 flex-shrink-0" aria-hidden="true" />
-            <span className="text-foreground text-sm font-medium">{appliedCoupon}</span>
-          </div>
-          <button
-            type="button"
-            onClick={handleRemove}
-            disabled={removing}
-            className="text-destructive hover:text-destructive/80 text-xs transition-colors disabled:opacity-40"
-          >
-            {removing ? tc('removing') : tc('remove')}
-          </button>
-        </div>
-      </div>
-    );
-  }
-
-  return (
-    <div className={cn('space-y-2', className)}>
-      <div className="flex gap-2">
-        <Input
-          type="text"
-          value={code}
-          onChange={(e) => {
-            setCode(e.target.value);
-            if (error) setError(null);
-          }}
-          onKeyDown={(e) => {
-            if (e.key === 'Enter') {
-              e.preventDefault();
-              handleApply();
-            }
-          }}
-          placeholder={t('placeholder')}
-          className={cn('h-9 flex-1 rounded', error && 'border-destructive')}
-        />
-        <Button
-          type="button"
-          variant="outline"
-          onClick={handleApply}
-          disabled={applying || !code.trim()}
-          className="h-9 rounded px-4 hover:bg-muted"
-        >
-          {applying ? (
-            <LoadingSpinner size="sm" className="border-muted-foreground/30 border-t-foreground" />
-          ) : (
-            tc('apply')
-          )}
-        </Button>
-      </div>
-
-      {error && <p className="text-destructive text-xs">{error}</p>}
-    </div>
-  );
-}
+'use client';
+
+import { useState } from 'react';
+import { Tag } from 'lucide-react';
+import type { Cart } from 'brainerce';
+import { getClient } from '@/core/lib/brainerce';
+import { couponErrorKey } from '@/core/lib/coupon-error';
+import { useTranslations } from '@/core/lib/translations';
+import { LoadingSpinner } from '@/ui/shared/loading-spinner';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { cn } from '@/core/lib/utils';
+
+interface CouponInputProps {
+  cart: Cart;
+  /** When provided, uses applyCheckoutCoupon/removeCheckoutCoupon instead of
+   *  applyCoupon/removeCoupon. Always pass this when a checkout session exists. */
+  checkoutId?: string;
+  onUpdate: () => void;
+  className?: string;
+}
+
+export function CouponInput({ cart, checkoutId, onUpdate, className }: CouponInputProps) {
+  const t = useTranslations('coupon');
+  const tc = useTranslations('common');
+  const [code, setCode] = useState('');
+  const [applying, setApplying] = useState(false);
+  const [removing, setRemoving] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  const appliedCoupon = cart.couponCode || null;
+
+  async function handleApply() {
+    const trimmed = code.trim();
+    if (!trimmed || applying) return;
+
+    try {
+      setApplying(true);
+      setError(null);
+      const client = getClient();
+      if (checkoutId) {
+        await client.applyCheckoutCoupon(checkoutId, trimmed);
+      } else {
+        await client.applyCoupon(cart.id, trimmed);
+      }
+      setCode('');
+      onUpdate();
+    } catch (err) {
+      // Known codes are shown from our own (translated) messages; the API's
+      // `message` is English. An uncoded refusal falls back to that message.
+      const key = couponErrorKey(err);
+      const message = key ? t(key) : err instanceof Error ? err.message : t('invalidCode');
+      setError(message);
+    } finally {
+      setApplying(false);
+    }
+  }
+
+  async function handleRemove() {
+    if (removing) return;
+
+    try {
+      setRemoving(true);
+      setError(null);
+      const client = getClient();
+      if (checkoutId) {
+        await client.removeCheckoutCoupon(checkoutId);
+      } else {
+        await client.removeCoupon(cart.id);
+      }
+      onUpdate();
+    } catch (err) {
+      console.error('Failed to remove coupon:', err);
+    } finally {
+      setRemoving(false);
+    }
+  }
+
+  // Show applied coupon
+  if (appliedCoupon) {
+    return (
+      <div className={cn('space-y-2', className)}>
+        <div className="bg-muted flex items-center justify-between rounded px-3 py-2">
+          <div className="flex items-center gap-2">
+            <Tag className="text-primary h-4 w-4 flex-shrink-0" aria-hidden="true" />
+            <span className="text-foreground text-sm font-medium">{appliedCoupon}</span>
+          </div>
+          <button
+            type="button"
+            onClick={handleRemove}
+            disabled={removing}
+            className="text-destructive hover:text-destructive/80 text-xs transition-colors disabled:opacity-40"
+          >
+            {removing ? tc('removing') : tc('remove')}
+          </button>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div className={cn('space-y-2', className)}>
+      <div className="flex gap-2">
+        <Input
+          type="text"
+          value={code}
+          onChange={(e) => {
+            setCode(e.target.value);
+            if (error) setError(null);
+          }}
+          onKeyDown={(e) => {
+            if (e.key === 'Enter') {
+              e.preventDefault();
+              handleApply();
+            }
+          }}
+          placeholder={t('placeholder')}
+          className={cn('h-9 flex-1 rounded', error && 'border-destructive')}
+        />
+        <Button
+          type="button"
+          variant="outline"
+          onClick={handleApply}
+          disabled={applying || !code.trim()}
+          className="hover:bg-muted h-9 rounded px-4"
+        >
+          {applying ? (
+            <LoadingSpinner size="sm" className="border-muted-foreground/30 border-t-foreground" />
+          ) : (
+            tc('apply')
+          )}
+        </Button>
+      </div>
+
+      {error && <p className="text-destructive text-xs">{error}</p>}
+    </div>
+  );
+}

package/templates/nextjs/base/src/ui/cart/tax-estimate-line.tsx

@@ -93,13 +93,20 @@ export function TaxEstimateLine() {
   return (
     <div className="space-y-1">
       <div className="flex items-center justify-between">
-        <span className="text-muted-foreground">{label}</span>
+        <span className="text-muted-foreground">
+          {estimate.pricesIncludeTax ? `${label} ${tc('inclSuffix')}` : label}
+        </span>
         <span className="text-foreground font-medium">
           {formatPrice(estimate.estimatedTax, { currency: estimate.currency }) as string}
         </span>
       </div>
-      {/* The caveat travels WITH the number, not in a footnote nobody reads. */}
-      <p className="text-muted-foreground text-xs">{t('taxAtCheckout')}</p>
+      {/* The caveat travels WITH the number, not in a footnote nobody reads.
+          A VAT-inclusive store has nothing left to calculate: the tax is already
+          inside the prices above, so "calculated at checkout" would promise an
+          extra charge that never comes. */}
+      {estimate.pricesIncludeTax ? null : (
+        <p className="text-muted-foreground text-xs">{t('taxAtCheckout')}</p>
+      )}
       {/* Server-written and already localized. Never replace it with copy of
           your own, it is what explains a partial estimate. */}
       {estimate.note ? <p className="text-muted-foreground text-xs">{estimate.note}</p> : null}

package/templates/nextjs/base/src/ui/layout/newsletter-signup.tsx

@@ -71,7 +71,11 @@ export function NewsletterSignup() {
     getClient()
       .marketing.getBenefit(locale)
       .then((result) => {
-        if (!cancelled) setOffer(result);
+        // Only a complete, enabled offer is ever shown. An empty or partial body
+        // (an older backend, a half-configured benefit) must read as "no offer",
+        // never as "undefined off your first order".
+        const usable = result && result.enabled === true && Number.isFinite(result.discountValue);
+        if (!cancelled) setOffer(usable ? result : null);
       })
       .catch(() => {
         // Silent on purpose. A failed offer read must not stop someone

package/templates/nextjs/base/src/ui/layout/site-footer.tsx.ejs

@@ -71,7 +71,7 @@ export function SiteFooter({ footer, storeName }: SiteFooterProps) {
           <div className="mx-auto max-w-md text-start">
             <NewsletterSignup />
           </div>
-          <div>© {year} {brandLabel}. All rights reserved.</div>
+          <div>© {year} {brandLabel}. <%- language === 'he' ? 'כל הזכויות שמורות.' : 'All rights reserved.' %></div>
         </div>
       </footer>
     );
@@ -152,7 +152,7 @@ export function SiteFooter({ footer, storeName }: SiteFooterProps) {
         </div>
 
         <div className="border-border text-muted-foreground mt-10 flex flex-col items-center justify-between gap-2 border-t pt-6 text-xs sm:flex-row">
-          <span>{data.copyright ?? `© ${year} ${brandLabel}. All rights reserved.`}</span>
+          <span>{data.copyright ?? `© ${year} ${brandLabel}. <%- language === 'he' ? 'כל הזכויות שמורות.' : 'All rights reserved.' %>`}</span>
         </div>
       </div>
     </footer>

package/templates/nextjs/base/src/ui/product/frequently-bought-together.tsx

@@ -8,7 +8,11 @@ import { formatPrice } from 'brainerce';
 import { useCart, useStoreInfo } from '@/core/providers/store-provider';
 import { useCurrency } from '@/core/lib/use-currency';
 import { useTranslations } from '@/core/lib/translations';
-import { toAddToCartError, type AddToCartError } from '@/core/lib/add-to-cart-error';
+import {
+  addToCartErrorMessageKey,
+  toAddToCartError,
+  type AddToCartError,
+} from '@/core/lib/add-to-cart-error';
 import { Button } from '@/components/ui/button';
 import { Card } from '@/components/ui/card';
 import { Checkbox } from '@/components/ui/checkbox';
@@ -214,7 +218,7 @@ export function FrequentlyBoughtTogether({
       */}
       {addError && (
         <p role="alert" className="text-destructive mt-3 text-sm">
-          {addError === 'CART_FULL' ? t('cartFull') : t('addToCartFailed')}
+          {t(addToCartErrorMessageKey(addError))}
         </p>
       )}
     </Card>

package/templates/nextjs/base/src/ui/product/product-card.tsx

@@ -18,7 +18,11 @@ import { Card } from '@/components/ui/card';
 import { useCart } from '@/core/providers/store-provider';
 import { useCurrency } from '@/core/lib/use-currency';
 import { trackAddToCart } from '@/core/lib/tracking';
-import { toAddToCartError, type AddToCartError } from '@/core/lib/add-to-cart-error';
+import {
+  addToCartErrorMessageKey,
+  toAddToCartError,
+  type AddToCartError,
+} from '@/core/lib/add-to-cart-error';
 import { cn } from '@/core/lib/utils';
 
 interface ProductCardProps {
@@ -238,7 +242,7 @@ export function ProductCard({ product, className }: ProductCardProps) {
         */}
         {addError && (
           <p className="text-destructive text-xs" role="alert">
-            {addError === 'CART_FULL' ? tp('cartFull') : tp('addToCartFailed')}
+            {tp(addToCartErrorMessageKey(addError))}
           </p>
         )}
       </div>

package/templates/nextjs/base/src/ui/product/product-client-section.tsx

@@ -1,9 +1,10 @@
 'use client';
 
-import { Download, FileText, Image as ImageIcon } from 'lucide-react';
+import { Download, Image as ImageIcon } from 'lucide-react';
 import { CdnImage as Image } from '@/ui/shared/cdn-image';
-import type { Product, ProductMetafield, DownloadFile } from 'brainerce';
+import type { Product, ProductMetafield } from 'brainerce';
 import { useProductPage } from '@/core/hooks/use-product-page';
+import { addToCartErrorMessageKey } from '@/core/lib/add-to-cart-error';
 import { PriceDisplay } from '@/ui/product/price-display';
 import { LoadingSpinner } from '@/ui/shared/loading-spinner';
 import { VariantSelector } from '@/ui/product/variant-selector';
@@ -283,39 +284,6 @@ export function ProductClientSection({
             <StockBadge inventory={inventory} />
           )}
 
-          {/* Downloadable files info */}
-          {product.isDownloadable && product.downloads && product.downloads.length > 0 && (
-            <div className="bg-muted/50 rounded-lg border p-4">
-              <p className="text-foreground mb-2 text-sm font-medium">
-                {t('filesIncluded')} ({product.downloads.length})
-              </p>
-              <ul className="space-y-1.5">
-                {product.downloads.map((file: DownloadFile) => (
-                  <li
-                    key={file.id}
-                    className="text-muted-foreground flex items-center gap-2 text-sm"
-                  >
-                    <FileText
-                      className="h-4 w-4 flex-shrink-0"
-                      strokeWidth={1.5}
-                      aria-hidden="true"
-                    />
-                    <span className="truncate">{file.name}</span>
-                    {file.size && (
-                      <span className="flex-shrink-0 text-xs">
-                        (
-                        {file.size < 1024 * 1024
-                          ? `${(file.size / 1024).toFixed(0)} KB`
-                          : `${(file.size / (1024 * 1024)).toFixed(1)} MB`}
-                        )
-                      </span>
-                    )}
-                  </li>
-                ))}
-              </ul>
-            </div>
-          )}
-
           {/* Variant Selector */}
           {/* A KIT is bought as ONE line, but the shopper needs to see what is
               in the box before deciding. These rows are display only — never add
@@ -445,7 +413,7 @@ export function ProductClientSection({
           */}
           {addToCartError && (
             <p className="text-destructive text-sm" role="alert">
-              {addToCartError === 'CART_FULL' ? t('cartFull') : t('addToCartFailed')}
+              {t(addToCartErrorMessageKey(addToCartError))}
             </p>
           )}
 

package/templates/nextjs/designs/atelier/ui/cart/cart-bundle-offer.tsx

@@ -7,7 +7,11 @@ import type { CartBundleOffer as CartBundleOfferType } from 'brainerce';
 import { formatPrice } from 'brainerce';
 import { useCurrency } from '@/core/lib/use-currency';
 import { useTranslations } from '@/core/lib/translations';
-import { toAddToCartError, type AddToCartError } from '@/core/lib/add-to-cart-error';
+import {
+  addToCartErrorMessageKey,
+  toAddToCartError,
+  type AddToCartError,
+} from '@/core/lib/add-to-cart-error';
 import { cn } from '@/core/lib/utils';
 import { IconBag } from '@/ui/shared/icons';
 
@@ -123,7 +127,7 @@ export function CartBundleOfferCard({ offer, cartId, onAdd, className }: CartBun
       */}
       {addError && (
         <p role="alert" className="text-destructive mt-2 text-xs">
-          {addError === 'CART_FULL' ? tp('cartFull') : tp('addToCartFailed')}
+          {tp(addToCartErrorMessageKey(addError))}
         </p>
       )}
     </article>

package/templates/nextjs/designs/atelier/ui/cart/cart-upgrade-banner.tsx

@@ -8,7 +8,11 @@ import { formatPrice } from 'brainerce';
 import { getClient } from '@/core/lib/brainerce';
 import { useCurrency } from '@/core/lib/use-currency';
 import { useTranslations } from '@/core/lib/translations';
-import { toAddToCartError, type AddToCartError } from '@/core/lib/add-to-cart-error';
+import {
+  addToCartErrorMessageKey,
+  toAddToCartError,
+  type AddToCartError,
+} from '@/core/lib/add-to-cart-error';
 import { cn } from '@/core/lib/utils';
 import { IconX } from '@/ui/shared/icons';
 
@@ -191,9 +195,7 @@ export function CartUpgradeBanner({
           <p role="alert" className="text-destructive mt-1 text-xs font-medium">
             {upgradeError === 'ORIGINAL_NOT_REMOVED'
               ? t('upgradeOriginalNotRemoved')
-              : upgradeError === 'CART_FULL'
-                ? tp('cartFull')
-                : tp('addToCartFailed')}
+              : tp(addToCartErrorMessageKey(upgradeError))}
           </p>
         )}
       </div>