feat(kapacitor): add token-prefix to alerta configuration

CHANGELOG.md

@@ -4,6 +4,8 @@
 
 ### Features
 
+1. [#5584](https://github.com/influxdata/chronograf/pull/5584): Allow to set token-prefix in Alerta configuration.
+
 ### Other
 
 ## v1.8.6 [2020-08-26]

ui/src/kapacitor/components/config/AlertaConfig.tsx

@@ -11,6 +11,7 @@ interface Config {
     environment: string
     origin: string
     token: boolean
+    'token-prefix': string
     url: string
     enabled: boolean
   }
@@ -33,6 +34,7 @@ class AlertaConfig extends PureComponent<Props, State> {
   private environment: HTMLInputElement
   private origin: HTMLInputElement
   private token: HTMLInputElement
+  private tokenPrefix: HTMLInputElement
   private url: HTMLInputElement
 
   constructor(props) {
@@ -44,7 +46,13 @@ class AlertaConfig extends PureComponent<Props, State> {
   }
 
   public render() {
-    const {environment, origin, token, url} = this.props.config.options
+    const {
+      environment,
+      origin,
+      token,
+      url,
+      'token-prefix': tokenPrefix,
+    } = this.props.config.options
     const {testEnabled, enabled} = this.state
 
     return (
@@ -84,6 +92,18 @@ class AlertaConfig extends PureComponent<Props, State> {
           />
         </div>
 
+        <div className="form-group col-xs-12">
+          <label htmlFor="token-prefix">Token Prefix</label>
+          <input
+            className="form-control"
+            id="token-prefix"
+            type="text"
+            ref={r => (this.tokenPrefix = r)}
+            defaultValue={tokenPrefix || ''}
+            onChange={this.disableTest}
+          />
+        </div>
+
         <div className="form-group col-xs-12">
           <label htmlFor="url">User</label>
           <input
@@ -142,6 +162,7 @@ class AlertaConfig extends PureComponent<Props, State> {
       environment: this.environment.value,
       origin: this.origin.value,
       token: this.token.value,
+      'token-prefix': this.tokenPrefix.value,
       url: this.url.value,
       enabled: this.state.enabled,
     }

ui/src/types/kapacitor.ts

@@ -319,6 +319,7 @@ export interface AlertaProperties {
   environment: string
   origin: string
   token: string
+  'token-prefix': string
   url: string
   enabled: boolean
 }