Allow users to edit a bot's full name.

(imported from commit fba8ea888d7b76b1ad5c44393ffd8f420f9fe464)

zephyr/static/js/settings.js

@@ -195,6 +195,79 @@ $(function () {
             }
         });
     });
+
+
+    $("#bots_list").on("click", "button.open_edit_bot_form", function (e) {
+        var li = $(e.target).closest('li');
+        var edit_div = li.find('div.edit_bot');
+        var form = li.find('.edit_bot_form');
+        var image = li.find(".image");
+        var bot_info = li.find(".bot_info");
+        var reset_edit_bot = li.find(".reset_edit_bot");
+
+        var old_full_name = bot_info.find(".name").text();
+        form.find(".edit_bot_name").attr('value', old_full_name);
+
+        image.hide();
+        bot_info.hide();
+        edit_div.show();
+
+        function show_row_again() {
+            image.show();
+            bot_info.show();
+            edit_div.hide();
+        }
+
+        reset_edit_bot.click(function (event) {
+            show_row_again();
+            $(this).off(event);
+        });
+
+        var errors = form.find('.bot_edit_errors');
+
+        form.validate({
+            errorClass: 'text-error',
+            success: function (label) {
+                errors.hide();
+            },
+            submitHandler: function () {
+                var email = form.data('email');
+                var full_name = form.find('.edit_bot_name').val();
+                var spinner = form.find('.edit_bot_spinner');
+                var edit_button = form.find('.edit_bot_button');
+                var formData = new FormData();
+                formData.append('full_name', full_name);
+                formData.append('csrfmiddlewaretoken', csrf_token);
+                util.make_loading_indicator(spinner, {text: 'Editing bot'});
+                edit_button.hide();
+                $.ajax({
+                    url: '/json/bots/' + encodeURIComponent(email),
+                    type: 'PATCH',
+                    data: formData,
+                    cache: false,
+                    processData: false,
+                    contentType: false,
+                    success: function (data) {
+                        util.destroy_loading_indicator(spinner);
+                        errors.hide();
+                        edit_button.show();
+                        show_row_again();
+                        bot_info.find('.name').text(full_name);
+                    },
+                    error: function (xhr, error_type, exn) {
+                        util.destroy_loading_indicator(spinner);
+                        edit_button.show();
+                        errors.text(JSON.parse(xhr.responseText).msg).show();
+                    }
+                });
+            }
+        });
+
+
+    });
+
+
+
 });
 
 }());

zephyr/static/styles/zephyr.css

@@ -1975,7 +1975,6 @@ li.expanded_subject .subject_box {
 
 #bots_list {
     display: none;
-    font-size: 90%;
     list-style-type: none;
     width: 550px;
     margin-left: 0px;
@@ -2005,6 +2004,21 @@ li.expanded_subject .subject_box {
     display: inline-block;
 }
 
+.edit_bot_form {
+    font-size: 100%;
+}
+
+.edit_bot_email {
+    font-weight: bold;
+}
+
+div.edit_bot {
+    border: 1px black solid;
+    display: none;
+    padding: 10px;
+}
+
+.edit_bot_form .control-label,
 #create_bot_form .control-label {
     width: 10em;
     text-align: left;
@@ -2019,6 +2033,7 @@ li.expanded_subject .subject_box {
     display: none;
 }
 
+.edit_bot_name,
 #create_bot_name {
     width: 20em;
 }

zephyr/static/templates/bot_avatar_row.handlebars

@@ -16,9 +16,30 @@
 			</button>
 			<div class="api_key_error text-error"></div>
 		</div>
-		<button type="submit" class="btn btn-primary delete_bot" data-email="{{email}}">
+		<button type="submit" class="btn btn-primary open_edit_bot_form">
+			Edit Bot
+		</button>
+		<button type="submit" class="btn btn-secondary delete_bot" data-email="{{email}}">
 			Delete Bot
 		</button>
 		<div id="bot_delete_error" class="alert alert-error hide"></div>
 	</div>
-</li>
+
+
+	<div class='edit_bot'>
+	    <form class="edit_bot_form form-horizontal" data-email="{{email}}">
+		    <div class="bot_edit_errors alert alert-error hide"></div>
+	        <p>
+	      	    <div class="edit_bot_email">{{email}}</div>
+	            <label for="edit_bot_name" class="control-label">Full name</label>
+	            <input type="text" name="bot_name" class="edit_bot_name required"
+	               maxlength=50 />
+	            <div><label for="edit_bot_name" generated="true" class="text-error"></label></div>
+	        </p>
+	     <input type="submit" class="btn btn-primary edit_bot_button" value="Save" />
+    	 <button type="submit" class="btn btn-secondary reset_edit_bot">Cancel</button>
+	     <div class="edit_bot_spinner"></div>
+	    </form>
+	</div>
+
+</li>