tf-checkout-react 1.3.39-beta.2 → 1.3.40

package/dist/hooks/usePixel.d.ts

@@ -1 +1 @@
-export declare const usePixel: (key: string, eventId: string | number) => Promise<void>;
+export declare const usePixel: (key: string | string[], eventId: string | number, alreadyLoadedEventData?: any) => Promise<void>;

package/dist/tf-checkout-react.cjs.development.js

@@ -1212,7 +1212,7 @@ var createElementFromHTML = function createElementFromHTML(htmlString) {
   var div = document.createElement('div');
   div.innerHTML = htmlString.trim(); // Change this to div.childNodes to support multiple top-level nodes.
 
-  return div.firstChild || '';
+  return div.childNodes || [];
 };
 
 var isWindowDefined = typeof window !== 'undefined';
@@ -1617,34 +1617,75 @@ var getCheckoutPageConfigs = /*#__PURE__*/function () {
 }();
 
 var usePixel = /*#__PURE__*/function () {
-  var _ref = /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2(key, eventId) {
-    var getEventData;
+  var _ref = /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2(key, eventId, alreadyLoadedEventData) {
+    var addPixel, getEventData;
     return runtime_1.wrap(function _callee2$(_context2) {
       while (1) {
         switch (_context2.prev = _context2.next) {
           case 0:
+            addPixel = function addPixel(pixel) {
+              var _document;
+
+              if ((_document = document) != null && _document.head && pixel) {
+                var nodes = createElementFromHTML(pixel);
+
+                for (var _i = 0, _Array$from = Array.from(nodes); _i < _Array$from.length; _i++) {
+                  var element = _Array$from[_i];
+                  document.head.append(element);
+                }
+              }
+            };
+
             getEventData = /*#__PURE__*/function () {
               var _ref2 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
-                var _document;
-
-                var eventResponse, event, pixel;
+                var isEventDataUndefined, eventResponse, event, pixel;
                 return runtime_1.wrap(function _callee$(_context) {
                   while (1) {
                     switch (_context.prev = _context.next) {
                       case 0:
-                        _context.next = 2;
-                        return getEvent(eventId);
+                        if (eventId) {
+                          _context.next = 2;
+                          break;
+                        }
+
+                        return _context.abrupt("return");
 
                       case 2:
-                        eventResponse = _context.sent;
-                        event = _get(eventResponse, 'data.data.attributes');
-                        pixel = event[key];
+                        // Check if event data object passed or not. If not then the value will be undefined.
+                        // If event data passed, then it's initial value will be null.
+                        isEventDataUndefined = alreadyLoadedEventData === undefined;
 
-                        if ((_document = document) != null && _document.head && pixel) {
-                          document.head.append(createElementFromHTML(pixel));
+                        if (!isEventDataUndefined) {
+                          _context.next = 9;
+                          break;
                         }
 
+                        _context.next = 6;
+                        return getEvent(eventId);
+
                       case 6:
+                        _context.t0 = _context.sent;
+                        _context.next = 10;
+                        break;
+
+                      case 9:
+                        _context.t0 = null;
+
+                      case 10:
+                        eventResponse = _context.t0;
+                        event = isEventDataUndefined ? _get(eventResponse, 'data.data.attributes', {}) : alreadyLoadedEventData || {};
+
+                        if (typeof key === 'string') {
+                          pixel = event[key];
+                          addPixel(pixel);
+                        } else {
+                          _forEach(key, function (item) {
+                            var pixel = event[item];
+                            addPixel(pixel);
+                          });
+                        }
+
+                      case 13:
                       case "end":
                         return _context.stop();
                     }
@@ -1658,10 +1699,10 @@ var usePixel = /*#__PURE__*/function () {
             }();
 
             React.useEffect(function () {
-              getEventData();
-            }, []);
+              getEventData(); // eslint-disable-next-line react-hooks/exhaustive-deps
+            }, [eventId, alreadyLoadedEventData]);
 
-          case 2:
+          case 3:
           case "end":
             return _context2.stop();
         }
@@ -1669,7 +1710,7 @@ var usePixel = /*#__PURE__*/function () {
     }, _callee2);
   }));
 
-  return function usePixel(_x, _x2) {
+  return function usePixel(_x, _x2, _x3) {
     return _ref.apply(this, arguments);
   };
 }();
@@ -3639,7 +3680,7 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
     return item.code.toLowerCase() === defaultCountry;
   }) || {};
   var initialCountry = selectedCountry.id || _get(userData, 'country', '') || '1';
-  usePixel('checkoutPixels', eventId);
+  usePixel(['checkoutPixels', 'brandCheckoutPixels'], eventId);
   return React__default.createElement(styles.ThemeProvider, {
     theme: themeMui
   }, (loading || isCountriesLoading) && React__default.createElement(Backdrop, {
@@ -5057,7 +5098,7 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
       confirmationMain = _confirmationLabels$c2 === void 0 ? 'Your tickets are available in My Tickets section' : _confirmationLabels$c2,
       _confirmationLabels$c3 = confirmationLabels.confirmationHelper,
       confirmationHelper = _confirmationLabels$c3 === void 0 ? 'Please bring them with you to the event' : _confirmationLabels$c3;
-  usePixel('conversionPixels', data == null ? void 0 : data.product_id);
+  usePixel(['conversionPixels', 'brandConversionPixels'], data == null ? void 0 : data.product_id);
   return React__default.createElement("div", {
     className: "confirmation-page"
   }, data && React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
@@ -5921,7 +5962,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
   useCookieListener(X_TF_ECOMMERCE, function (value) {
     return setIsLogged(Boolean(value));
   });
-  usePixel('pagePixels', eventId);
+  usePixel(['pagePixels', 'brandPagePixels'], eventId, event);
   React.useEffect(function () {
     if (typeof window !== 'undefined') {
       var access_token = window.localStorage.getItem('access_token');