@bigbinary/neeto-payments-frontend 1.3.5 → 1.3.7

package/dist/index.js

@@ -11,16 +11,16 @@ import { ReactQueryDevtools } from 'react-query/devtools';
 import { DEFAULT_STALE_TIME, DEFAULT_PAGE_INDEX, DEFAULT_PAGE_SIZE } from '@bigbinary/neeto-commons-frontend/constants';
 import { Download, Down, Right } from '@bigbinary/neeto-icons';
 import axios from 'axios';
-import { noop, isPresent, capitalize, removeBy, camelToSnakeCase, filterBy, isNotPresent } from 'neetocist';
+import { noop, isPresent, capitalize, removeBy, camelToSnakeCase as camelToSnakeCase$1, filterBy, isNotPresent } from 'neetocist';
 import { createSubscription, getQueryParams, buildUrl } from '@bigbinary/neeto-commons-frontend/utils';
 import { useLocation, useHistory } from 'react-router-dom';
+import { camelToSnakeCase, snakeToCamelCase, isPresent as isPresent$1 } from '@bigbinary/neeto-cist';
 import { isEmpty, assoc, modify, concat, curry, pipe, split, map, join, equals, sortBy, prop, evolve, insert } from 'ramda';
 import DateFormat from '@bigbinary/neeto-molecules/DateFormat';
 import CopyToClipboardButton from '@bigbinary/neeto-molecules/CopyToClipboardButton';
 import PageLoader from '@bigbinary/neeto-molecules/PageLoader';
 import TableWrapper from '@bigbinary/neeto-molecules/TableWrapper';
 import require$$0 from 'util';
-import { isPresent as isPresent$1 } from '@bigbinary/neeto-cist';
 import { useParams } from 'react-router-dom/cjs/react-router-dom';
 import classNames from 'classnames';
 import { globalProps } from '@bigbinary/neeto-commons-frontend/initializers';
@@ -601,7 +601,7 @@ var TAG_STYLE = {
   completed: "success",
   rejected: "danger"
 };
-var DEFAULT_SORT_PROPERTIES = {
+var DEFAULT_SORT_PROPERTIES$1 = {
   sortBy: "updated_at",
   orderBy: "DESC"
 };
@@ -810,7 +810,7 @@ var buildPayload = function buildPayload(_ref) {
     _ref$payoutId = _ref.payoutId,
     payoutId = _ref$payoutId === void 0 ? null : _ref$payoutId;
   return _objectSpread$8({
-    tab: tab,
+    tab: camelToSnakeCase(tab),
     payoutId: payoutId,
     page: (_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page,
     pageSize: (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize,
@@ -858,7 +858,7 @@ var preProcessStatus = function preProcessStatus(type, status) {
   if (status === "voided") {
     return "incomplete";
   }
-  return status;
+  return snakeToCamelCase(status);
 };
 var renderStatus = curry(function (type, status, record) {
   var processedStatus = preProcessStatus(type, status, record);
@@ -983,7 +983,7 @@ var useFiltersAndPagination$3 = function useFiltersAndPagination() {
     _useState6 = _slicedToArray(_useState5, 2),
     pageProperties = _useState6[0],
     setPageProperties = _useState6[1];
-  var _useState7 = useState(DEFAULT_SORT_PROPERTIES),
+  var _useState7 = useState(DEFAULT_SORT_PROPERTIES$1),
     _useState8 = _slicedToArray(_useState7, 2),
     sortProperties = _useState8[0],
     setSortProperties = _useState8[1];
@@ -1119,6 +1119,7 @@ var List$3 = function List(_ref) {
     setDataSize(dataSize);
   }, [accounts]);
   var handleTablePagination = function handleTablePagination(page, pageSize) {
+    urlSearchParams.set("tab", tab);
     urlSearchParams.set("page", page);
     urlSearchParams.set("page_size", pageSize);
     history.push({
@@ -1131,7 +1132,7 @@ var List$3 = function List(_ref) {
   };
   useEffect(function () {
     handleTablePagination(DEFAULT_PAGE_INDEX, DEFAULT_PAGE_SIZE);
-    setSortProperties(DEFAULT_SORT_PROPERTIES);
+    setSortProperties(DEFAULT_SORT_PROPERTIES$1);
   }, [filters, tab]);
   useEffect(function () {
     var _pageProperties$tab, _pageProperties$tab2;
@@ -1145,9 +1146,9 @@ var List$3 = function List(_ref) {
   }, [urlSearchParams]);
   var handleTableChange = function handleTableChange(_, __, sorter) {
     setSortProperties(isPresent(sorter === null || sorter === void 0 ? void 0 : sorter.column) ? {
-      sortBy: camelToSnakeCase(sorter.field),
+      sortBy: camelToSnakeCase$1(sorter.field),
       orderBy: sorter.order === "ascend" ? "ASC" : "DESC"
-    } : DEFAULT_SORT_PROPERTIES);
+    } : DEFAULT_SORT_PROPERTIES$1);
   };
   if (isLoading) {
     return /*#__PURE__*/React.createElement(PageLoader, null);
@@ -1156,7 +1157,9 @@ var List$3 = function List(_ref) {
     return /*#__PURE__*/React.createElement("div", {
       className: "flex h-full w-full items-center justify-center"
     }, /*#__PURE__*/React.createElement(NoData, {
-      title: t("neetoPayments.emptyState.account")
+      title: tab === TAB$3.all ? t("neetoPayments.emptyState.account") : t("neetoPayments.emptyState.accountWithStatus", {
+        status: tab
+      })
     }));
   }
   return /*#__PURE__*/React.createElement(TableWrapper, {
@@ -1241,8 +1244,11 @@ var AccountsDashboard = function AccountsDashboard() {
     leftActionBlock: isTabsVisible && dataSize !== 0 && /*#__PURE__*/React.createElement(Typography, {
       className: "neeto-ui-gray-800 mr-2 font-semibold",
       component: "h4"
-    }, t("neetoPayments.countOf.account", {
+    }, tab === TAB$3.all ? t("neetoPayments.countOf.account", {
       count: dataSize
+    }) : t("neetoPayments.countOf.accountWithStatus", {
+      count: dataSize,
+      status: tab
     })),
     rightActionBlock: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Bar, {
       columns: FILTER_COLUMNS$3,
@@ -1572,8 +1578,9 @@ var COLUMNS$2 = [{
   dataIndex: "refunds",
   key: "refundsTime",
   width: "220px",
-  render: function render(refunds) {
+  render: function render() {
     var _refunds$;
+    var refunds = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
     return renderDate((_refunds$ = refunds[0]) === null || _refunds$ === void 0 ? void 0 : _refunds$.updatedAt);
   },
   position: 6
@@ -2000,7 +2007,7 @@ var useFiltersAndPagination$2 = function useFiltersAndPagination(_ref) {
     _useState6 = _slicedToArray(_useState5, 2),
     pageProperties = _useState6[0],
     setPageProperties = _useState6[1];
-  var _useState7 = useState(DEFAULT_SORT_PROPERTIES),
+  var _useState7 = useState(DEFAULT_SORT_PROPERTIES$1),
     _useState8 = _slicedToArray(_useState7, 2),
     sortProperties = _useState8[0],
     setSortProperties = _useState8[1];
@@ -4209,7 +4216,7 @@ var useFetchStripePayouts = function useFetchStripePayouts(payload) {
 };
 var useShowStripePayout = function useShowStripePayout(id) {
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  return useQuery(QUERY_KEYS.STRIPE_PAYOUT, function () {
+  return useQuery([QUERY_KEYS.STRIPE_PAYOUT, id], function () {
     return payoutsApi$1.show(id);
   }, options);
 };
@@ -4316,7 +4323,7 @@ var useFetchStripePlatformPayouts = function useFetchStripePlatformPayouts(paylo
 };
 var useShowStripePlatformPayout = function useShowStripePlatformPayout(id) {
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  return useQuery(QUERY_KEYS.STRIPE_PAYOUT, function () {
+  return useQuery([QUERY_KEYS.STRIPE_PAYOUT, id], function () {
     return payoutsApi.show(id);
   }, options);
 };
@@ -4639,7 +4646,7 @@ var List$2 = function List(_ref) {
   };
   useEffect(function () {
     handleTablePaginaton(DEFAULT_PAGE_INDEX, DEFAULT_PAGE_SIZE);
-    setSortProperties(DEFAULT_SORT_PROPERTIES);
+    setSortProperties(DEFAULT_SORT_PROPERTIES$1);
   }, [filters, tab]);
   useEffect(function () {
     var _pageProperties$tab, _pageProperties$tab2;
@@ -4653,9 +4660,9 @@ var List$2 = function List(_ref) {
   }, [urlSearchParams]);
   var handleTableChange = function handleTableChange(_, __, sorter) {
     setSortProperties(isPresent(sorter === null || sorter === void 0 ? void 0 : sorter.column) ? {
-      sortBy: camelToSnakeCase(sorter.field),
+      sortBy: camelToSnakeCase$1(sorter.field),
       orderBy: sorter.order === "ascend" ? "ASC" : "DESC"
-    } : DEFAULT_SORT_PROPERTIES);
+    } : DEFAULT_SORT_PROPERTIES$1);
   };
   if (isStripeAccountLoading || isStripePlatformAccountLoading || isDataLoading) {
     return /*#__PURE__*/React.createElement(PageLoader, null);
@@ -4664,7 +4671,9 @@ var List$2 = function List(_ref) {
     return /*#__PURE__*/React.createElement("div", {
       className: "flex h-full w-full items-center justify-center"
     }, /*#__PURE__*/React.createElement(NoData, {
-      title: isRefundKind$1(kind) ? t("neetoPayments.emptyState.refund") : t("neetoPayments.emptyState.payment")
+      title: tab === TAB$2.all ? t("neetoPayments.emptyState.".concat(kind)) : t("neetoPayments.emptyState.".concat(kind, "WithStatus"), {
+        status: tab
+      })
     }));
   }
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TableWrapper, {
@@ -4784,8 +4793,11 @@ var Dashboard = function Dashboard(_ref) {
     leftActionBlock: isTabsVisible && dataSize !== 0 && /*#__PURE__*/React.createElement(Typography, {
       className: "neeto-ui-gray-800 mr-2 font-semibold",
       component: "h4"
-    }, t("neetoPayments.countOf.".concat(kind), {
+    }, tab === TAB$2.all ? t("neetoPayments.countOf.".concat(kind), {
       count: dataSize
+    }) : t("neetoPayments.countOf.".concat(kind, "WithStatus"), {
+      count: dataSize,
+      status: tab
     })),
     rightActionBlock: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Bar, {
       columns: filterableColumns,
@@ -4846,10 +4858,10 @@ var Dashboard$1 = withTitle(withReactQuery(Dashboard), t$1("neetoPayments.common
 var TAB$1 = {
   all: "all",
   paid: "paid",
-  pending: "pending",
-  in_transit: "in_transit",
+  inTransit: "inTransit",
   failed: "failed",
-  canceled: "canceled"
+  canceled: "canceled",
+  pending: "pending"
 };
 var TABS$1 = Object.values(TAB$1);
 var SEARCH_PROPS = {
@@ -4871,6 +4883,10 @@ var FILTER_COLUMNS = [{
   type: "date",
   showRuleSelector: true
 }];
+var DEFAULT_SORT_PROPERTIES = {
+  sortBy: "created_at",
+  orderBy: "DESC"
+};
 
 function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$3(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -5006,6 +5022,9 @@ var IDENTIFIER_COLUMN = {
   width: "300px"
 };
 
+var processTab = function processTab(status) {
+  return camelToSnakeCase(status).split("_").join(" ");
+};
 var renderPayoutIdentifier$1 = curry(function (route, _ref) {
   var _ref$identifier = _ref.identifier,
     identifier = _ref$identifier === void 0 ? "" : _ref$identifier,
@@ -5039,7 +5058,7 @@ var useFiltersAndPagination$1 = function useFiltersAndPagination(payoutsPageRout
     _useState6 = _slicedToArray(_useState5, 2),
     pageProperties = _useState6[0],
     setPageProperties = _useState6[1];
-  var _useState7 = useState(DEFAULT_SORT_PROPERTIES),
+  var _useState7 = useState(DEFAULT_SORT_PROPERTIES$1),
     _useState8 = _slicedToArray(_useState7, 2),
     sortProperties = _useState8[0],
     setSortProperties = _useState8[1];
@@ -5111,6 +5130,7 @@ var useFetchData$1 = function useFetchData(_ref) {
     payload = _ref.payload;
   var data = {};
   var kind = isPlatformEnabled ? "platform" : "connected";
+  var tab = snakeToCamelCase((payload === null || payload === void 0 ? void 0 : payload.tab) || "");
   data.connected = useFetchStripePayouts(payload, {
     enabled: !isPlatformEnabled
   });
@@ -5119,7 +5139,7 @@ var useFetchData$1 = function useFetchData(_ref) {
   });
   return {
     data: (_data$kind = data[kind]) === null || _data$kind === void 0 || (_data$kind = _data$kind.data) === null || _data$kind === void 0 ? void 0 : _data$kind.payouts,
-    dataSize: (_data$kind2 = data[kind]) === null || _data$kind2 === void 0 || (_data$kind2 = _data$kind2.data) === null || _data$kind2 === void 0 || (_data$kind2 = _data$kind2.views) === null || _data$kind2 === void 0 ? void 0 : _data$kind2[payload === null || payload === void 0 ? void 0 : payload.tab],
+    dataSize: (_data$kind2 = data[kind]) === null || _data$kind2 === void 0 || (_data$kind2 = _data$kind2.data) === null || _data$kind2 === void 0 || (_data$kind2 = _data$kind2.views) === null || _data$kind2 === void 0 ? void 0 : _data$kind2[tab],
     isDataLoading: (_data$kind3 = data[kind]) === null || _data$kind3 === void 0 ? void 0 : _data$kind3.isLoading,
     isDataFetching: (_data$kind4 = data[kind]) === null || _data$kind4 === void 0 ? void 0 : _data$kind4.isFetching
   };
@@ -5160,6 +5180,7 @@ var List$1 = function List(_ref) {
     setDataSize(dataSize);
   }, [payouts]);
   var handleTablePagination = function handleTablePagination(page, pageSize) {
+    urlSearchParams.set("tab", tab);
     urlSearchParams.set("page", page);
     urlSearchParams.set("page_size", pageSize);
     history.push({
@@ -5186,7 +5207,7 @@ var List$1 = function List(_ref) {
   }, [urlSearchParams]);
   var handleTableChange = function handleTableChange(_, __, sorter) {
     setSortProperties(isPresent(sorter === null || sorter === void 0 ? void 0 : sorter.column) ? {
-      sortBy: camelToSnakeCase(sorter.field),
+      sortBy: camelToSnakeCase$1(sorter.field),
       orderBy: sorter.order === "ascend" ? "ASC" : "DESC"
     } : DEFAULT_SORT_PROPERTIES);
   };
@@ -5197,7 +5218,7 @@ var List$1 = function List(_ref) {
     return /*#__PURE__*/React.createElement("div", {
       className: "flex h-full w-full items-center justify-center"
     }, /*#__PURE__*/React.createElement(NoData, {
-      title: t("neetoPayments.emptyState.payouts")
+      title: t("neetoPayments.emptyState.payouts.".concat(tab))
     }));
   }
   return /*#__PURE__*/React.createElement(TableWrapper, {
@@ -5284,8 +5305,11 @@ var PayoutsDashboard = function PayoutsDashboard(_ref) {
     leftActionBlock: isTabsVisible && dataSize !== 0 && /*#__PURE__*/React.createElement(Typography, {
       className: "neeto-ui-gray-800 mr-2 font-semibold",
       component: "h4"
-    }, t("neetoPayments.countOf.payout", {
+    }, tab === TAB$1.all ? t("neetoPayments.countOf.payout", {
       count: dataSize
+    }) : t("neetoPayments.countOf.payoutWithStatus", {
+      count: dataSize,
+      status: processTab(tab)
     })),
     rightActionBlock: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Bar, {
       columns: FILTER_COLUMNS,
@@ -5378,7 +5402,7 @@ var PayoutsPage = function PayoutsPage(_ref) {
       id: id,
       isPlatformEnabled: isPlatformEnabled
     }),
-    isLoading = _useFetchData.isLoading,
+    isDataLoading = _useFetchData.isDataLoading,
     _useFetchData$data = _useFetchData.data,
     _useFetchData$data2 = _useFetchData$data === void 0 ? {} : _useFetchData$data,
     amount = _useFetchData$data2.amount,
@@ -5396,7 +5420,7 @@ var PayoutsPage = function PayoutsPage(_ref) {
   }, {
     text: identifier
   }];
-  if (isLoading) return /*#__PURE__*/React.createElement(PageLoader, null);
+  if (isDataLoading) return /*#__PURE__*/React.createElement(PageLoader, null);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
     breadcrumbs: headerBreadCrumbs,
     title: t("neetoPayments.payoutsPage.title")