beem-component 2.0.25 → 2.0.27

package/dist/components/ChatComponents/ChatBody/chatBody.js

@@ -417,8 +417,7 @@ var ListReplyRender = function ListReplyRender(_ref28) {
   }, /*#__PURE__*/_react.default.createElement(_List.default, null), (_globalButtons$ = globalButtons[0]) === null || _globalButtons$ === void 0 ? void 0 : _globalButtons$.title)));
 };
 var OrderRender = function OrderRender(_ref29) {
-  var count = _ref29.count,
-    amount = _ref29.amount,
+  var amount = _ref29.amount,
     type = _ref29.type,
     state = _ref29.state,
     items = _ref29.items;
@@ -426,6 +425,11 @@ var OrderRender = function OrderRender(_ref29) {
     _useState2 = _slicedToArray(_useState, 2),
     displayItems = _useState2[0],
     setDisplayItems = _useState2[1];
+  var sumQuantities = function sumQuantities() {
+    return items === null || items === void 0 ? void 0 : items.reduce(function (total, item) {
+      return total + parseInt(item.quantity, 10);
+    }, 0);
+  };
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(Messages, {
     type: type,
     state: state
@@ -435,7 +439,7 @@ var OrderRender = function OrderRender(_ref29) {
     state: state
   }, /*#__PURE__*/_react.default.createElement(_ShoppingCartOutlined.default, {
     fontSize: "small"
-  }), /*#__PURE__*/_react.default.createElement("h5", null, /*#__PURE__*/_react.default.createElement("strong", null, count, " items")))), displayItems ? /*#__PURE__*/_react.default.createElement(OrderBody, {
+  }), /*#__PURE__*/_react.default.createElement("h5", null, /*#__PURE__*/_react.default.createElement("strong", null, sumQuantities(), " ", sumQuantities() > 1 ? 'items' : 'item')))), displayItems ? /*#__PURE__*/_react.default.createElement(OrderBody, {
     state: state
   }, items.map(function (data, index) {
     return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(CartContent, {
@@ -443,7 +447,7 @@ var OrderRender = function OrderRender(_ref29) {
     }, /*#__PURE__*/_react.default.createElement("p", null, index + 1, ". "), /*#__PURE__*/_react.default.createElement(ProductImage, {
       src: data.imgURL,
       alt: "product"
-    }), /*#__PURE__*/_react.default.createElement("p", null, data.description, " @ ", data.currency, " ", data.amount)), /*#__PURE__*/_react.default.createElement("hr", {
+    }), /*#__PURE__*/_react.default.createElement("p", null, data.quantity, " X ", data.description, " @ ", data.currency, ' ', data.amount)), /*#__PURE__*/_react.default.createElement("hr", {
       style: {
         width: '100%'
       }
@@ -452,7 +456,7 @@ var OrderRender = function OrderRender(_ref29) {
     state: state
   }, /*#__PURE__*/_react.default.createElement(CartContent, {
     state: state
-  }, /*#__PURE__*/_react.default.createElement("p", null, amount, " (Estimated Total)"))), /*#__PURE__*/_react.default.createElement(IntButton, {
+  }, /*#__PURE__*/_react.default.createElement("p", null, ' ', "Estimated Total: ", /*#__PURE__*/_react.default.createElement("strong", null, amount)))), /*#__PURE__*/_react.default.createElement(IntButton, {
     state: state,
     onClick: function onClick() {
       setDisplayItems(!displayItems);
@@ -477,7 +481,6 @@ BmChat.Details = function (_ref30) {
     type = _ref30.type,
     extension = _ref30.extension,
     rest = _objectWithoutProperties(_ref30, _excluded3);
-  console.log(src);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(Details, _extends({
     state: state
   }, rest), /*#__PURE__*/_react.default.createElement(MessageState, null, state === 'inbound' && session && handleState({
@@ -514,7 +517,7 @@ BmChat.Details = function (_ref30) {
   })) : /*#__PURE__*/_react.default.createElement(Messages, {
     metadata: metadata,
     state: state
-  }), children) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, type && (type === 'interactive' || type === 'order') ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children.type === 'quick_reply' && /*#__PURE__*/_react.default.createElement(QuickReplyRender, _extends({
+  }, metadata), children) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, type && (type === 'interactive' || type === 'order') ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children.type === 'quick_reply' && /*#__PURE__*/_react.default.createElement(QuickReplyRender, _extends({
     rest: rest
   }, children, {
     type: type,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "beem-component",
-  "version": "2.0.25",
+  "version": "2.0.27",
   "private": false,
   "main": "dist/components/index.js",
   "scripts": {

package/src/App.js

@@ -17,7 +17,7 @@ import {
   // BmButtonDropDown,
   // BmBtnIcon,
   BmContactCard,
-  BmModal,
+  // BmModal,
   // BmContactCheckbox,
   // BmCounter,
   // BmProfileIcon,
@@ -894,22 +894,7 @@ const Chat = () => {
   return (
     <>
       <GlobalStyle />
-      <BmModal show style={{ width: '800px' }}>
-        <div>
-          <BmModal.Header subHeading={<h5>Orders for user.</h5>} closeButton>
-            <h3 className="text-black font-weight-bold">
-              <h3>Order History</h3>
-            </h3>
-          </BmModal.Header>
-          <BmModal.Body>
-            {' '}
-            <p>TEXT HERE</p>
-          </BmModal.Body>
-          {/* <BmModal.Footer>
 
-      </BmModal.Footer> */}
-        </div>
-      </BmModal>
       <div>
         <BmChat.Details
           key={85279}
@@ -1383,6 +1368,35 @@ const Chat = () => {
           })}
         </BmChat.Body>
       </BmChat>
+      <BmAccordion expandIconPosition="right">
+        <BmAccordion.Title size="small">Contacts</BmAccordion.Title>
+        <BmAccordion.Body>
+          <div className="accordion-body">
+            <BmAccordion expandIcon="none">
+              <BmAccordion.Title>
+                <button
+                  type="button"
+                  onClick={() => {
+                    console.log('click 1');
+                  }}
+                >
+                  Customers
+                </button>
+              </BmAccordion.Title>
+            </BmAccordion>
+
+            <BmAccordion expandIcon="none">
+              <BmAccordion.Title>Reedem History</BmAccordion.Title>
+            </BmAccordion>
+            <BmAccordion expandIcon="none">
+              <BmAccordion.Title>Rewards</BmAccordion.Title>
+            </BmAccordion>
+            <BmAccordion expandIcon="none">
+              <BmAccordion.Title>Pending Redemption</BmAccordion.Title>
+            </BmAccordion>
+          </div>
+        </BmAccordion.Body>
+      </BmAccordion>
     </>
   );
 };

package/src/lib/components/ChatComponents/ChatBody/chatBody.js

@@ -497,8 +497,14 @@ const ListReplyRender = ({
   );
 };
 
-const OrderRender = ({ count, amount, type, state, items }) => {
+const OrderRender = ({ amount, type, state, items }) => {
   const [displayItems, setDisplayItems] = useState(false);
+
+  const sumQuantities = () => {
+    return items?.reduce((total, item) => {
+      return total + parseInt(item.quantity, 10);
+    }, 0);
+  };
   return (
     <>
       <Messages type={type} state={state}>
@@ -506,7 +512,9 @@ const OrderRender = ({ count, amount, type, state, items }) => {
           <CartContent state={state}>
             <ShoppingCartOutlinedIcon fontSize="small" />
             <h5>
-              <strong>{count} items</strong>
+              <strong>
+                {sumQuantities()} {sumQuantities() > 1 ? 'items' : 'item'}
+              </strong>
             </h5>
           </CartContent>
         </OrderBody>
@@ -520,7 +528,8 @@ const OrderRender = ({ count, amount, type, state, items }) => {
                   <ProductImage src={data.imgURL} alt="product" />
 
                   <p>
-                    {data.description} @ {data.currency} {data.amount}
+                    {data.quantity} X {data.description} @ {data.currency}{' '}
+                    {data.amount}
                   </p>
                 </CartContent>
                 <hr style={{ width: '100%' }} />
@@ -532,7 +541,10 @@ const OrderRender = ({ count, amount, type, state, items }) => {
         )}
         <OrderBody state={state}>
           <CartContent state={state}>
-            <p>{amount} (Estimated Total)</p>
+            <p>
+              {' '}
+              Estimated Total: <strong>{amount}</strong>
+            </p>
           </CartContent>
         </OrderBody>
         <IntButton
@@ -567,7 +579,6 @@ BmChat.Details = ({
   extension,
   ...rest
 }) => {
-  console.log(src);
   return (
     <>
       <Details state={state} {...rest}>
@@ -617,7 +628,9 @@ BmChat.Details = ({
                   ) : metadata.type === 'order' ? (
                     <OrderRender {...metadata} type={type} state={state} />
                   ) : (
-                    <Messages metadata={metadata} state={state} />
+                    <Messages metadata={metadata} state={state}>
+                      {metadata}
+                    </Messages>
                   )}
 
                   {children}