Timeseries: support boolean values out-of-the-box (#34168)

packages/grafana-data/src/field/displayProcessor.ts

@@ -4,7 +4,7 @@ import { toString, toNumber as _toNumber, isEmpty, isBoolean } from 'lodash';
 // Types
 import { Field, FieldType } from '../types/dataFrame';
 import { DisplayProcessor, DisplayValue } from '../types/displayValue';
-import { getValueFormat } from '../valueFormats/valueFormats';
+import { getValueFormat, isBooleanUnit } from '../valueFormats/valueFormats';
 import { getValueMappingResult } from '../utils/valueMappings';
 import { dateTime } from '../datetime';
 import { KeyValue, TimeZone } from '../types';
@@ -49,6 +49,10 @@ export function getDisplayProcessor(options?: DisplayProcessorOptions): DisplayP
   if (field.type === FieldType.time && !hasDateUnit) {
     unit = `dateTimeAsSystem`;
     hasDateUnit = true;
+  } else if (field.type === FieldType.boolean) {
+    if (!isBooleanUnit(unit)) {
+      unit = 'bool';
+    }
   }
 
   const formatFunc = getValueFormat(unit || 'none');

packages/grafana-data/src/field/fieldOverrides.test.ts

@@ -689,7 +689,7 @@ describe('applyRawFieldOverrides', () => {
       percent: expect.any(Number),
       prefix: undefined,
       suffix: undefined,
-      text: '0',
+      text: 'False',
     });
 
     expect(getDisplayValue(frames, frameIndex, 4)).toEqual({

packages/grafana-data/src/valueFormats/categories.ts

@@ -1,4 +1,12 @@
-import { locale, scaledUnits, simpleCountUnit, toFixedUnit, ValueFormatCategory, stringFormater } from './valueFormats';
+import {
+  locale,
+  scaledUnits,
+  simpleCountUnit,
+  toFixedUnit,
+  ValueFormatCategory,
+  stringFormater,
+  booleanValueFormatter,
+} from './valueFormats';
 import {
   dateTimeAsIso,
   dateTimeAsIsoNoDateIfToday,
@@ -399,4 +407,12 @@ export const getCategories = (): ValueFormatCategory[] => [
       { name: 'gallons', id: 'gallons', fn: toFixedUnit('gal') },
     ],
   },
+  {
+    name: 'Boolean',
+    formats: [
+      { name: 'True / False', id: 'bool', fn: booleanValueFormatter('True', 'False') },
+      { name: 'Yes / No', id: 'bool_yes_no', fn: booleanValueFormatter('Yes', 'No') },
+      { name: 'On / Off', id: 'bool_on_off', fn: booleanValueFormatter('On', 'Off') },
+    ],
+  },
 ];

packages/grafana-data/src/valueFormats/valueFormats.ts

@@ -113,6 +113,16 @@ export function toFixedUnit(unit: string, asPrefix?: boolean): ValueFormatter {
   };
 }
 
+export function isBooleanUnit(unit?: string) {
+  return unit && unit.startsWith('bool');
+}
+
+export function booleanValueFormatter(t: string, f: string): ValueFormatter {
+  return (value: any) => {
+    return { text: value ? t : f };
+  };
+}
+
 // Formatter which scales the unit string geometrically according to the given
 // numeric factor. Repeatedly scales the value down by the factor until it is
 // less than the factor in magnitude, or the end of the array is reached.
@@ -199,7 +209,7 @@ export function getValueFormat(id?: string | null): ValueFormatter {
   const fmt = index[id];
 
   if (!fmt && id) {
-    const idx = id.indexOf(':');
+    let idx = id.indexOf(':');
 
     if (idx > 0) {
       const key = id.substring(0, idx);
@@ -230,6 +240,16 @@ export function getValueFormat(id?: string | null): ValueFormatter {
       if (key === 'currency') {
         return currency(sub);
       }
+
+      if (key === 'bool') {
+        idx = sub.indexOf('/');
+        if (idx >= 0) {
+          const t = sub.substring(0, idx);
+          const f = sub.substring(idx + 1);
+          return booleanValueFormatter(t, f);
+        }
+        return booleanValueFormatter(sub, '-');
+      }
     }
 
     return toFixedUnit(id);