From ed7a3dc6850c438ccca7ba533f1dd840b9807881 Mon Sep 17 00:00:00 2001
From: Alexey Kasyanchuk <degitx@gmail.com>
Date: Mon, 2 Jan 2017 15:40:37 +0300
Subject: [PATCH] =?UTF-8?q?=D0=B8=D0=BD=D0=B4=D0=B8=D0=BA=D0=B0=D1=82?=
 =?UTF-8?q?=D0=BE=D1=80=20=D0=BF=D0=BE=D0=B8=D1=81=D0=BA=D0=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/search.js | 37 ++++++++++++++++++++++++++++++++++++-
 1 file changed, 36 insertions(+), 1 deletion(-)

diff --git a/src/search.js b/src/search.js
index 23c4de4..e88bfdf 100644
--- a/src/search.js
+++ b/src/search.js
@@ -3,12 +3,24 @@ import React, { Component } from 'react';
 import SearchResults from './search-results'
 import TextField from 'material-ui/TextField';
 import RaisedButton from 'material-ui/RaisedButton';
+import RefreshIndicator from 'material-ui/RefreshIndicator';
 
 export default class Search extends Component {
+  constructor(props)
+  {
+    super(props)
+    this.state = { searchingIndicator: false }
+  }
+
   search() {
+    this.setState({
+      searchingIndicator: true
+    });
     window.torrentSocket.emit('search', this.searchValue, (torrents) => {
       this.searchData = torrents;
-      this.forceUpdate();
+      this.setState({
+        searchingIndicator: false
+      });
     });
   }
   componentDidMount() {
@@ -18,6 +30,13 @@ export default class Search extends Component {
     });
   }
   render() {
+    const style = {
+      refresh: {
+        display: 'inline-block',
+        position: 'relative',
+      },
+    };
+
     return (
       <div className="column w100p center">
         <div className='row inline w100p pad0-75' style={{maxWidth: '30em'}}>
@@ -44,6 +63,22 @@ export default class Search extends Component {
             :
             null
         }
+        {
+          this.state.searchingIndicator
+          ?
+          <div className='pad1'>
+            <RefreshIndicator
+              size={50}
+              left={0}
+              top={0}
+              loadingColor="#FF9800"
+              status="loading"
+              style={style.refresh}
+            />
+          </div>
+          :
+          null
+        }
         <SearchResults results={this.searchData} />
       </div>
     );