src/renderer/page/fileListDownloaded/index.js

@@ -1,10 +1,15 @@
 import { connect } from 'react-redux';
-import { selectFileInfosDownloaded, selectMyClaimsWithoutChannels } from 'lbry-redux';
+import {
+  selectFileInfosDownloaded,
+  selectMyClaimsWithoutChannels,
+  selectIsFetchingFileList,
+} from 'lbry-redux';
 import { doNavigate } from 'redux/actions/navigation';
 import FileListDownloaded from './view';
 
 const select = state => ({
   fileInfos: selectFileInfosDownloaded(state),
+  fetching: selectIsFetchingFileList(state),
   claims: selectMyClaimsWithoutChannels(state),
 });
 
@@ -12,4 +17,7 @@ const perform = dispatch => ({
   navigate: path => dispatch(doNavigate(path)),
 });
 
-export default connect(select, perform)(FileListDownloaded);
+export default connect(
+  select,
+  perform
+)(FileListDownloaded);

src/renderer/page/fileListDownloaded/view.jsx

@@ -1,16 +1,25 @@
+// @flow
 import React from 'react';
 import Button from 'component/button';
 import FileList from 'component/fileList';
 import Page from 'component/page';
 
-class FileListDownloaded extends React.PureComponent {
+type Props = {
+  fetching: boolean,
+  fileInfos: {},
+  navigate: (string, ?{}) => void,
+};
+
+class FileListDownloaded extends React.PureComponent<Props> {
   render() {
-    const { fileInfos, navigate } = this.props;
+    const { fetching, fileInfos, navigate } = this.props;
     const hasDownloads = fileInfos && fileInfos.length > 0;
 
     return (
       <Page notContained>
-        {hasDownloads ? (
+        {fetching ? (
+          <div className="card__actions card__actions--center">Fetching content...</div>
+        ) : hasDownloads ? (
           <FileList fileInfos={fileInfos} />
         ) : (
           <div className="page__empty">

src/renderer/page/fileListPublished/index.js

@@ -1,11 +1,13 @@
 import { connect } from 'react-redux';
 import { selectPendingPublishes, selectClaimsWithPendingPublishes } from 'redux/selectors/publish';
+import { selectIsFetchingClaimListMine } from 'lbry-redux';
 import { doNavigate } from 'redux/actions/navigation';
 import { doCheckPendingPublishes } from 'redux/actions/publish';
 import FileListPublished from './view';
 
 const select = state => ({
   claims: selectClaimsWithPendingPublishes(state),
+  fetching: selectIsFetchingClaimListMine(state),
   pendingPublishes: selectPendingPublishes(state),
 });
 

src/renderer/page/fileListPublished/view.jsx

@@ -9,6 +9,7 @@ type Props = {
   claims: Array<{}>,
   checkIfPublishesConfirmed: (Array<{}>) => void,
   navigate: (string, ?{}) => void,
+  fetching: boolean,
 };
 
 class FileListPublished extends React.PureComponent<Props> {
@@ -20,11 +21,13 @@ class FileListPublished extends React.PureComponent<Props> {
   }
 
   render() {
-    const { claims, navigate } = this.props;
+    const { fetching, claims, navigate } = this.props;
 
     return (
       <Page notContained>
-        {claims.length ? (
+        {fetching ? (
+          <div className="card__actions card__actions--center">Fetching content...</div>
+        ) : claims.length ? (
           <FileList checkPending fileInfos={claims} sortByHeight />
         ) : (
           <div className="page__empty">