Remove files from UI immediately (don't wait for daemon to confirm)

js/component/file-tile.js

@@ -17,6 +17,7 @@ let FileTile = React.createClass({
     local: React.PropTypes.bool,
     cost: React.PropTypes.number,
     costIncludesData: React.PropTypes.bool,
+    hideOnRemove: React.PropTypes.bool,
   },
   updateFileInfo: function(progress=null) {
     const updateFileInfoCallback = ((fileInfo) => {
@@ -73,6 +74,7 @@ let FileTile = React.createClass({
   getInitialState: function() {
     return {
       downloading: false,
+      removeConfirmed: false,
       isHovered: false,
       cost: null,
       costIncludesData: null,
@@ -84,6 +86,7 @@ let FileTile = React.createClass({
   getDefaultProps: function() {
     return {
       compact: false,
+      hideOnRemove: false,
     }
   },
   handleMouseOver: function() {
@@ -96,6 +99,11 @@ let FileTile = React.createClass({
       isHovered: false,
     });
   },
+  handleRemoveConfirmed: function() {
+    this.setState({
+      removeConfirmed: true,
+    });
+  },
   componentWillMount: function() {
     this.updateFileInfo();
 
@@ -120,8 +128,9 @@ let FileTile = React.createClass({
     this._isMounted = false;
   },
   render: function() {
-    if (this.state.isMine === null || this.state.local === null) {
+    // Can't render until we know whether we own the file and if we have a local copy
-      // Can't render until we know whether we own the file and if we have a local copy
+    if (this.state.isMine === null || this.state.local === null ||
+        (this.props.hideOnRemove && this.state.removeConfirmed)) {
       return null;
     }
 
@@ -163,7 +172,8 @@ let FileTile = React.createClass({
             <div>
               {this.props.metadata.content_type.startsWith('video/') ? <WatchLink streamName={this.props.name} button="primary" /> : null}
               {!this.props.isMine
-                ? <DownloadLink streamName={this.props.name} metadata={this.props.metadata} button="text" {... downloadLinkExtraProps}/>
+                ? <DownloadLink streamName={this.props.name} metadata={this.props.metadata} button="text"
+                                onRemoveConfirmed={this.handleRemoveConfirmed} {... downloadLinkExtraProps}/>
                 : null}
              </div>
             <p className="file-tile__description">

js/component/link.js

@@ -167,6 +167,7 @@ export let DownloadLink = React.createClass({
     path: React.PropTypes.string,
     hidden: React.PropTypes.bool,
     deleteChecked: React.PropTypes.bool,
+    onRemoveConfirmed: React.PropTypes.func,
   },
   tryDownload: function() {
     this.setState({
@@ -217,13 +218,18 @@ export let DownloadLink = React.createClass({
   },
   handleRemoveConfirmed: function() {
     lbry.deleteFile(this.props.sdHash || this.props.streamName, this.state.deleteChecked);
+    if (this.props.onRemoveConfirmed) {
+      this.props.onRemoveConfirmed();
+    }
     this.setState({
       modal: null,
+      attemptingRemove: true,
     });
   },
   getDefaultProps: function() {
     return {
       state: 'not-started',
+      hideOnDelete: false,
     }
   },
   getInitialState: function() {
@@ -233,6 +239,7 @@ export let DownloadLink = React.createClass({
       menuOpen: false,
       deleteChecked: false,
       attemptingDownload: false,
+      attemptingRemove: false,
     }
   },
   closeModal: function() {
@@ -256,7 +263,9 @@ export let DownloadLink = React.createClass({
     ];
 
     let linkBlock;
-    if (this.state.attemptingDownload) {
+    if (this.state.attemptingRemove || this.props.state == 'not-started') {
+        linkBlock = <Link button="text" label="Download" icon="icon-download" onClick={this.handleClick} />;
+    } else if (this.state.attemptingDownload) {
       linkBlock = <Link button="text" className="button-download button-download--bg"
                         label="Connecting..." icon="icon-download" />
     } else if (this.props.state == 'downloading') {
@@ -273,10 +282,6 @@ export let DownloadLink = React.createClass({
           </DropDown>
         </span>
       );
-    } else if (this.props.state == 'not-started') {
-      linkBlock = (
-        <Link button="text" label="Download" icon="icon-download" onClick={this.handleClick} />
-      );
     } else if (this.props.state == 'done') {
       linkBlock = (
         <DropDown button="alt" label="Open" onClick={this.handleClick} onCaretClick={this.openMenu}>

js/page/my_files.js

@@ -178,7 +178,7 @@ var MyFilesPage = React.createClass({
 
         seenUris[lbry_uri] = true;
 
-        content.push(<FileTile name={lbry_uri} sdHash={sd_hash} isMine={this.props.show == 'published'} local={true}
+        content.push(<FileTile name={lbry_uri} sdHash={sd_hash} isMine={this.props.show == 'published'} local={true} hideOnRemove={true}
                                metadata={metadata} completed={completed} stopped={stopped} pending={pending} path={download_path}
                                {... this.state.filesAvailable !== null ? {available: this.state.filesAvailable[sd_hash]} : {}} />);
       }