From 23c9f8c22d521054c5b1d3b6ddd7a137e4c8feab Mon Sep 17 00:00:00 2001
From: deniz kusefoglu <denizk@gmail.com>
Date: Tue, 5 Dec 2017 15:23:32 -0800
Subject: [PATCH] Add post header inputs

---
 ui/src/kapacitor/components/HandlerInput.js   |  4 +++-
 ui/src/kapacitor/components/RuleHandlers.js   | 24 ++++++++++++++++---
 .../components/handlers/PostHandler.js        | 14 +++++++++++
 3 files changed, 38 insertions(+), 4 deletions(-)

diff --git a/ui/src/kapacitor/components/HandlerInput.js b/ui/src/kapacitor/components/HandlerInput.js
index 1d4ac033a1..e1750a9f8d 100644
--- a/ui/src/kapacitor/components/HandlerInput.js
+++ b/ui/src/kapacitor/components/HandlerInput.js
@@ -11,6 +11,7 @@ const HandlerInput = ({
   disabled = false,
   fieldColumns = 'col-md-6',
   parseToArray = false,
+  headerIndex = 0,
 }) => {
   const formGroupClass = `form-group ${fieldColumns}`
   return (
@@ -28,7 +29,8 @@ const HandlerInput = ({
           onChange={handleModifyHandler(
             selectedHandler,
             fieldName,
-            parseToArray
+            parseToArray,
+            headerIndex
           )}
           value={
             parseToArray
diff --git a/ui/src/kapacitor/components/RuleHandlers.js b/ui/src/kapacitor/components/RuleHandlers.js
index 468a659373..3285def9f9 100644
--- a/ui/src/kapacitor/components/RuleHandlers.js
+++ b/ui/src/kapacitor/components/RuleHandlers.js
@@ -86,11 +86,29 @@ class RuleHandlers extends Component {
     ruleActions.updateAlertNodes(rule.id, handlersOnThisAlert)
   }
 
-  handleModifyHandler = (selectedHandler, fieldName, parseToArray) => e => {
+  handleModifyHandler = (
+    selectedHandler,
+    fieldName,
+    parseToArray,
+    headerIndex
+  ) => e => {
     const {handlersOnThisAlert} = this.state
-
     let modifiedEP
-    if (e.target.type === 'checkbox') {
+    if (fieldName === 'headerKey') {
+      const currentHeader = selectedHandler.headers || [[]]
+      currentHeader[headerIndex][0] = e.target.value // only works for headerIndex= 0 atm. would need to initialize if headerindex is larger.
+      modifiedEP = {
+        ...selectedHandler,
+        headers: [...currentHeader],
+      }
+    } else if (fieldName === 'headerValue') {
+      const currentHeader = selectedHandler.headers || [[]]
+      currentHeader[headerIndex][1] = e.target.value
+      modifiedEP = {
+        ...selectedHandler,
+        headers: [...currentHeader],
+      }
+    } else if (e.target.type === 'checkbox') {
       modifiedEP = {
         ...selectedHandler,
         [fieldName]: !selectedHandler[fieldName],
diff --git a/ui/src/kapacitor/components/handlers/PostHandler.js b/ui/src/kapacitor/components/handlers/PostHandler.js
index 5c4f107954..fc33ae410b 100644
--- a/ui/src/kapacitor/components/handlers/PostHandler.js
+++ b/ui/src/kapacitor/components/handlers/PostHandler.js
@@ -15,6 +15,20 @@ const HttpHandler = ({selectedHandler, handleModifyHandler}) => {
             placeholder="ex: http://example.com/api/alert"
             fieldColumns="col-md-12"
           />
+          <HandlerInput
+            selectedHandler={selectedHandler}
+            handleModifyHandler={handleModifyHandler}
+            fieldName="headerKey"
+            fieldDisplay="Header Key"
+            placeholder=""
+          />
+          <HandlerInput
+            selectedHandler={selectedHandler}
+            handleModifyHandler={handleModifyHandler}
+            fieldName="headerValue"
+            fieldDisplay="Header Value"
+            placeholder=""
+          />
         </div>
       </div>
     </div>