feat: reveal the cart drawer after the umbrella ?add= deep link

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

src/App.vue

@@ -28,7 +28,12 @@ if (isUmbrella && typeof window !== 'undefined') {
   const params = new URLSearchParams(window.location.search)
   const addId = params.get('add')
   if (addId) {
-    import('@/api/cart.js').then(({ addToCart }) => addToCart(addId))
+    import('@/api/cart.js').then(async ({ addToCart }) => {
+      await addToCart(addId)
+      // Ask the landing page to reveal its cart drawer (see lib/umbrellaCart).
+      const { cartRevealPending } = await import('@/lib/umbrellaCart.js')
+      cartRevealPending.value = true
+    })
     params.delete('add')
     const qs = params.toString()
     history.replaceState(

src/lib/umbrellaCart.js

@@ -0,0 +1,8 @@
+import { ref } from 'vue'
+
+// Set by the umbrella ?add= deep-link handler (App.vue) after it puts a
+// product in the cart on page load. The landing page consumes it once
+// on mount and reveals its cart drawer, so the visitor arrives seeing
+// what the umbrella card promised. The drawer state itself is
+// page-local by design — this flag is only the handoff.
+export const cartRevealPending = ref(false)

src/pages/HomePage.vue

@@ -10,6 +10,7 @@ import Bundles from '@/design-system/components/Bundles.vue'
 import About from '@/design-system/components/About.vue'
 import Footer from '@/design-system/components/Footer.vue'
 import CartDrawer from '@/design-system/components/CartDrawer.vue'
+import { cartRevealPending } from '@/lib/umbrellaCart.js'
 import {
   products,
   fetchCart,
@@ -219,6 +220,21 @@ function syncNavHeight() {
   const h = Math.round(node.getBoundingClientRect().height)
   document.documentElement.style.setProperty('--nav-h', `${h}px`)
 }
+// Umbrella ?add= deep link: reveal the drawer once the App-level
+// handler has put the product in the cart. A watch (not a mount-time
+// check) because the handler resolves through dynamic imports and can
+// finish after mount.
+watch(
+  cartRevealPending,
+  (pending) => {
+    if (pending) {
+      cartOpen.value = true
+      cartRevealPending.value = false
+    }
+  },
+  { immediate: true },
+)
+
 onMounted(() => {
   fetchCart()
   syncNavHeight()