Tempo: Trace View - Search bar to absolute position instead of sticky (#61324)

* Trace View: Search bar to absolute position instead of sticky

* Fix search bar position to the inside of the trace view panel
This commit is contained in:
Andre Pereira 2023-01-17 11:42:56 +00:00 committed by GitHub
parent e7271ee3f1
commit d2a5b9b289
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 22 deletions

View File

@ -29,12 +29,11 @@ export const getStyles = (theme: GrafanaTheme2) => {
TracePageSearchBar: css`
label: TracePageSearchBar;
float: right;
position: sticky;
top: 8px;
position: absolute;
top: 0;
right: 0;
z-index: ${theme.zIndex.navbarFixed};
background: ${theme.colors.background.primary};
margin-top: 8px;
margin-bottom: -48px;
padding: 8px;
margin-right: 2px;

View File

@ -35,7 +35,7 @@ export function TraceViewContainer(props: Props) {
}
return (
<>
<Collapse label="Trace View" isOpen>
<TracePageSearchBar
navigable={true}
searchValue={search}
@ -46,23 +46,20 @@ export function TraceViewContainer(props: Props) {
focusedSpanIdForSearch={focusedSpanIdForSearch}
setFocusedSpanIdForSearch={setFocusedSpanIdForSearch}
/>
<Collapse label="Trace View" isOpen>
<TraceView
exploreId={exploreId}
dataFrames={dataFrames}
splitOpenFn={splitOpenFn}
scrollElement={scrollElement}
traceProp={traceProp}
spanFindMatches={spanFindMatches}
search={search}
focusedSpanIdForSearch={focusedSpanIdForSearch}
queryResponse={queryResponse}
datasource={datasource}
topOfViewRef={topOfViewRef}
topOfViewRefType={TopOfViewRefType.Explore}
/>
</Collapse>
</>
<TraceView
exploreId={exploreId}
dataFrames={dataFrames}
splitOpenFn={splitOpenFn}
scrollElement={scrollElement}
traceProp={traceProp}
spanFindMatches={spanFindMatches}
search={search}
focusedSpanIdForSearch={focusedSpanIdForSearch}
queryResponse={queryResponse}
datasource={datasource}
topOfViewRef={topOfViewRef}
topOfViewRefType={TopOfViewRefType.Explore}
/>
</Collapse>
);
}