From eba0ac6842aea3fd8ee3e57dea67306a40312b3e Mon Sep 17 00:00:00 2001
From: Alex Liebowitz <alex@alexliebowitz.com>
Date: Mon, 30 Jan 2017 02:26:30 -0500
Subject: [PATCH 1/2] Indicate files pending confirmation in FileTile

---
 js/component/file-tile.js | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/js/component/file-tile.js b/js/component/file-tile.js
index 171fc9f5c..400be231e 100644
--- a/js/component/file-tile.js
+++ b/js/component/file-tile.js
@@ -113,20 +113,21 @@ export let FileTileStream = React.createClass({
       return null;
     }
 
-    const metadata = this.props.metadata || {},
-          obscureNsfw = this.props.obscureNsfw && metadata.nsfw,
-          title = metadata.title ? metadata.title : ('lbry://' + this.props.name);
+    const metadata = this.props.metadata;
+    const isConfirmed = typeof metadata == 'object';
+    const title = isConfirmed ? metadata.title : this.props.name;
+    const obscureNsfw = this.props.obscureNsfw && isConfirmed && metadata.nsfw;
     return (
       <section className={ 'file-tile card ' + (obscureNsfw ? 'card-obscured ' : '') } onMouseEnter={this.handleMouseOver} onMouseLeave={this.handleMouseOut}>
         <div className={"row-fluid card-content file-tile__row"}>
           <div className="span3">
-            <a href={'/?show=' + this.props.name}><Thumbnail className="file-tile__thumbnail" src={metadata.thumbnail} alt={'Photo for ' + (title || this.props.name)} /></a>
+            <a href={'/?show=' + this.props.name}><Thumbnail className="file-tile__thumbnail" src={metadata.thumbnail} alt={`Photo for ${title}`} /></a>
           </div>
           <div className="span9">
             { !this.props.hidePrice
               ? <FilePrice name={this.props.name} />
               : null}
-            <div className="meta"><a href={'/?show=' + this.props.name}>lbry://{this.props.name}</a></div>
+            <div className="meta"><a href={'/?show=' + this.props.name}>{isConfirmed ? metadata.title : ('lbry://' + this.props.name)}</a></div>
             <h3 className="file-tile__title">
               <a href={'/?show=' + this.props.name}>
                 <TruncatedText lines={1}>
@@ -137,7 +138,9 @@ export let FileTileStream = React.createClass({
             <FileActions streamName={this.props.name} sdHash={this.props.sdHash} metadata={metadata} />
             <p className="file-tile__description">
               <TruncatedText lines={3}>
-                {metadata.description}
+                {isConfirmed
+                   ? metadata.description
+                   : <span className="empty">This file is pending confirmation.</span>}
               </TruncatedText>
             </p>
           </div>

From 042c0936666e8e87082935b120169fd56302100d Mon Sep 17 00:00:00 2001
From: Alex Liebowitz <alex@alexliebowitz.com>
Date: Mon, 30 Jan 2017 03:21:43 -0500
Subject: [PATCH 2/2] Don't show "file not available" message if user has the
 file

---
 js/component/file-actions.js | 36 ++++++++++++++++++++++++------------
 1 file changed, 24 insertions(+), 12 deletions(-)

diff --git a/js/component/file-actions.js b/js/component/file-actions.js
index 7dba036e0..cc1dba546 100644
--- a/js/component/file-actions.js
+++ b/js/component/file-actions.js
@@ -232,6 +232,7 @@ export let FileActions = React.createClass({
     return {
       available: true,
       forceShowActions: false,
+      fileInfo: null,
     }
   },
   onShowFileActionsRowClicked: function() {
@@ -239,8 +240,14 @@ export let FileActions = React.createClass({
       forceShowActions: true,
     });
   },
+  onFileInfoUpdate: function(fileInfo) {
+    this.setState({
+      fileInfo: fileInfo,
+    });
+  },
   componentDidMount: function() {
     this._isMounted = true;
+    this._fileInfoSubscribeId = lbry.fileInfoSubscribe(this.props.sdHash, this.onFileInfoUpdate);
     lbry.getPeersForBlobHash(this.props.sdHash, (peers) => {
       if (!this._isMounted) {
         return;
@@ -255,20 +262,25 @@ export let FileActions = React.createClass({
     this._isMounted = false;
   },
   render: function() {
+    const fileInfo = this.state.fileInfo;
+    if (fileInfo === null) {
+      return null;
+    }
+
     return (<section className="file-actions">
       {
-        this.state.available || this.state.forceShowActions ?
-         <FileActionsRow sdHash={this.props.sdHash} metadata={this.props.metadata} streamName={this.props.streamName} /> :
-         (<div>
-           <div className="button-container empty">This file is not currently available.</div>
-           <div className="button-container">
-             <ToolTip label="Why?"
-                      body="The content on LBRY is hosted by its users. It appears there are no users connected that have this file at the moment." />
-           </div>
-           <div className="button-container">
-             <Link label="Try Anyway" onClick={this.onShowFileActionsRowClicked} />
-           </div>
-         </div>)
+        fileInfo || this.state.available || this.state.forceShowActions
+          ? <FileActionsRow sdHash={this.props.sdHash} metadata={this.props.metadata} streamName={this.props.streamName} />
+          : <div>
+              <div className="button-container empty">This file is not currently available.</div>
+              <div className="button-container">
+                <ToolTip label="Why?"
+                         body="The content on LBRY is hosted by its users. It appears there are no users connected that have this file at the moment." />
+              </div>
+              <div className="button-container">
+                <Link label="Try Anyway" onClick={this.onShowFileActionsRowClicked} />
+              </div>
+            </div>
       }
     </section>);
   }