fix: tables with custom views.

client/src/containers/Sales/Invoices/InvoicesLanding/InvoiceViewTabs.js

@@ -31,9 +31,9 @@ function InvoiceViewTabs({
   }));
 
   // Handle tab change.
-  const handleTabsChange = (customView) => {    
+  const handleTabsChange = (customViewId) => {    
     setInvoicesTableState({
-      customViewId: customView.id || null,
+      customViewId: customViewId || null,
     });
   };
 
@@ -46,7 +46,7 @@ function InvoiceViewTabs({
     <Navbar className={'navbar--dashboard-views'}>
       <NavbarGroup align={Alignment.LEFT}>
         <DashboardViewsTabs
-          customViewId={invoicesTableState.customViewId}
+          currentViewId={invoicesTableState.customViewId}
           resourceName={'invoices'}
           tabs={tabs}
           onNewViewTabClick={handleClickNewView}

client/src/containers/Sales/Invoices/InvoicesLanding/InvoicesActionsBar.js

@@ -46,9 +46,7 @@ function InvoiceActionsBar({
 
   // Handle views tab change.
   const handleTabChange = (customView) => {
-    setInvoicesTableState({
-      customViewId: customView.id || null,
-    });
+    setInvoicesTableState({ customViewId: customView.id || null });
   };
 
   return (

client/src/containers/Sales/Invoices/InvoicesLanding/InvoicesDataTable.js

@@ -1,9 +1,7 @@
 import React, { useCallback } from 'react';
 import { useHistory } from 'react-router-dom';
-import classNames from 'classnames';
 
 import InvoicesEmptyStatus from './InvoicesEmptyStatus';
-import { CLASSES } from 'common/classes';
 
 import { compose } from 'utils';
 import { DataTable } from 'components';

client/src/containers/Sales/Invoices/InvoicesLanding/InvoicesList.js

@@ -3,7 +3,7 @@ import React from 'react';
 import 'style/pages/SaleInvoice/List.scss';
 
 import { DashboardContentTable, DashboardPageContent } from 'components';
-import InvoiceActionsBar from './InvoiceActionsBar';
+import InvoicesActionsBar from './InvoicesActionsBar';
 import { InvoicesListProvider } from './InvoicesListProvider';
 
 import InvoiceViewTabs from './InvoiceViewTabs';
@@ -26,7 +26,7 @@ function InvoicesList({
     <InvoicesListProvider
       query={transformTableStateToQuery(invoicesTableState)}
     >
-      <InvoiceActionsBar />
+      <InvoicesActionsBar />
 
       <DashboardPageContent>
         <InvoiceViewTabs />

client/src/containers/Sales/Invoices/InvoicesLanding/InvoicesListProvider.js

@@ -8,7 +8,7 @@ const InvoicesListContext = createContext();
 /**
  * Accounts chart data provider.
  */
-function InvoicesListProvider({ accountsTableQuery, ...props }) {
+function InvoicesListProvider({ query, ...props }) {
   // Fetch accounts resource views and fields.
   const { data: invoicesViews, isFetching: isViewsLoading } = useResourceViews(
     'sale_invoices',
@@ -25,7 +25,7 @@ function InvoicesListProvider({ accountsTableQuery, ...props }) {
     data: { invoices, pagination, filterMeta },
     isFetching: isInvoicesFetching,
     isLoading: isInvoicesLoading,
-  } = useInvoices(accountsTableQuery, { keepPreviousData: true });
+  } = useInvoices(query, { keepPreviousData: true });
 
   // Detarmines the datatable empty status.
   const isEmptyStatus =

client/src/containers/Sales/Invoices/InvoicesLanding/withInvoiceActions.js

@@ -4,7 +4,7 @@ import {
 } from 'store/Invoice/invoices.actions';
 
 const mapDipatchToProps = (dispatch) => ({
-  setInvoicesTableState: (query) => setInvoicesTableState(query),
+  setInvoicesTableState: (queries) => dispatch(setInvoicesTableState(queries)),
 });
 
 export default connect(null, mapDipatchToProps);