Merge pull request #5613 from influxdata/5561/alert_rule

fix(alert rule): warn about unsupported data

ui/src/kapacitor/components/RuleGraphDygraph.tsx

@@ -64,6 +64,17 @@ class RuleGraphDygraph extends Component<Props, State> {
     if (!timeSeriesToDygraphResult) {
       return null
     }
+    if (timeSeriesToDygraphResult.unsupportedValue) {
+      console.error(
+        'Unsupported y-axis value, cannot display data',
+        timeSeriesToDygraphResult
+      )
+      return (
+        <p className="unexpected-error">
+          Unsupported y-axis value, only numbers are supported.
+        </p>
+      )
+    }
 
     return (
       <Dygraph

ui/src/shared/components/FieldList.tsx

@@ -253,10 +253,10 @@ class FieldList extends PureComponent<Props, State> {
       const newFields = _.get(fieldSets, measurement, []).map(f => ({
         value: f,
         type: 'field',
-      }))
+      })) as Field[]
 
       this.setState({
-        fields: newFields,
+        fields: _.uniqBy(newFields, 'value'), // do not duplicate items
       })
     })
   }

ui/src/utils/timeSeriesTransformers.ts

@@ -11,6 +11,7 @@ export interface TimeSeriesToDyGraphReturnType {
   labels: string[]
   timeSeries: DygraphValue[][]
   dygraphSeries: DygraphSeries
+  unsupportedValue?: any
 }
 
 export const timeSeriesToDygraph = async (
@@ -19,12 +20,18 @@ export const timeSeriesToDygraph = async (
 ): Promise<TimeSeriesToDyGraphReturnType> => {
   const result = await manager.timeSeriesToDygraph(raw, pathname)
   const {timeSeries} = result
+  let unsupportedValue: any
   const newTimeSeries = fastMap<DygraphValue[], DygraphValue[]>(
     timeSeries,
-    ([time, ...values]) => [new Date(time), ...values]
+    ([time, ...values]) => {
+      if (unsupportedValue === undefined) {
+        unsupportedValue = values.find(x => x !== null && typeof x !== 'number')
+      }
+      return [new Date(time), ...values]
+    }
   )
 
-  return {...result, timeSeries: newTimeSeries}
+  return {...result, timeSeries: newTimeSeries, unsupportedValue}
 }
 
 export const timeSeriesToTableGraph = async (