Add loading status when deleting instances

webapp/frontend/app/controllers/lambda-instance.js

@@ -69,6 +69,7 @@ export default Ember.Controller.extend({
           success: function(){
             _this.set('success_delete', true);
             _this.set('delete_success_message', 'Your request to delete the lambda instance was successfully sent to the server.');
+            _this.get('model.instance').set('deleting', true);
             Ember.run.later((function () {
               _this.set('success_delete', false);
               _this.transitionToRoute('dashboard');

webapp/frontend/app/controllers/lambda-instances/index.js

@@ -65,6 +65,7 @@ export default Ember.ArrayController.extend({
           success: function(){
             _this.set('success_delete', true);
             _this.set('delete_success_message', 'Your request to delete the lambda instance was successfully sent to the server.');
+            _this.get('model').findBy('id', instance_id).set('deleting', true);
             Ember.run.later((function () {
               _this.set('success_delete', false);
             }), ENV.message_dismiss);

webapp/frontend/app/models/lambda-instance.js

@@ -22,7 +22,8 @@ var LambdaInstance = DS.Model.extend({
   started_app: DS.attr('boolean'),          // is specific app started?
   running_app: DS.attr('boolean'),          // is any app running on the lambda instance?
   kafka_input_topics: DS.attr(),            // kafka input topics of lambda instance
-  kafka_output_topics: DS.attr()            // kafka output topics of lambda instance
+  kafka_output_topics: DS.attr(),           // kafka output topics of lambda instance
+  deleting: DS.attr('boolean')              // has a delete request been sent?
 });
 
 export default LambdaInstance;

webapp/frontend/app/templates/lambda-instance.hbs

@@ -57,22 +57,28 @@
               actions you may take depending on the <i>status</i> of the lambda instance.
               </div>
 
-              {{#if (logical-op 'and'
-                (compare (lambda-instance-state model.instance.status_message) "!==" "DESTROYING")
-                (compare (lambda-instance-state model.instance.status_message) "!==" "DESTROYED")
-              )}}
-                <button name="del-btn" id="del-btn" class="btn btn-danger btn-primary pull-right"
-                  {{action "delete_instance" model.instance.id}}>
-                    <i class="fa fa-times"></i> Delete
-                </button>
-              {{else}}
+              {{#if (logical-op 'or'
+                (compare (lambda-instance-state model.instance.status_message) "===" "DESTROYING")
+                model.instance.deleting)
+              }}
                 {{#tool-tip}}
-                <button name="del-btn" id="del-btn" class="btn btn-danger btn-primary pull-right disabled has-tooltip"
-                        data-tooltip-content="<center>Cannot delete a lambda instance, while its
-                        status is {{lower-case model.instance.status_message}}!</center>">
-                    <i class="fa fa-times"></i> Delete
-                </button>
+                    <button name="del-btn" id="del-btn" class="btn btn-danger btn-primary pull-right disabled has-tooltip"
+                            data-tooltip-content="<center>The lambda instance is being destroyed!</center>">
+                        <i class="fa fa-times"></i> Deleting <i class="fa fa-spinner fa-spin"></i>
+                    </button>
                 {{/tool-tip}}
+              {{else if (compare (lambda-instance-state model.instance.status_message) "===" "DESTROYED")}}
+                {{#tool-tip}}
+                    <button name="del-btn" id="del-btn" class="btn btn-danger btn-primary pull-right disabled has-tooltip"
+                            data-tooltip-content="<center>The lambda instance is destroyed!</center>">
+                        <i class="fa fa-times"></i> Delete
+                    </button>
+                {{/tool-tip}}
+              {{else}}
+                  <button name="del-btn" id="del-btn" class="btn btn-danger btn-primary pull-right"
+                    {{action "delete_instance" model.instance.id}}>
+                      <i class="fa fa-times"></i> Delete
+                  </button>
               {{/if}}
                 {{#if (compare model.instance.status_code '==' '0')}}
                 {{#link-to 'deploy-app-2' model.instance.id}}

webapp/frontend/app/templates/lambda-instances/index.hbs

@@ -196,19 +196,21 @@
                       </td>
                     {{/if}}
                     <td>
-                      {{#if (compare (lambda-instance-state lambda-instance.status_message) "!==" "DESTROYING")}}
-                          <button name="del-btn" id="del-btn" class="btn btn-danger btn-xs"
-                                  {{action "delete_instance" lambda-instance.id}}>
-                              <i class="fa fa-times"></i> Delete
-                          </button>
-                    {{else}}
-                      {{#tool-tip}}
+                      {{#if (logical-op 'or'
+                        (compare (lambda-instance-state lambda-instance.status_message) "===" "DESTROYING")
+                        lambda-instance.deleting)
+                      }}
+                        {{#tool-tip}}
                           <button name="del-btn" id="del-btn" class="btn btn-danger btn-xs disabled has-tooltip"
-                                  data-tooltip-content="<center>Cannot delete a lambda instance, while its
-                                  status is {{lower-case lambda-instance.status_message}}!</center>">
-                              <i class="fa fa-times"></i> Delete
+                                  data-tooltip-content="<center>The lambda instance is being destroyed!</center>">
+                              <i class="fa fa-times"></i> Deleting <i class="fa fa-spinner fa-spin"></i>
                           </button>
-                      {{/tool-tip}}
+                        {{/tool-tip}}
+                      {{else}}
+                        <button name="del-btn" id="del-btn" class="btn btn-danger btn-xs"
+                          {{action "delete_instance" lambda-instance.id}}>
+                            <i class="fa fa-times"></i> Delete
+                        </button>
                     {{/if}}
                     </td>
                 </td>