diff --git a/src/ui/page/fileListPublished/index.js b/src/ui/page/fileListPublished/index.js
index 0be607a99..36e016635 100644
--- a/src/ui/page/fileListPublished/index.js
+++ b/src/ui/page/fileListPublished/index.js
@@ -1,18 +1,28 @@
import { connect } from 'react-redux';
-import { selectIsFetchingClaimListMine, selectMyClaimUrisWithoutChannels } from 'lbry-redux';
+import { selectIsFetchingClaimListMine, makeSelectMyStreamUrisForPage, selectMyStreamUrisCount } from 'lbry-redux';
import { doCheckPendingPublishesApp } from 'redux/actions/publish';
import FileListPublished from './view';
+import { withRouter } from 'react-router';
-const select = state => ({
- uris: selectMyClaimUrisWithoutChannels(state),
- fetching: selectIsFetchingClaimListMine(state),
-});
+const select = (state, props) => {
+ const { search } = props.location;
+ const urlParams = new URLSearchParams(search);
+ const page = Number(urlParams.get('page')) || 0;
+ return {
+ page,
+ uris: makeSelectMyStreamUrisForPage(page)(state),
+ uriTotal: selectMyStreamUrisCount(state),
+ fetching: selectIsFetchingClaimListMine(state),
+ };
+};
const perform = dispatch => ({
checkPendingPublishes: () => dispatch(doCheckPendingPublishesApp()),
});
-export default connect(
- select,
- perform
-)(FileListPublished);
+export default withRouter(
+ connect(
+ select,
+ perform
+ )(FileListPublished)
+);
diff --git a/src/ui/page/fileListPublished/view.jsx b/src/ui/page/fileListPublished/view.jsx
index 13f56adc8..dcb54c5c4 100644
--- a/src/ui/page/fileListPublished/view.jsx
+++ b/src/ui/page/fileListPublished/view.jsx
@@ -3,16 +3,20 @@ import React, { useEffect } from 'react';
import Button from 'component/button';
import ClaimList from 'component/claimList';
import Page from 'component/page';
+import Paginate from 'component/common/paginate';
+import { PAGE_SIZE } from 'constants/claim';
type Props = {
- uris: Array
,
checkPendingPublishes: () => void,
fetching: boolean,
+ uris: Array,
+ uriTotal: ?number,
+ history: { replace: string => void },
+ page: number,
};
function FileListPublished(props: Props) {
- const { checkPendingPublishes, fetching, uris } = props;
-
+ const { checkPendingPublishes, fetching, uris, uriTotal, history, page } = props;
useEffect(() => {
checkPendingPublishes();
}, [checkPendingPublishes]);
@@ -29,12 +33,20 @@ function FileListPublished(props: Props) {
defaultSort
headerAltControls={ }
/>
+ {
+ if (page !== p) {
+ history.replace(`#/$/published?page=${p + 1}`);
+ }
+ }}
+ totalPages={Math.floor(Number(uriTotal) / Number(PAGE_SIZE))}
+ loading={fetching}
+ />
) : (