From f9a1bd99c0a62896fec0ba9dc35f03882cbd870e Mon Sep 17 00:00:00 2001
From: Jeremy Kauffman <kauffj@gmail.com>
Date: Sun, 21 Aug 2016 10:55:32 -0400
Subject: [PATCH] component for busy indicator, use in my_files

---
 js/component/common.js | 9 +++++++++
 js/component/splash.js | 3 +--
 js/page/discover.js    | 3 +--
 js/page/my_files.js    | 2 +-
 4 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/js/component/common.js b/js/component/common.js
index f767e8a1b..9a5fd57e4 100644
--- a/js/component/common.js
+++ b/js/component/common.js
@@ -27,6 +27,15 @@ var TruncatedText = React.createClass({
   }
 });
 
+var BusyMessage = React.createClass({
+  propTypes: {
+    message: React.PropTypes.string
+  },
+  render: function() {
+    return <span>{this.props.message} <span className="busy-indicator"></span></span>
+  }
+});
+
 var toolTipStyle = {
   position: 'absolute',
   zIndex: '1',
diff --git a/js/component/splash.js b/js/component/splash.js
index e07478971..c6aaf87df 100644
--- a/js/component/splash.js
+++ b/js/component/splash.js
@@ -52,8 +52,7 @@ var SplashScreen = React.createClass({
         <img src={imgSrc} alt="LBRY"/>
         <div style={splashMessageStyle}>
           <h3>
-            {this.props.message}
-            <span className="busy-indicator"></span>
+            <BusyMessage message={this.props.message} />
           </h3>
           <Icon icon='icon-warning' style={this.state.isLagging ? {} : { display: 'none' }}/> <span style={ this.state.isLagging ? {} : {'color': '#c3c3c3'} }>{this.state.details}</span>
         </div>
diff --git a/js/page/discover.js b/js/page/discover.js
index ce3a8657c..c76b92827 100644
--- a/js/page/discover.js
+++ b/js/page/discover.js
@@ -8,8 +8,7 @@ var SearchActive = React.createClass({
   render: function() {
     return (
       <div style={fetchResultsStyle}>
-        Looking up the Dewey Decimals
-        <span className="busy-indicator"></span>
+        <BusyMessage message="Looking up the Dewey Decimals" />
       </div>
     );
   }
diff --git a/js/page/my_files.js b/js/page/my_files.js
index fb207f9ac..14cef41d8 100644
--- a/js/page/my_files.js
+++ b/js/page/my_files.js
@@ -160,7 +160,7 @@ var MyFilesPage = React.createClass({
     if (this.state.filesInfo === null) {
       return (
         <main className="page">
-          <span>Loading...</span>
+          <BusyMessage message="Loading" />
         </main>
       );
     }