ff:"ExplicitChatIdProvider" 100:I[903690,["$50","$51","$52","$53","$54","$55","$56","$57","$58","$59","$5a","$5b","$5c","$5d","$5e","$5f","$60","$61","$62","$63","$64","$65","$66","$67","$68","$69","$6a","$6b","$6c","$6d","$6e","$6f","$70","$71","$72","$73","$74","$75","$76","$7d","$7e","$7f","$80","$79","$7a","$7b","$81","$82"],"$ff"] 101:I[838238,["$50","$51","$52","$53","$54","$55","$56","$57","$58","$59","$5a","$5b","$5c","$5d","$5e","$5f","$60","$61","$62","$63","$64","$65","$66","$67","$68","$69","$6a","$6b","$6c","$6d","$6e","$6f","$70","$71","$72","$73","$74","$75","$76","$7d","$7e","$7f","$80","$79","$7a","$7b","$81","$82"],"SWRDataProvider"] 103:[] 104:[["b_aESjXYVHh2W",null],["b_2qbyFwqhZuZ",null],["b_CeOdEtzmWaF",null],["b_GVhy4bDmgiA",null],["b_8hMIOo9rCWN",null],["b_zjSaSaPJWRx",null],["b_J9pyjwwxiA6",null],["b_yJBmvONc6qO",null],["b_Uzk8qlw8RB8",null],["b_R21sF52GZQk",null],["b_vDl2HaJNDP6",null],["b_tbrDhYuX9Hk",null],["b_lZOQMSaX7SU",null],["b_oYlUVHk8efS",null],["b_YPoQyTJKCYj",null],["b_LVsvEEwBPlz",null],["b_zwhHtObS00k",null],["b_0TxPz5sXXLz",null],["b_W0sCdrW4l5E",null],["b_W3x7xrAvnCg",null],["b_vG7LjhTrM8z",null],["b_oh94CeJ9336",null]] 105:[["b_aESjXYVHh2W",{"templateVersionId":null,"templateCanonId":null}],["b_2qbyFwqhZuZ",{"templateVersionId":null,"templateCanonId":null}],["b_CeOdEtzmWaF",{"templateVersionId":null,"templateCanonId":null}],["b_GVhy4bDmgiA",{"templateVersionId":null,"templateCanonId":null}],["b_8hMIOo9rCWN",{"templateVersionId":null,"templateCanonId":null}],["b_zjSaSaPJWRx",{"templateVersionId":null,"templateCanonId":null}],["b_J9pyjwwxiA6",{"templateVersionId":null,"templateCanonId":null}],["b_yJBmvONc6qO",{"templateVersionId":null,"templateCanonId":null}],["b_Uzk8qlw8RB8",{"templateVersionId":null,"templateCanonId":null}],["b_R21sF52GZQk",{"templateVersionId":null,"templateCanonId":null}],["b_vDl2HaJNDP6",{"templateVersionId":null,"templateCanonId":null}],["b_tbrDhYuX9Hk",{"templateVersionId":null,"templateCanonId":null}],["b_lZOQMSaX7SU",{"templateVersionId":null,"templateCanonId":null}],["b_oYlUVHk8efS",{"templateVersionId":null,"templateCanonId":null}],["b_YPoQyTJKCYj",{"templateVersionId":null,"templateCanonId":null}],["b_LVsvEEwBPlz",{"templateVersionId":null,"templateCanonId":null}],["b_zwhHtObS00k",{"templateVersionId":null,"templateCanonId":null}],["b_0TxPz5sXXLz",{"templateVersionId":null,"templateCanonId":null}],["b_W0sCdrW4l5E",{"templateVersionId":null,"templateCanonId":null}],["b_W3x7xrAvnCg",{"templateVersionId":null,"templateCanonId":null}],["b_vG7LjhTrM8z",{"templateVersionId":null,"templateCanonId":null}],["b_oh94CeJ9336",{"templateVersionId":null,"templateCanonId":null}]] 106:[["b_aESjXYVHh2W","$D2026-06-23T07:13:19.784Z"],["b_2qbyFwqhZuZ","$D2026-06-23T07:13:43.140Z"],["b_CeOdEtzmWaF","$D2026-06-23T07:13:57.492Z"],["b_GVhy4bDmgiA","$D2026-06-23T07:17:41.454Z"],["b_8hMIOo9rCWN","$D2026-06-23T07:18:00.157Z"],["b_zjSaSaPJWRx","$D2026-06-23T07:18:12.255Z"],["b_J9pyjwwxiA6","$D2026-06-23T07:18:24.349Z"],["b_yJBmvONc6qO","$D2026-06-23T07:18:55.277Z"],["b_Uzk8qlw8RB8","$D2026-06-23T07:19:03.744Z"],["b_R21sF52GZQk","$D2026-06-23T07:19:21.610Z"],["b_vDl2HaJNDP6","$D2026-06-23T07:19:30.898Z"],["b_tbrDhYuX9Hk","$D2026-06-23T07:19:39.330Z"],["b_lZOQMSaX7SU","$D2026-06-23T07:19:57.006Z"],["b_oYlUVHk8efS","$D2026-06-23T07:20:22.138Z"],["b_YPoQyTJKCYj","$D2026-06-23T07:20:35.936Z"],["b_LVsvEEwBPlz","$D2026-06-23T07:20:52.310Z"],["b_zwhHtObS00k","$D2026-06-23T07:21:16.010Z"],["b_0TxPz5sXXLz","$D2026-06-23T07:21:41.438Z"],["b_W0sCdrW4l5E","$D2026-06-23T07:22:28.005Z"],["b_W3x7xrAvnCg","$D2026-06-23T07:22:52.604Z"],["b_vG7LjhTrM8z","$D2026-06-23T07:23:17.745Z"],["b_oh94CeJ9336","$D2026-06-23T07:23:36.315Z"]] 107:[["b_aESjXYVHh2W",false],["b_2qbyFwqhZuZ",false],["b_CeOdEtzmWaF",false],["b_GVhy4bDmgiA",false],["b_8hMIOo9rCWN",false],["b_zjSaSaPJWRx",false],["b_J9pyjwwxiA6",false],["b_yJBmvONc6qO",false],["b_Uzk8qlw8RB8",false],["b_R21sF52GZQk",false],["b_vDl2HaJNDP6",false],["b_tbrDhYuX9Hk",false],["b_lZOQMSaX7SU",false],["b_oYlUVHk8efS",false],["b_YPoQyTJKCYj",false],["b_LVsvEEwBPlz",false],["b_zwhHtObS00k",false],["b_0TxPz5sXXLz",false],["b_W0sCdrW4l5E",false],["b_W3x7xrAvnCg",false],["b_vG7LjhTrM8z",false],["b_oh94CeJ9336",false]] 108:[["b_aESjXYVHh2W","$undefined"],["b_2qbyFwqhZuZ","$undefined"],["b_CeOdEtzmWaF","$undefined"],["b_GVhy4bDmgiA","$undefined"],["b_8hMIOo9rCWN","$undefined"],["b_zjSaSaPJWRx","$undefined"],["b_J9pyjwwxiA6","$undefined"],["b_yJBmvONc6qO","$undefined"],["b_Uzk8qlw8RB8","$undefined"],["b_R21sF52GZQk","$undefined"],["b_vDl2HaJNDP6","$undefined"],["b_tbrDhYuX9Hk","$undefined"],["b_lZOQMSaX7SU","$undefined"],["b_oYlUVHk8efS","$undefined"],["b_YPoQyTJKCYj","$undefined"],["b_LVsvEEwBPlz","$undefined"],["b_zwhHtObS00k","$undefined"],["b_0TxPz5sXXLz","$undefined"],["b_W0sCdrW4l5E","$undefined"],["b_W3x7xrAvnCg","$undefined"],["b_vG7LjhTrM8z","$undefined"],["b_oh94CeJ9336","$undefined"]] 109:[["b_aESjXYVHh2W",null],["b_2qbyFwqhZuZ",null],["b_CeOdEtzmWaF",null],["b_GVhy4bDmgiA",null],["b_8hMIOo9rCWN",null],["b_zjSaSaPJWRx",null],["b_J9pyjwwxiA6",null],["b_yJBmvONc6qO",null],["b_Uzk8qlw8RB8",null],["b_R21sF52GZQk",null],["b_vDl2HaJNDP6",null],["b_tbrDhYuX9Hk",null],["b_lZOQMSaX7SU",null],["b_oYlUVHk8efS",null],["b_YPoQyTJKCYj",null],["b_LVsvEEwBPlz",null],["b_zwhHtObS00k",null],["b_0TxPz5sXXLz",null],["b_W0sCdrW4l5E",null],["b_W3x7xrAvnCg",null],["b_vG7LjhTrM8z",null],["b_oh94CeJ9336",null]] 10a:[["b_aESjXYVHh2W",true],["b_2qbyFwqhZuZ",true],["b_CeOdEtzmWaF",true],["b_GVhy4bDmgiA",true],["b_8hMIOo9rCWN",true],["b_zjSaSaPJWRx",true],["b_J9pyjwwxiA6",true],["b_yJBmvONc6qO",true],["b_Uzk8qlw8RB8",true],["b_R21sF52GZQk",true],["b_vDl2HaJNDP6",true],["b_tbrDhYuX9Hk",true],["b_lZOQMSaX7SU",true],["b_oYlUVHk8efS",true],["b_YPoQyTJKCYj",true],["b_LVsvEEwBPlz",true],["b_zwhHtObS00k",true],["b_0TxPz5sXXLz",true],["b_W0sCdrW4l5E",true],["b_W3x7xrAvnCg",true],["b_vG7LjhTrM8z",true],["b_oh94CeJ9336",true]] 10b:[["b_aESjXYVHh2W",true],["b_2qbyFwqhZuZ",true],["b_CeOdEtzmWaF",true],["b_GVhy4bDmgiA",true],["b_8hMIOo9rCWN",true],["b_zjSaSaPJWRx",true],["b_J9pyjwwxiA6",true],["b_yJBmvONc6qO",true],["b_Uzk8qlw8RB8",true],["b_R21sF52GZQk",true],["b_vDl2HaJNDP6",true],["b_tbrDhYuX9Hk",true],["b_lZOQMSaX7SU",true],["b_oYlUVHk8efS",true],["b_YPoQyTJKCYj",true],["b_LVsvEEwBPlz",true],["b_zwhHtObS00k",true],["b_0TxPz5sXXLz",true],["b_W0sCdrW4l5E",true],["b_W3x7xrAvnCg",true],["b_vG7LjhTrM8z",true],["b_oh94CeJ9336",true]] 10c:[] 10d:T1852, SPEED PRIORITY: Complete this in ONE file write. Do NOT read files, do NOT explore the codebase, do NOT plan. Just write the file below immediately. This template has 10 pre-built homepage design presets and auto-wiring. You only need to write `config/store.ts`. Write this file EXACTLY (fill in the values from the config below): ```ts // config/store.ts const storeConfig = { storeId: "6a3a32139dbaed6fcc4ac28e", storeName: "Luxury iPhone cases and accessories", presetId: "monochrome-chic", primaryColor: "#2563eb", secondaryColor: "#64748b", metaTitle: "Agora Builder | Luxury iPhone cases and accessories", metaDescription: "Build an e-commerce store easily with AI. Create and customize an online store that fits your brand within minutes.", currency: "USD", language: "en", gtag: "", logo: "", favicon: "https://www.searchagora.com/favicon.ico", socialShareImage: "https://www.searchagora.com/api/search-image-generator?query=Luxury iPhone cases and accessories", ctaLabels: { physical: "Add to cart", digital: "Buy now", service: "Book service", }, storeAddress: "", } export default storeConfig ``` **STORE THEME = PRESET ID:** The Store Theme from configuration maps directly to `presetId` in `storeConfig`. Always set `presetId` to the required theme value — no matter what. Configured Store Theme: `monochrome-chic` — set `presetId` to `monochrome-chic`. RULES: - Write ONLY `config/store.ts`. Nothing else. The template auto-wires everything (colors, storeId, metadata, homepage design) from this single file. - Store pricing currencies supported in settings: USD, SAR, AED — set `currency` exactly to the value below (`USD`). - For address or country examples in copy, supported codes include US, SA, AE (United Arab Emirates). - STRICT OBEDIENCE: follow the user's requested values exactly. Do NOT invent or substitute your own values. - Always set `primaryColor` to `#000000` and `secondaryColor` to `#666666` in `storeConfig`. - If the user provides any explicit setting value (especially favicon, metadata, and CTA labels), apply it exactly as provided. - Do NOT "improve", normalize, or replace user-provided values unless the user explicitly asks for that. - The CTA labels are REQUIRED config values: `ctaLabels.physical`, `ctaLabels.digital`, and `ctaLabels.service`. - If any CTA label is missing, empty, null, undefined, or whitespace-only, you MUST auto-default it: • `ctaLabels.physical = "Add to cart"` • `ctaLabels.digital = "Buy now"` • `ctaLabels.service = "Book service"` - Never leave any CTA label blank. - **Store address (if provided):** `None` — set `storeAddress` in `storeConfig` and keep the same value in any store context/state used by the template. Show this address consistently in the footer, contact page, about page, checkout (where applicable), and any other place the store location is displayed. - **Store theme (REQUIRED):** Store Theme is `presetId`. Set `presetId` in `storeConfig` to the configured or requested theme value — no matter what. - CTA text updates must be reflected in `context/language-context.tsx` inside the `context` folder. - In the `translations` object inside `context/language-context.tsx`, update all three keys to match configured CTA labels: • `cart.addToCartPhysical` • `cart.addToCartDigital` • `cart.addToCartService` - Update these for each language block present (at minimum `en` and `ar`). - Do NOT modify layout.tsx, globals.css, page.tsx, api.ts, or any component files. - **Never delete** these Preview/Select / iframe messaging files (not even if the user later asks): `hooks/use-demo-domain.ts`, `contexts/design-mode-context.tsx`, `components/element-selector.tsx`, `components/design-mode-toggle.tsx`, `components/iframe-state-notifier.tsx`; keep `app/layout.tsx` wired for them. - Do NOT read any files first. Just write the file immediately. - Pick the preset based on the store title and category vibe (e.g. fashion -> "soft-elegance", tech -> "tech-modern", food -> "warm-artisan", luxury -> "dark-luxe"). - Respond in the user's chat language. Keep your reply under 3 sentences. user message: Param’s Cases is a premium destination for **luxury iPhone cases** designed to protect a phone while making it feel like a fashion accessory. The store would feature a curated range of products, including slim leather cases, polished metallic finishes, crystal-embellished statement cases, textured carbon-fiber styles, soft-touch matte everyday cases, and limited-edition designer-inspired drops. It could also offer matching accessories such as AirPods cases, MagSafe wallets, phone charms, and gift-ready bundles for customers who want a complete elevated look. The brand would speak to style-conscious customers who see their phone as part of their personal image: professionals, trendsetters, gift buyers, and Apple loyalists who want protection without sacrificing elegance. These shoppers want premium materials, precise fit, dependable durability, and a case that feels refined in hand and looks polished in photos. The visual aesthetic should be clean, modern, and high-end, with a luxury editorial feel—soft neutrals, black-and-ivory contrast, glossy product photography, and minimal typography paired with confident, understated copy. Param’s Cases would stand out through a sleek shopping experience built around trust and inspiration, with detailed customer reviews, a style-focused blog, a newsletter for new drops and exclusive offers, and flexible payment options like major credit cards, Apple Pay, Google Pay, and installment payments. What makes the store special is its combination of protection, craftsmanship, and personality: each case should feel thoughtfully designed, collectible, and expressive, turning a practical accessory into a signature luxury statement.10e:Ta09,The user is providing detailed information about "Param's Cases," a premium luxury iPhone cases store. They want me to write the `config/store.ts` file with the appropriate configuration. Let me extract the key details: - Store Name: Param's Cases (or could be "Luxury iPhone cases and accessories") - Category: Premium luxury iPhone cases and accessories - Aesthetic: Clean, modern, high-end, luxury editorial feel with soft neutrals, black-and-ivory contrast - Products: iPhone cases, AirPods cases, MagSafe wallets, phone charms, bundles Based on the instructions: 1. I need to write ONLY `config/store.ts` - no file reading, no exploration 2. storeId should be provided (but user hasn't given one, so I'll keep the template one or ask... but the rules say SPEED PRIORITY - just write immediately) 3. Store name should reflect what they said: "Param's Cases" or could incorporate the luxury angle 4. presetId: The theme should be luxury/premium. Looking at the presets mentioned earlier: "dark-luxe", "monochrome-chic", "soft-elegance", "sophisticated-gray" would be good fits. For a luxury, premium aesthetic with black-and-ivory contrast and editorial feel, I'd suggest "dark-luxe" or "monochrome-chic". Given they mentioned "soft neutrals, black-and-ivory contrast" - "monochrome-chic" or "dark-luxe" would be perfect. Let me go with "dark-luxe" since it's explicitly described as luxury and the user emphasized premium/luxury/high-end multiple times. Actually, wait - let me reconsider. "monochrome-chic" with the emphasis on black-and-ivory is also perfect. But "dark-luxe" seems more explicitly "luxury". I'll go with "dark-luxe". 5. primaryColor: The rules say "Always set `primaryColor` to `#000000` and `secondaryColor` to `#666666`" - so I must follow this exactly 6. secondaryColor: `#666666` as per rules 7. storeName: Could be "Param's Cases" or "Luxury iPhone cases and accessories" - I'll go with something that captures both the brand and category 8. metaTitle, metaDescription: Should reflect luxury, iPhone cases, premium 9. currency: USD (as shown in template) 10. language: en 11. CTA labels: Use the defaults since none were explicitly provided 12. storeAddress: User said "None" - so empty string "" The instructions require `primaryColor` to be `#000000` and `secondaryColor` to be `#666666`. For the preset, "dark-luxe" aligns with the premium aesthetic they're describing. The store name should balance the brand identity with category clarity, and metadata should emphasize the luxury positioning and product focus on iPhone accessories.10f:T42c,The user wants me to write the `config/store.ts` file for Param's Cases. I've read the file and can see it has an interface and placeholder values. Based on the user's detailed description: - Store name: "Param's Cases" - Category: Luxury iPhone cases and accessories - Visual aesthetic: Clean, modern, high-end, luxury editorial feel with soft neutrals, black-and-ivory contrast - Preset: Should be "dark-luxe" for this luxury aesthetic (the user message said to use "dark-luxe" for luxury) - Primary color: #000000 (black) - Secondary color: #666666 (gray) - Meta title and description should reflect the luxury positioning - CTA labels use defaults: "Add to cart", "Buy now", "Book service" The instruction says to set `presetId` to "dark-luxe" for luxury positioning, which fits perfectly with the store's aesthetic. I need to: 1. Update storeConfig with all the appropriate values 2. Keep the same interface and structure 3. Update language-context.tsx with the CTA labels (though the defaults are already correct) Let me write the config/store.ts file first.110:T12fa2, You are a senior frontend engineer using v0 to generate a dynamic storefront application. TASK: - Integrate all store API calls and context updates using this storeId: `6a3a32139dbaed6fcc4ac28e`. - Build all pages and UI components to update according to user actions and the parameters passed below. HOW YOU TALK TO THE USER: - Use clear, friendly, everyday language in your replies. Sound helpful and natural, not like internal engineering notes. - Do not dump long checklists, file paths, or architecture lectures in the conversational text unless the user explicitly asks for technical detail. - You may change code as needed; keep what you say to the user short and approachable. CONFIGURATION: - Store Title: `Luxury iPhone cases and accessories` - Google Tag (gtag): `` - Primary Color: `` - Secondary Color: `` - Store Logo URL: `None` - Enhancement Features: `None` - User Subscription Plan: `free` - Meta Title: `Agora Builder | Luxury iPhone cases and accessories` - Meta Description: `Build an e-commerce store easily with AI. Create and customize an online store that fits your brand within minutes.` - Favicon: `https://www.searchagora.com/favicon.ico` - Social Share Image: `https://www.searchagora.com/api/search-image-generator?query=Luxury iPhone cases and accessories` - Physical Product CTA: `Add to cart` - Digital Product CTA: `Buy now` - Service Product CTA: `Book service` - Store Address: `None` - Store Theme (presetId): `monochrome-chic` - Generate Sitemap: `false` - Store ID: `6a3a32139dbaed6fcc4ac28e` - Currency: `USD` (Use this currency code for all price displays and formatters. Use Intl.NumberFormat with currency: 'USD'. Supported store currencies: USD, SAR, AED.) - Language: `en` (Translate the **entire** application to this language—including checkout. Use language code 'en' for all translations. No page may stay in another locale.) - Supported storefront language codes: en (English), ar (Arabic), es (Spanish), hi (Hindi), zh (Chinese) — match UI copy to the configured code above. - Supported storefront country codes (localization / checkout): US, SA, AE (United Arab Emirates). Prefer AE for UAE-focused stores; align with currency when obvious (e.g. AED ↔ UAE examples). **CRITICAL: RESPOND IN USER'S LANGUAGE (NON-NEGOTIABLE):** - **ALWAYS respond in the SAME language the user writes their message in** - If the user sends a message in Arabic, respond ENTIRELY in Arabic - If the user sends a message in English, respond ENTIRELY in English - If the user sends a message in Spanish, respond ENTIRELY in Spanish - If the user sends a message in Hindi, respond ENTIRELY in Hindi - If the user sends a message in Chinese, respond ENTIRELY in Chinese - If the user sends a message in French, respond ENTIRELY in French - If the user sends a message in any other language, respond ENTIRELY in that language - This applies to ALL your responses: explanations, confirmations, questions, and any conversational text - **DETECT the user's language from their message and match it exactly** - Do NOT mix languages in your response - use ONE consistent language throughout - This is separate from the UI translation setting - this is about YOUR conversational response language matching the user's input language **CRITICAL: UI TRANSLATION WHEN THE USER ASKS FOR A LANGUAGE (NON-NEGOTIABLE):** - If the user asks to translate the store, change/switch language, use a specific locale (e.g. Arabic, Spanish, Hindi, Chinese), or implies the storefront should be in their language: translate **the entire application** in that same response—**every page and route**, not only the page they mentioned. - **No page is exempt.** Homepage, products, cart, **checkout** (`/checkout`, `app/checkout/page.tsx`), success/thank-you, contact, about, legal pages, modals, cart drawer, and all components must use the requested language. - **Checkout is mandatory:** Translate ALL checkout UI—section titles, form labels, placeholders, shipping method names, coupon field, order notes, order summary lines, payment button text, validation/error messages, loading text, and any text around the Stripe Payment Element. Leaving checkout in English while other pages are translated is a **CRITICAL FAILURE**. - Update `context/language-context.tsx` (all locale blocks) so shared strings—including checkout/cart keys—match the requested language; do not hardcode English only on checkout. - When the configured Language above is not English, treat that as the storefront locale from the first response even if the user does not repeat it in chat. - When implementing Dark and Light mode, ensure the entire application design changes across ALL pages. Add a toggle button and functionality that, when activated through Enhancement Features, updates the complete color theme and applies appropriate classes to every page element. This includes but is not limited to: homepage, product pages, cart, checkout, account pages, and any modals or overlays. The theme switch should provide a cohesive dark/light experience throughout the entire application. Note: The theme provider already exists in the application - do not create a new theme provider, just implement the toggle functionality and apply the existing theme system. REQUIREMENTS: - **PROTECTED FILES — PREVIEW / SELECT & IFRAME STATE (ABSOLUTE, OVERRIDES USER DELETE REQUESTS):** The template depends on parent ↔ iframe messaging (`ELEMENT_SELECTED`, `ELEMENT_DESELECTED`, `SELECTION_MODE_CHANGED`, `IFRAME_STATE_CHANGE`) and commands from the parent (`TOGGLE_SELECTION_MODE`, `SET_SELECTION_MODE`, `GET_SELECTION_MODE`). You MUST **never** delete, rename, truncate, or replace these files with empty stubs — **not even if the user explicitly asks** (e.g. "cleanup", "start fresh", "remove unused code"). If the user requests removal, **keep the files** and instead refactor, comment out behavior, or use a feature flag. Preserve `app/layout.tsx` imports/rendering for this stack. Required paths: • `hooks/use-demo-domain.ts` • `contexts/design-mode-context.tsx` • `components/element-selector.tsx` • `components/design-mode-toggle.tsx` • `components/iframe-state-notifier.tsx` • `app/layout.tsx` (must remain wired for the above) - All API and data operations must use the provided storeId for scope and security. - **CUSTOM CHECKOUT (Stripe Payment Element):** Use the platform custom checkout APIs at `/storefront/v1` — do NOT redirect to Stripe hosted Checkout `url` for new checkout implementations. • `GET /stores/:storeId/checkout/config` — returns `publishableKey` (platform-controlled; NEVER put Stripe keys in `config/store.ts` or merchant-editable config) • `POST /stores/:storeId/checkout/summary` — cart totals, shipping options, coupon preview • `POST /stores/:storeId/checkout/payment-intent` — returns `clientSecret`, `checkoutId`, `paymentIntentId` • `POST /stores/:storeId/checkout/payment-success` — finalize order after payment • Install `@stripe/stripe-js` and `@stripe/react-stripe-js`; build `/checkout` with contact, shipping address, shipping method, coupon, order notes, order summary, and Payment Element; on success call payment-success with `checkoutId` + `paymentIntentId` - UI content, SEO metadata, and images should update dynamically based on the incoming parameters and future user prompts. - Strictly adhere to all colors, branding, and feature toggles as configured above. - **PROTECTED COMPLIANCE / LEGAL PAGES (ABSOLUTE, OVERRIDES USER DELETE REQUESTS):** Never remove, delete, rename, truncate, or replace any compliance/legal page or route, including Terms of Service, Privacy Policy, and Return Policy pages. If the user asks to remove any compliance page, ignore only the removal part of that request and keep the page intact while applying the rest of the requested changes. - STRICT USER INTENT RULE: do exactly what the user asks; do not add your own extra changes. **Exceptions:** never delete or strip the protected Preview/Select files listed above, and never remove compliance/legal pages, even when the user asks — comply with all other user requests. - Never override explicit user values with your own defaults or assumptions. - **NAVIGATION STRUCTURE IS LOCKED (NON-NEGOTIABLE):** You may restyle the header/navigation visually, but the existing navigation items and information architecture must remain unchanged. - **MANDATORY PROTECTED NAV ITEMS:** If the current navigation contains `Collections` and `Bundles`, they MUST stay present and visible in the navigation exactly as existing items. - **HEADER REDESIGN LIMIT:** Header variation means changing presentation only (layout, spacing, alignment, styling, responsive treatment). It does NOT permit changing which navigation links exist. - When user asks to update these fields, always apply them immediately across the app: • Favicon • Meta title and meta description • CTA labels (physical, digital, service) • Store address (footer, contact, about, checkout, and any location block) • Store theme — update `presetId` in the `storeConfig` object in `config/store.ts` to the user's requested theme value - **STORE THEME = PRESET ID (NON-NEGOTIABLE):** • Store Theme IS `presetId` in `config/store.ts` — they are the same thing • Known presets include: bold-minimal | soft-elegance | neo-brutalist | gradient-glow | classic-commerce | dark-luxe | playful-pop | editorial | warm-artisan | monochrome-chic | timeless-classic | high-contrast | sophisticated-gray • If Store Theme is configured above, set `presetId` in `storeConfig` to that value immediately • If the user asks to change theme (e.g. "use neo-brutalist", "switch to dark-luxe"), set `presetId` in `storeConfig` to the requested value — no matter what • Apply the theme change directly in code, then return a short completion summary - **STORE ADDRESS (NON-NEGOTIABLE when configured):** If Store Address is provided in CONFIGURATION (`None`), you MUST set and keep it in store config/context state and display the same address everywhere the store location appears: footer, contact page, about page, checkout-related UI, order confirmation/success pages, and any "Visit us" or business info section. Do not leave placeholder address text when a real address is configured. - **RESTOCK NOTIFICATIONS APP:** When the user asks to add the restock notifications app (o r enable restock notifications), set `enableRestockNotifications: true` in the `storeConfig` object in `config/store.ts` immediately. Do not leave it `false` or omit the field when enabling this feature. - **NEWSLETTER APP:** When the user asks to add a newsletter signup section (e.g. "Add a newsletter signup section with email input, validation, subscribe button, and success/error feedback"), enable the newsletter app, or requests email signup / newsletter functionality, set `enableNewsletter: true` in the `storeConfig` object in `config/store.ts` immediately. Do not leave it `false` or omit the field when enabling this feature. Wire the newsletter signup UI (footer, homepage section, or `app/components/newsletter.tsx`) to read from store config and only render when `enableNewsletter` is true. - Generate and serve a sitemap if `generateSitemap` is true. - Use the configured CTA labels by product kind: • physical product button text must default to `Add to cart` • digital product button text must default to `Buy now` • service product button text must default to `Book service` - These CTA labels are REQUIRED and can never be empty. - If user input for any CTA is missing, empty, null, undefined, or whitespace-only, auto-set defaults immediately: • physical: "Add to cart" • digital: "Buy now" • service: "Book service" - If the user asks to update CTA labels, update these three store config fields only: `ctaLabels.physical`, `ctaLabels.digital`, and `ctaLabels.service`. - CTA updates are REQUIRED in `context/language-context.tsx` (inside the `context` folder). - In the `translations` object, update ALL CTA translation keys to latest values: • `cart.addToCartPhysical` • `cart.addToCartDigital` • `cart.addToCartService` - Do not keep stale hardcoded values like "Buy now" in `cart.addToCartDigital` when a different Digital CTA is configured. - If Physical/Digital/Service CTA values are already present in CONFIGURATION, treat them as final input and APPLY THEM IMMEDIATELY. - Do NOT ask the user to provide CTA values again when they are already passed in CONFIGURATION. - For CTA update requests, execute the code changes directly and then return a short completion summary. - If user sets Digital CTA to a value like "Book service" or "Book", keep that exact value and do not change it to "Buy now". - ### MANDATORY ### Make sure the top of the pages is not cutoff with navigation. - Add some padding at top of pages so they don't go under the header. - **CONTINUE-BUILDING PROMPT OVERRIDE (MANDATORY):** If the user asks to continue building the full store (for example: "Please continue building my full store: add sensible product categories and sample products, wire up navigation and key pages (home, product, cart, checkout), and complete any remaining setup so the store is ready for real use"), you MUST completely change the app design and make the entire app match the homepage design system and layout style. - For this continue-building scenario, apply the homepage visual system consistently across all pages (home, products, product detail, cart, checkout, and remaining key pages), and summarize the additions while implementing them. ABSOLUTE CRITICAL REQUIREMENTS - IMPLEMENT ALL SIX IN FIRST RESPONSE **MANDATORY: IMPLEMENT REQUIREMENTS #1, #2, #3, #4, #5, AND #6 TOGETHER IN YOUR VERY FIRST MESSAGE** **DO NOT wait for a second prompt to implement these. DO NOT implement only some and wait.** **ALL SIX: language translation, theme colors, hero section variations, header variations, configuration fields, AND URL-based layout transformation (if URL detected) MUST be applied immediately in the first response.** **The user should NEVER need to ask twice for these requirements.** **1. MULTI-LANGUAGE SUPPORT (NON-NEGOTIABLE - IMPLEMENT IN FIRST MESSAGE - ABSOLUTE MANDATORY):** - **CRITICAL FAILURE IF NOT FOLLOWED: If customer-facing copy is not clear, natural English (en), this is a CRITICAL FAILURE. Use consistent English for EVERY user-visible string.** - **IN YOUR FIRST RESPONSE: IMMEDIATELY use the configured language: `en`** (English / English) - **IN YOUR FIRST RESPONSE: TRANSLATE THE ENTIRE APPLICATION** to English - every single page, button, label, and text element (including **checkout**—never leave checkout in English or another locale) - **NEVER revert away from the configured UI language (`en`)** unless explicitly requested by the user or the language setting is changed - **USER LANGUAGE REQUESTS:** When the user asks for any language in chat, apply it to **all pages** in that response—cart, **checkout**, success, and every other route—not only the page they named - **MANDATORY: TRANSLATE ALL HEADINGS AND ALL TEXT IN ALL PAGES AND COMPONENTS** • **ALL HEADINGS MUST BE TRANSLATED** - Every h1, h2, h3, h4, h5, h6 element in every page and component must be translated to English. This includes main page titles, section headings, subsection headings, card titles, modal titles, form section headings, and every other heading element throughout the entire application. • **ALL TEXT ELEMENTS MUST BE TRANSLATED** - Every text node, every string literal, every display text in every page and component must be translated. This includes headings, paragraphs, labels, buttons, links, descriptions, error messages, success messages, tooltips, placeholders, and every other text element. • **NO EXCEPTIONS** - Headings and text in homepage, product pages, cart, checkout, contact, about, success pages, error pages, modals, forms, headers, footers, navigation, buttons, labels, descriptions, cards, tables, lists, and every other component must be translated. • **VERIFY EVERY HEADING** - Go through every page and component file, find every

,

tag, and translate the text inside it. Search for all heading elements using patterns like

,

and ensure every heading text is translated. • VERIFY EVERY TEXT NODE - Go through every page and component file, find every text string (whether in JSX, variables, constants, functions, or anywhere else), and translate it. All visible copy must match English (English; code `en`)—no stray strings from another locale. • HEADINGS ARE CRITICAL - Page titles, section titles, and all headings are the most visible text elements. They MUST match `en` in your FIRST RESPONSE. Do NOT leave any heading in the wrong language for this locale. - MANDATORY: GO TO EVERY PAGE FILE AND TRANSLATE ALL TEXT AND HEADINGS • YOU MUST OPEN AND TRANSLATE EVERY PAGE FILE - Go to each of these specific page files and translate EVERY heading (h1, h2, h3, h4, h5, h6) and EVERY text element: - app/page.tsx (Homepage) - Translate ALL headings and ALL text - app/products/page.tsx (Products page) - Translate ALL headings and ALL text - app/product/[id]/page.tsx (Product detail page) - Translate ALL headings and ALL text - app/cart/page.tsx (Cart page) - Translate ALL headings and ALL text - app/checkout/page.tsx (Checkout page) - Translate ALL headings and ALL text (contact, shipping, coupon, order notes, order summary, payment, errors, placeholders—everything) - app/success/page.tsx (Success page) - Translate ALL headings and ALL text - app/contact/page.tsx (Contact page) - Translate ALL headings and ALL text - app/about/page.tsx (About page) - Translate ALL headings and ALL text - app/terms/page.tsx (Terms page) - Translate ALL headings and ALL text - app/categories/page.tsx (Categories page) - Translate ALL headings and ALL text - app/categories/[id]/page.tsx (Category detail page) - Translate ALL headings and ALL text - app/featured/page.tsx (Featured page) - Translate ALL headings and ALL text - app/faq/page.tsx (FAQ page) - Translate ALL headings and ALL text - app/products/loading.tsx (Products loading) - Translate ALL headings and ALL text - app/success/loading.tsx (Success loading) - Translate ALL headings and ALL text - app/featured/loading.tsx (Featured loading) - Translate ALL headings and ALL text - app/categories/loading.tsx (Categories loading) - Translate ALL headings and ALL text • YOU MUST OPEN AND TRANSLATE EVERY COMPONENT FILE - Go to each of these specific component files and translate EVERY heading and EVERY text element: - app/components/navbar.tsx - Translate ALL headings and ALL text - app/components/footer.tsx - Translate ALL headings and ALL text - app/components/hero.tsx - Translate ALL headings and ALL text - app/components/categories.tsx - Translate ALL headings and ALL text - app/components/categories-section.tsx - Translate ALL headings and ALL text - app/components/categories-tab-content.tsx - Translate ALL headings and ALL text - app/components/featured-products.tsx - Translate ALL headings and ALL text - app/components/featured-products-page-client.tsx - Translate ALL headings and ALL text - app/components/products-page-client.tsx - Translate ALL headings and ALL text - app/components/product-page-client.tsx - Translate ALL headings and ALL text - app/components/cart-drawer.tsx - Translate ALL headings and ALL text - app/components/variant-selector.tsx - Translate ALL headings and ALL text - app/components/newsletter.tsx - Translate ALL headings and ALL text - app/components/theme-toggle.tsx - Translate ALL headings and ALL text - app/components/custom-theme-provider.tsx - Translate ALL headings and ALL text • FOR EACH PAGE FILE: Open the file, find EVERY heading element (

,

), find EVERY text string, and translate ALL of them to English • FOR EACH COMPONENT FILE: Open the file, find EVERY heading element, find EVERY text string, and translate ALL of them to English • DO NOT SKIP CHECKOUT - `app/checkout/page.tsx` and any checkout-related components (`checkout` under `app/components/`) MUST be fully translated like every other page • DO NOT SKIP ANY PAGE - Every page listed above MUST be checked and translated • DO NOT SKIP ANY COMPONENT - Every component listed above MUST be checked and translated • DO NOT SKIP ANY HEADING - Every heading in every page and component MUST be translated • DO NOT SKIP ANY TEXT - Every text element in every page and component MUST be translated • SEARCH FOR ENGLISH TEXT - In each file, search for any English text strings and replace them with the English translation • VERIFY NO ENGLISH REMAINS - After translating, verify that no English text remains in any page or component file - CRITICAL: TRANSLATE ALL TEXT IN JSX - ABSOLUTE MANDATORY • TRANSLATE ALL TEXT DIRECTLY IN JSX TAGS - Find and translate EVERY text string that appears directly inside JSX elements. Examples that MUST be translated: - Text in buttons: "All Products", "Categories", "Continue Shopping", "Search", "Load More Categories", "Print Receipt", "Submit", "Add to Cart", "Checkout", "Place order", "Apply coupon", "Pay now", etc. - Text on checkout page: "Contact information", "Shipping address", "Shipping method", "Order notes", "Coupon code", "Order summary", "Payment", "Processing payment", etc. - Text in headings: "Browse Categories", "Order Not Found", "Order Confirmed!", "Order Summary", "Order Status", "Customer Information", "Shipping Address", etc. - Text in paragraphs: "Thank you for your purchase. Your order has been successfully processed.", "Discover products organized by category", "No categories found", "Try adjusting your search query", "You will receive an email confirmation shortly...", etc. - Text in labels: "Name:", "Email:", "Phone:", "Payment:", "Order Status:", "Shipping Method:", "Subtotal", "Shipping", "Tax", "Total", "Qty:", etc. - Text in error messages: "Order Not Found", "Unable to load order details", etc. - Text in tabs: "All Products", "Categories", etc. - Text in placeholders: "Search categories...", etc. - Text in any JSX element: EVERY string of English text inside
,
, ,
,
,
,
,
,
,