@instockng/storefront-ui 1.0.77 → 1.0.79

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instockng/storefront-ui",
-  "version": "1.0.77",
+  "version": "1.0.79",
   "description": "Pre-built UI components for OMS e-commerce sites",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/components/Checkout.tsx

@@ -896,7 +896,7 @@ export function Checkout({
                       <option disabled value="">{selectedState ? 'Select Delivery Zone' : 'Select State First'}</option>
                       {selectedState?.zones.map((zone) => (
                         <option key={zone.id} value={zone.id}>
-                          {zone.name}
+                          {zone.name} (₦{zone.deliveryCost})
                         </option>
                       ))}
                     </FormSelect>

package/src/contexts/CartContext.tsx

@@ -294,14 +294,14 @@ export function CartProvider({ children, brandSlug, initialCartId, shoppingCartP
         // Generate event ID matching backend format: cart_{cartId}_item_{itemId}
         const eventID = `cart_${cartId}_item_${addedItem.id}`;
 
-        // Track AddToCart event with Meta Pixel and matching event ID
-        trackMetaAddToCart(sku, productName, price, quantity, eventID);
+        // Track AddToCart event with Meta Pixel using product slug to match catalog
+        trackMetaAddToCart(productSlug, productName, price, quantity, eventID);
 
         // Track AddToCart event with TikTok Pixel and matching event ID
         trackTikTokAddToCart(productSlug, productName, price, quantity, eventID);
       } else {
         // Fallback without event ID if item not found
-        trackMetaAddToCart(sku, productName, price, quantity);
+        trackMetaAddToCart(productSlug, productName, price, quantity);
         trackTikTokAddToCart(productSlug, productName, price, quantity);
       }
     },
@@ -373,9 +373,9 @@ export function CartProvider({ children, brandSlug, initialCartId, shoppingCartP
       const cartTotal = cart.pricing.total;
       const itemCount = cart.items.reduce((sum, item) => sum + item.quantity, 0);
 
-      // Prepare rich data for Pixel and CAPI
+      // Prepare rich data for Pixel and CAPI - use product slug to match catalog
       const contents = cart.items.map(item => ({
-        id: item.variant.sku,
+        id: item.variant.product.slug,
         quantity: item.quantity,
         item_price: Number(item.variant.price),
       }));