Refactor My Files page

- Checking for file ownership is now done by making one call to
   lbry.getMyClaims() and saving a list of txids.
 - Broke out logic for Published and Downloaded pages
 - Published page now looks up the user's claims instead of files.
   This allows published streams to be listed even if the files don't
   exist on the user's machine; also, because it looks up file info by
   txid, you will no longer see a newer claim listed if you made a
   claim and it was overtaken.

js/page/my_files.js

@@ -168,12 +168,11 @@ var MyFilesPage = React.createClass({
   _fileTimeout: null,
   _fileInfoCheckRate: 300,
   _fileInfoCheckNum: 0,
-  _filesOwnership: {},
 
   getInitialState: function() {
     return {
       filesInfo: null,
-      filesOwnershipLoaded: false,
+      publishedFilesSdHashes: null,
       filesAvailable: {},
     };
   },
@@ -186,8 +185,30 @@ var MyFilesPage = React.createClass({
     document.title = "My Files";
   },
   componentWillMount: function() {
-    this.getFilesOwnership();
+    if (this.props.show == 'downloaded') {
+      this.getPublishedFilesSdHashes(() => {
         this.updateFilesInfo();
+      });
+    } else {
+      this.updateFilesInfo();
+    }
+  },
+  getPublishedFilesSdHashes: function(callback) {
+    // Determines which files were published by the user and saves their SD hashes in
+    // this.state.publishedFilesSdHashes. Used on the Downloads page to filter out claims published
+    // by the user.
+    var publishedFilesSdHashes = [];
+    lbry.getMyClaims((claimsInfo) => {
+      for (let claimInfo of claimsInfo) {
+        let metadata = JSON.parse(claimInfo.value);
+        publishedFilesSdHashes.push(metadata.sources.lbry_sd_hash);
+      }
+
+      this.setState({
+        publishedFilesSdHashes: publishedFilesSdHashes,
+      });
+      callback();
+    });
   },
   componentWillUnmount: function() {
     if (this._fileTimeout)
@@ -195,43 +216,40 @@ var MyFilesPage = React.createClass({
       clearTimeout(this._fileTimeout);
     }
   },
-  getFilesOwnership: function() {
-    lbry.getFilesInfo((filesInfo) => {
-      if (!filesInfo) {
-        this.setState({
-          filesOwnershipLoaded: true,
-        });
-        return;
-      }
-
-      var ownershipLoadedCount = 0;
-      for (let i = 0; i < filesInfo.length; i++) {
-        let fileInfo = filesInfo[i];
-        lbry.call('get_my_claim', {name: fileInfo.lbry_uri}, (claim) => {
-          this._filesOwnership[fileInfo.lbry_uri] = !!claim;
-          ownershipLoadedCount++;
-          if (ownershipLoadedCount >= filesInfo.length) {
-            this.setState({
-              filesOwnershipLoaded: true,
-            });
-          }
-        }, (claim) => {
-          this._filesOwnership[fileInfo.lbry_uri] = true;
-          ownershipLoadedCount++;
-          if (ownershipLoadedCount >= filesInfo.length) {
-            this.setState({
-              filesOwnershipLoaded: true,
-            });
-          }
-        });
-      }
-    });
-  },
   updateFilesInfo: function() {
-    lbry.getFilesInfo((filesInfo) => {
+    this._fileInfoCheckNum += 1;
-      if (!filesInfo) {
+
-        filesInfo = [];
+    if (this.props.show == 'published') {
+      // We're in the Published tab, so populate this.state.filesInfo with data from the user's claims
+      lbry.getMyClaims((claimsInfo) => {
+        let newFilesInfo = [];
+        let claimInfoProcessedCount = 0;
+        for (let claimInfo of claimsInfo) {
+          let metadata = JSON.parse(claimInfo.value);
+          lbry.getFileInfoBySdHash(metadata.sources.lbry_sd_hash, (fileInfo) => {
+            claimInfoProcessedCount++;
+            if (fileInfo !== false) {
+              newFilesInfo.push(fileInfo);
             }
+            if (claimInfoProcessedCount >= claimsInfo.length) {
+              this.setState({
+                filesInfo: newFilesInfo
+              });
+
+              this._fileTimeout = setTimeout(() => { this.updateFilesInfo() }, 1000);
+            }
+          });
+        }
+      });
+    } else {
+      // We're in the Downloaded tab, so populate this.state.filesInfo with files the user has in
+      // lbrynet, with published files filtered out.
+      lbry.getFilesInfo((filesInfo) => {
+        this.setState({
+          filesInfo: filesInfo.filter(({sd_hash}) => {
+            return this.state.publishedFilesSdHashes.indexOf(sd_hash) == -1;
+          }),
+        });
 
         let newFilesAvailable;
         if (!(this._fileInfoCheckNum % this._fileInfoCheckRate)) {
@@ -239,10 +257,10 @@ var MyFilesPage = React.createClass({
 
           newFilesAvailable = {};
           let filePeersCheckCount = 0;
-        for (let fileInfo of filesInfo) {
+          for (let {sd_hash} of filesInfo) {
-          lbry.getPeersForBlobHash(fileInfo.sd_hash, (peers) => {
+            lbry.getPeersForBlobHash(sd_hash, (peers) => {
               filePeersCheckCount++;
-            newFilesAvailable[fileInfo.sd_hash] = peers.length >= 0;
+              newFilesAvailable[sd_hash] = peers.length >= 0;
               if (filePeersCheckCount >= filesInfo.length) {
                 this.setState({
                   filesAvailable: newFilesAvailable,
@@ -252,17 +270,12 @@ var MyFilesPage = React.createClass({
           }
         }
 
-      this._fileInfoCheckNum += 1;
-
-      this.setState({
-        filesInfo: filesInfo,
-      });
-
         this._fileTimeout = setTimeout(() => { this.updateFilesInfo() }, 1000);
-    });
+      })
+    }
   },
   render: function() {
-    if (this.state.filesInfo === null || !this.state.filesOwnershipLoaded) {
+    if (this.state.filesInfo === null || (this.props.show == 'downloaded' && this.state.publishedFileSdHashes === null)) {
       return (
         <main className="page">
           <BusyMessage message="Loading" />
@@ -284,10 +297,7 @@ var MyFilesPage = React.createClass({
         let {completed, written_bytes, total_bytes, lbry_uri, file_name, download_path,
           stopped, metadata, sd_hash} = fileInfo;
 
-        var isMine = this._filesOwnership[lbry_uri];
+        if (!metadata || seenUris[lbry_uri]) {
-
-        if (!metadata || seenUris[lbry_uri] || (this.props.show == 'downloaded' && isMine) ||
-            (this.props.show == 'published' && !isMine)) {
           continue;
         }
 
@@ -312,7 +322,7 @@ var MyFilesPage = React.createClass({
         content.push(<MyFilesRow key={lbry_uri} lbryUri={lbry_uri} title={title || ('lbry://' + lbry_uri)} completed={completed} stopped={stopped}
                                  ratioLoaded={ratioLoaded} imgUrl={thumbnail} path={download_path}
                                  showWatchButton={showWatchButton} pending={pending}
-                                 available={this.state.filesAvailable[sd_hash]} isMine={isMine} />);
+                                 available={this.state.filesAvailable[sd_hash]} isMine={this.props.show == 'published'} />);
       }
     }
     return (