[v11.0.x] datatrails: handle "single" layout when switching to "all" labels (#85375)

datatrails: handle "single" layout when switching to "all" labels (#85373)

* fix: handle "single" layout when switching to "all" labels

(cherry picked from commit 18f3c7188b)

Co-authored-by: Darren Janeczek <38694490+darrenjaneczek@users.noreply.github.com>

public/app/features/trails/ActionTabs/LayoutSwitcher.tsx

@@ -20,22 +20,30 @@ export class LayoutSwitcher extends SceneObjectBase<LayoutSwitcherState> {
 
   public Selector({ model }: { model: LayoutSwitcher }) {
     const { options } = model.useState();
-    const { layout } = model.getMetricScene().useState();
+    const activeLayout = model.useActiveLayout();
 
     return (
       <Field label="View">
-        <RadioButtonGroup options={options} value={layout} onChange={model.onLayoutChange} />
+        <RadioButtonGroup options={options} value={activeLayout} onChange={model.onLayoutChange} />
       </Field>
     );
   }
 
+  private useActiveLayout() {
+    const { options } = this.useState();
+    const { layout } = this.getMetricScene().useState();
+
+    const activeLayout = options.map((option) => option.value).includes(layout) ? layout : options[0].value;
+    return activeLayout;
+  }
+
   public onLayoutChange = (active: LayoutType) => {
     this.getMetricScene().setState({ layout: active });
   };
 
   public static Component = ({ model }: SceneComponentProps<LayoutSwitcher>) => {
     const { layouts, options } = model.useState();
-    const { layout: activeLayout } = model.getMetricScene().useState();
+    const activeLayout = model.useActiveLayout();
 
     const index = options.findIndex((o) => o.value === activeLayout);
     if (index === -1) {