mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Tempo: Carry over query from Search tab to TraceQL tab (#79442)
* Carry over query from Search tab to TraceQL tab * Update tracking * Update flow * Updates to logic
This commit is contained in:
parent
9e5826f40f
commit
7451f41967
@ -151,7 +151,6 @@ class TempoQueryFieldComponent extends React.PureComponent<Props, State> {
|
||||
});
|
||||
|
||||
this.onClearResults();
|
||||
|
||||
onChange({
|
||||
...query,
|
||||
queryType: v,
|
||||
@ -205,6 +204,8 @@ class TempoQueryFieldComponent extends React.PureComponent<Props, State> {
|
||||
query={query}
|
||||
onRunQuery={this.props.onRunQuery}
|
||||
onChange={onChange}
|
||||
app={app}
|
||||
onClearResults={this.onClearResults}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
|
@ -1,21 +1,31 @@
|
||||
import { css } from '@emotion/css';
|
||||
import { defaults } from 'lodash';
|
||||
import React from 'react';
|
||||
import React, { useState } from 'react';
|
||||
|
||||
import { QueryEditorProps } from '@grafana/data';
|
||||
import { InlineLabel, useStyles2 } from '@grafana/ui';
|
||||
import { config, reportInteraction } from '@grafana/runtime';
|
||||
import { Button, InlineLabel, useStyles2 } from '@grafana/ui';
|
||||
|
||||
import { generateQueryFromFilters } from '../SearchTraceQLEditor/utils';
|
||||
import { TempoDatasource } from '../datasource';
|
||||
import { defaultQuery, MyDataSourceOptions, TempoQuery } from '../types';
|
||||
|
||||
import { TempoQueryBuilderOptions } from './TempoQueryBuilderOptions';
|
||||
import { TraceQLEditor } from './TraceQLEditor';
|
||||
|
||||
type Props = QueryEditorProps<TempoDatasource, TempoQuery, MyDataSourceOptions>;
|
||||
type EditorProps = {
|
||||
onClearResults: () => void;
|
||||
};
|
||||
|
||||
type Props = EditorProps & QueryEditorProps<TempoDatasource, TempoQuery, MyDataSourceOptions>;
|
||||
|
||||
export function QueryEditor(props: Props) {
|
||||
const styles = useStyles2(getStyles);
|
||||
const query = defaults(props.query, defaultQuery);
|
||||
const [showCopyFromSearchButton, setShowCopyFromSearchButton] = useState(() => {
|
||||
const genQuery = generateQueryFromFilters(query.filters || []);
|
||||
return genQuery === query.query || genQuery === '{}';
|
||||
});
|
||||
|
||||
const onEditorChange = (value: string) => {
|
||||
props.onChange({ ...query, query: value });
|
||||
@ -29,6 +39,34 @@ export function QueryEditor(props: Props) {
|
||||
Documentation
|
||||
</a>
|
||||
</InlineLabel>
|
||||
{!showCopyFromSearchButton && (
|
||||
<InlineLabel>
|
||||
<div>
|
||||
Continue editing the query from the Search tab?
|
||||
<Button
|
||||
variant="secondary"
|
||||
size="sm"
|
||||
onClick={() => {
|
||||
reportInteraction('grafana_traces_copy_to_traceql_clicked', {
|
||||
datasourceType: 'tempo',
|
||||
app: props.app ?? '',
|
||||
grafana_version: config.buildInfo.version,
|
||||
});
|
||||
|
||||
props.onClearResults();
|
||||
props.onChange({
|
||||
...query,
|
||||
query: generateQueryFromFilters(query.filters || []),
|
||||
});
|
||||
setShowCopyFromSearchButton(true);
|
||||
}}
|
||||
style={{ marginLeft: '10px' }}
|
||||
>
|
||||
Copy query from Search
|
||||
</Button>
|
||||
</div>
|
||||
</InlineLabel>
|
||||
)}
|
||||
<TraceQLEditor
|
||||
placeholder="Enter a TraceQL query or trace ID (run with Shift+Enter)"
|
||||
value={query.query || ''}
|
||||
|
Loading…
Reference in New Issue
Block a user