Plugins: ReactPanelPlugin to VizPanelPlugin (#16779)

* Plugins: ReactPanelPlugin renamed

* Plugins: renamed PanelPlugin to PanelPluginMeta and VizPanelPlugin to PanelPlugin

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

@@ -53,7 +53,7 @@ export type PanelTypeChangedHandler<TOptions = any> = (
   prevOptions: any
 ) => Partial<TOptions>;
 
-export class ReactPanelPlugin<TOptions = any> {
+export class PanelPlugin<TOptions = any> {
   panel: ComponentType<PanelProps<TOptions>>;
   editor?: ComponentClass<PanelEditorProps<TOptions>>;
   defaults?: TOptions;

public/app/core/config.ts

@@ -1,5 +1,5 @@
 import _ from 'lodash';
-import { PanelPlugin } from 'app/types/plugins';
+import { PanelPluginMeta } from 'app/types/plugins';
 import { GrafanaTheme, getTheme, GrafanaThemeType, DataSourceInstanceSettings } from '@grafana/ui';
 
 export interface BuildInfo {
@@ -13,7 +13,7 @@ export interface BuildInfo {
 
 export class Settings {
   datasources: { [str: string]: DataSourceInstanceSettings };
-  panels: { [key: string]: PanelPlugin };
+  panels: { [key: string]: PanelPluginMeta };
   appSubUrl: string;
   windowTitlePrefix: string;
   buildInfo: BuildInfo;

public/app/features/dashboard/components/DashExportModal/DashboardExporter.test.ts

@@ -9,7 +9,7 @@ import config from 'app/core/config';
 import { DashboardExporter } from './DashboardExporter';
 import { DashboardModel } from '../../state/DashboardModel';
 import { DatasourceSrv } from 'app/features/plugins/datasource_srv';
-import { PanelPlugin } from 'app/types';
+import { PanelPluginMeta } from 'app/types';
 
 describe('given dashboard with repeated panels', () => {
   let dash: any, exported: any;
@@ -97,19 +97,19 @@ describe('given dashboard with repeated panels', () => {
       id: 'graph',
       name: 'Graph',
       info: { version: '1.1.0' },
-    } as PanelPlugin;
+    } as PanelPluginMeta;
 
     config.panels['table'] = {
       id: 'table',
       name: 'Table',
       info: { version: '1.1.1' },
-    } as PanelPlugin;
+    } as PanelPluginMeta;
 
     config.panels['heatmap'] = {
       id: 'heatmap',
       name: 'Heatmap',
       info: { version: '1.1.2' },
-    } as PanelPlugin;
+    } as PanelPluginMeta;
 
     dash = new DashboardModel(dash, {});
     const exporter = new DashboardExporter(datasourceSrvStub);

public/app/features/dashboard/components/DashExportModal/DashboardExporter.ts

@@ -4,7 +4,7 @@ import config from 'app/core/config';
 import { DashboardModel } from '../../state/DashboardModel';
 import DatasourceSrv from 'app/features/plugins/datasource_srv';
 import { PanelModel } from 'app/features/dashboard/state';
-import { PanelPlugin } from 'app/types/plugins';
+import { PanelPluginMeta } from 'app/types/plugins';
 
 interface Input {
   name: string;
@@ -119,7 +119,7 @@ export class DashboardExporter {
         }
       }
 
-      const panelDef: PanelPlugin = config.panels[panel.type];
+      const panelDef: PanelPluginMeta = config.panels[panel.type];
       if (panelDef) {
         requires['panel' + panelDef.id] = {
           type: 'panel',

public/app/features/dashboard/dashgrid/DashboardPanel.tsx

@@ -17,8 +17,8 @@ import { PanelResizer } from './PanelResizer';
 
 // Types
 import { PanelModel, DashboardModel } from '../state';
-import { PanelPlugin } from 'app/types';
+import { PanelPluginMeta } from 'app/types';
-import { AngularPanelPlugin, ReactPanelPlugin } from '@grafana/ui/src/types/panel';
+import { AngularPanelPlugin, PanelPlugin } from '@grafana/ui/src/types/panel';
 import { AutoSizer } from 'react-virtualized';
 
 export interface Props {
@@ -29,7 +29,7 @@ export interface Props {
 }
 
 export interface State {
-  plugin: PanelPlugin;
+  plugin: PanelPluginMeta;
   angularPanel: AngularComponent;
 }
 
@@ -61,7 +61,7 @@ export class DashboardPanel extends PureComponent<Props, State> {
     return <AddPanelWidget panel={this.props.panel} dashboard={this.props.dashboard} />;
   }
 
-  onPluginTypeChanged = (plugin: PanelPlugin) => {
+  onPluginTypeChanged = (plugin: PanelPluginMeta) => {
     this.loadPlugin(plugin.id);
   };
 
@@ -92,7 +92,7 @@ export class DashboardPanel extends PureComponent<Props, State> {
     }
   }
 
-  async importPanelPluginModule(plugin: PanelPlugin): Promise<PanelPlugin> {
+  async importPanelPluginModule(plugin: PanelPluginMeta): Promise<PanelPluginMeta> {
     if (plugin.hasBeenImported) {
       return plugin;
     }
@@ -101,8 +101,8 @@ export class DashboardPanel extends PureComponent<Props, State> {
       const importedPlugin = await importPanelPlugin(plugin.module);
       if (importedPlugin instanceof AngularPanelPlugin) {
         plugin.angularPlugin = importedPlugin as AngularPanelPlugin;
-      } else if (importedPlugin instanceof ReactPanelPlugin) {
+      } else if (importedPlugin instanceof PanelPlugin) {
-        plugin.reactPlugin = importedPlugin as ReactPanelPlugin;
+        plugin.vizPlugin = importedPlugin as PanelPlugin;
       }
     } catch (e) {
       plugin = getPanelPluginNotFound(plugin.id);
@@ -210,7 +210,7 @@ export class DashboardPanel extends PureComponent<Props, State> {
               onMouseLeave={this.onMouseLeave}
               style={styles}
             >
-              {plugin.reactPlugin && this.renderReactPanel()}
+              {plugin.vizPlugin && this.renderReactPanel()}
               {plugin.angularPlugin && this.renderAngularPanel()}
             </div>
           )}

public/app/features/dashboard/dashgrid/PanelChrome.tsx

@@ -16,7 +16,7 @@ import config from 'app/core/config';
 
 // Types
 import { DashboardModel, PanelModel } from '../state';
-import { PanelPlugin } from 'app/types';
+import { PanelPluginMeta } from 'app/types';
 import { LoadingState, PanelData } from '@grafana/ui';
 import { ScopedVars } from '@grafana/ui';
 
@@ -30,7 +30,7 @@ const DEFAULT_PLUGIN_ERROR = 'Error in plugin';
 export interface Props {
   panel: PanelModel;
   dashboard: DashboardModel;
-  plugin: PanelPlugin;
+  plugin: PanelPluginMeta;
   isFullscreen: boolean;
   width: number;
   height: number;
@@ -216,7 +216,7 @@ export class PanelChrome extends PureComponent<Props, State> {
   renderPanel(width: number, height: number): JSX.Element {
     const { panel, plugin } = this.props;
     const { renderCounter, data, isFirstLoad } = this.state;
-    const PanelComponent = plugin.reactPlugin.panel;
+    const PanelComponent = plugin.vizPlugin.panel;
 
     // This is only done to increase a counter that is used by backend
     // image rendering (phantomjs/headless chrome) to know when to capture image
@@ -237,7 +237,7 @@ export class PanelChrome extends PureComponent<Props, State> {
           <PanelComponent
             data={data}
             timeRange={data.request ? data.request.range : this.timeSrv.timeRange()}
-            options={panel.getOptions(plugin.reactPlugin.defaults)}
+            options={panel.getOptions(plugin.vizPlugin.defaults)}
             width={width - 2 * config.theme.panelPadding.horizontal}
             height={height - PANEL_HEADER_HEIGHT - config.theme.panelPadding.vertical}
             renderCounter={renderCounter}

public/app/features/dashboard/dashgrid/PanelPluginNotFound.tsx

@@ -6,8 +6,8 @@ import React, { PureComponent } from 'react';
 import { AlertBox } from 'app/core/components/AlertBox/AlertBox';
 
 // Types
-import { PanelPlugin, AppNotificationSeverity } from 'app/types';
+import { PanelPluginMeta, AppNotificationSeverity } from 'app/types';
-import { PanelProps, ReactPanelPlugin, PluginType } from '@grafana/ui';
+import { PanelProps, PanelPlugin, PluginType } from '@grafana/ui';
 
 interface Props {
   pluginId: string;
@@ -34,7 +34,7 @@ class PanelPluginNotFound extends PureComponent<Props> {
   }
 }
 
-export function getPanelPluginNotFound(id: string): PanelPlugin {
+export function getPanelPluginNotFound(id: string): PanelPluginMeta {
   const NotFound = class NotFound extends PureComponent<PanelProps> {
     render() {
       return <PanelPluginNotFound pluginId={id} />;
@@ -63,7 +63,7 @@ export function getPanelPluginNotFound(id: string): PanelPlugin {
       updated: '',
       version: '',
     },
-    reactPlugin: new ReactPanelPlugin(NotFound),
+    vizPlugin: new PanelPlugin(NotFound),
     angularPlugin: null,
   };
 }

public/app/features/dashboard/panel_editor/PanelEditor.tsx

@@ -13,16 +13,16 @@ import { AngularComponent } from 'app/core/services/AngularLoader';
 
 import { PanelModel } from '../state/PanelModel';
 import { DashboardModel } from '../state/DashboardModel';
-import { PanelPlugin } from 'app/types/plugins';
+import { PanelPluginMeta } from 'app/types/plugins';
 
 import { Tooltip } from '@grafana/ui';
 
 interface PanelEditorProps {
   panel: PanelModel;
   dashboard: DashboardModel;
-  plugin: PanelPlugin;
+  plugin: PanelPluginMeta;
   angularPanel?: AngularComponent;
-  onTypeChanged: (newType: PanelPlugin) => void;
+  onTypeChanged: (newType: PanelPluginMeta) => void;
 }
 
 interface PanelEditorTab {

public/app/features/dashboard/panel_editor/VisualizationTab.tsx

@@ -16,16 +16,16 @@ import { FadeIn } from 'app/core/components/Animations/FadeIn';
 // Types
 import { PanelModel } from '../state';
 import { DashboardModel } from '../state';
-import { PanelPlugin } from 'app/types/plugins';
+import { PanelPluginMeta } from 'app/types/plugins';
 import { VizPickerSearch } from './VizPickerSearch';
 import PluginStateinfo from 'app/features/plugins/PluginStateInfo';
 
 interface Props {
   panel: PanelModel;
   dashboard: DashboardModel;
-  plugin: PanelPlugin;
+  plugin: PanelPluginMeta;
   angularPanel?: AngularComponent;
-  onTypeChanged: (newType: PanelPlugin) => void;
+  onTypeChanged: (newType: PanelPluginMeta) => void;
   updateLocation: typeof updateLocation;
   urlOpenVizPicker: boolean;
 }
@@ -54,7 +54,7 @@ export class VisualizationTab extends PureComponent<Props, State> {
 
   getReactPanelOptions = () => {
     const { panel, plugin } = this.props;
-    return panel.getOptions(plugin.reactPlugin.defaults);
+    return panel.getOptions(plugin.vizPlugin.defaults);
   };
 
   renderPanelOptions() {
@@ -64,8 +64,8 @@ export class VisualizationTab extends PureComponent<Props, State> {
       return <div ref={element => (this.element = element)} />;
     }
 
-    if (plugin.reactPlugin) {
+    if (plugin.vizPlugin) {
-      const PanelEditor = plugin.reactPlugin.editor;
+      const PanelEditor = plugin.vizPlugin.editor;
 
       if (PanelEditor) {
         return <PanelEditor options={this.getReactPanelOptions()} onOptionsChange={this.onPanelOptionsChanged} />;
@@ -197,7 +197,7 @@ export class VisualizationTab extends PureComponent<Props, State> {
     }
   };
 
-  onTypeChanged = (plugin: PanelPlugin) => {
+  onTypeChanged = (plugin: PanelPluginMeta) => {
     if (plugin.id === this.props.plugin.id) {
       this.setState({ isVizPickerOpen: false });
     } else {

public/app/features/dashboard/panel_editor/VizPickerSearch.tsx

@@ -2,10 +2,10 @@ import React, { PureComponent } from 'react';
 
 import { FilterInput } from 'app/core/components/FilterInput/FilterInput';
 
-import { PanelPlugin } from 'app/types';
+import { PanelPluginMeta } from 'app/types';
 
 interface Props {
-  plugin: PanelPlugin;
+  plugin: PanelPluginMeta;
   searchQuery: string;
   onChange: (query: string) => void;
   onClose: () => void;

public/app/features/dashboard/panel_editor/VizTypePicker.tsx

@@ -1,13 +1,13 @@
 import React, { PureComponent } from 'react';
 
 import config from 'app/core/config';
-import { PanelPlugin } from 'app/types/plugins';
+import { PanelPluginMeta } from 'app/types/plugins';
 import VizTypePickerPlugin from './VizTypePickerPlugin';
 import { EmptySearchResult } from '@grafana/ui';
 
 export interface Props {
-  current: PanelPlugin;
+  current: PanelPluginMeta;
-  onTypeChanged: (newType: PanelPlugin) => void;
+  onTypeChanged: (newType: PanelPluginMeta) => void;
   searchQuery: string;
   onClose: () => void;
 }
@@ -25,16 +25,16 @@ export class VizTypePicker extends PureComponent<Props> {
     return filteredPluginList.length - 1;
   }
 
-  get getPanelPlugins(): PanelPlugin[] {
+  get getPanelPlugins(): PanelPluginMeta[] {
     const allPanels = config.panels;
 
     return Object.keys(allPanels)
       .filter(key => allPanels[key]['hideFromList'] === false)
       .map(key => allPanels[key])
-      .sort((a: PanelPlugin, b: PanelPlugin) => a.sort - b.sort);
+      .sort((a: PanelPluginMeta, b: PanelPluginMeta) => a.sort - b.sort);
   }
 
-  renderVizPlugin = (plugin: PanelPlugin, index: number) => {
+  renderVizPlugin = (plugin: PanelPluginMeta, index: number) => {
     const { onTypeChanged } = this.props;
     const isCurrent = plugin.id === this.props.current.id;
 
@@ -48,7 +48,7 @@ export class VizTypePicker extends PureComponent<Props> {
     );
   };
 
-  getFilteredPluginList = (): PanelPlugin[] => {
+  getFilteredPluginList = (): PanelPluginMeta[] => {
     const { searchQuery } = this.props;
     const regex = new RegExp(searchQuery, 'i');
     const pluginList = this.pluginList;

public/app/features/dashboard/panel_editor/VizTypePickerPlugin.tsx

@@ -1,10 +1,10 @@
 import React from 'react';
 import classNames from 'classnames';
-import { PanelPlugin } from 'app/types/plugins';
+import { PanelPluginMeta } from 'app/types/plugins';
 
 interface Props {
   isCurrent: boolean;
-  plugin: PanelPlugin;
+  plugin: PanelPluginMeta;
   onClick: () => void;
 }
 

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

@@ -1,6 +1,6 @@
 import { PanelModel } from './PanelModel';
 import { getPanelPlugin } from '../../plugins/__mocks__/pluginMocks';
-import { ReactPanelPlugin, AngularPanelPlugin } from '@grafana/ui/src/types/panel';
+import { PanelPlugin, AngularPanelPlugin } from '@grafana/ui/src/types/panel';
 
 class TablePanelCtrl {}
 
@@ -123,13 +123,13 @@ describe('PanelModel', () => {
 
     describe('when changing to react panel', () => {
       const onPanelTypeChanged = jest.fn();
-      const reactPlugin = new ReactPanelPlugin({} as any).setPanelChangeHandler(onPanelTypeChanged as any);
+      const reactPlugin = new PanelPlugin({} as any).setPanelChangeHandler(onPanelTypeChanged as any);
 
       beforeEach(() => {
         model.changePlugin(
           getPanelPlugin({
             id: 'react',
-            reactPlugin: reactPlugin,
+            vizPlugin: reactPlugin,
           })
         );
       });

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

@@ -7,7 +7,7 @@ import { getNextRefIdChar } from 'app/core/utils/query';
 
 // Types
 import { DataQuery, Threshold, ScopedVars, DataQueryResponseData } from '@grafana/ui';
-import { PanelPlugin } from 'app/types';
+import { PanelPluginMeta } from 'app/types';
 import config from 'app/core/config';
 
 import { PanelQueryRunner } from './PanelQueryRunner';
@@ -117,7 +117,7 @@ export class PanelModel {
   cacheTimeout?: any;
   cachedPluginOptions?: any;
   legend?: { show: boolean };
-  plugin?: PanelPlugin;
+  plugin?: PanelPluginMeta;
   private queryRunner?: PanelQueryRunner;
 
   constructor(model: any) {
@@ -249,23 +249,23 @@ export class PanelModel {
     });
   }
 
-  private getPluginVersion(plugin: PanelPlugin): string {
+  private getPluginVersion(plugin: PanelPluginMeta): string {
     return this.plugin && this.plugin.info.version ? this.plugin.info.version : config.buildInfo.version;
   }
 
-  pluginLoaded(plugin: PanelPlugin) {
+  pluginLoaded(plugin: PanelPluginMeta) {
     this.plugin = plugin;
 
-    if (plugin.reactPlugin && plugin.reactPlugin.onPanelMigration) {
+    if (plugin.vizPlugin && plugin.vizPlugin.onPanelMigration) {
       const version = this.getPluginVersion(plugin);
       if (version !== this.pluginVersion) {
-        this.options = plugin.reactPlugin.onPanelMigration(this);
+        this.options = plugin.vizPlugin.onPanelMigration(this);
         this.pluginVersion = version;
       }
     }
   }
 
-  changePlugin(newPlugin: PanelPlugin) {
+  changePlugin(newPlugin: PanelPluginMeta) {
     const pluginId = newPlugin.id;
     const oldOptions: any = this.getOptionsToRemember();
     const oldPluginId = this.type;
@@ -292,7 +292,7 @@ export class PanelModel {
     this.plugin = newPlugin;
 
     // Let panel plugins inspect options from previous panel and keep any that it can use
-    const reactPanel = newPlugin.reactPlugin;
+    const reactPanel = newPlugin.vizPlugin;
 
     if (reactPanel) {
       if (reactPanel.onPanelTypeChanged) {

public/app/features/plugins/__mocks__/pluginMocks.ts

@@ -1,4 +1,4 @@
-import { Plugin, PanelPlugin, PanelDataFormat } from 'app/types';
+import { Plugin, PanelPluginMeta, PanelDataFormat } from 'app/types';
 import { PluginType } from '@grafana/ui';
 
 export const getMockPlugins = (amount: number): Plugin[] => {
@@ -34,7 +34,7 @@ export const getMockPlugins = (amount: number): Plugin[] => {
   return plugins;
 };
 
-export const getPanelPlugin = (options: Partial<PanelPlugin>): PanelPlugin => {
+export const getPanelPlugin = (options: Partial<PanelPluginMeta>): PanelPluginMeta => {
   return {
     id: options.id,
     type: PluginType.panel,
@@ -58,7 +58,7 @@ export const getPanelPlugin = (options: Partial<PanelPlugin>): PanelPlugin => {
     hideFromList: options.hideFromList === true,
     module: '',
     baseUrl: '',
-    reactPlugin: options.reactPlugin,
+    vizPlugin: options.vizPlugin,
     angularPlugin: options.angularPlugin,
   };
 };

public/app/features/plugins/plugin_loader.ts

@@ -18,7 +18,7 @@ import config from 'app/core/config';
 import TimeSeries from 'app/core/time_series2';
 import TableModel from 'app/core/table_model';
 import { coreModule, appEvents, contextSrv } from 'app/core/core';
-import { DataSourcePlugin, AppPlugin, ReactPanelPlugin, AngularPanelPlugin, PluginMeta } from '@grafana/ui/src/types';
+import { DataSourcePlugin, AppPlugin, PanelPlugin, AngularPanelPlugin, PluginMeta } from '@grafana/ui/src/types';
 import * as datemath from 'app/core/utils/datemath';
 import * as fileExport from 'app/core/utils/file_export';
 import * as flatten from 'app/core/utils/flatten';
@@ -182,10 +182,10 @@ export function importAppPlugin(meta: PluginMeta): Promise<AppPlugin> {
   });
 }
 
-export function importPanelPlugin(path: string): Promise<AngularPanelPlugin | ReactPanelPlugin> {
+export function importPanelPlugin(path: string): Promise<AngularPanelPlugin | PanelPlugin> {
   return importPluginModule(path).then(pluginExports => {
-    if (pluginExports.reactPanel) {
+    if (pluginExports.plugin) {
-      return pluginExports.reactPanel as ReactPanelPlugin;
+      return pluginExports.plugin as PanelPlugin;
     } else {
       return new AngularPanelPlugin(pluginExports.PanelCtrl);
     }

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

@@ -1,10 +1,10 @@
-import { ReactPanelPlugin, sharedSingleStatOptionsCheck } from '@grafana/ui';
+import { PanelPlugin, sharedSingleStatOptionsCheck } from '@grafana/ui';
 
 import { BarGaugePanel } from './BarGaugePanel';
 import { BarGaugePanelEditor } from './BarGaugePanelEditor';
 import { BarGaugeOptions, defaults } from './types';
 
-export const reactPanel = new ReactPanelPlugin<BarGaugeOptions>(BarGaugePanel)
+export const plugin = new PanelPlugin<BarGaugeOptions>(BarGaugePanel)
   .setDefaults(defaults)
   .setEditor(BarGaugePanelEditor)
   .setPanelChangeHandler(sharedSingleStatOptionsCheck);

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

@@ -1,9 +1,9 @@
-import { ReactPanelPlugin, sharedSingleStatMigrationCheck, sharedSingleStatOptionsCheck } from '@grafana/ui';
+import { PanelPlugin, sharedSingleStatMigrationCheck, sharedSingleStatOptionsCheck } from '@grafana/ui';
 import { GaugePanelEditor } from './GaugePanelEditor';
 import { GaugePanel } from './GaugePanel';
 import { GaugeOptions, defaults } from './types';
 
-export const reactPanel = new ReactPanelPlugin<GaugeOptions>(GaugePanel)
+export const plugin = new PanelPlugin<GaugeOptions>(GaugePanel)
   .setDefaults(defaults)
   .setEditor(GaugePanelEditor)
   .setPanelChangeHandler(sharedSingleStatOptionsCheck)

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

@@ -1,6 +1,6 @@
-import { ReactPanelPlugin } from '@grafana/ui';
+import { PanelPlugin } from '@grafana/ui';
 import { GraphPanelEditor } from './GraphPanelEditor';
 import { GraphPanel } from './GraphPanel';
 import { Options, defaults } from './types';
 
-export const reactPanel = new ReactPanelPlugin<Options>(GraphPanel).setDefaults(defaults).setEditor(GraphPanelEditor);
+export const plugin = new PanelPlugin<Options>(GraphPanel).setDefaults(defaults).setEditor(GraphPanelEditor);

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

@@ -1,8 +1,8 @@
-import { ReactPanelPlugin } from '@grafana/ui';
+import { PanelPlugin } from '@grafana/ui';
 import { PieChartPanelEditor } from './PieChartPanelEditor';
 import { PieChartPanel } from './PieChartPanel';
 import { PieChartOptions, defaults } from './types';
 
-export const reactPanel = new ReactPanelPlugin<PieChartOptions>(PieChartPanel)
+export const plugin = new PanelPlugin<PieChartOptions>(PieChartPanel)
   .setDefaults(defaults)
   .setEditor(PieChartPanelEditor);

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

@@ -1,9 +1,9 @@
-import { ReactPanelPlugin, sharedSingleStatMigrationCheck, sharedSingleStatOptionsCheck } from '@grafana/ui';
+import { PanelPlugin, sharedSingleStatMigrationCheck, sharedSingleStatOptionsCheck } from '@grafana/ui';
 import { SingleStatOptions, defaults } from './types';
 import { SingleStatPanel } from './SingleStatPanel';
 import { SingleStatEditor } from './SingleStatEditor';
 
-export const reactPanel = new ReactPanelPlugin<SingleStatOptions>(SingleStatPanel)
+export const plugin = new PanelPlugin<SingleStatOptions>(SingleStatPanel)
   .setDefaults(defaults)
   .setEditor(SingleStatEditor)
   .setPanelChangeHandler(sharedSingleStatOptionsCheck)

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

@@ -1,7 +1,7 @@
-import { ReactPanelPlugin } from '@grafana/ui';
+import { PanelPlugin } from '@grafana/ui';
 
 import { TablePanelEditor } from './TablePanelEditor';
 import { TablePanel } from './TablePanel';
 import { Options, defaults } from './types';
 
-export const reactPanel = new ReactPanelPlugin<Options>(TablePanel).setDefaults(defaults).setEditor(TablePanelEditor);
+export const plugin = new PanelPlugin<Options>(TablePanel).setDefaults(defaults).setEditor(TablePanelEditor);

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

@@ -1,10 +1,10 @@
-import { ReactPanelPlugin } from '@grafana/ui';
+import { PanelPlugin } from '@grafana/ui';
 
 import { TextPanelEditor } from './TextPanelEditor';
 import { TextPanel } from './TextPanel';
 import { TextOptions, defaults } from './types';
 
-export const reactPanel = new ReactPanelPlugin<TextOptions>(TextPanel)
+export const plugin = new PanelPlugin<TextOptions>(TextPanel)
   .setDefaults(defaults)
   .setEditor(TextPanelEditor)
   .setPanelChangeHandler((options: TextOptions, prevPluginId: string, prevOptions: any) => {

public/app/types/plugins.ts

@@ -1,12 +1,10 @@
-import { AngularPanelPlugin, ReactPanelPlugin, PluginMetaInfo, PluginMeta } from '@grafana/ui/src/types';
+import { AngularPanelPlugin, PanelPlugin, PluginMeta } from '@grafana/ui/src/types';
 
-export interface PanelPlugin extends PluginMeta {
+export interface PanelPluginMeta extends PluginMeta {
   hideFromList?: boolean;
-  baseUrl: string;
-  info: PluginMetaInfo;
   sort: number;
   angularPlugin: AngularPanelPlugin | null;
-  reactPlugin: ReactPanelPlugin | null;
+  vizPlugin: PanelPlugin | null;
   hasBeenImported?: boolean;
   dataFormats: PanelDataFormat[];
 }

public/test/specs/helpers.ts

@@ -3,7 +3,7 @@ import config from 'app/core/config';
 import * as dateMath from 'app/core/utils/datemath';
 import { angularMocks, sinon } from '../lib/common';
 import { PanelModel } from 'app/features/dashboard/state/PanelModel';
-import { PanelPlugin } from 'app/types';
+import { PanelPluginMeta } from 'app/types';
 import { RawTimeRange } from '@grafana/ui/src/types';
 
 export function ControllerTestContext(this: any) {
@@ -64,7 +64,7 @@ export function ControllerTestContext(this: any) {
         $rootScope.colors.push('#' + i);
       }
 
-      config.panels['test'] = { info: {} } as PanelPlugin;
+      config.panels['test'] = { info: {} } as PanelPluginMeta;
       self.ctrl = $controller(
         Ctrl,
         { $scope: self.scope },