Revert "grafana/data: PanelTypeChangedHandler API update to use PanelModel…

Revert "grafana/data: PanelTypeChangedHandler API update to use PanelModel instead of panel options object [BREAKING] (#22754)"

This reverts commit 16f3fe7e.

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

@@ -63,10 +63,10 @@ export interface PanelModel<TOptions = any> {
 export type PanelMigrationHandler<TOptions = any> = (panel: PanelModel<TOptions>) => Partial<TOptions>;
 
 /**
- * Called before a panel is initialized. Allows panel inspection for any updates before changing the panel type.
+ * Called before a panel is initialized
  */
 export type PanelTypeChangedHandler<TOptions = any> = (
-  panel: PanelModel<TOptions>,
+  options: Partial<TOptions>,
   prevPluginId: string,
   prevOptions: any
 ) => Partial<TOptions>;
@@ -117,12 +117,8 @@ export class PanelPlugin<TOptions = any> extends GrafanaPlugin<PanelPluginMeta>
   }
 
   /**
-   * This function is called when the visualization was changed. This
-   * passes in the panel model for previous visualisation options inspection
-   * and panel model updates.
-   *
-   * This is useful for supporting PanelModel API updates when changing
-   * between Angular and React panels.
+   * This function is called when the visualization was changed.  This
+   * passes in the options that were used in the previous visualization
    */
   setPanelChangeHandler(handler: PanelTypeChangedHandler) {
     this.onPanelTypeChanged = handler;

packages/grafana-ui/src/components/SingleStatShared/SingleStatBaseOptions.ts

@@ -27,16 +27,15 @@ export interface SingleStatBaseOptions {
 const optionsToKeep = ['fieldOptions', 'orientation'];
 
 export function sharedSingleStatPanelChangedHandler(
-  panel: PanelModel<Partial<SingleStatBaseOptions>> | any,
+  options: Partial<SingleStatBaseOptions> | any,
   prevPluginId: string,
   prevOptions: any
 ) {
-  let options = panel.options;
   // Migrating from angular singlestat
   if (prevPluginId === 'singlestat' && prevOptions.angular) {
-    const prevPanel = prevOptions.angular;
-    const reducer = fieldReducers.getIfExists(prevPanel.valueName);
-    options = {
+    const panel = prevOptions.angular;
+    const reducer = fieldReducers.getIfExists(panel.valueName);
+    const options = {
       fieldOptions: {
         defaults: {} as FieldConfig,
         overrides: [] as ConfigOverrideRule[],
@@ -46,28 +45,28 @@ export function sharedSingleStatPanelChangedHandler(
     };
 
     const defaults = options.fieldOptions.defaults;
-    if (prevPanel.format) {
-      defaults.unit = prevPanel.format;
+    if (panel.format) {
+      defaults.unit = panel.format;
     }
-    if (prevPanel.nullPointMode) {
-      defaults.nullValueMode = prevPanel.nullPointMode;
+    if (panel.nullPointMode) {
+      defaults.nullValueMode = panel.nullPointMode;
     }
-    if (prevPanel.nullText) {
-      defaults.noValue = prevPanel.nullText;
+    if (panel.nullText) {
+      defaults.noValue = panel.nullText;
     }
-    if (prevPanel.decimals || prevPanel.decimals === 0) {
-      defaults.decimals = prevPanel.decimals;
+    if (panel.decimals || panel.decimals === 0) {
+      defaults.decimals = panel.decimals;
     }
 
     // Convert thresholds and color values
-    if (prevPanel.thresholds && prevPanel.colors) {
-      const levels = prevPanel.thresholds.split(',').map((strVale: string) => {
+    if (panel.thresholds && panel.colors) {
+      const levels = panel.thresholds.split(',').map((strVale: string) => {
         return Number(strVale.trim());
       });
 
       // One more color than threshold
       const thresholds: Threshold[] = [];
-      for (const color of prevPanel.colors) {
+      for (const color of panel.colors) {
         const idx = thresholds.length - 1;
         if (idx >= 0) {
           thresholds.push({ value: levels[idx], color });
@@ -82,14 +81,14 @@ export function sharedSingleStatPanelChangedHandler(
     }
 
     // Convert value mappings
-    const mappings = convertOldAngularValueMapping(prevPanel);
+    const mappings = convertOldAngularValueMapping(panel);
     if (mappings && mappings.length) {
       defaults.mappings = mappings;
     }
 
-    if (prevPanel.gauge && prevPanel.gauge.show) {
-      defaults.min = prevPanel.gauge.minValue;
-      defaults.max = prevPanel.gauge.maxValue;
+    if (panel.gauge && panel.gauge.show) {
+      defaults.min = panel.gauge.minValue;
+      defaults.max = panel.gauge.maxValue;
     }
     return options;
   }

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

@@ -313,7 +313,7 @@ export class PanelModel {
         old = oldOptions.options;
       }
       this.options = this.options || {};
-      Object.assign(this.options, newPlugin.onPanelTypeChanged(this, oldPluginId, old));
+      Object.assign(this.options, newPlugin.onPanelTypeChanged(this.options, oldPluginId, old));
     }
 
     // switch

public/app/plugins/panel/annolist/module.ts

 import { AnnoListPanel } from './AnnoListPanel';
 import { AnnoOptions, defaults } from './types';
 import { AnnoListEditor } from './AnnoListEditor';
-import { PanelModel, PanelPlugin } from '@grafana/data';
+import { PanelPlugin } from '@grafana/data';
 
 export const plugin = new PanelPlugin<AnnoOptions>(AnnoListPanel)
   .setDefaults(defaults)
   .setEditor(AnnoListEditor)
 
   // TODO, we should support this directly in the plugin infrastructure
-  .setPanelChangeHandler((panel: PanelModel<AnnoOptions>, prevPluginId: string, prevOptions: any) => {
+  .setPanelChangeHandler((options: AnnoOptions, prevPluginId: string, prevOptions: any) => {
     if (prevPluginId === 'ryantxu-annolist-panel') {
       return prevOptions as AnnoOptions;
     }
-    return panel.options;
+    return options;
   });

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

@@ -9,12 +9,12 @@ export const gaugePanelMigrationHandler = (panel: PanelModel<GaugeOptions>): Par
 
 // This is called when the panel changes from another panel
 export const gaugePanelChangedHandler = (
-  panel: PanelModel<Partial<GaugeOptions>> | any,
+  options: Partial<GaugeOptions> | any,
   prevPluginId: string,
   prevOptions: any
 ) => {
   // This handles most config changes
-  const opts = sharedSingleStatPanelChangedHandler(panel, prevPluginId, prevOptions) as GaugeOptions;
+  const opts = sharedSingleStatPanelChangedHandler(options, prevPluginId, prevOptions) as GaugeOptions;
 
   // Changing from angular singlestat
   if (prevPluginId === 'singlestat' && prevOptions.angular) {

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

-import { PanelModel, PanelPlugin } from '@grafana/data';
+import { PanelPlugin } from '@grafana/data';
 
 import { TextPanelEditor } from './TextPanelEditor';
 import { TextPanel } from './TextPanel';
@@ -7,9 +7,9 @@ import { TextOptions, defaults } from './types';
 export const plugin = new PanelPlugin<TextOptions>(TextPanel)
   .setDefaults(defaults)
   .setEditor(TextPanelEditor)
-  .setPanelChangeHandler((panel: PanelModel<TextOptions>, prevPluginId: string, prevOptions: any) => {
+  .setPanelChangeHandler((options: TextOptions, prevPluginId: string, prevOptions: any) => {
     if (prevPluginId === 'text') {
       return prevOptions as TextOptions;
     }
-    return panel.options;
+    return options;
   });