fix(LogsPanelScene): respect collapsed status of logs volume

grafana · Feb 18, 2025 · c03150d · c03150d
1 parent b7f0e45
commit c03150d
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 9 deletions.
diff --git a/src/Components/ServiceScene/LogsPanelScene.tsx b/src/Components/ServiceScene/LogsPanelScene.tsx
@@ -11,7 +11,7 @@ import {
   VizPanel,
 } from '@grafana/scenes';
 import { DataFrame, getValueFormat, LoadingState, LogRowModel, PanelData } from '@grafana/data';
-import { getLogOption, setDisplayedFields } from '../../services/store';
+import { getLogOption, getLogsVolumeOption, setDisplayedFields } from '../../services/store';
 import React, { MouseEvent } from 'react';
 import { LogsListScene } from './LogsListScene';
 import { LoadingPlaceholder, useStyles2 } from '@grafana/ui';
@@ -43,6 +43,7 @@ import { clearVariables } from 'services/variableHelpers';
 interface LogsPanelSceneState extends SceneObjectState {
   body?: VizPanel<Options>;
   error?: string;
+  logsVolumeCollapsedByError?: boolean;
   sortOrder?: LogsSortOrder;
   wrapLogMessage?: boolean;
 }
@@ -150,16 +151,24 @@ export class LogsPanelScene extends SceneObjectBase<LogsPanelSceneState> {
   }
 
   handleLogsError(data: PanelData) {
+    const logsVolumeCollapsedByError = this.state.logsVolumeCollapsedByError ?? !getLogsVolumeOption('collapsed');
+
     const error = data.errors?.length ? data.errors[0].message : data.error?.message;
-    this.setState({ error });
-    const logsVolume = sceneGraph.findByKeyAndType(this, logsVolumePanelKey, LogsVolumePanel);
-    logsVolume.state.panel?.setState({ collapsed: true });
+    this.setState({ error, logsVolumeCollapsedByError });
+
+    if (logsVolumeCollapsedByError) {
+      const logsVolume = sceneGraph.findByKeyAndType(this, logsVolumePanelKey, LogsVolumePanel);
+      logsVolume.state.panel?.setState({ collapsed: true });
+    }
   }
 
   clearLogsError() {
-    this.setState({ error: undefined });
-    const logsVolume = sceneGraph.findByKeyAndType(this, logsVolumePanelKey, LogsVolumePanel);
-    logsVolume.state.panel?.setState({ collapsed: false });
+    if (this.state.logsVolumeCollapsedByError) {
+      const logsVolume = sceneGraph.findByKeyAndType(this, logsVolumePanelKey, LogsVolumePanel);
+      logsVolume.state.panel?.setState({ collapsed: false });
+    }
+
+    this.setState({ error: undefined, logsVolumeCollapsedByError: undefined });
   }
 
   onClickShowField = (field: string) => {

diff --git a/src/Components/ServiceScene/LogsVolumePanel.tsx b/src/Components/ServiceScene/LogsVolumePanel.tsx
@@ -96,7 +96,7 @@ export class LogsVolumePanel extends SceneObjectBase<LogsVolumePanelState> {
       .setUnit('short')
       .setMenu(new PanelMenu({ investigationOptions: { labelName: 'level' } }))
       .setCollapsible(true)
-      .setCollapsed(Boolean(getLogsVolumeOption('collapsed')))
+      .setCollapsed(getLogsVolumeOption('collapsed'))
       .setHeaderActions(new LogsVolumeActions({}))
       // 11.5
       // .setShowMenuAlways(true)

diff --git a/src/services/store.ts b/src/services/store.ts
@@ -229,7 +229,7 @@ export function setLogsVolumeOption(option: 'collapsed', value: string | undefin
 }
 
 export function getLogsVolumeOption(option: 'collapsed') {
-  return localStorage.getItem(`${LOGS_VOLUME_LOCALSTORAGE_KEY}.${option}`);
+  return Boolean(localStorage.getItem(`${LOGS_VOLUME_LOCALSTORAGE_KEY}.${option}`));
 }
 
 // Log visualization options