From 807e9471461cdc3e65be56c84a25a94812e0aec0 Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Tue, 6 Oct 2015 14:12:45 +0100
Subject: [PATCH] Add spinner for inviting. Fixes #13.

---
 .../vector/views/organisms/MemberList.js      | 21 ++++++++++++-------
 1 file changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/skins/vector/views/organisms/MemberList.js b/src/skins/vector/views/organisms/MemberList.js
index 1cf0bf27..b525c6be 100644
--- a/src/skins/vector/views/organisms/MemberList.js
+++ b/src/skins/vector/views/organisms/MemberList.js
@@ -18,6 +18,7 @@ limitations under the License.
 
 var React = require('react');
 var classNames = require('classnames');
+var Loader = require('react-loader');
 
 var MemberListController = require('matrix-react-sdk/lib/controllers/organisms/MemberList')
 
@@ -69,14 +70,20 @@ module.exports = React.createClass({
         });
 
         var EditableText = sdk.getComponent("atoms.EditableText");
-        return (
-            <div className={ classes } onClick={ this.onClickInvite } >
-                <div className="mx_MemberTile_avatar"><img src="img/create-big.png" width="40" height="40" alt=""/></div>            
-                <div className="mx_MemberTile_name">
-                    <EditableText ref="invite" label="Invite" placeHolder="@user:domain.com" initialValue="" onValueChanged={this.onPopulateInvite}/>
+        if (this.state.inviting) {
+            return (
+                <Loader />
+            );
+        } else {
+            return (
+                <div className={ classes } onClick={ this.onClickInvite } >
+                    <div className="mx_MemberTile_avatar"><img src="img/create-big.png" width="40" height="40" alt=""/></div>
+                    <div className="mx_MemberTile_name">
+                        <EditableText ref="invite" label="Invite" placeHolder="@user:domain.com" initialValue="" onValueChanged={this.onPopulateInvite}/>
+                    </div>
                 </div>
-            </div>
-        );
+            );
+        }
     },
 
     render: function() {