chore: disabled logs histogram for table view

frontend/src/container/QueryBuilder/components/ToolbarActions/LeftToolbarActions.tsx

@@ -3,6 +3,8 @@ import './ToolbarActions.styles.scss';
 import { FilterOutlined } from '@ant-design/icons';
 import { Button, Switch, Tooltip, Typography } from 'antd';
 import cx from 'classnames';
+import { PANEL_TYPES } from 'constants/queryBuilder';
+import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { Atom, SquareMousePointer, Terminal } from 'lucide-react';
 import { SELECTED_VIEWS } from 'pages/LogsExplorer/utils';
 
@@ -30,6 +32,7 @@ export default function LeftToolbarActions({
 	handleFilterVisibilityChange,
 }: LeftToolbarActionsProps): JSX.Element {
 	const { clickhouse, search, queryBuilder: QB } = items;
+	const { panelType } = useQueryBuilder();
 
 	return (
 		<div className="left-toolbar">
@@ -85,12 +88,27 @@ export default function LeftToolbarActions({
 
 			<div className="frequency-chart-view-controller">
 				<Typography>Frequency chart</Typography>
+				{panelType === PANEL_TYPES.TABLE ? (
+					<Tooltip title="Frequency chart is not available in table view">
+						<span>
 							<Switch
 								size="small"
-					checked={showFrequencyChart}
+								checked={false}
+								disabled
 								defaultChecked
 								onChange={onToggleHistrogramVisibility}
 							/>
+						</span>
+					</Tooltip>
+				) : (
+					<Switch
+						size="small"
+						checked={showFrequencyChart}
+						disabled={false}
+						defaultChecked
+						onChange={onToggleHistrogramVisibility}
+					/>
+				)}
 			</div>
 		</div>
 	);

frontend/src/pages/LogsExplorer/index.tsx

@@ -8,6 +8,7 @@ import ExplorerCard from 'components/ExplorerCard/ExplorerCard';
 import QuickFilters from 'components/QuickFilters/QuickFilters';
 import { QuickFiltersSource, SignalType } from 'components/QuickFilters/types';
 import { LOCALSTORAGE } from 'constants/localStorage';
+import { PANEL_TYPES } from 'constants/queryBuilder';
 import LogExplorerQuerySection from 'container/LogExplorerQuerySection';
 import LogsExplorerViews from 'container/LogsExplorerViews';
 import {
@@ -33,6 +34,8 @@ import { SELECTED_VIEWS } from './utils';
 
 function LogsExplorer(): JSX.Element {
 	const [showFrequencyChart, setShowFrequencyChart] = useState(true);
+	const showFrequencyChartRef = useRef<boolean>(true);
+	const prevPanelTypeRef = useRef<string | null>(null);
 	const [selectedView, setSelectedView] = useState<SELECTED_VIEWS>(
 		SELECTED_VIEWS.SEARCH,
 	);
@@ -48,7 +51,7 @@ function LogsExplorer(): JSX.Element {
 		return true;
 	});
 
-	const { handleRunQuery, currentQuery } = useQueryBuilder();
+	const { handleRunQuery, currentQuery, panelType } = useQueryBuilder();
 
 	const listQueryKeyRef = useRef<any>();
 
@@ -165,6 +168,18 @@ function LogsExplorer(): JSX.Element {
 		[mergeWithRequiredColumns, logListOptionsFromLocalStorage],
 	);
 
+	useEffect(() => {
+		if (prevPanelTypeRef.current !== panelType) {
+			if (panelType === PANEL_TYPES.TABLE) {
+				showFrequencyChartRef.current = showFrequencyChart;
+				setShowFrequencyChart(false);
+			} else if (prevPanelTypeRef.current === PANEL_TYPES.TABLE) {
+				setShowFrequencyChart(showFrequencyChartRef.current);
+			}
+			prevPanelTypeRef.current = panelType;
+		}
+	}, [panelType, showFrequencyChart]);
+
 	useEffect(() => {
 		if (!preferences || preferencesLoading) {
 			return;