Allow user to show pagination somewhere else

src/PaginationContainer.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import { connect } from 'react-redux';
+import makeSelectors from './selectors';
+import { tablePageChanged } from './actions';
+import Pagination from './Pagination';
+
+const mapStateToProps = (state, { tableName }) => {
+  const selectors = makeSelectors(tableName);
+  const isInitialized = selectors.getIsInitialized(state);
+
+  if (!isInitialized) {
+    return {
+      isInitialized,
+    };
+  }
+
+  const pageInfo = selectors.getPageInfo(state);
+
+  return {
+    isInitialized,
+    ...pageInfo,
+  };
+};
+
+const mapDispatchToProps = (dispatch, { tableName }) => ({
+  onPageChange: (page) => dispatch(tablePageChanged(tableName, page)),
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(({
+  isInitialized,
+  ...otherProps
+}) => {
+  if (!isInitialized) { return null; }
+  return <Pagination {...otherProps} />;
+});

src/index.js

@@ -6,6 +6,7 @@ import TableRow from './TableRow.js';
 import Table from './Table.js';
 import FilterContainer from './FilterContainer.js';
 import PageSizeContainer from './PageSizeContainer.js';
+import PaginationContainer from './PaginationContainer.js';
 import makeSelectors from './selectors.js';
 import reducer from './reducer.js';
 import { tableDestroyState, tableSetFilter } from './actions.js';
@@ -18,6 +19,7 @@ export {
   TableRow,
   FilterContainer,
   PageSizeContainer,
+  PaginationContainer,
   makeSelectors,
   tableDestroyState,
   tableSetFilter,