chrone: sperate client and server to different repos.

src/containers/Sales/Receipts/ReceiptsLanding/ReceiptsList.js

@@ -0,0 +1,61 @@
+import React from 'react';
+import { DashboardContentTable, DashboardPageContent } from 'components';
+
+import 'style/pages/SaleReceipt/List.scss';
+
+import ReceiptActionsBar from './ReceiptActionsBar';
+import ReceiptViewTabs from './ReceiptViewTabs';
+import ReceiptsAlerts from '../ReceiptsAlerts';
+import ReceiptsTable from './ReceiptsTable';
+
+import withReceipts from './withReceipts';
+import withReceiptsActions from './withReceiptsActions';
+
+import { ReceiptsListProvider } from './ReceiptsListProvider';
+import { transformTableStateToQuery, compose } from 'utils';
+
+/**
+ * Receipts list page.
+ */
+function ReceiptsList({
+  // #withReceipts
+  receiptTableState,
+  receiptsTableStateChanged,
+
+  // #withReceiptsActions
+  resetReceiptsTableState,
+}) {
+  // Resets the receipts table state once the page unmount.
+  React.useEffect(
+    () => () => {
+      resetReceiptsTableState();
+    },
+    [resetReceiptsTableState],
+  );
+
+  return (
+    <ReceiptsListProvider
+      query={transformTableStateToQuery(receiptTableState)}
+      tableStateChanged={receiptsTableStateChanged}
+    >
+      <DashboardPageContent>
+        <ReceiptActionsBar />
+
+        <DashboardPageContent>
+          <ReceiptViewTabs />
+          <ReceiptsTable />
+        </DashboardPageContent>
+
+        <ReceiptsAlerts />
+      </DashboardPageContent>
+    </ReceiptsListProvider>
+  );
+}
+
+export default compose(
+  withReceipts(({ receiptTableState, receiptsTableStateChanged }) => ({
+    receiptTableState,
+    receiptsTableStateChanged,
+  })),
+  withReceiptsActions,
+)(ReceiptsList);