From 602ad1dea81f457fe506718fb8bad9a676009b65 Mon Sep 17 00:00:00 2001
From: someposer <someposer@users.noreply.github.com>
Date: Sun, 5 Nov 2017 21:24:02 -0600
Subject: [PATCH] Improved handling of webhook header values when form has
 errors

---
 static/js/webhook.js                    |  3 +++
 templates/integrations/add_webhook.html | 24 ++++++++++++++++++------
 2 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/static/js/webhook.js b/static/js/webhook.js
index 7a07435e..9b22b380 100644
--- a/static/js/webhook.js
+++ b/static/js/webhook.js
@@ -1,4 +1,7 @@
 $(function() {
+    $(".webhook_header_btn:first").addClass("btn-info").text("+")
+    $(".webhook_header_btn:not(:first)").addClass("btn-danger").text("X")
+
     $("#webhook_headers").on("click", ".webhook_header_btn.btn-danger", function(e) {
         e.preventDefault();
         $(this).closest("div.row").remove();
diff --git a/templates/integrations/add_webhook.html b/templates/integrations/add_webhook.html
index c9d3c338..4291a041 100644
--- a/templates/integrations/add_webhook.html
+++ b/templates/integrations/add_webhook.html
@@ -108,6 +108,23 @@
         <div class="form-group {{ form.headers.css_classes }}">
             <label class="col-sm-2 control-label">Headers</label>
             <div id="webhook_headers" class="col-xs-12 col-sm-10">
+                {% if form.headers %}
+                {% for k,v in form.headers.items %}
+                <div class="row">
+                    <div class="col-xs-6 col-sm-6" style="padding-right: 0px;">
+                        <input type="text" class="form-control" name="header_key[]" placeholder="Key" value="{{ k|default:"" }}">
+                    </div>
+                    <div class="col-xs-6 col-sm-6" style="padding-left: 0px;">
+                        <div class="input-group">
+                            <input type="text" class="form-control" name="header_value[]" placeholder="Value" value="{{ v|default:"" }}">
+                            <span class="input-group-btn">
+                                <button class="webhook_header_btn btn" type="button" class="btn"></button>
+                            </span>
+                        </div>
+                    </div>
+                </div>
+                {% endfor %}
+                {% else %}
                 <div class="row">
                     <div class="col-xs-6 col-sm-6" style="padding-right: 0px;">
                         <input type="text" class="form-control" name="header_key[]" placeholder="Key">
@@ -121,13 +138,8 @@
                         </div>
                     </div>
                 </div>
+                {% endif %}
             </div>
-            <input type="hidden"
-                    type="text"
-                    class="form-control"
-                    name="headers"
-                    value="{{ form.headers.value|default:"" }}">
-            
         </div>
         <div class="form-group">
             <div class="col-sm-offset-2 col-sm-10">