@bigbinary/neeto-payments-frontend 1.3.15 → 1.3.17

package/dist/index.cjs.js

@@ -17,11 +17,11 @@ var neetoIcons = require('@bigbinary/neeto-icons');
 var axios = require('axios');
 var neetoCist = require('@bigbinary/neeto-cist');
 var utils$3 = require('@bigbinary/neeto-commons-frontend/utils');
-var Columns = require('@bigbinary/neeto-molecules/Columns');
-var reactRouterDom = require('react-router-dom');
 var ramda = require('ramda');
+var reactRouterDom = require('react-router-dom');
 var DateFormat = require('@bigbinary/neeto-molecules/DateFormat');
 var CopyToClipboardButton = require('@bigbinary/neeto-molecules/CopyToClipboardButton');
+var Columns = require('@bigbinary/neeto-molecules/Columns');
 var PageLoader = require('@bigbinary/neeto-molecules/PageLoader');
 var TableWrapper = require('@bigbinary/neeto-molecules/TableWrapper');
 var require$$0 = require('util');
@@ -837,14 +837,6 @@ function _toConsumableArray(arr) {
   return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
 }
 
-var useURLSearchParams = function useURLSearchParams() {
-  var _useLocation = reactRouterDom.useLocation(),
-    search = _useLocation.search;
-  return React.useMemo(function () {
-    return new URLSearchParams(search);
-  }, [search]);
-};
-
 function ownKeys$a(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var processSortProperties = function processSortProperties(sortProperties) {
@@ -1038,7 +1030,7 @@ var COLUMNS$3 = [{
 function ownKeys$9(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useFiltersAndPagination$3 = function useFiltersAndPagination() {
-  var urlSearchParams = useURLSearchParams();
+  var history = reactRouterDom.useHistory();
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isFilterButtonVisible = _useState2[0],
@@ -1055,13 +1047,9 @@ var useFiltersAndPagination$3 = function useFiltersAndPagination() {
     _useState8 = _slicedToArray(_useState7, 2),
     sortProperties = _useState8[0],
     setSortProperties = _useState8[1];
-  var _useState9 = React.useState(TAB$3.all),
-    _useState10 = _slicedToArray(_useState9, 2),
-    tab = _useState10[0],
-    setTab = _useState10[1];
-  var _useHiddenColumns = Columns.useHiddenColumns(STRIPE_ACCOUNTS_TABLE_HIDDEN_COLUMNS_STORAGE_KEY),
-    hideColumn = _useHiddenColumns.hideColumn,
-    getVisibleColumnData = _useHiddenColumns.getVisibleColumnData;
+  var _useQueryParams = reactUtils.useQueryParams(),
+    _useQueryParams$tab = _useQueryParams.tab,
+    tab = _useQueryParams$tab === void 0 ? TAB$3.all : _useQueryParams$tab;
   var _getQueryParams = utils$3.getQueryParams(),
     _getQueryParams$searc = _getQueryParams.searchTerm,
     searchTerm = _getQueryParams$searc === void 0 ? "" : _getQueryParams$searc;
@@ -1069,24 +1057,28 @@ var useFiltersAndPagination$3 = function useFiltersAndPagination() {
     key: "search_term",
     value: searchTerm.trim()
   });
-  var _useState11 = React.useState(neetoFiltersFrontend.buildFiltersFromURL([].concat(_toConsumableArray(FILTER_COLUMNS$3), [searchKeywordProps]))),
+  var _useState9 = React.useState(neetoFiltersFrontend.buildFiltersFromURL([].concat(_toConsumableArray(FILTER_COLUMNS$3), [searchKeywordProps]))),
+    _useState10 = _slicedToArray(_useState9, 2),
+    filters = _useState10[0],
+    setFilters = _useState10[1];
+  var _useState11 = React.useState(0),
     _useState12 = _slicedToArray(_useState11, 2),
-    filters = _useState12[0],
-    setFilters = _useState12[1];
-  var _useState13 = React.useState(0),
-    _useState14 = _slicedToArray(_useState13, 2),
-    dataSize = _useState14[0],
-    setDataSize = _useState14[1];
-  var selectableColumnData = tab !== TAB$3.all ? neetoCist.removeBy({
+    dataSize = _useState12[0],
+    setDataSize = _useState12[1];
+  var columnData = tab !== TAB$3.all ? neetoCist.removeBy({
     key: "status"
   }, COLUMNS$3) : COLUMNS$3;
-  var columnData = getVisibleColumnData(selectableColumnData);
   var handleTabChange = function handleTabChange(tab) {
     var _pageProperties$tab, _pageProperties$tab2;
-    urlSearchParams.set("tab", tab);
-    urlSearchParams.set("page", (_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page);
-    urlSearchParams.set("page_size", (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize);
-    setTab(tab);
+    var queryParams = utils$3.getQueryParams({
+      toCamelCase: false
+    });
+    var newParams = {
+      tab: tab,
+      page: (_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page,
+      page_size: (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize
+    };
+    history.push(utils$3.buildUrl(window.location.pathname, ramda.mergeLeft(newParams, queryParams)));
   };
   return {
     isFilterButtonVisible: isFilterButtonVisible,
@@ -1097,15 +1089,12 @@ var useFiltersAndPagination$3 = function useFiltersAndPagination() {
     tab: tab,
     sortProperties: sortProperties,
     columnData: columnData,
-    selectableColumnData: selectableColumnData,
     dataSize: dataSize,
     setDataSize: setDataSize,
-    hideColumn: hideColumn,
     setIsFilterButtonVisible: setIsFilterButtonVisible,
     setIsFilterPaneOpen: setIsFilterPaneOpen,
     setPageProperties: setPageProperties,
     setFilters: setFilters,
-    setTab: setTab,
     handleTabChange: handleTabChange,
     setSortProperties: setSortProperties
   };
@@ -1148,22 +1137,22 @@ var useFetchConnectedAccounts = function useFetchConnectedAccounts() {
 };
 
 var List$3 = function List(_ref) {
-  var _pageProperties$tab3, _pageProperties$tab4, _pageProperties$tab5;
+  var _pageProperties$tab, _pageProperties$tab2, _pageProperties$tab3;
   var columnData = _ref.columnData,
     filters = _ref.filters,
-    handleTabChange = _ref.handleTabChange,
     pageProperties = _ref.pageProperties,
     setDataSize = _ref.setDataSize,
     setIsFilterButtonVisible = _ref.setIsFilterButtonVisible,
     setPageProperties = _ref.setPageProperties,
     setSortProperties = _ref.setSortProperties,
     sortProperties = _ref.sortProperties,
-    tab = _ref.tab,
-    hideColumn = _ref.hideColumn;
-  var urlSearchParams = useURLSearchParams();
+    tab = _ref.tab;
   var history = reactRouterDom.useHistory();
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
+  var _useHiddenColumns = Columns.useHiddenColumns(STRIPE_ACCOUNTS_TABLE_HIDDEN_COLUMNS_STORAGE_KEY),
+    hideColumn = _useHiddenColumns.hideColumn,
+    getVisibleColumnData = _useHiddenColumns.getVisibleColumnData;
   var _useFetchConnectedAcc = useFetchConnectedAccounts(buildPayload({
       filters: filters,
       pageProperties: pageProperties,
@@ -1184,12 +1173,13 @@ 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({
-      search: urlSearchParams.toString()
+    var queryParams = utils$3.getQueryParams({
+      toCamelCase: false
     });
+    history.push(utils$3.buildUrl(window.location.pathname, ramda.mergeLeft({
+      page: page,
+      page_size: pageSize
+    }, queryParams)));
     setPageProperties(ramda.assoc(tab, {
       page: page,
       pageSize: pageSize
@@ -1199,16 +1189,6 @@ var List$3 = function List(_ref) {
     handleTablePagination(constants.DEFAULT_PAGE_INDEX, constants.DEFAULT_PAGE_SIZE);
     setSortProperties(DEFAULT_SORT_PROPERTIES$1);
   }, [filters, tab]);
-  React.useEffect(function () {
-    var _pageProperties$tab, _pageProperties$tab2;
-    var tab = urlSearchParams.get("tab") || TAB$3.all;
-    var validatedTab = TABS$3.includes(tab) ? tab : TAB$3.all;
-    var page = Number(urlSearchParams.get("page")) || ((_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page);
-    var pageSize = Number(urlSearchParams.get("page_size")) || ((_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize);
-    handleTabChange(validatedTab);
-    urlSearchParams.set("tab", validatedTab);
-    handleTablePagination(page, pageSize);
-  }, [urlSearchParams]);
   var handleTableChange = function handleTableChange(_, __, sorter) {
     setSortProperties(neetoCist.isPresent(sorter === null || sorter === void 0 ? void 0 : sorter.column) ? {
       sortBy: neetoCist.camelToSnakeCase(sorter.field),
@@ -1228,12 +1208,12 @@ var List$3 = function List(_ref) {
     }));
   }
   return /*#__PURE__*/React__default["default"].createElement(TableWrapper__default["default"], {
-    hasPagination: dataSize > ((_pageProperties$tab3 = pageProperties[tab]) === null || _pageProperties$tab3 === void 0 ? void 0 : _pageProperties$tab3.pageSize)
+    hasPagination: dataSize > ((_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.pageSize)
   }, /*#__PURE__*/React__default["default"].createElement(neetoui.Table, {
-    columnData: columnData,
     fixedHeight: true,
     allowRowClick: false,
-    currentPageNumber: (_pageProperties$tab4 = pageProperties[tab]) === null || _pageProperties$tab4 === void 0 ? void 0 : _pageProperties$tab4.page,
+    columnData: getVisibleColumnData(columnData),
+    currentPageNumber: (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.page,
     handlePageChange: handleTablePagination,
     loading: isFetching,
     rowData: buildRowData({
@@ -1247,7 +1227,7 @@ var List$3 = function List(_ref) {
     paginationProps: {
       showSizeChanger: true,
       hideOnSinglePage: true,
-      pageSize: (_pageProperties$tab5 = pageProperties[tab]) === null || _pageProperties$tab5 === void 0 ? void 0 : _pageProperties$tab5.pageSize,
+      pageSize: (_pageProperties$tab3 = pageProperties[tab]) === null || _pageProperties$tab3 === void 0 ? void 0 : _pageProperties$tab3.pageSize,
       total: dataSize
     },
     onChange: handleTableChange,
@@ -1278,9 +1258,7 @@ var AccountsDashboard = function AccountsDashboard() {
     tab = _useFiltersAndPaginat.tab,
     sortProperties = _useFiltersAndPaginat.sortProperties,
     columnData = _useFiltersAndPaginat.columnData,
-    selectableColumnData = _useFiltersAndPaginat.selectableColumnData,
     dataSize = _useFiltersAndPaginat.dataSize,
-    hideColumn = _useFiltersAndPaginat.hideColumn,
     setDataSize = _useFiltersAndPaginat.setDataSize,
     setIsFilterButtonVisible = _useFiltersAndPaginat.setIsFilterButtonVisible,
     setIsFilterPaneOpen = _useFiltersAndPaginat.setIsFilterPaneOpen,
@@ -1326,7 +1304,7 @@ var AccountsDashboard = function AccountsDashboard() {
       onChange: handleFiltersChange
     }), isFilterButtonVisible && /*#__PURE__*/React__default["default"].createElement(SubHeader__default["default"].RightBlock, {
       columnsButtonProps: {
-        columnData: selectableColumnData,
+        columnData: columnData,
         fixedColumns: DASHBOARD_MANDATORY_COLUMNS$2,
         localStorageKey: STRIPE_ACCOUNTS_TABLE_HIDDEN_COLUMNS_STORAGE_KEY
       },
@@ -1346,8 +1324,6 @@ var AccountsDashboard = function AccountsDashboard() {
   }), /*#__PURE__*/React__default["default"].createElement(List$3, {
     columnData: columnData,
     filters: filters,
-    handleTabChange: handleTabChange,
-    hideColumn: hideColumn,
     pageProperties: pageProperties,
     setDataSize: setDataSize,
     setIsFilterButtonVisible: setIsFilterButtonVisible,
@@ -1643,7 +1619,7 @@ var COLUMNS$2 = [{
   title: i18next.t("neetoPayments.common.platformSplitAmount"),
   dataIndex: "platformSplitAmount",
   key: "platformSplitAmount",
-  width: "200px",
+  width: "280px",
   position: 3
 }, {
   title: i18next.t("neetoPayments.common.paymentTime"),
@@ -2081,7 +2057,9 @@ var useFiltersAndPagination$2 = function useFiltersAndPagination(_ref) {
   var payableEntityColumns = _ref.payableEntityColumns,
     kind = _ref.kind,
     searchProps = _ref.searchProps;
-  var urlSearchParams = useURLSearchParams();
+  var _useQueryParams = reactUtils.useQueryParams(),
+    _useQueryParams$tab = _useQueryParams.tab,
+    tab = _useQueryParams$tab === void 0 ? TAB$2.all : _useQueryParams$tab;
   var history = reactRouterDom.useHistory();
   var tabs = TABS$2.filter(function (tab) {
     var _TAB_METADATA$tab;
@@ -2103,13 +2081,6 @@ var useFiltersAndPagination$2 = function useFiltersAndPagination(_ref) {
     _useState8 = _slicedToArray(_useState7, 2),
     sortProperties = _useState8[0],
     setSortProperties = _useState8[1];
-  var _useState9 = React.useState(TAB$2.all),
-    _useState10 = _slicedToArray(_useState9, 2),
-    tab = _useState10[0],
-    setTab = _useState10[1];
-  var _useHiddenColumns = Columns.useHiddenColumns("stripePaymentDashboard_".concat(kind)),
-    _useHiddenColumns$hid = _useHiddenColumns.hiddenColumns,
-    hiddenColumns = _useHiddenColumns$hid === void 0 ? [] : _useHiddenColumns$hid;
   var filterableColumns = buildFilterColumns$1(tab, kind, payableEntityColumns);
   var _getQueryParams = utils$3.getQueryParams(),
     _getQueryParams$searc = _getQueryParams.searchTerm,
@@ -2121,18 +2092,18 @@ var useFiltersAndPagination$2 = function useFiltersAndPagination(_ref) {
     key: "search_term",
     value: searchTerm.trim()
   });
-  var _useState11 = React.useState(neetoFiltersFrontend.buildFiltersFromURL([].concat(_toConsumableArray(filterableColumns), [searchKeywordProps]))),
+  var _useState9 = React.useState(neetoFiltersFrontend.buildFiltersFromURL([].concat(_toConsumableArray(filterableColumns), [searchKeywordProps]))),
+    _useState10 = _slicedToArray(_useState9, 2),
+    filters = _useState10[0],
+    setFilters = _useState10[1];
+  var _useState11 = React.useState(0),
     _useState12 = _slicedToArray(_useState11, 2),
-    filters = _useState12[0],
-    setFilters = _useState12[1];
-  var _useState13 = React.useState(0),
+    dataSize = _useState12[0],
+    setDataSize = _useState12[1];
+  var _useState13 = React.useState(INITIAL_PANE_STATUS),
     _useState14 = _slicedToArray(_useState13, 2),
-    dataSize = _useState14[0],
-    setDataSize = _useState14[1];
-  var _useState15 = React.useState(INITIAL_PANE_STATUS),
-    _useState16 = _slicedToArray(_useState15, 2),
-    paneStatus = _useState16[0],
-    setPaneStatus = _useState16[1];
+    paneStatus = _useState14[0],
+    setPaneStatus = _useState14[1];
   var columns = buildPaymentColumns$1({
     tab: tab,
     kind: kind,
@@ -2141,20 +2112,18 @@ var useFiltersAndPagination$2 = function useFiltersAndPagination(_ref) {
       setPaneStatus: setPaneStatus
     }
   });
-  var selectableColumnData = columns.map(ramda.modify("dataIndex", processDataIndex));
-  var columnData = columns.filter(function (_ref2) {
-    var dataIndex = _ref2.dataIndex;
-    return !hiddenColumns.includes(processDataIndex(dataIndex));
-  });
+  var modifiedColumns = columns.map(ramda.modify("dataIndex", processDataIndex));
   var handleTabChange = function handleTabChange(tab) {
     var _pageProperties$tab, _pageProperties$tab2;
-    urlSearchParams.set("tab", tab);
-    urlSearchParams.set("page", (_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page);
-    urlSearchParams.set("page_size", (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize);
-    history.push({
-      search: urlSearchParams.toString()
+    var queryParams = utils$3.getQueryParams({
+      toCamelCase: false
     });
-    setTab(tab);
+    var newParams = {
+      tab: tab,
+      page: (_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page,
+      page_size: (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize
+    };
+    history.push(utils$3.buildUrl(window.location.pathname, ramda.mergeLeft(newParams, queryParams)));
   };
   return {
     isFilterButtonVisible: isFilterButtonVisible,
@@ -2168,14 +2137,13 @@ var useFiltersAndPagination$2 = function useFiltersAndPagination(_ref) {
     dataSize: dataSize,
     filterableColumns: filterableColumns,
     sortProperties: sortProperties,
-    columnData: columnData,
-    selectableColumnData: selectableColumnData,
+    columns: columns,
+    modifiedColumns: modifiedColumns,
     setIsFilterButtonVisible: setIsFilterButtonVisible,
     setIsFilterPaneOpen: setIsFilterPaneOpen,
     setPageProperties: setPageProperties,
     setPaneStatus: setPaneStatus,
     setFilters: setFilters,
-    setTab: setTab,
     handleTabChange: handleTabChange,
     setDataSize: setDataSize,
     setSortProperties: setSortProperties
@@ -4705,7 +4673,7 @@ var Details = function Details(_ref) {
 };
 
 var List$2 = function List(_ref) {
-  var _pageProperties$tab3, _pageProperties$tab4, _pageProperties$tab5;
+  var _pageProperties$tab, _pageProperties$tab2, _pageProperties$tab3;
   var _ref$isPlatformEnable = _ref.isPlatformEnabled,
     isPlatformEnabled = _ref$isPlatformEnable === void 0 ? false : _ref$isPlatformEnable,
     kind = _ref.kind,
@@ -4718,23 +4686,18 @@ var List$2 = function List(_ref) {
     tab = _ref.tab,
     paneStatus = _ref.paneStatus,
     setPaneStatus = _ref.setPaneStatus,
-    columnData = _ref.columnData,
-    handleTabChange = _ref.handleTabChange,
     setDataSize = _ref.setDataSize,
     sortProperties = _ref.sortProperties,
     setSortProperties = _ref.setSortProperties,
-    payoutId = _ref.payoutId;
-  var urlSearchParams = useURLSearchParams();
+    payoutId = _ref.payoutId,
+    columns = _ref.columns;
   var history = reactRouterDom.useHistory();
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
-  var tabs = TABS$2.filter(function (tab) {
-    var _TAB_METADATA$tab;
-    return !((_TAB_METADATA$tab = TAB_METADATA$1[tab]) !== null && _TAB_METADATA$tab !== void 0 && (_TAB_METADATA$tab = _TAB_METADATA$tab.isHidden) !== null && _TAB_METADATA$tab !== void 0 && _TAB_METADATA$tab[kind]);
-  });
   var _useHiddenColumns = Columns.useHiddenColumns("stripePaymentDashboard_".concat(kind)),
     hideColumn = _useHiddenColumns.hideColumn,
-    getVisibleColumnData = _useHiddenColumns.getVisibleColumnData;
+    _useHiddenColumns$hid = _useHiddenColumns.hiddenColumns,
+    hiddenColumns = _useHiddenColumns$hid === void 0 ? [] : _useHiddenColumns$hid;
   var _useFetchStripePlatfo = useFetchStripePlatformAccount({
       enabled: isPlatformEnabled
     }),
@@ -4769,11 +4732,13 @@ var List$2 = function List(_ref) {
     setDataSize(dataSize);
   }, [data]);
   var handleTablePaginaton = function handleTablePaginaton(page, pageSize) {
-    urlSearchParams.set("page", page);
-    urlSearchParams.set("page_size", pageSize);
-    history.push({
-      search: urlSearchParams.toString()
+    var queryParams = utils$3.getQueryParams({
+      toCamelCase: false
     });
+    history.push(utils$3.buildUrl(window.location.pathname, ramda.mergeLeft({
+      page: page,
+      page_size: pageSize
+    }, queryParams)));
     setPageProperties(ramda.assoc(tab, {
       page: page,
       pageSize: pageSize
@@ -4783,16 +4748,6 @@ var List$2 = function List(_ref) {
     handleTablePaginaton(constants.DEFAULT_PAGE_INDEX, constants.DEFAULT_PAGE_SIZE);
     setSortProperties(DEFAULT_SORT_PROPERTIES$1);
   }, [filters, tab]);
-  React.useEffect(function () {
-    var _pageProperties$tab, _pageProperties$tab2;
-    var tab = urlSearchParams.get("tab") || TAB$2.all;
-    var validatedTab = tabs.includes(tab) ? tab : TAB$2.all;
-    var page = Number(urlSearchParams.get("page")) || ((_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page);
-    var pageSize = Number(urlSearchParams.get("page_size")) || ((_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize);
-    handleTabChange(validatedTab);
-    urlSearchParams.set("tab", validatedTab);
-    handleTablePaginaton(page, pageSize);
-  }, [urlSearchParams]);
   var handleTableChange = function handleTableChange(_, __, sorter) {
     setSortProperties(neetoCist.isPresent(sorter === null || sorter === void 0 ? void 0 : sorter.column) ? {
       sortBy: neetoCist.camelToSnakeCase(processDataIndex(sorter.field)),
@@ -4811,13 +4766,17 @@ var List$2 = function List(_ref) {
       })
     }));
   }
+  var visibleColumns = columns.filter(function (_ref2) {
+    var dataIndex = _ref2.dataIndex;
+    return !hiddenColumns.includes(processDataIndex(dataIndex));
+  });
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(TableWrapper__default["default"], {
-    hasPagination: dataSize > ((_pageProperties$tab3 = pageProperties[tab]) === null || _pageProperties$tab3 === void 0 ? void 0 : _pageProperties$tab3.pageSize)
+    hasPagination: dataSize > ((_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.pageSize)
   }, /*#__PURE__*/React__default["default"].createElement(neetoui.Table, {
     fixedHeight: true,
     allowRowClick: false,
-    columnData: getVisibleColumnData(columnData),
-    currentPageNumber: (_pageProperties$tab4 = pageProperties[tab]) === null || _pageProperties$tab4 === void 0 ? void 0 : _pageProperties$tab4.page,
+    columnData: visibleColumns,
+    currentPageNumber: (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.page,
     handlePageChange: handleTablePaginaton,
     loading: isDataFetching,
     rowData: buildRowData({
@@ -4840,7 +4799,7 @@ var List$2 = function List(_ref) {
     paginationProps: {
       showSizeChanger: true,
       hideOnSinglePage: true,
-      pageSize: (_pageProperties$tab5 = pageProperties[tab]) === null || _pageProperties$tab5 === void 0 ? void 0 : _pageProperties$tab5.pageSize,
+      pageSize: (_pageProperties$tab3 = pageProperties[tab]) === null || _pageProperties$tab3 === void 0 ? void 0 : _pageProperties$tab3.pageSize,
       total: dataSize
     },
     onChange: handleTableChange,
@@ -4893,8 +4852,8 @@ var Dashboard = function Dashboard(_ref) {
     tab = _useFiltersAndPaginat.tab,
     dataSize = _useFiltersAndPaginat.dataSize,
     sortProperties = _useFiltersAndPaginat.sortProperties,
-    columnData = _useFiltersAndPaginat.columnData,
-    selectableColumnData = _useFiltersAndPaginat.selectableColumnData,
+    columns = _useFiltersAndPaginat.columns,
+    modifiedColumns = _useFiltersAndPaginat.modifiedColumns,
     paneStatus = _useFiltersAndPaginat.paneStatus,
     setPaneStatus = _useFiltersAndPaginat.setPaneStatus,
     setIsFilterButtonVisible = _useFiltersAndPaginat.setIsFilterButtonVisible,
@@ -4943,7 +4902,7 @@ var Dashboard = function Dashboard(_ref) {
       onChange: handleFiltersChange
     }), isFilterButtonVisible && /*#__PURE__*/React__default["default"].createElement(SubHeader__default["default"].RightBlock, {
       columnsButtonProps: {
-        columnData: selectableColumnData,
+        columnData: modifiedColumns,
         fixedColumns: DASHBOARD_MANDATORY_COLUMNS$1,
         localStorageKey: "stripePaymentDashboard_".concat(kind)
       },
@@ -4961,9 +4920,8 @@ var Dashboard = function Dashboard(_ref) {
       }
     }))
   }), /*#__PURE__*/React__default["default"].createElement(List$2, {
-    columnData: columnData,
+    columns: columns,
     filters: filters,
-    handleTabChange: handleTabChange,
     holdableId: holdableId,
     isPlatformEnabled: isPlatformEnabled,
     kind: kind,
@@ -5183,7 +5141,7 @@ var renderPayoutIdentifier$1 = ramda.curry(function (route, _ref) {
 function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useFiltersAndPagination$1 = function useFiltersAndPagination(payoutsPageRoute) {
-  var urlSearchParams = useURLSearchParams();
+  var history = reactRouterDom.useHistory();
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isFilterButtonVisible = _useState2[0],
@@ -5200,13 +5158,9 @@ var useFiltersAndPagination$1 = function useFiltersAndPagination(payoutsPageRout
     _useState8 = _slicedToArray(_useState7, 2),
     sortProperties = _useState8[0],
     setSortProperties = _useState8[1];
-  var _useState9 = React.useState(TAB$1.all),
-    _useState10 = _slicedToArray(_useState9, 2),
-    tab = _useState10[0],
-    setTab = _useState10[1];
-  var _useHiddenColumns = Columns.useHiddenColumns(STRIPE_PAYOUTS_TABLE_HIDDEN_COLUMNS_STORAGE_KEY),
-    hideColumn = _useHiddenColumns.hideColumn,
-    getVisibleColumnData = _useHiddenColumns.getVisibleColumnData;
+  var _useQueryParams = reactUtils.useQueryParams(),
+    _useQueryParams$tab = _useQueryParams.tab,
+    tab = _useQueryParams$tab === void 0 ? TAB$1.all : _useQueryParams$tab;
   var _getQueryParams = utils$3.getQueryParams(),
     _getQueryParams$searc = _getQueryParams.searchTerm,
     searchTerm = _getQueryParams$searc === void 0 ? "" : _getQueryParams$searc;
@@ -5214,26 +5168,30 @@ var useFiltersAndPagination$1 = function useFiltersAndPagination(payoutsPageRout
     key: "search_term",
     value: searchTerm.trim()
   });
-  var _useState11 = React.useState(neetoFiltersFrontend.buildFiltersFromURL([].concat(_toConsumableArray(FILTER_COLUMNS), [searchKeywordProps]))),
+  var _useState9 = React.useState(neetoFiltersFrontend.buildFiltersFromURL([].concat(_toConsumableArray(FILTER_COLUMNS), [searchKeywordProps]))),
+    _useState10 = _slicedToArray(_useState9, 2),
+    filters = _useState10[0],
+    setFilters = _useState10[1];
+  var _useState11 = React.useState(0),
     _useState12 = _slicedToArray(_useState11, 2),
-    filters = _useState12[0],
-    setFilters = _useState12[1];
-  var _useState13 = React.useState(0),
-    _useState14 = _slicedToArray(_useState13, 2),
-    dataSize = _useState14[0],
-    setDataSize = _useState14[1];
+    dataSize = _useState12[0],
+    setDataSize = _useState12[1];
   var identifierColumn = ramda.assoc("render", renderPayoutIdentifier$1(payoutsPageRoute), IDENTIFIER_COLUMN);
   var columns = ramda.insert(1, identifierColumn, COLUMNS$1);
-  var selectableColumnData = tab !== TAB$1.all ? neetoCist.removeBy({
+  var columnData = tab !== TAB$1.all ? neetoCist.removeBy({
     key: "status"
   }, columns) : columns;
-  var columnData = getVisibleColumnData(selectableColumnData);
   var handleTabChange = function handleTabChange(tab) {
     var _pageProperties$tab, _pageProperties$tab2;
-    urlSearchParams.set("tab", tab);
-    urlSearchParams.set("page", (_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page);
-    urlSearchParams.set("page_size", (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize);
-    setTab(tab);
+    var queryParams = utils$3.getQueryParams({
+      toCamelCase: false
+    });
+    var newParams = {
+      tab: tab,
+      page: (_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page,
+      page_size: (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize
+    };
+    history.push(utils$3.buildUrl(window.location.pathname, ramda.mergeLeft(newParams, queryParams)));
   };
   return {
     isFilterButtonVisible: isFilterButtonVisible,
@@ -5243,16 +5201,13 @@ var useFiltersAndPagination$1 = function useFiltersAndPagination(payoutsPageRout
     searchKeywordProps: searchKeywordProps,
     tab: tab,
     sortProperties: sortProperties,
-    selectableColumnData: selectableColumnData,
     columnData: columnData,
     dataSize: dataSize,
     setDataSize: setDataSize,
-    hideColumn: hideColumn,
     setIsFilterButtonVisible: setIsFilterButtonVisible,
     setIsFilterPaneOpen: setIsFilterPaneOpen,
     setPageProperties: setPageProperties,
     setFilters: setFilters,
-    setTab: setTab,
     handleTabChange: handleTabChange,
     setSortProperties: setSortProperties
   };
@@ -5280,10 +5235,9 @@ var useFetchData$1 = function useFetchData(_ref) {
 };
 
 var List$1 = function List(_ref) {
-  var _pageProperties$tab3, _pageProperties$tab4, _pageProperties$tab5;
+  var _pageProperties$tab, _pageProperties$tab2, _pageProperties$tab3;
   var columnData = _ref.columnData,
     filters = _ref.filters,
-    handleTabChange = _ref.handleTabChange,
     pageProperties = _ref.pageProperties,
     setDataSize = _ref.setDataSize,
     setIsFilterButtonVisible = _ref.setIsFilterButtonVisible,
@@ -5291,12 +5245,13 @@ var List$1 = function List(_ref) {
     setSortProperties = _ref.setSortProperties,
     sortProperties = _ref.sortProperties,
     tab = _ref.tab,
-    isPlatformEnabled = _ref.isPlatformEnabled,
-    hideColumn = _ref.hideColumn;
-  var urlSearchParams = useURLSearchParams();
+    isPlatformEnabled = _ref.isPlatformEnabled;
   var history = reactRouterDom.useHistory();
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
+  var _useHiddenColumns = Columns.useHiddenColumns(STRIPE_PAYOUTS_TABLE_HIDDEN_COLUMNS_STORAGE_KEY),
+    hideColumn = _useHiddenColumns.hideColumn,
+    getVisibleColumnData = _useHiddenColumns.getVisibleColumnData;
   var _useFetchData = useFetchData$1({
       payload: buildPayload({
         filters: filters,
@@ -5315,12 +5270,13 @@ 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({
-      search: urlSearchParams.toString()
+    var queryParams = utils$3.getQueryParams({
+      toCamelCase: false
     });
+    history.push(utils$3.buildUrl(window.location.pathname, ramda.mergeLeft({
+      page: page,
+      page_size: pageSize
+    }, queryParams)));
     setPageProperties(ramda.assoc(tab, {
       page: page,
       pageSize: pageSize
@@ -5330,16 +5286,6 @@ var List$1 = function List(_ref) {
     handleTablePagination(constants.DEFAULT_PAGE_INDEX, constants.DEFAULT_PAGE_SIZE);
     setSortProperties(DEFAULT_SORT_PROPERTIES);
   }, [filters, tab]);
-  React.useEffect(function () {
-    var _pageProperties$tab, _pageProperties$tab2;
-    var tab = urlSearchParams.get("tab") || TAB$1.all;
-    var validatedTab = TABS$1.includes(tab) ? tab : TAB$1.all;
-    var page = Number(urlSearchParams.get("page")) || ((_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page);
-    var pageSize = Number(urlSearchParams.get("page_size")) || ((_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize);
-    handleTabChange(validatedTab);
-    urlSearchParams.set("tab", validatedTab);
-    handleTablePagination(page, pageSize);
-  }, [urlSearchParams]);
   var handleTableChange = function handleTableChange(_, __, sorter) {
     setSortProperties(neetoCist.isPresent(sorter === null || sorter === void 0 ? void 0 : sorter.column) ? {
       sortBy: neetoCist.camelToSnakeCase(sorter.field),
@@ -5357,12 +5303,12 @@ var List$1 = function List(_ref) {
     }));
   }
   return /*#__PURE__*/React__default["default"].createElement(TableWrapper__default["default"], {
-    hasPagination: dataSize > ((_pageProperties$tab3 = pageProperties[tab]) === null || _pageProperties$tab3 === void 0 ? void 0 : _pageProperties$tab3.pageSize)
+    hasPagination: dataSize > ((_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.pageSize)
   }, /*#__PURE__*/React__default["default"].createElement(neetoui.Table, {
-    columnData: columnData,
     fixedHeight: true,
     allowRowClick: false,
-    currentPageNumber: (_pageProperties$tab4 = pageProperties[tab]) === null || _pageProperties$tab4 === void 0 ? void 0 : _pageProperties$tab4.page,
+    columnData: getVisibleColumnData(columnData),
+    currentPageNumber: (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.page,
     handlePageChange: handleTablePagination,
     loading: isDataFetching,
     rowData: buildRowData({
@@ -5376,7 +5322,7 @@ var List$1 = function List(_ref) {
     paginationProps: {
       showSizeChanger: true,
       hideOnSinglePage: true,
-      pageSize: (_pageProperties$tab5 = pageProperties[tab]) === null || _pageProperties$tab5 === void 0 ? void 0 : _pageProperties$tab5.pageSize,
+      pageSize: (_pageProperties$tab3 = pageProperties[tab]) === null || _pageProperties$tab3 === void 0 ? void 0 : _pageProperties$tab3.pageSize,
       total: dataSize
     },
     onChange: handleTableChange,
@@ -5409,7 +5355,6 @@ var PayoutsDashboard = function PayoutsDashboard(_ref) {
     tab = _useFiltersAndPaginat.tab,
     sortProperties = _useFiltersAndPaginat.sortProperties,
     columnData = _useFiltersAndPaginat.columnData,
-    selectableColumnData = _useFiltersAndPaginat.selectableColumnData,
     dataSize = _useFiltersAndPaginat.dataSize,
     setDataSize = _useFiltersAndPaginat.setDataSize,
     setIsFilterButtonVisible = _useFiltersAndPaginat.setIsFilterButtonVisible,
@@ -5417,8 +5362,7 @@ var PayoutsDashboard = function PayoutsDashboard(_ref) {
     setPageProperties = _useFiltersAndPaginat.setPageProperties,
     setFilters = _useFiltersAndPaginat.setFilters,
     handleTabChange = _useFiltersAndPaginat.handleTabChange,
-    setSortProperties = _useFiltersAndPaginat.setSortProperties,
-    hideColumn = _useFiltersAndPaginat.hideColumn;
+    setSortProperties = _useFiltersAndPaginat.setSortProperties;
   var isTabsVisible = isFilterButtonVisible || tab !== "all";
   var handleFiltersChange = function handleFiltersChange(filters) {
     startTransition(function () {
@@ -5457,7 +5401,7 @@ var PayoutsDashboard = function PayoutsDashboard(_ref) {
       onChange: handleFiltersChange
     }), isFilterButtonVisible && /*#__PURE__*/React__default["default"].createElement(SubHeader__default["default"].RightBlock, {
       columnsButtonProps: {
-        columnData: selectableColumnData,
+        columnData: columnData,
         fixedColumns: DASHBOARD_MANDATORY_COLUMNS,
         localStorageKey: STRIPE_PAYOUTS_TABLE_HIDDEN_COLUMNS_STORAGE_KEY
       },
@@ -5477,8 +5421,6 @@ var PayoutsDashboard = function PayoutsDashboard(_ref) {
   }), /*#__PURE__*/React__default["default"].createElement(List$1, {
     columnData: columnData,
     filters: filters,
-    handleTabChange: handleTabChange,
-    hideColumn: hideColumn,
     isPlatformEnabled: isPlatformEnabled,
     pageProperties: pageProperties,
     setDataSize: setDataSize,
@@ -6330,7 +6272,6 @@ var useFiltersAndPagination = function useFiltersAndPagination(_ref) {
     kind = _ref.kind,
     initialTabs = _ref.initialTabs,
     tabMetaData = _ref.tabMetaData;
-  var urlSearchParams = useURLSearchParams();
   var history = reactRouterDom.useHistory();
   var tabs = initialTabs.filter(function (tab) {
     var _tabMetaData$tab;
@@ -6352,31 +6293,32 @@ var useFiltersAndPagination = function useFiltersAndPagination(_ref) {
     _useState8 = _slicedToArray(_useState7, 2),
     pageProperties = _useState8[0],
     setPageProperties = _useState8[1];
-  var _useState9 = React.useState("all"),
-    _useState10 = _slicedToArray(_useState9, 2),
-    tab = _useState10[0],
-    setTab = _useState10[1];
+  var _useQueryParams = reactUtils.useQueryParams(),
+    _useQueryParams$tab = _useQueryParams.tab,
+    tab = _useQueryParams$tab === void 0 ? "all" : _useQueryParams$tab;
   var filterableColumns = buildFilterColumns(payableEntityColumns);
-  var _useState11 = React.useState(neetoFiltersFrontend.buildFiltersFromURL(filterableColumns)),
+  var _useState9 = React.useState(neetoFiltersFrontend.buildFiltersFromURL(filterableColumns)),
+    _useState10 = _slicedToArray(_useState9, 2),
+    filters = _useState10[0],
+    setFilters = _useState10[1];
+  var _useState11 = React.useState(0),
     _useState12 = _slicedToArray(_useState11, 2),
-    filters = _useState12[0],
-    setFilters = _useState12[1];
-  var _useState13 = React.useState(0),
-    _useState14 = _slicedToArray(_useState13, 2),
-    dataSize = _useState14[0],
-    setDataSize = _useState14[1];
+    dataSize = _useState12[0],
+    setDataSize = _useState12[1];
   var _getQueryParams = utils$3.getQueryParams(),
     _getQueryParams$searc = _getQueryParams.searchTerm,
     searchTerm = _getQueryParams$searc === void 0 ? "" : _getQueryParams$searc;
   var handleTabChange = function handleTabChange(tab) {
     var _pageProperties$tab, _pageProperties$tab2;
-    urlSearchParams.set("tab", tab);
-    urlSearchParams.set("page", (_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page);
-    urlSearchParams.set("page_size", (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize);
-    history.push({
-      search: urlSearchParams.toString()
+    var queryParams = utils$3.getQueryParams({
+      toCamelCase: false
     });
-    setTab(tab);
+    var newParams = {
+      tab: tab,
+      page: (_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page,
+      page_size: (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize
+    };
+    history.push(utils$3.buildUrl(window.location.pathname, ramda.mergeLeft(newParams, queryParams)));
   };
   return {
     isFilterButtonVisible: isFilterButtonVisible,
@@ -6394,7 +6336,6 @@ var useFiltersAndPagination = function useFiltersAndPagination(_ref) {
     setPageProperties: setPageProperties,
     setSortProperties: setSortProperties,
     setFilters: setFilters,
-    setTab: setTab,
     handleTabChange: handleTabChange,
     setDataSize: setDataSize
   };
@@ -6516,7 +6457,7 @@ var useFetchSquareData = function useFetchSquareData(_ref) {
 };
 
 var List = function List(_ref) {
-  var _pageProperties$tab3, _pageProperties$tab4, _pageProperties$tab5;
+  var _pageProperties$tab, _pageProperties$tab2, _pageProperties$tab3;
   var kind = _ref.kind,
     _ref$holdableId = _ref.holdableId,
     holdableId = _ref$holdableId === void 0 ? null : _ref$holdableId,
@@ -6526,12 +6467,9 @@ var List = function List(_ref) {
     payableEntityColumns = _ref.payableEntityColumns,
     setPageProperties = _ref.setPageProperties,
     tab = _ref.tab,
-    tabs = _ref.tabs,
-    handleTabChange = _ref.handleTabChange,
     sortProperties = _ref.sortProperties,
     setSortProperties = _ref.setSortProperties,
     setDataSize = _ref.setDataSize;
-  var urlSearchParams = useURLSearchParams();
   var history = reactRouterDom.useHistory();
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
@@ -6564,26 +6502,18 @@ var List = function List(_ref) {
     setDataSize(dataSize);
   }, [data]);
   var handleTablePaginaton = function handleTablePaginaton(page, pageSize) {
-    urlSearchParams.set("page", page);
-    urlSearchParams.set("page_size", pageSize);
-    history.push({
-      search: urlSearchParams.toString()
+    var queryParams = utils$3.getQueryParams({
+      toCamelCase: false
     });
+    history.push(utils$3.buildUrl(window.location.pathname, ramda.mergeLeft({
+      page: page,
+      page_size: pageSize
+    }, queryParams)));
     setPageProperties(ramda.assoc(tab, {
       page: page,
       pageSize: pageSize
     }));
   };
-  React.useEffect(function () {
-    var _pageProperties$tab, _pageProperties$tab2;
-    var tab = urlSearchParams.get("tab") || TAB.all;
-    var validatedTab = tabs.includes(tab) ? tab : TAB.all;
-    var pageIndex = Number(urlSearchParams.get("page")) || ((_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.page);
-    var pageSize = Number(urlSearchParams.get("page_size")) || ((_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.pageSize);
-    handleTabChange(validatedTab);
-    urlSearchParams.set("tab", validatedTab);
-    handleTablePaginaton(pageIndex, pageSize);
-  }, [urlSearchParams]);
   var handleTableChange = function handleTableChange(_, __, sorter) {
     setSortProperties(neetoCist.isPresent(sorter === null || sorter === void 0 ? void 0 : sorter.column) ? {
       sortBy: neetoCist.camelToSnakeCase(sorter.field),
@@ -6603,12 +6533,12 @@ var List = function List(_ref) {
     }));
   }
   return /*#__PURE__*/React__default["default"].createElement(TableWrapper__default["default"], {
-    hasPagination: dataSize > ((_pageProperties$tab3 = pageProperties[tab]) === null || _pageProperties$tab3 === void 0 ? void 0 : _pageProperties$tab3.pageSize)
+    hasPagination: dataSize > ((_pageProperties$tab = pageProperties[tab]) === null || _pageProperties$tab === void 0 ? void 0 : _pageProperties$tab.pageSize)
   }, /*#__PURE__*/React__default["default"].createElement(neetoui.Table, {
+    columnData: columnData,
     fixedHeight: true,
     allowRowClick: false,
-    columnData: columnData,
-    currentPageNumber: (_pageProperties$tab4 = pageProperties[tab]) === null || _pageProperties$tab4 === void 0 ? void 0 : _pageProperties$tab4.page,
+    currentPageNumber: (_pageProperties$tab2 = pageProperties[tab]) === null || _pageProperties$tab2 === void 0 ? void 0 : _pageProperties$tab2.page,
     handlePageChange: handleTablePaginaton,
     loading: isDataFetching,
     rowData: buildRowData({
@@ -6622,7 +6552,7 @@ var List = function List(_ref) {
     paginationProps: {
       showSizeChanger: true,
       hideOnSinglePage: true,
-      pageSize: (_pageProperties$tab5 = pageProperties[tab]) === null || _pageProperties$tab5 === void 0 ? void 0 : _pageProperties$tab5.pageSize,
+      pageSize: (_pageProperties$tab3 = pageProperties[tab]) === null || _pageProperties$tab3 === void 0 ? void 0 : _pageProperties$tab3.pageSize,
       total: dataSize
     },
     onChange: handleTableChange
@@ -6656,8 +6586,6 @@ var SquareDashboard = function SquareDashboard(_ref) {
     sortProperties = filterPaginationState.sortProperties,
     setSortProperties = filterPaginationState.setSortProperties,
     tab = filterPaginationState.tab,
-    tabs = filterPaginationState.tabs,
-    handleTabChange = filterPaginationState.handleTabChange,
     setDataSize = filterPaginationState.setDataSize;
   return /*#__PURE__*/React__default["default"].createElement(FilterWrapper, _extends$1({
     title: isPaymentKind(kind) ? t("neetoPayments.title.squarePayment") : t("neetoPayments.title.squareRefund")
@@ -6667,7 +6595,6 @@ var SquareDashboard = function SquareDashboard(_ref) {
     searchProps: searchProps
   }, filterPaginationState)), /*#__PURE__*/React__default["default"].createElement(List, {
     filters: filters,
-    handleTabChange: handleTabChange,
     holdableId: holdableId,
     kind: kind,
     pageProperties: pageProperties,
@@ -6675,10 +6602,9 @@ var SquareDashboard = function SquareDashboard(_ref) {
     setDataSize: setDataSize,
     setIsFilterButtonVisible: setIsFilterButtonVisible,
     setPageProperties: setPageProperties,
-    tab: tab,
-    tabs: tabs,
+    setSortProperties: setSortProperties,
     sortProperties: sortProperties,
-    setSortProperties: setSortProperties
+    tab: tab
   }));
 };
 var index = reactUtils.withTitle(withReactQuery(SquareDashboard), i18next.t("neetoPayments.common.squarePayments"));
@@ -7003,6 +6929,8 @@ var AccountDetails = function AccountDetails(_ref) {
 var AccountProcessing = function AccountProcessing(_ref) {
   var holdableId = _ref.holdableId,
     returnUrl = _ref.returnUrl;
+  var _useQueryParams = reactUtils.useQueryParams(),
+    app = _useQueryParams.app;
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isAlertOpen = _useState2[0],
@@ -7013,8 +6941,7 @@ var AccountProcessing = function AccountProcessing(_ref) {
     setIsPolling = _useState4[1];
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
-  var urlSearchParams = useURLSearchParams();
-  var isStripeCallback = urlSearchParams.get("app") === "stripe";
+  var isStripeCallback = app === "stripe";
   React.useEffect(function () {
     if (!isStripeCallback) return;
     setIsPolling(true);