Sidecar: Use a proper way to get header height (#94691)

Use a proper hook
This commit is contained in:
Andrej Ocenas 2024-10-15 18:09:34 +02:00 committed by GitHub
parent 2a6b73ca5f
commit 1f39692d9b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -5,12 +5,11 @@ import { Router } from 'react-router-dom';
import { CompatRouter } from 'react-router-dom-v5-compat';
import { GrafanaTheme2 } from '@grafana/data/';
import { HistoryWrapper, locationService, LocationServiceProvider } from '@grafana/runtime';
import { HistoryWrapper, locationService, LocationServiceProvider, useChromeHeaderHeight } from '@grafana/runtime';
import { GlobalStyles, IconButton, ModalRoot, Stack, useSplitter, useStyles2 } from '@grafana/ui';
import { AngularRoot } from '../angular/AngularRoot';
import { AppChrome } from '../core/components/AppChrome/AppChrome';
import { TOP_BAR_LEVEL_HEIGHT } from '../core/components/AppChrome/types';
import { AppNotificationList } from '../core/components/AppNotifications/AppNotificationList';
import { ModalsContextProvider } from '../core/context/ModalsContextProvider';
import { useSidecar } from '../core/context/SidecarContext';
@ -74,10 +73,8 @@ export function ExperimentalSplitPaneRouterWrapper(props: RouterWrapperProps) {
primaryProps = alterStyles(primaryProps);
secondaryProps = alterStyles(secondaryProps);
// TODO: this should be used to calculate the height of the header but right now results in a error loop when
// navigating to explore "Cannot destructure property 'range' of 'itemState' as it is undefined."
// const headerHeight = useChromeHeaderHeight();
const styles = useStyles2(getStyles, TOP_BAR_LEVEL_HEIGHT * 2);
const headerHeight = useChromeHeaderHeight();
const styles = useStyles2(getStyles, headerHeight);
const memoryLocationService = new HistoryWrapper(H.createMemoryHistory({ initialEntries: ['/'] }));
return (