fix: resolve container width issues, spa redirects, and appearance settings overwrite. feat: enhance order/sub details and newsletter layout

customer-spa/src/pages/Checkout/index.tsx

@@ -14,6 +14,7 @@ import { apiClient } from '@/lib/api/client';
 import { api } from '@/lib/api/client';
 import { AddressSelector } from '@/components/AddressSelector';
 import { applyCoupon, removeCoupon, fetchCart } from '@/lib/cart/api';
+import { CaptchaWidget } from '@/components/CaptchaWidget';
 
 interface SavedAddress {
   id: number;
@@ -42,7 +43,9 @@ export default function Checkout() {
   const [isApplyingCoupon, setIsApplyingCoupon] = useState(false);
   const [appliedCoupons, setAppliedCoupons] = useState<{ code: string; discount: number }[]>([]);
   const [discountTotal, setDiscountTotal] = useState(0);
+  const [captchaToken, setCaptchaToken] = useState('');
   const user = (window as any).woonoowCustomer?.user;
+  const security = (window as any).woonoowCustomer?.security;
 
   // Check if cart needs shipping (virtual-only carts don't need shipping)
   // Use cart.needs_shipping from WooCommerce API, fallback to item-level check
@@ -567,6 +570,8 @@ export default function Checkout() {
         customer_note: orderNotes,
         // Include all custom field data for backend processing
         custom_fields: customFieldData,
+        // CAPTCHA token for security validation
+        captcha_token: captchaToken,
       };
 
       // Submit order
@@ -579,10 +584,18 @@ export default function Checkout() {
 
         toast.success('Order placed successfully!');
 
-        // Navigate to thank you page via SPA routing
-        // Using window.location.replace to prevent back button issues
+        // Build thank you page URL
         const thankYouUrl = `/order-received/${data.order_id}?key=${data.order_key}`;
-        navigate(thankYouUrl, { replace: true });
+
+        // If user was logged in during this request (guest auto-register), 
+        // we need a full page reload to recognize the auth cookie
+        if (data.user_logged_in) {
+          // Full page reload so browser recognizes the new auth cookie
+          window.location.href = thankYouUrl;
+        } else {
+          // Already logged in or no login happened - SPA navigate is fine
+          navigate(thankYouUrl, { replace: true });
+        }
         return; // Stop execution here
       } else {
         throw new Error(data.error || 'Failed to create order');
@@ -615,6 +628,17 @@ export default function Checkout() {
   return (
     <Container>
       <SEOHead title="Checkout" description="Complete your purchase" />
+
+      {/* Invisible CAPTCHA widget for bot protection */}
+      {security?.captcha_provider && security.captcha_provider !== 'none' && (
+        <CaptchaWidget
+          provider={security.captcha_provider}
+          siteKey={security.captcha_provider === 'recaptcha' ? security.recaptcha_site_key : security.turnstile_site_key}
+          onToken={setCaptchaToken}
+          action="checkout"
+        />
+      )}
+
       <div className="py-8">
         {/* Header */}
         <div className="mb-8">

customer-spa/src/pages/DynamicPage/index.tsx

@@ -59,6 +59,8 @@ interface PageData {
         og_description?: string;
         og_image?: string;
     };
+    container_width?: string;
+    effective_container_width?: 'boxed' | 'fullwidth';
     structure?: {
         sections: Section[];
     };
@@ -205,8 +207,8 @@ export function DynamicPageRenderer({ slug: propSlug }: DynamicPageRendererProps
                 )}
             </Helmet>
 
-            {/* Render sections */}
-            <div className="wn-page">
+            {/* Render sections using effective container width */}
+            <div className={`wn-page ${pageData.effective_container_width === 'boxed' ? 'container mx-auto px-4 max-w-6xl' : ''}`}>
                 {sections.map((section) => {
                     const SectionComponent = SECTION_COMPONENTS[section.type];