[v11.0.x] Scenes/PanelVizTypePicker: Use default tab if listMode is unsupported (#87006)

Scenes/PanelVizTypePicker: Use default tab if listMode is unsupported (#86885)

Closes #84565

(cherry picked from commit 1dbb3bfdea)

Co-authored-by: kay delaney <45561153+kaydelaney@users.noreply.github.com>

public/app/features/dashboard-scene/panel-edit/PanelVizTypePicker.tsx

@@ -1,5 +1,5 @@
 import { css } from '@emotion/css';
-import React, { useMemo, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import { useLocalStorage } from 'react-use';
 
 import { GrafanaTheme2, PanelData, SelectableValue } from '@grafana/data';
@@ -30,7 +30,21 @@ export function PanelVizTypePicker({ vizManager, data, onChange }: Props) {
   const defaultTab = isWidgetEnabled ? VisualizationSelectPaneTab.Widgets : VisualizationSelectPaneTab.Visualizations;
   const panelModel = useMemo(() => new PanelModelCompatibilityWrapper(panel), [panel]);
 
+  const supportedListModes = useMemo(
+    () =>
+      new Set([
+        VisualizationSelectPaneTab.Widgets,
+        VisualizationSelectPaneTab.Visualizations,
+        VisualizationSelectPaneTab.Suggestions,
+      ]),
+    []
+  );
   const [listMode, setListMode] = useLocalStorage(tabKey, defaultTab);
+  useEffect(() => {
+    if (listMode && !supportedListModes.has(listMode)) {
+      setListMode(defaultTab);
+    }
+  }, [defaultTab, listMode, setListMode, supportedListModes]);
 
   const radioOptions: Array<SelectableValue<VisualizationSelectPaneTab>> = [
     { label: 'Visualizations', value: VisualizationSelectPaneTab.Visualizations },