Merge branch 'react-panel-options' into bar-gauge-poc

packages/grafana-ui/src/components/Gauge/Gauge.tsx

@@ -9,7 +9,7 @@ import { Themeable } from '../../index';
 type GaugeValue = string | number | null;
 
 export interface Props extends Themeable {
-  decimals: number;
+  decimals?: number | null;
   height: number;
   valueMappings: ValueMapping[];
   maxValue: number;

public/app/features/dashboard/containers/__snapshots__/DashboardPage.test.tsx.snap

@@ -78,7 +78,7 @@ exports[`DashboardPage Dashboard init completed  Should render dashboard grid 1`
         ],
         "refresh": undefined,
         "revision": undefined,
-        "schemaVersion": 17,
+        "schemaVersion": 18,
         "snapshot": undefined,
         "style": "dark",
         "tags": Array [],
@@ -190,7 +190,7 @@ exports[`DashboardPage Dashboard init completed  Should render dashboard grid 1`
               ],
               "refresh": undefined,
               "revision": undefined,
-              "schemaVersion": 17,
+              "schemaVersion": 18,
               "snapshot": undefined,
               "style": "dark",
               "tags": Array [],
@@ -313,7 +313,7 @@ exports[`DashboardPage When dashboard has editview url state should render setti
         ],
         "refresh": undefined,
         "revision": undefined,
-        "schemaVersion": 17,
+        "schemaVersion": 18,
         "snapshot": undefined,
         "style": "dark",
         "tags": Array [],
@@ -423,7 +423,7 @@ exports[`DashboardPage When dashboard has editview url state should render setti
             ],
             "refresh": undefined,
             "revision": undefined,
-            "schemaVersion": 17,
+            "schemaVersion": 18,
             "snapshot": undefined,
             "style": "dark",
             "tags": Array [],
@@ -518,7 +518,7 @@ exports[`DashboardPage When dashboard has editview url state should render setti
               ],
               "refresh": undefined,
               "revision": undefined,
-              "schemaVersion": 17,
+              "schemaVersion": 18,
               "snapshot": undefined,
               "style": "dark",
               "tags": Array [],

public/app/features/dashboard/state/DashboardMigrator.test.ts

@@ -127,7 +127,7 @@ describe('DashboardModel', () => {
     });
 
     it('dashboard schema version should be set to latest', () => {
-      expect(model.schemaVersion).toBe(17);
+      expect(model.schemaVersion).toBe(18);
     });
 
     it('graph thresholds should be migrated', () => {

public/app/plugins/panel/gauge/GaugePanel.tsx

@@ -50,6 +50,10 @@ export class GaugePanel extends PureComponent<Props> {
             decimals={valueOptions.decimals}
             thresholds={options.thresholds}
             valueMappings={options.valueMappings}
+            showThresholdLabels={options.showThresholdLabels}
+            showThresholdMarkers={options.showThresholdMarkers}
+            minValue={options.minValue}
+            maxValue={options.maxValue}
             theme={theme}
           />
         )}

public/app/plugins/panel/gauge/SingleStatValueEditor.tsx

@@ -35,7 +35,15 @@ export class SingleStatValueEditor extends PureComponent<Props> {
 
   onDecimalChange = event => {
     if (!isNaN(event.target.value)) {
-      this.props.onChange({ ...this.props.options, decimals: event.target.value });
+      this.props.onChange({
+        ...this.props.options,
+        decimals: parseInt(event.target.value, 10),
+      });
+    } else {
+      this.props.onChange({
+        ...this.props.options,
+        decimals: null,
+      });
     }
   };
 
@@ -45,6 +53,11 @@ export class SingleStatValueEditor extends PureComponent<Props> {
   render() {
     const { stat, unit, decimals, prefix, suffix } = this.props.options;
 
+    let decimalsString = '';
+    if (Number.isFinite(decimals)) {
+      decimalsString = decimals.toString();
+    }
+
     return (
       <PanelOptionsGroup title="Value">
         <div className="gf-form">
@@ -65,7 +78,7 @@ export class SingleStatValueEditor extends PureComponent<Props> {
           labelWidth={labelWidth}
           placeholder="auto"
           onChange={this.onDecimalChange}
-          value={decimals || ''}
+          value={decimalsString}
           type="number"
         />
         <FormField label="Prefix" labelWidth={labelWidth} onChange={this.onPrefixChange} value={prefix || ''} />

public/app/plugins/panel/gauge/types.ts

@@ -15,7 +15,7 @@ export interface SingleStatValueOptions {
   suffix: string;
   stat: string;
   prefix: string;
-  decimals: number;
+  decimals?: number | null;
 }
 
 export const defaults: GaugeOptions = {
@@ -26,7 +26,7 @@ export const defaults: GaugeOptions = {
   valueOptions: {
     prefix: '',
     suffix: '',
-    decimals: 0,
+    decimals: null,
     stat: 'avg',
     unit: 'none',
   },