From c1a442223bf81e60d76fdd4911c4b113041edd7c Mon Sep 17 00:00:00 2001
From: Jeffrey Morgan <jmorganca@gmail.com>
Date: Fri, 6 Feb 2015 12:14:38 -0500
Subject: [PATCH] add loading after button press

---
 src/NewContainer.react.js | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/NewContainer.react.js b/src/NewContainer.react.js
index 5855140cc7..3191ebafe9 100644
--- a/src/NewContainer.react.js
+++ b/src/NewContainer.react.js
@@ -1,3 +1,4 @@
+var _ = require('underscore');
 var $ = require('jquery');
 var React = require('react/addons');
 var RetinaImage = require('react-retina-image');
@@ -14,9 +15,13 @@ var NewContainer = React.createClass({
       loading: false,
       tags: {},
       active: null,
+      creating: []
     };
   },
   componentDidMount: function () {
+    this.setState({
+      creating: []
+    });
     this.refs.searchInput.getDOMNode().focus();
     ContainerStore.on(ContainerStore.CLIENT_RECOMMENDED_EVENT, this.update);
   },
@@ -126,6 +131,12 @@ var NewContainer = React.createClass({
         } else {
           imgsrc = 'https://kitematic.com/recommended/kitematic_html.png';
         }
+        var action;
+        if (_.find(self.state.creating, r.name)) {
+          action = <RetinaImage src="loading.png"/>;
+        } else {
+          action = <a className="btn btn-action" onClick={self.handleClick.bind(self, r.name)}>Create</a>;
+        }
         return (
           <div key={r.name} className="image-item">
             <div className="logo" style={logoStyle}>
@@ -148,7 +159,7 @@ var NewContainer = React.createClass({
                   <span className="text">latest</span>
                 </div>
                 <div className="action">
-                  <a className="btn btn-action" onClick={self.handleClick.bind(self, r.name)}>Create</a>
+                  {action}
                 </div>
               </div>
             </div>