Minor refactoring and name changes

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

@@ -4,10 +4,10 @@ import $ from 'jquery';
 import {
   ValueMapping,
   Threshold,
-  Theme,
+  ThemeName,
   MappingType,
   BasicGaugeColor,
-  Themes,
+  ThemeNames,
   ValueMap,
   RangeMap,
 } from '../../types/panel';
@@ -31,7 +31,7 @@ export interface Props {
   suffix: string;
   unit: string;
   width: number;
-  theme?: Theme;
+  theme?: ThemeName;
 }
 
 export class Gauge extends PureComponent<Props> {
@@ -48,6 +48,7 @@ export class Gauge extends PureComponent<Props> {
     thresholds: [],
     unit: 'none',
     stat: 'avg',
+    theme: ThemeNames.Dark,
   };
 
   componentDidMount() {
@@ -207,7 +208,7 @@ export class Gauge extends PureComponent<Props> {
     }
 
     const dimension = Math.min(width, height * 1.3);
-    const backgroundColor = theme === Themes.Light ? 'rgb(230,230,230)' : 'rgb(38,38,38)';
+    const backgroundColor = theme === ThemeNames.Light ? 'rgb(230,230,230)' : 'rgb(38,38,38)';
     const fontScale = parseInt('80', 10) / 100;
     const fontSize = Math.min(dimension / 5, 100) * fontScale;
     const gaugeWidthReduceRatio = showThresholdLabels ? 1.5 : 1;

packages/grafana-ui/src/types/panel.ts

@@ -67,9 +67,9 @@ export interface RangeMap extends BaseMap {
   to: string;
 }
 
-export type Theme = 'dark' | 'light';
+export type ThemeName = 'dark' | 'light';
 
-export enum Themes {
+export enum ThemeNames {
   Dark = 'dark',
   Light = 'light',
 }

packages/grafana-ui/src/utils/processTimeSeries.ts

@@ -1,18 +1,19 @@
 // Libraries
 import _ from 'lodash';
 
+import { colors } from './colors';
+
 // Types
 import { TimeSeries, TimeSeriesVMs, NullValueMode, TimeSeriesValue } from '../types';
 
 interface Options {
   timeSeries: TimeSeries[];
   nullValueMode: NullValueMode;
-  colorPalette: string[];
 }
 
-export function processTimeSeries({ timeSeries, nullValueMode, colorPalette }: Options): TimeSeriesVMs {
+export function processTimeSeries({ timeSeries, nullValueMode }: Options): TimeSeriesVMs {
   const vmSeries = timeSeries.map((item, index) => {
-    const colorIndex = index % colorPalette.length;
+    const colorIndex = index % colors.length;
     const label = item.target;
     const result = [];
 
@@ -150,7 +151,7 @@ export function processTimeSeries({ timeSeries, nullValueMode, colorPalette }: O
     return {
       data: result,
       label: label,
-      color: colorPalette[colorIndex],
+      color: colors[colorIndex],
       allIsZero,
       allIsNull,
       stats: {