IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Fix query inspector in explore to scroll to bottom (#82369)

Browse Source
This commit is contained in:
Victor Marin
2024-02-14 10:00:16 +02:00
committed by GitHub
parent cb47177df9
commit a1ff439a20
4 changed files with 10 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/grafana-ui/src/components/TabbedContainer/TabbedContainer.tsx
View File

@@ -5,7 +5,7 @@ import { SelectableValue, GrafanaTheme2 } from '@grafana/data';
import { IconButton } from '../../components/IconButton/IconButton';
import { TabsBar, Tab, TabContent } from '../../components/Tabs';
import { useStyles2 } from '../../themes';
import { useStyles2, useTheme2 } from '../../themes';
import { IconName } from '../../types/icon';
import { CustomScrollbar } from '../CustomScrollbar/CustomScrollbar';
@@ -25,12 +25,14 @@ export interface TabbedContainerProps {
export function TabbedContainer({ tabs, defaultTab, closeIconTooltip, onClose }: TabbedContainerProps) {
const [activeTab, setActiveTab] = useState(tabs.some((tab) => tab.value === defaultTab) ? defaultTab : tabs[0].value);
const styles = useStyles2(getStyles);
const theme = useTheme2();
const onSelectTab = (item: SelectableValue<string>) => {
setActiveTab(item.value!);
};
const styles = useStyles2(getStyles);
const autoHeight = `calc(100% - (${theme.components.menuTabs.height}px + ${theme.spacing(1)}))`;
return (
<div className={styles.container}>
@@ -46,7 +48,7 @@ export function TabbedContainer({ tabs, defaultTab, closeIconTooltip, onClose }:
))}
<IconButton className={styles.close} onClick={onClose} name="times" tooltip={closeIconTooltip ?? 'Close'} />
</TabsBar>
<CustomScrollbar autoHeightMin="100%">
<CustomScrollbar autoHeightMin={autoHeight} autoHeightMax={autoHeight}>
<TabContent className={styles.tabContent}>{tabs.find((t) => t.value === activeTab)?.content}</TabContent>
</CustomScrollbar>
</div>
@@ -60,7 +62,7 @@ const getStyles = (theme: GrafanaTheme2) => ({
tabContent: css({
padding: theme.spacing(2),
backgroundColor: theme.colors.background.primary,
height: `calc(100% - ${theme.components.menuTabs.height}px)`,
height: `100%`,
}),
close: css({
position: 'absolute',