StatPanels: Fixes to palette color scheme is not cleared when loading panel (#31126)

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

@@ -313,11 +313,12 @@ export class PanelModel implements DataConfigSource {
     this.fieldConfig = restoreCustomOverrideRules(this.fieldConfig, prevOptions.fieldConfig);
   }
 
-  applyPluginOptionDefaults(plugin: PanelPlugin) {
+  applyPluginOptionDefaults(plugin: PanelPlugin, isAfterPluginChange: boolean) {
     const options = getPanelOptionsWithDefaults({
       plugin,
       currentOptions: this.options,
       currentFieldConfig: this.fieldConfig,
+      isAfterPluginChange: isAfterPluginChange,
     });
 
     this.fieldConfig = options.fieldConfig;
@@ -336,7 +337,7 @@ export class PanelModel implements DataConfigSource {
       }
     }
 
-    this.applyPluginOptionDefaults(plugin);
+    this.applyPluginOptionDefaults(plugin, false);
     this.resendLastResult();
   }
 
@@ -389,7 +390,7 @@ export class PanelModel implements DataConfigSource {
 
     // For some reason I need to rebind replace variables here, otherwise the viz repeater does not work
     this.replaceVariables = this.replaceVariables.bind(this);
-    this.applyPluginOptionDefaults(newPlugin);
+    this.applyPluginOptionDefaults(newPlugin, true);
 
     if (newPlugin.onPanelMigration) {
       this.pluginVersion = getPluginVersion(newPlugin);

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

@@ -79,6 +79,7 @@ describe('getPanelOptionsWithDefaults', () => {
           defaults: {},
           overrides: [],
         },
+        isAfterPluginChange: false,
       });
 
       expect(result).toMatchInlineSnapshot(`
@@ -129,6 +130,7 @@ describe('getPanelOptionsWithDefaults', () => {
           },
           overrides: [],
         },
+        isAfterPluginChange: true,
       });
 
       expect(result).toMatchInlineSnapshot(`
@@ -187,6 +189,7 @@ describe('getPanelOptionsWithDefaults', () => {
           },
           overrides: [],
         },
+        isAfterPluginChange: true,
       });
 
       expect(result.fieldConfig.defaults.color!.mode).toBe(FieldColorModeId.PaletteClassic);
@@ -223,6 +226,7 @@ describe('getPanelOptionsWithDefaults', () => {
             },
           },
         },
+        isAfterPluginChange: true,
       });
       expect(result.fieldConfig.defaults.color!.mode).toBe(FieldColorModeId.Thresholds);
     });
@@ -357,6 +361,7 @@ interface ScenarioOptions {
   standardOptions?: Partial<Record<FieldConfigProperty, StandardOptionConfig>>;
   plugin?: PanelPlugin;
   options?: any;
+  isAfterPluginChange?: boolean;
 }
 
 function runScenario(options: ScenarioOptions) {
@@ -386,5 +391,6 @@ function runScenario(options: ScenarioOptions) {
     plugin,
     currentOptions: options.options || {},
     currentFieldConfig: fieldConfig,
+    isAfterPluginChange: !!options.isAfterPluginChange,
   });
 }

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

@@ -17,6 +17,7 @@ export interface Props {
   plugin: PanelPlugin;
   currentFieldConfig: FieldConfigSource;
   currentOptions: Record<string, any>;
+  isAfterPluginChange: boolean;
 }
 
 export interface OptionDefaults {
@@ -24,7 +25,12 @@ export interface OptionDefaults {
   fieldConfig: FieldConfigSource;
 }
 
-export function getPanelOptionsWithDefaults({ plugin, currentOptions, currentFieldConfig }: Props): OptionDefaults {
+export function getPanelOptionsWithDefaults({
+  plugin,
+  currentOptions,
+  currentFieldConfig,
+  isAfterPluginChange,
+}: Props): OptionDefaults {
   const optionsWithDefaults = mergeWith(
     {},
     plugin.defaults,
@@ -37,7 +43,7 @@ export function getPanelOptionsWithDefaults({ plugin, currentOptions, currentFie
   );
 
   const fieldConfigWithDefaults = applyFieldConfigDefaults(currentFieldConfig, plugin);
-  const fieldConfigWithOptimalColorMode = adaptFieldColorMode(plugin, fieldConfigWithDefaults);
+  const fieldConfigWithOptimalColorMode = adaptFieldColorMode(plugin, fieldConfigWithDefaults, isAfterPluginChange);
 
   return { options: optionsWithDefaults, fieldConfig: fieldConfigWithOptimalColorMode };
 }
@@ -119,7 +125,15 @@ function cleanProperties(obj: any, parentPath: string, fieldConfigRegistry: Fiel
   }
 }
 
-function adaptFieldColorMode(plugin: PanelPlugin, fieldConfig: FieldConfigSource): FieldConfigSource {
+function adaptFieldColorMode(
+  plugin: PanelPlugin,
+  fieldConfig: FieldConfigSource,
+  isAfterPluginChange: boolean
+): FieldConfigSource {
+  if (!isAfterPluginChange) {
+    return fieldConfig;
+  }
+
   // adjust to prefered field color setting if needed
   const color = plugin.fieldConfigRegistry.getIfExists(FieldConfigProperty.Color);