@ikas/storefront 0.0.85 → 0.0.86

package/build/analytics/analytics.d.ts

@@ -1,5 +1,6 @@
 import { IkasProductDetail, IkasOrderLineItem, IkasCheckout } from "../models/index";
 import { CheckoutStep } from "../components/checkout/model";
+import { IkasCart } from "../models/data/cart/index";
 export declare class Analytics {
     constructor();
     static pageView(url: string): {
@@ -16,4 +17,6 @@ export declare class Analytics {
     static addToWishlist(id: string): void;
     static search(searchKeyword: string): void;
     static completeRegistration(): void;
+    static viewCart(cart: IkasCart | null | undefined): void;
+    static viewCategory(categoryPath: string): void;
 }

package/build/analytics/facebookPixel.d.ts

@@ -1,4 +1,5 @@
 import { IkasProductDetail, IkasOrderLineItem, IkasCheckout } from "../models/index";
+import { IkasCart } from "../models/data/cart/index";
 export declare class FacebookPixel {
     constructor();
     static productView(productDetail: IkasProductDetail): void;
@@ -8,4 +9,6 @@ export declare class FacebookPixel {
     static addToWishlist(id: string): void;
     static search(searchKeyword: string): void;
     static completeRegistration(): void;
+    static viewCart(cart: IkasCart): void;
+    static viewCategory(categoryPath: string): void;
 }

package/build/index.es.js

@@ -19807,6 +19807,32 @@ var FacebookPixel = /** @class */ (function () {
                 window.fbq &&
                 window.fbq("track", "CompleteRegistration", {
                     status: true,
+                    value: 0,
+                    currency: "TRY",
+                });
+            return;
+        }
+        catch (err) {
+            console.error(err);
+        }
+    };
+    FacebookPixel.viewCart = function (cart) {
+        try {
+            !isServer &&
+                window.fbq &&
+                window.fbq("track", "ViewCart", viewCartFBPItem(cart));
+            return;
+        }
+        catch (err) {
+            console.error(err);
+        }
+    };
+    FacebookPixel.viewCategory = function (categoryPath) {
+        try {
+            !isServer &&
+                window.fbq &&
+                window.fbq("track", "ViewCategory", {
+                    content_name: categoryPath,
                 });
             return;
         }
@@ -19817,7 +19843,6 @@ var FacebookPixel = /** @class */ (function () {
     return FacebookPixel;
 }());
 function productToFBPItem(productDetail, quantity) {
-    if (quantity === void 0) { quantity = 1; }
     return {
         content_name: productDetail.product.name,
         content_category: productDetail.product.categories.length > 0
@@ -19831,7 +19856,6 @@ function productToFBPItem(productDetail, quantity) {
         currency: productDetail.selectedVariant.price.currency === ""
             ? "TRY"
             : productDetail.selectedVariant.price.currency,
-        num_items: quantity,
     };
 }
 function beginCheckoutFBPItem(checkout) {
@@ -19845,12 +19869,29 @@ function beginCheckoutFBPItem(checkout) {
     return {
         contents: contents,
         content_category: "",
+        content_type: "product_group",
         content_ids: contentIds,
         currency: (_b = checkout.cart) === null || _b === void 0 ? void 0 : _b.items[0].currencyCode,
         value: (_c = checkout.cart) === null || _c === void 0 ? void 0 : _c.totalPrice,
         num_items: (_d = checkout.cart) === null || _d === void 0 ? void 0 : _d.items.length,
     };
 }
+function viewCartFBPItem(cart) {
+    var contentIds = [];
+    var contents = [];
+    cart.items.map(function (item) {
+        contentIds.push(item.id);
+        contents.push({ id: item.id, quantity: item.quantity });
+    });
+    return {
+        contents: contents,
+        content_type: "product_group",
+        content_ids: contentIds,
+        currency: cart.items[0].currencyCode,
+        value: cart.totalPrice,
+        num_items: cart.items.length,
+    };
+}
 function orderLineItemToFBPItem(orderLineItem, quantity) {
     return {
         content_name: orderLineItem.variant.name,
@@ -21364,6 +21405,26 @@ var Analytics = /** @class */ (function () {
             console.error(err);
         }
     };
+    Analytics.viewCart = function (cart) {
+        try {
+            if (cart) {
+                FacebookPixel.viewCart(cart);
+            }
+            return;
+        }
+        catch (err) {
+            console.error(err);
+        }
+    };
+    Analytics.viewCategory = function (categoryPath) {
+        try {
+            FacebookPixel.viewCategory(categoryPath);
+            return;
+        }
+        catch (err) {
+            console.error(err);
+        }
+    };
     return Analytics;
 }());
 
@@ -27447,6 +27508,10 @@ var IkasCheckoutPage = observer(function (_a) {
     var checkout = _a.checkout, queryParams = _a.queryParams;
     var router = useRouter();
     var vm = useState(function () { return new CheckoutViewModel(checkout, queryParams, router); })[0];
+    useEffect(function () {
+        Analytics.beginCheckout(vm.checkout);
+        Analytics.checkoutStep(vm.checkout, vm.step);
+    }, []);
     var _e = useState(""), policyModalTitle = _e[0], setPolicyModalTitle = _e[1];
     var _f = useState(""), policyModalText = _f[0], setPolicyModalText = _f[1];
     var step;
@@ -27540,8 +27605,6 @@ var IkasCheckoutPage = observer(function (_a) {
     };
     if (!vm.isCheckoutLoaded || !vm.customerStore.initialized)
         return null;
-    Analytics.beginCheckout(vm.checkout);
-    Analytics.checkoutStep(vm.checkout, vm.step);
     return (createElement(Fragment, null,
         createElement(IkasPageHead, { pageTitle: (((_b = vm.merchantSettings) === null || _b === void 0 ? void 0 : _b.merchantName) || "") + " - Güvenli Ödeme", description: "Güvenli ödeme" }),
         createElement("div", { id: "Checkout", className: styles$2.CheckoutPage },
@@ -28126,9 +28189,7 @@ var Page$1 = function (_a) {
     var _c = useState(initialPropValues), propValues = _c[0], setPropValues = _c[1];
     useEffect(function () {
         setIsBrowser(typeof window !== "undefined");
-        if (isBrowser) {
-            handleAnalytics(page, pageSpecificDataStr);
-        }
+        handleAnalytics(page, pageSpecificDataStr);
     }, []);
     useEffect(function () {
         setPropValues(IkasPageDataProvider.initPropValues(propValuesStr, router, isBrowser));
@@ -28228,6 +28289,17 @@ function handleAnalytics(page, pageSpecificDataStr) {
                 var productDetail = new IkasProductDetail(productDetailParsed.product, productDetailParsed.selectedVariantValues);
                 Analytics.productView(productDetail);
             }
+            if (page.type === IkasThemePageType.CATEGORY) {
+                var category = JSON.parse(pageSpecificDataStr);
+                var categoryPath = category.path.map(function (cat) { return cat.name; }).join(" > ");
+                if (category.path.length > 0) {
+                    categoryPath = categoryPath + " > " + category.name;
+                }
+                else {
+                    categoryPath = category.name;
+                }
+                Analytics.viewCategory(categoryPath);
+            }
         }
         catch (err) {
             console.error(err);
@@ -28564,6 +28636,10 @@ var Page$b = function (_a) {
     var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr;
     var router = useRouter();
     var propValues = useMemo(function () { return IkasPageDataProvider.initPropValues(propValuesStr, router); }, [propValuesStr]);
+    var store = IkasStorefrontConfig.store;
+    useEffect(function () {
+        Analytics.viewCart(store.cartStore.cart);
+    }, []);
     return (createElement(IkasPage, { settingsStr: settingsStr, page: page, propValues: propValues }));
 };
 var getStaticProps$a = function (context) { return __awaiter(void 0, void 0, void 0, function () {

package/build/index.js

@@ -19790,6 +19790,32 @@ var FacebookPixel = /** @class */ (function () {
                 window.fbq &&
                 window.fbq("track", "CompleteRegistration", {
                     status: true,
+                    value: 0,
+                    currency: "TRY",
+                });
+            return;
+        }
+        catch (err) {
+            console.error(err);
+        }
+    };
+    FacebookPixel.viewCart = function (cart) {
+        try {
+            !isServer &&
+                window.fbq &&
+                window.fbq("track", "ViewCart", viewCartFBPItem(cart));
+            return;
+        }
+        catch (err) {
+            console.error(err);
+        }
+    };
+    FacebookPixel.viewCategory = function (categoryPath) {
+        try {
+            !isServer &&
+                window.fbq &&
+                window.fbq("track", "ViewCategory", {
+                    content_name: categoryPath,
                 });
             return;
         }
@@ -19800,7 +19826,6 @@ var FacebookPixel = /** @class */ (function () {
     return FacebookPixel;
 }());
 function productToFBPItem(productDetail, quantity) {
-    if (quantity === void 0) { quantity = 1; }
     return {
         content_name: productDetail.product.name,
         content_category: productDetail.product.categories.length > 0
@@ -19814,7 +19839,6 @@ function productToFBPItem(productDetail, quantity) {
         currency: productDetail.selectedVariant.price.currency === ""
             ? "TRY"
             : productDetail.selectedVariant.price.currency,
-        num_items: quantity,
     };
 }
 function beginCheckoutFBPItem(checkout) {
@@ -19828,12 +19852,29 @@ function beginCheckoutFBPItem(checkout) {
     return {
         contents: contents,
         content_category: "",
+        content_type: "product_group",
         content_ids: contentIds,
         currency: (_b = checkout.cart) === null || _b === void 0 ? void 0 : _b.items[0].currencyCode,
         value: (_c = checkout.cart) === null || _c === void 0 ? void 0 : _c.totalPrice,
         num_items: (_d = checkout.cart) === null || _d === void 0 ? void 0 : _d.items.length,
     };
 }
+function viewCartFBPItem(cart) {
+    var contentIds = [];
+    var contents = [];
+    cart.items.map(function (item) {
+        contentIds.push(item.id);
+        contents.push({ id: item.id, quantity: item.quantity });
+    });
+    return {
+        contents: contents,
+        content_type: "product_group",
+        content_ids: contentIds,
+        currency: cart.items[0].currencyCode,
+        value: cart.totalPrice,
+        num_items: cart.items.length,
+    };
+}
 function orderLineItemToFBPItem(orderLineItem, quantity) {
     return {
         content_name: orderLineItem.variant.name,
@@ -21347,6 +21388,26 @@ var Analytics = /** @class */ (function () {
             console.error(err);
         }
     };
+    Analytics.viewCart = function (cart) {
+        try {
+            if (cart) {
+                FacebookPixel.viewCart(cart);
+            }
+            return;
+        }
+        catch (err) {
+            console.error(err);
+        }
+    };
+    Analytics.viewCategory = function (categoryPath) {
+        try {
+            FacebookPixel.viewCategory(categoryPath);
+            return;
+        }
+        catch (err) {
+            console.error(err);
+        }
+    };
     return Analytics;
 }());
 
@@ -27427,6 +27488,10 @@ var IkasCheckoutPage = mobxReactLite.observer(function (_a) {
     var checkout = _a.checkout, queryParams = _a.queryParams;
     var router$1 = router.useRouter();
     var vm = React.useState(function () { return new CheckoutViewModel(checkout, queryParams, router$1); })[0];
+    React.useEffect(function () {
+        Analytics.beginCheckout(vm.checkout);
+        Analytics.checkoutStep(vm.checkout, vm.step);
+    }, []);
     var _e = React.useState(""), policyModalTitle = _e[0], setPolicyModalTitle = _e[1];
     var _f = React.useState(""), policyModalText = _f[0], setPolicyModalText = _f[1];
     var step;
@@ -27520,8 +27585,6 @@ var IkasCheckoutPage = mobxReactLite.observer(function (_a) {
     };
     if (!vm.isCheckoutLoaded || !vm.customerStore.initialized)
         return null;
-    Analytics.beginCheckout(vm.checkout);
-    Analytics.checkoutStep(vm.checkout, vm.step);
     return (React.createElement(React.Fragment, null,
         React.createElement(IkasPageHead, { pageTitle: (((_b = vm.merchantSettings) === null || _b === void 0 ? void 0 : _b.merchantName) || "") + " - Güvenli Ödeme", description: "Güvenli ödeme" }),
         React.createElement("div", { id: "Checkout", className: styles$2.CheckoutPage },
@@ -28106,9 +28169,7 @@ var Page$1 = function (_a) {
     var _c = React.useState(initialPropValues), propValues = _c[0], setPropValues = _c[1];
     React.useEffect(function () {
         setIsBrowser(typeof window !== "undefined");
-        if (isBrowser) {
-            handleAnalytics(page, pageSpecificDataStr);
-        }
+        handleAnalytics(page, pageSpecificDataStr);
     }, []);
     React.useEffect(function () {
         setPropValues(IkasPageDataProvider.initPropValues(propValuesStr, router$1, isBrowser));
@@ -28208,6 +28269,17 @@ function handleAnalytics(page, pageSpecificDataStr) {
                 var productDetail = new IkasProductDetail(productDetailParsed.product, productDetailParsed.selectedVariantValues);
                 Analytics.productView(productDetail);
             }
+            if (page.type === exports.IkasThemePageType.CATEGORY) {
+                var category = JSON.parse(pageSpecificDataStr);
+                var categoryPath = category.path.map(function (cat) { return cat.name; }).join(" > ");
+                if (category.path.length > 0) {
+                    categoryPath = categoryPath + " > " + category.name;
+                }
+                else {
+                    categoryPath = category.name;
+                }
+                Analytics.viewCategory(categoryPath);
+            }
         }
         catch (err) {
             console.error(err);
@@ -28544,6 +28616,10 @@ var Page$b = function (_a) {
     var page = _a.page, propValuesStr = _a.propValuesStr, settingsStr = _a.settingsStr;
     var router$1 = router.useRouter();
     var propValues = React.useMemo(function () { return IkasPageDataProvider.initPropValues(propValuesStr, router$1); }, [propValuesStr]);
+    var store = IkasStorefrontConfig.store;
+    React.useEffect(function () {
+        Analytics.viewCart(store.cartStore.cart);
+    }, []);
     return (React.createElement(IkasPage, { settingsStr: settingsStr, page: page, propValues: propValues }));
 };
 var getStaticProps$a = function (context) { return __awaiter(void 0, void 0, void 0, function () {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ikas/storefront",
-  "version": "0.0.85",
+  "version": "0.0.86",
   "main": "./build/index.js",
   "module": "./build/index.es.js",
   "author": "Umut Ozan Yıldırım",