@bjsdistribution/dms-client-return 0.1.58-prod → 0.1.59-prod

package/dist/common/expand-collapse/index.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 interface IProps {
     collapsedContent: React.ReactNode;
     children: React.ReactNode;
+    extraActions?: React.ReactNode;
 }
 declare function CollapsableForm(props: IProps): React.JSX.Element;
 export default CollapsableForm;

package/dist/dms-client-return.cjs.development.js

@@ -7093,7 +7093,7 @@ function CollapsableForm(props) {
   var _useState = React.useState(true),
     isExpanded = _useState[0],
     setIsExpanded = _useState[1];
-  return React__default.createElement(MainContainer$3, null, React__default.createElement(CardHeader$1, null, React__default.createElement(CollapsedContent, null, props.collapsedContent, React__default.createElement(Container$F, null, React__default.createElement(Text$4, {
+  return React__default.createElement(MainContainer$3, null, React__default.createElement(CardHeader$1, null, React__default.createElement(CollapsedContent, null, props.collapsedContent, React__default.createElement(Container$F, null, props == null ? void 0 : props.extraActions, React__default.createElement(Text$4, {
     onClick: function onClick() {
       return setIsExpanded(function (prev) {
         return !prev;
@@ -8244,25 +8244,58 @@ var Container$P = /*#__PURE__*/styled__default.div(_templateObject2$$ || (_templ
 var Items = /*#__PURE__*/styled__default.span(_templateObject3$w || (_templateObject3$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: 'Roboto', sans-serif;\n  font-size: 14px;\n  font-weight: 500;\n  line-height: 24px;\n  color: #8e8a85;\n  text-transform: capitalize;\n  color: #6a7378;\n"])));
 
 function ProductsInfo(_ref) {
+  var _returnOrdersData$dat;
   var locationloading = _ref.locationloading;
   var _useOrderDetails = useOrderDetails(),
     data = _useOrderDetails[0];
   var returnOrder = data;
+  var _useState = React.useState(false),
+    spinLoading = _useState[0],
+    setSpinLoading = _useState[1];
+  // Export functionality
+  var _useAxios = dmsComponentLibrary.useAxios({
+      endpoint: "/v1/export/csv/" + (returnOrder == null ? void 0 : returnOrder.id),
+      method: 'POST'
+    }),
+    callExportCSV = _useAxios.fetchData;
+  var handleExportCSV = function handleExportCSV(e) {
+    e.stopPropagation();
+    setSpinLoading(true);
+    callExportCSV().then(function (res) {
+      var _res$data;
+      var urlToDownload = (res == null || (_res$data = res.data) == null ? void 0 : _res$data.url) || (res == null ? void 0 : res.url);
+      if (urlToDownload) {
+        var a = document.createElement('a');
+        a.href = urlToDownload;
+        a.download = "products_export_" + (returnOrder == null ? void 0 : returnOrder.id) + ".csv";
+        document.body.appendChild(a);
+        a.click();
+        document.body.removeChild(a);
+      }
+      setSpinLoading(false);
+    })["catch"](function (err) {
+      antd.notification.error({
+        message: 'Failed to export csv',
+        description: (err == null ? void 0 : err.message) || 'Export error'
+      });
+      setSpinLoading(false);
+    });
+  };
   // For API Call
   var _useProductDetails = useProductDetails(),
     setProductsData = _useProductDetails[1];
   var _useLoading = useLoading(),
     setLoading = _useLoading[1];
-  var _useAxios = dmsComponentLibrary.useAxios({
+  var _useAxios2 = dmsComponentLibrary.useAxios({
       endpoint: "/v1/return/products/" + (returnOrder == null ? void 0 : returnOrder.id),
       method: 'GET',
       pagination: {
         is_pagination: false
       }
     }),
-    returnOrdersData = _useAxios.data,
-    loading = _useAxios.loading,
-    callReturnProducts = _useAxios.fetchData;
+    returnOrdersData = _useAxios2.data,
+    loading = _useAxios2.loading,
+    callReturnProducts = _useAxios2.fetchData;
   React.useEffect(function () {
     if (returnOrder != null && returnOrder.id) {
       callReturnProducts();
@@ -8279,8 +8312,52 @@ function ProductsInfo(_ref) {
       }
     }
   }, [returnOrdersData, loading]);
+  var isExportDisabled = !(returnOrdersData != null && returnOrdersData.data) || (returnOrdersData == null || (_returnOrdersData$dat = returnOrdersData.data) == null ? void 0 : _returnOrdersData$dat.length) === 0;
   return React__default.createElement(CollapsableForm, {
-    collapsedContent: React__default.createElement(CollapsedContent$1, null)
+    collapsedContent: React__default.createElement(CollapsedContent$1, null),
+    extraActions: React__default.createElement("div", {
+      style: {
+        display: 'flex',
+        alignItems: 'center',
+        cursor: isExportDisabled ? 'not-allowed' : 'pointer',
+        opacity: isExportDisabled ? 0.5 : 1,
+        marginRight: '16px',
+        backgroundColor: 'rgb(243 243 243)',
+        border: '1px solid #E2E8F0',
+        padding: '6px 14px',
+        borderRadius: '10px',
+        boxShadow: '0 1px 2px rgba(0,0,0,0.05)',
+        transition: 'background-color 0.2s'
+      },
+      onClick: function onClick(e) {
+        if (isExportDisabled) return;
+        handleExportCSV(e);
+      },
+      onMouseOver: function onMouseOver(e) {
+        if (!isExportDisabled) e.currentTarget.style.backgroundColor = '#E2E8F0';
+      },
+      onMouseOut: function onMouseOut(e) {
+        if (!isExportDisabled) e.currentTarget.style.backgroundColor = 'rgb(243 243 243)';
+      }
+    }, React__default.createElement("span", {
+      style: {
+        color: '#475569',
+        fontFamily: 'Lato',
+        fontSize: '13px',
+        fontWeight: 600,
+        whiteSpace: 'nowrap',
+        letterSpacing: '0.3px'
+      }
+    }, "EXPORT CSV"), React__default.createElement("span", {
+      style: {
+        marginLeft: '6px',
+        display: 'flex',
+        alignItems: 'center'
+      }
+    }, React__default.createElement(antd.Spin, {
+      spinning: spinLoading,
+      size: "small"
+    })))
   }, React__default.createElement(ExpandedContent$2, {
     callReturnProducts: callReturnProducts,
     loading: loading,