tf-checkout-react 1.4.0 → 1.4.1

package/dist/tf-checkout-react.esm.js

@@ -948,8 +948,7 @@ var getStates = function getStates(countryId) {
   return publicRequest.get("/countries/" + countryId + "/states/");
 };
 var getOrders = function getOrders(page, limit, eventSlug) {
-  return publicRequest.get( // eslint-disable-next-line max-len
-  "v1/account/orders/?page=" + page + "&limit=" + limit + "&filter[event]=" + eventSlug + "&filter[brand]=" + CONFIGS.BRAND_SLUG + "&filter[subbrands]=true");
+  return publicRequest.get("v1/account/orders/?page=" + page + "&limit=" + limit + "&filter[event]=" + eventSlug + "&" + (CONFIGS.BRAND_SLUG ? "filter[brand]=" + CONFIGS.BRAND_SLUG + "&filter[subbrands]=true" : ''));
 };
 var getOrderDetails = function getOrderDetails(orderId) {
   return publicRequest.get("v1/account/order/" + orderId);
@@ -6118,23 +6117,78 @@ var EventInfoItem = function EventInfoItem(_ref) {
     alt: "event"
   }), name);
 };
-var tableConfig = function tableConfig(key) {
+var tableConfig = function tableConfig(columns, key) {
   var config;
+  if (columns) {
+    return {
+      header: _map(columns, function (item) {
+        return item.label;
+      }),
+      body: _map(columns, function (item) {
+        if (item.component) {
+          var ItemComponent = item.component;
+          return function (row) {
+            return {
+              columnProps: item,
+              component: React.createElement(ItemComponent, Object.assign({}, row))
+            };
+          };
+        }
+        if (item.key === 'event') {
+          return function (row) {
+            return {
+              columnProps: item,
+              component: React.createElement(EventInfoItem, {
+                image: row.image,
+                name: row.eventName
+              })
+            };
+          };
+        }
+        if (item.key === 'total') {
+          return function (row) {
+            return {
+              columnProps: item,
+              component: row.currency + row.amount
+            };
+          };
+        }
+        return function (row) {
+          return {
+            columnProps: item,
+            component: item.normalizer ? item.normalizer(row[item.key]) : row[item.key]
+          };
+        };
+      })
+    };
+  }
   switch (key) {
     default:
       config = {
         header: ['Order No.', 'Date', 'Event', 'Total'],
         body: [function (row) {
-          return row.id;
+          return {
+            columnProps: {},
+            component: row.id
+          };
         }, function (row) {
-          return row.timezone ? moment.tz(row.date, row.timezone).format('DD MMMM YYYY') : row.date;
+          return {
+            columnProps: {},
+            component: row.timezone ? moment.tz(row.date, row.timezone).format('DD MMMM YYYY') : row.date
+          };
         }, function (row) {
-          return React.createElement(EventInfoItem, {
-            image: row.image,
-            name: row.eventName
-          });
+          return {
+            columnProps: {},
+            component: React.createElement(EventInfoItem, {
+              image: row.image,
+              name: row.eventName
+            })
+          };
         }, function (row) {
-          return row.currency + row.amount;
+          return {
+            columnProps: {},
+            component: row.currency + row.amount
+          };
         }]
       };
   }
@@ -6143,20 +6197,31 @@ var tableConfig = function tableConfig(key) {
 
 var Row = function Row(_ref) {
   var row = _ref.row,
-    handleDetailsInfo = _ref.handleDetailsInfo;
+    handleDetailsInfo = _ref.handleDetailsInfo,
+    _ref$columns = _ref.columns,
+    columns = _ref$columns === void 0 ? [] : _ref$columns,
+    hideDetailsButton = _ref.hideDetailsButton;
   return React.createElement(TableRow, {
     sx: {
       '& > *': {
         borderBottom: 'unset'
       }
     }
-  }, tableConfig().body.map(function (column, index) {
+  }, tableConfig(columns).body.map(function (column, index) {
     return React.createElement(TableCell, {
       component: "th",
       scope: "row",
-      key: index
-    }, column(row));
-  }), React.createElement(TableCell, {
+      key: index,
+      onClick: function onClick(e) {
+        var _column = column(row),
+          columnProps = _column.columnProps,
+          component = _column.component;
+        var onCellClick = (columnProps == null ? void 0 : columnProps.onCellClick) || _identity;
+        var componentProps = _get(component, 'props', {});
+        onCellClick(componentProps, e);
+      }
+    }, column(row).component);
+  }), !hideDetailsButton && React.createElement(TableCell, {
     component: "th",
     scope: "row"
   }, React.createElement("button", {
@@ -6169,7 +6234,7 @@ var Row = function Row(_ref) {
 };
 
 var MyTicketsContainer = function MyTicketsContainer(_ref) {
-  var _data$orders;
+  var _data$orders, _data$orders2;
   var _ref$handleDetailsInf = _ref.handleDetailsInfo,
     handleDetailsInfo = _ref$handleDetailsInf === void 0 ? _identity : _ref$handleDetailsInf,
     _ref$onGetOrdersSucce = _ref.onGetOrdersSuccess,
@@ -6178,7 +6243,13 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
     onGetOrdersError = _ref$onGetOrdersError === void 0 ? _identity : _ref$onGetOrdersError,
     _ref$theme = _ref.theme,
     theme = _ref$theme === void 0 ? 'dark' : _ref$theme,
-    logo = _ref.logo;
+    _ref$selectEventsLabe = _ref.selectEventsLabel,
+    selectEventsLabel = _ref$selectEventsLabe === void 0 ? 'Events' : _ref$selectEventsLabe,
+    logo = _ref.logo,
+    _ref$hideDetailsButto = _ref.hideDetailsButton,
+    hideDetailsButton = _ref$hideDetailsButto === void 0 ? false : _ref$hideDetailsButto,
+    _ref$columns = _ref.columns,
+    columns = _ref$columns === void 0 ? [] : _ref$columns;
   var _useState = useState(null),
     data = _useState[0],
     setData = _useState[1];
@@ -6275,7 +6346,7 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
     },
     userExpired: userExpired,
     logo: logo
-  })), data && React.createElement(React.Fragment, null, React.createElement("h2", null, "My Ticket Orders"), React.createElement(Autocomplete, {
+  })), data != null && (_data$orders = data.orders) != null && _data$orders.length ? React.createElement(React.Fragment, null, React.createElement("h2", null, "My Ticket Orders"), React.createElement(Autocomplete, {
     disablePortal: true,
     id: "combo-box-demo",
     getOptionLabel: function getOptionLabel(option) {
@@ -6288,7 +6359,7 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
     },
     renderInput: function renderInput(params) {
       return React.createElement(TextField, Object.assign({}, params, {
-        label: "Events"
+        label: selectEventsLabel
       }));
     }
   }), loading ? React.createElement("div", {
@@ -6298,15 +6369,16 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
     className: "my-ticket-table"
   }, React.createElement(Table, {
     "aria-label": "collapsible table"
-  }, React.createElement(TableHead, null, React.createElement(TableRow, null, tableConfig().header.map(function (column, index) {
+  }, React.createElement(TableHead, null, React.createElement(TableRow, null, tableConfig(columns).header.map(function (column, index) {
     return React.createElement(TableCell, {
       key: index
     }, column);
-  }), React.createElement(TableCell, null))), React.createElement(TableBody, null, (_data$orders = data.orders) == null ? void 0 : _data$orders.map(function (row) {
+  }), !hideDetailsButton && React.createElement(TableCell, null))), React.createElement(TableBody, null, (_data$orders2 = data.orders) == null ? void 0 : _data$orders2.map(function (row) {
     return React.createElement(Row, {
-      key: row.id,
       row: row,
-      handleDetailsInfo: handleDetailsInfo
+      handleDetailsInfo: handleDetailsInfo,
+      columns: columns,
+      hideDetailsButton: hideDetailsButton
     });
   })))), React.createElement(TablePagination, {
     rowsPerPageOptions: [10, 25, 100],
@@ -6316,7 +6388,15 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
     page: data.page,
     onPageChange: handleChangePage,
     onRowsPerPageChange: handleChangeRowsPerPage
-  }))), React.createElement(React.Fragment, null, showModalLogin && React.createElement(LoginModal, {
+  }))) : !loading && React.createElement(React.Fragment, null, React.createElement("h2", null, "My Ticket Orders"), React.createElement("div", {
+    className: "no_orders_section"
+  }, React.createElement("div", {
+    className: "nodata_title"
+  }, "You have no current ticket orders on this account"), React.createElement("div", {
+    className: "nodata_subtitle"
+  }, "Discover your next nite out ", React.createElement("a", {
+    href: "/events"
+  }, "here"), "."))), React.createElement(React.Fragment, null, showModalLogin && React.createElement(LoginModal, {
     onClose: function onClose() {
       setShowModalLogin(false);
     },
@@ -6518,7 +6598,11 @@ var TicketsTable = function TicketsTable(_ref) {
     _ref$icon = _ref.icon,
     icon = _ref$icon === void 0 ? '' : _ref$icon,
     _ref$displayColumnNam = _ref.displayColumnNameInRow,
-    displayColumnNameInRow = _ref$displayColumnNam === void 0 ? false : _ref$displayColumnNam;
+    displayColumnNameInRow = _ref$displayColumnNam === void 0 ? false : _ref$displayColumnNam,
+    _ref$canSellTicket = _ref.canSellTicket,
+    canSellTicket = _ref$canSellTicket === void 0 ? true : _ref$canSellTicket,
+    _ref$ticketsTitle = _ref.ticketsTitle,
+    ticketsTitle = _ref$ticketsTitle === void 0 ? 'Your Tickets' : _ref$ticketsTitle;
   var _useState = useState(null),
     pdfError = _useState[0],
     setPdfError = _useState[1];
@@ -6600,7 +6684,7 @@ var TicketsTable = function TicketsTable(_ref) {
       if (column.key === 'sell_ticket') {
         return React.createElement(TableCell, {
           key: columnIndex
-        }, ticket.is_sellable && React.createElement("span", {
+        }, ticket.is_sellable && canSellTicket && React.createElement("span", {
           "aria-hidden": true,
           className: "action-button",
           onClick: function onClick() {
@@ -6635,8 +6719,8 @@ var TicketsTable = function TicketsTable(_ref) {
       return setPdfError(null);
     }
   }), React.createElement("h4", {
-    className: "sub-title"
-  }, "Your Tickets"), React.createElement(TableContainer, {
+    className: "sub-title tickets-title"
+  }, ticketsTitle), React.createElement(TableContainer, {
     component: Paper
   }, React.createElement(Table, {
     "aria-label": "collapsible table"
@@ -6655,7 +6739,7 @@ var TicketsTable = function TicketsTable(_ref) {
     }, React.createElement(TableHead, null, React.createElement(TableRow, null, React.createElement(TableCell, null, "Add-On"), React.createElement(TableCell, null, "Status"))), React.createElement(TableBody, null, ticket.add_ons.map(function (add_on, index) {
       return React.createElement(TableRow, {
         key: index
-      }, React.createElement(TableCell, null, add_on.name), React.createElement(TableCell, null, add_on.status));
+      }, React.createElement(TableCell, null, add_on.groupName, ":", add_on.name), React.createElement(TableCell, null, add_on.status));
     }))))));
   })))));
 };
@@ -6687,8 +6771,17 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
     personalLinkIcon = _ref$personalLinkIcon === void 0 ? '' : _ref$personalLinkIcon,
     _ref$displayColumnNam = _ref.displayColumnNameInRow,
     displayColumnNameInRow = _ref$displayColumnNam === void 0 ? false : _ref$displayColumnNam,
+    _ref$canSellTicket = _ref.canSellTicket,
+    canSellTicket = _ref$canSellTicket === void 0 ? true : _ref$canSellTicket,
     ticketsTableColumns = _ref.ticketsTableColumns,
-    ordersPath = _ref.ordersPath;
+    ordersPath = _ref.ordersPath,
+    pOrderId = _ref.orderId,
+    _ref$referralTitle = _ref.referralTitle,
+    referralTitle = _ref$referralTitle === void 0 ? '' : _ref$referralTitle,
+    _ref$itemsTitle = _ref.itemsTitle,
+    itemsTitle = _ref$itemsTitle === void 0 ? '' : _ref$itemsTitle,
+    _ref$ticketsTitle = _ref.ticketsTitle,
+    ticketsTitle = _ref$ticketsTitle === void 0 ? 'Your Tickets' : _ref$ticketsTitle;
   var _useState = useState({}),
     data = _useState[0],
     setData = _useState[1];
@@ -6718,13 +6811,13 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
           case 0:
             _context.prev = 0;
             setLoading(true);
-            orderId = '';
-            if (typeof window !== 'undefined') {
+            orderId = pOrderId || '';
+            if (isBrowser && !pOrderId) {
               params = new URL("" + window.location).searchParams;
               orderId = params.get('o') || '';
             }
             _context.next = 6;
-            return getOrderDetails(orderId);
+            return getOrderDetails(String(orderId));
           case 6:
             response = _context.sent;
             onGetOrdersSuccess(response);
@@ -6901,7 +6994,9 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
     className: "summary-item"
   }, React.createElement("h6", {
     className: "sub-title"
-  }, "Order Summary"), React.createElement("p", null, orderSummery)), React.createElement("div", {
+  }, "Order Summary"), React.createElement("p", {
+    className: 'order-summary-date'
+  }, orderSummery)), React.createElement("div", {
     className: "summary-item"
   }, React.createElement("div", {
     className: "return-button-container"
@@ -6913,7 +7008,9 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
         window.location.assign(ordersPath != null ? ordersPath : '/orders');
       }
     }
-  }, "Back to Orders")))), !(data != null && data.disable_referral) && React.createElement("div", {
+  }, "Back to Orders")))), !(data != null && data.disable_referral) && React.createElement(React.Fragment, null, referralTitle && React.createElement("h4", {
+    className: "referral-title sub-title"
+  }, referralTitle), React.createElement("div", {
     className: "personal-link"
   }, React.createElement("div", {
     className: "link-item"
@@ -6928,7 +7025,9 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
     className: "link-item"
   }, React.createElement("p", {
     className: "total-referrer"
-  }, "So far, you\u2019ve referred " + data.sales_referred + " tickets")) : null), React.createElement(TableContainer, {
+  }, "So far, you\u2019ve referred " + data.sales_referred + " tickets")) : null)), itemsTitle && React.createElement("h4", {
+    className: "items-title sub-title"
+  }, itemsTitle), React.createElement(TableContainer, {
     component: Paper
   }, React.createElement(Table, {
     className: "tt-type",
@@ -6944,10 +7043,11 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
   }), data == null ? void 0 : (_data$items2 = data.items) == null ? void 0 : (_data$items2$add_ons = _data$items2.add_ons) == null ? void 0 : _data$items2$add_ons.map(function (ticket, index) {
     return React.createElement(TableRow, {
       key: index
-    }, React.createElement(TableCell, null, React.createElement("b", null, "Add-On: "), ticket.name), React.createElement(TableCell, null, ticket.currency + ticket.price), React.createElement(TableCell, null, ticket.quantity), React.createElement(TableCell, null, ticket.currency + ticket.total));
+    }, React.createElement(TableCell, null, React.createElement("div", null, React.createElement("b", null, "Add-On"), React.createElement("div", null, ticket.groupName, ": ", ticket.name))), React.createElement(TableCell, null, ticket.currency + ticket.price), React.createElement(TableCell, null, ticket.quantity), React.createElement(TableCell, null, ticket.currency + ticket.total));
   }), React.createElement(TableRow, {
     className: "total-row"
   }, React.createElement(TableCell, null), React.createElement(TableCell, null), React.createElement(TableCell, null, "Total"), React.createElement(TableCell, null, getTotal(data))))))), React.createElement(TicketsTable, {
+    ticketsTitle: ticketsTitle,
     tickets: data.tickets,
     columns: ticketsTableColumns != null && ticketsTableColumns.length ? ticketsTableColumns : [{
       key: 'hash',
@@ -6970,7 +7070,8 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
     }],
     handleSellTicket: handleSellTicket,
     handleRemoveFromResale: handleRemoveFromResale,
-    displayColumnNameInRow: displayColumnNameInRow
+    displayColumnNameInRow: displayColumnNameInRow,
+    canSellTicket: canSellTicket
   }), React.createElement("div", {
     className: "return-button-container"
   }, React.createElement("button", {