FieldConfig: Some name change suggestions and moving defaults to PanelPlugin (#23265)

* FieldConfig: Some name change suggestions and moving defaults to PanelPlugin

* More name changes

packages/grafana-data/src/index.ts

@@ -12,4 +12,4 @@ export * from './datetime';
 export * from './text';
 export * from './valueFormats';
 export * from './field';
-export { PanelPlugin, defaultStandardFieldConfigProperties } from './panel/PanelPlugin';
+export { PanelPlugin } from './panel/PanelPlugin';

packages/grafana-data/src/panel/PanelPlugin.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { identityOverrideProcessor, standardEditorsRegistry } from '../field';
 import { PanelPlugin, standardFieldConfigProperties } from './PanelPlugin';
-import { StandardFieldConfigProperties } from '../types';
+import { FieldConfigProperty } from '../types';
 
 describe('PanelPlugin', () => {
   describe('declarative options', () => {
@@ -193,7 +193,7 @@ describe('PanelPlugin', () => {
           return <div>Panel</div>;
         });
 
-        panel.useStandardFieldConfig([StandardFieldConfigProperties.Min, StandardFieldConfigProperties.Thresholds]);
+        panel.useStandardFieldConfig([FieldConfigProperty.Min, FieldConfigProperty.Thresholds]);
         expect(panel.standardFieldConfigProperties).toEqual(['min', 'thresholds']);
       });
 
@@ -203,9 +203,9 @@ describe('PanelPlugin', () => {
             return <div>Panel</div>;
           });
 
-          panel.useStandardFieldConfig([StandardFieldConfigProperties.Color, StandardFieldConfigProperties.Min], {
-            [StandardFieldConfigProperties.Color]: '#ff00ff',
-            [StandardFieldConfigProperties.Min]: 10,
+          panel.useStandardFieldConfig([FieldConfigProperty.Color, FieldConfigProperty.Min], {
+            [FieldConfigProperty.Color]: '#ff00ff',
+            [FieldConfigProperty.Min]: 10,
           });
 
           expect(panel.standardFieldConfigProperties).toEqual(['color', 'min']);
@@ -224,9 +224,9 @@ describe('PanelPlugin', () => {
             return <div>Panel</div>;
           });
 
-          panel.useStandardFieldConfig([StandardFieldConfigProperties.Color], {
-            [StandardFieldConfigProperties.Color]: '#ff00ff',
-            [StandardFieldConfigProperties.Min]: 10,
+          panel.useStandardFieldConfig([FieldConfigProperty.Color], {
+            [FieldConfigProperty.Color]: '#ff00ff',
+            [FieldConfigProperty.Min]: 10,
           });
 
           expect(panel.standardFieldConfigProperties).toEqual(['color']);

packages/grafana-data/src/panel/PanelPlugin.ts

@@ -8,33 +8,45 @@ import {
   PanelPluginMeta,
   PanelProps,
   PanelTypeChangedHandler,
-  StandardFieldConfigProperties,
+  FieldConfigProperty,
+  ThresholdsMode,
 } from '../types';
 import { FieldConfigEditorBuilder, PanelOptionsEditorBuilder } from '../utils/OptionsUIBuilders';
 import { ComponentClass, ComponentType } from 'react';
 import set from 'lodash/set';
 import { deprecationWarning } from '../utils';
 
-export const defaultStandardFieldConfigProperties: StandardFieldConfigProperties[] = [
-  StandardFieldConfigProperties.Min,
-  StandardFieldConfigProperties.Max,
-  StandardFieldConfigProperties.Title,
-  StandardFieldConfigProperties.Unit,
-  StandardFieldConfigProperties.Decimals,
-  StandardFieldConfigProperties.NoValue,
-  StandardFieldConfigProperties.Color,
-  StandardFieldConfigProperties.Thresholds,
-  StandardFieldConfigProperties.Mappings,
-  StandardFieldConfigProperties.Links,
+export const allStandardFieldConfigProperties: FieldConfigProperty[] = [
+  FieldConfigProperty.Min,
+  FieldConfigProperty.Max,
+  FieldConfigProperty.Title,
+  FieldConfigProperty.Unit,
+  FieldConfigProperty.Decimals,
+  FieldConfigProperty.NoValue,
+  FieldConfigProperty.Color,
+  FieldConfigProperty.Thresholds,
+  FieldConfigProperty.Mappings,
+  FieldConfigProperty.Links,
 ];
 
-export const standardFieldConfigProperties = new Map(defaultStandardFieldConfigProperties.map(p => [p, undefined]));
+export const standardFieldConfigDefaults: Partial<Record<FieldConfigProperty, any>> = {
+  [FieldConfigProperty.Thresholds]: {
+    mode: ThresholdsMode.Absolute,
+    steps: [
+      { value: -Infinity, color: 'green' },
+      { value: 80, color: 'red' },
+    ],
+  },
+  [FieldConfigProperty.Mappings]: [],
+};
+
+export const standardFieldConfigProperties = new Map(allStandardFieldConfigProperties.map(p => [p, undefined]));
 
 export class PanelPlugin<TOptions = any, TFieldConfigOptions extends object = any> extends GrafanaPlugin<
   PanelPluginMeta
 > {
   private _defaults?: TOptions;
-  private _standardFieldConfigProperties?: Map<StandardFieldConfigProperties, any>;
+  private _standardFieldConfigProperties?: Map<FieldConfigProperty, any>;
 
   private _fieldConfigDefaults: FieldConfigSource<TFieldConfigOptions> = {
     defaults: {},
@@ -270,13 +282,13 @@ export class PanelPlugin<TOptions = any, TFieldConfigOptions extends object = an
    * // when plugin should only display specific standard options
    * // note, that options will be displayed in the order they are provided
    * export const plugin = new PanelPlugin<ShapePanelOptions>(ShapePanel)
-   *  .useStandardFieldConfig([StandardFieldConfigProperties.Min, StandardFieldConfigProperties.Max, StandardFieldConfigProperties.Links]);
+   *  .useStandardFieldConfig([FieldConfigProperty.Min, FieldConfigProperty.Max, FieldConfigProperty.Links]);
    *
    * // when standard option's default value needs to be provided
    * export const plugin = new PanelPlugin<ShapePanelOptions>(ShapePanel)
-   *  .useStandardFieldConfig([StandardFieldConfigProperties.Min, StandardFieldConfigProperties.Max], {
-   *    [StandardFieldConfigProperties.Min]: 20,
-   *    [StandardFieldConfigProperties.Max]: 100
+   *  .useStandardFieldConfig([FieldConfigProperty.Min, FieldConfigProperty.Max], {
+   *    [FieldConfigProperty.Min]: 20,
+   *    [FieldConfigProperty.Max]: 100
    *  });
    *
    * ```
@@ -284,8 +296,8 @@ export class PanelPlugin<TOptions = any, TFieldConfigOptions extends object = an
    * @public
    */
   useStandardFieldConfig(
-    properties?: StandardFieldConfigProperties[],
-    defauls?: Partial<Record<StandardFieldConfigProperties, any>>
+    properties?: FieldConfigProperty[] | null,
+    customDefaults?: Partial<Record<FieldConfigProperty, any>>
   ) {
     if (!properties) {
       this._standardFieldConfigProperties = standardFieldConfigProperties;
@@ -294,13 +306,12 @@ export class PanelPlugin<TOptions = any, TFieldConfigOptions extends object = an
       this._standardFieldConfigProperties = new Map(properties.map(p => [p, standardFieldConfigProperties.get(p)]));
     }
 
-    if (defauls) {
-      Object.keys(defauls).map(k => {
-        if (properties.indexOf(k as StandardFieldConfigProperties) > -1) {
-          this._standardFieldConfigProperties!.set(
-            k as StandardFieldConfigProperties,
-            defauls[k as StandardFieldConfigProperties]
-          );
+    const defaults = customDefaults ?? standardFieldConfigDefaults;
+
+    if (defaults) {
+      Object.keys(defaults).map(k => {
+        if (properties.indexOf(k as FieldConfigProperty) > -1) {
+          this._standardFieldConfigProperties!.set(k as FieldConfigProperty, defaults[k as FieldConfigProperty]);
         }
       });
     }

packages/grafana-data/src/types/fieldOverrides.ts

@@ -88,7 +88,7 @@ export interface ApplyFieldOverrideOptions {
   custom?: FieldConfigEditorRegistry;
 }
 
-export enum StandardFieldConfigProperties {
+export enum FieldConfigProperty {
   Unit = 'unit',
   Min = 'min',
   Max = 'max',

public/app/features/dashboard/components/PanelEditor/FieldConfigEditor.tsx

@@ -8,7 +8,7 @@ import {
   standardFieldConfigEditorRegistry,
   PanelPlugin,
   SelectableValue,
-  StandardFieldConfigProperties,
+  FieldConfigProperty,
 } from '@grafana/data';
 import { Forms, fieldMatchersUI, ValuePicker, useTheme } from '@grafana/ui';
 import { getDataLinksVariableSuggestions } from '../../../panel/panellinks/link_srv';
@@ -18,7 +18,7 @@ import { css } from 'emotion';
 interface Props {
   plugin: PanelPlugin;
   config: FieldConfigSource;
-  include?: StandardFieldConfigProperties[]; // Ordered list of which fields should be shown/included
+  include?: FieldConfigProperty[]; // Ordered list of which fields should be shown/included
   onChange: (config: FieldConfigSource) => void;
   /* Helpful for IntelliSense */
   data: DataFrame[];

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

@@ -1,6 +1,6 @@
 import { PanelModel } from './PanelModel';
 import { getPanelPlugin } from '../../plugins/__mocks__/pluginMocks';
-import { PanelProps, StandardFieldConfigProperties } from '@grafana/data';
+import { PanelProps, FieldConfigProperty } from '@grafana/data';
 import { ComponentClass } from 'react';
 
 class TablePanelCtrl {}
@@ -79,9 +79,9 @@ describe('PanelModel', () => {
         TablePanelCtrl // angular
       );
       panelPlugin.setDefaults(defaultOptionsMock);
-      panelPlugin.useStandardFieldConfig([StandardFieldConfigProperties.Unit, StandardFieldConfigProperties.Decimals], {
-        [StandardFieldConfigProperties.Unit]: 'flop',
-        [StandardFieldConfigProperties.Decimals]: 2,
+      panelPlugin.useStandardFieldConfig([FieldConfigProperty.Unit, FieldConfigProperty.Decimals], {
+        [FieldConfigProperty.Unit]: 'flop',
+        [FieldConfigProperty.Decimals]: 2,
       });
       model.pluginLoaded(panelPlugin);
     });

public/app/plugins/panel/bargauge/module.tsx

@@ -1,8 +1,8 @@
 import { sharedSingleStatPanelChangedHandler } from '@grafana/ui';
-import { defaultStandardFieldConfigProperties, PanelPlugin } from '@grafana/data';
+import { PanelPlugin } from '@grafana/data';
 import { BarGaugePanel } from './BarGaugePanel';
 import { BarGaugeOptions, defaults } from './types';
-import { standardFieldConfigDefaults, addStandardDataReduceOptions } from '../stat/types';
+import { addStandardDataReduceOptions } from '../stat/types';
 import { BarGaugePanelEditor } from './BarGaugePanelEditor';
 import { barGaugePanelMigrationHandler } from './BarGaugeMigrations';
 
@@ -33,4 +33,4 @@ export const plugin = new PanelPlugin<BarGaugeOptions>(BarGaugePanel)
   })
   .setPanelChangeHandler(sharedSingleStatPanelChangedHandler)
   .setMigrationHandler(barGaugePanelMigrationHandler)
-  .useStandardFieldConfig(defaultStandardFieldConfigProperties, standardFieldConfigDefaults);
+  .useStandardFieldConfig();

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

@@ -1,8 +1,8 @@
-import { defaultStandardFieldConfigProperties, PanelPlugin } from '@grafana/data';
+import { PanelPlugin } from '@grafana/data';
 import { GaugePanelEditor } from './GaugePanelEditor';
 import { GaugePanel } from './GaugePanel';
 import { GaugeOptions, defaults } from './types';
-import { standardFieldConfigDefaults, addStandardDataReduceOptions } from '../stat/types';
+import { addStandardDataReduceOptions } from '../stat/types';
 import { gaugePanelMigrationHandler, gaugePanelChangedHandler } from './GaugeMigrations';
 
 export const plugin = new PanelPlugin<GaugeOptions>(GaugePanel)
@@ -25,4 +25,4 @@ export const plugin = new PanelPlugin<GaugeOptions>(GaugePanel)
   })
   .setPanelChangeHandler(gaugePanelChangedHandler)
   .setMigrationHandler(gaugePanelMigrationHandler)
-  .useStandardFieldConfig(defaultStandardFieldConfigProperties, standardFieldConfigDefaults);
+  .useStandardFieldConfig();

public/app/plugins/panel/piechart/module.tsx

@@ -1,11 +1,11 @@
-import { defaultStandardFieldConfigProperties, PanelPlugin, StandardFieldConfigProperties } from '@grafana/data';
+import { PanelPlugin, FieldConfigProperty } from '@grafana/data';
 import { PieChartPanelEditor } from './PieChartPanelEditor';
 import { PieChartPanel } from './PieChartPanel';
 import { PieChartOptions, defaults } from './types';
 
 export const plugin = new PanelPlugin<PieChartOptions>(PieChartPanel)
   .setDefaults(defaults)
-  .useStandardFieldConfig(defaultStandardFieldConfigProperties, {
-    [StandardFieldConfigProperties.Unit]: 'short',
+  .useStandardFieldConfig(null, {
+    [FieldConfigProperty.Unit]: 'short',
   })
   .setEditor(PieChartPanelEditor);

public/app/plugins/panel/stat/module.tsx

@@ -1,6 +1,6 @@
 import { sharedSingleStatMigrationHandler, sharedSingleStatPanelChangedHandler } from '@grafana/ui';
-import { defaultStandardFieldConfigProperties, PanelPlugin } from '@grafana/data';
-import { StatPanelOptions, defaults, standardFieldConfigDefaults, addStandardDataReduceOptions } from './types';
+import { PanelPlugin } from '@grafana/data';
+import { StatPanelOptions, defaults, addStandardDataReduceOptions } from './types';
 import { StatPanel } from './StatPanel';
 import { StatPanelEditor } from './StatPanelEditor';
 
@@ -48,4 +48,4 @@ export const plugin = new PanelPlugin<StatPanelOptions>(StatPanel)
   .setNoPadding()
   .setPanelChangeHandler(sharedSingleStatPanelChangedHandler)
   .setMigrationHandler(sharedSingleStatMigrationHandler)
-  .useStandardFieldConfig(defaultStandardFieldConfigProperties, standardFieldConfigDefaults);
+  .useStandardFieldConfig();

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

@@ -6,7 +6,7 @@ import {
   SelectableValue,
   ThresholdsMode,
   standardEditorsRegistry,
-  StandardFieldConfigProperties,
+  FieldConfigProperty,
 } from '@grafana/data';
 import { PanelOptionsEditorBuilder } from '@grafana/data/src/utils/OptionsUIBuilders';
 
@@ -37,15 +37,15 @@ export const commonValueOptionDefaults: ReduceDataOptions = {
   calcs: [ReducerID.mean],
 };
 
-export const standardFieldConfigDefaults: Partial<Record<StandardFieldConfigProperties, any>> = {
-  [StandardFieldConfigProperties.Thresholds]: {
+export const standardFieldConfigDefaults: Partial<Record<FieldConfigProperty, any>> = {
+  [FieldConfigProperty.Thresholds]: {
     mode: ThresholdsMode.Absolute,
     steps: [
       { value: -Infinity, color: 'green' },
-      { value: 80, color: 'red' }, // 80%
+      { value: 80, color: 'red' },
     ],
   },
-  [StandardFieldConfigProperties.Mappings]: [],
+  [FieldConfigProperty.Mappings]: [],
 };
 
 export function addStandardDataReduceOptions(builder: PanelOptionsEditorBuilder<StatPanelOptions>) {