Prometheus: Remove raw query toggle (#59069)

* remove the raw query option toggle from the prometheus query builder
This commit is contained in:
Galen Kistler 2022-11-29 08:12:46 -06:00 committed by GitHub
parent 6b5ebf2b4b
commit 5b7ef92399
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 6 additions and 29 deletions

View File

@ -18,7 +18,6 @@ export interface Props {
onChange: (update: PromQuery) => void;
onRunQuery: () => void;
data?: PanelData;
showRawQuery?: boolean;
showExplain: boolean;
}
@ -31,7 +30,7 @@ export interface State {
* This component is here just to contain the translation logic between string query and the visual query builder model.
*/
export function PromQueryBuilderContainer(props: Props) {
const { query, onChange, onRunQuery, datasource, data, showRawQuery, showExplain } = props;
const { query, onChange, onRunQuery, datasource, data, showExplain } = props;
const [state, dispatch] = useReducer(stateSlice.reducer, { expr: query.expr });
// Only rebuild visual query if expr changes from outside
@ -59,7 +58,7 @@ export function PromQueryBuilderContainer(props: Props) {
data={data}
showExplain={showExplain}
/>
{showRawQuery && <QueryPreview query={query.expr} />}
{<QueryPreview query={query.expr} />}
</>
);
}

View File

@ -95,14 +95,7 @@ describe('PromQueryEditorSelector', () => {
});
});
it('Can enable raw query', async () => {
renderWithMode(QueryEditorMode.Builder);
expect(screen.queryByLabelText('selector')).toBeInTheDocument();
screen.getByLabelText('Raw query').click();
expect(screen.queryByLabelText('selector')).not.toBeInTheDocument();
});
it('Should show raw query by default', async () => {
it('Should show raw query', async () => {
renderWithProps({
editorMode: QueryEditorMode.Builder,
expr: 'my_metric',

View File

@ -11,7 +11,7 @@ import { promQueryModeller } from '../PromQueryModeller';
import { buildVisualQueryFromString } from '../parsing';
import { QueryEditorModeToggle } from '../shared/QueryEditorModeToggle';
import { QueryHeaderSwitch } from '../shared/QueryHeaderSwitch';
import { promQueryEditorExplainKey, promQueryEditorRawQueryKey, useFlag } from '../shared/hooks/useFlag';
import { promQueryEditorExplainKey, useFlag } from '../shared/hooks/useFlag';
import { QueryEditorMode } from '../shared/types';
import { changeEditorMode, getQueryWithDefaults } from '../state';
@ -26,7 +26,6 @@ export const PromQueryEditorSelector = React.memo<Props>((props) => {
const [parseModalOpen, setParseModalOpen] = useState(false);
const [dataIsStale, setDataIsStale] = useState(false);
const { flag: explain, setFlag: setExplain } = useFlag(promQueryEditorExplainKey);
const { flag: rawQuery, setFlag: setRawQuery } = useFlag(promQueryEditorRawQueryKey, true);
const query = getQueryWithDefaults(props.query, app);
// This should be filled in from the defaults by now.
@ -58,11 +57,6 @@ export const PromQueryEditorSelector = React.memo<Props>((props) => {
setDataIsStale(false);
}, [data]);
const onQueryPreviewChange = (event: SyntheticEvent<HTMLInputElement>) => {
const isEnabled = event.currentTarget.checked;
setRawQuery(isEnabled);
};
const onChangeInternal = (query: PromQuery) => {
setDataIsStale(true);
onChange(query);
@ -102,13 +96,7 @@ export const PromQueryEditorSelector = React.memo<Props>((props) => {
}}
options={promQueryModeller.getQueryPatterns().map((x) => ({ label: x.name, value: x }))}
/>
<QueryHeaderSwitch label="Explain" value={explain} onChange={onShowExplainChange} />
{editorMode === QueryEditorMode.Builder && (
<>
<QueryHeaderSwitch label="Raw query" value={rawQuery} onChange={onQueryPreviewChange} />
</>
)}
<FlexItem grow={1} />
{app !== CoreApp.Explore && (
<Button
@ -133,7 +121,6 @@ export const PromQueryEditorSelector = React.memo<Props>((props) => {
onChange={onChangeInternal}
onRunQuery={props.onRunQuery}
data={data}
showRawQuery={rawQuery}
showExplain={explain}
/>
)}

View File

@ -1,6 +1,6 @@
import React from 'react';
import { EditorRow, EditorFieldGroup, EditorField } from '@grafana/experimental';
import { EditorFieldGroup, EditorRow } from '@grafana/experimental';
import promqlGrammar from '../../promql';
import { RawQuery } from '../shared/RawQuery';
@ -13,9 +13,7 @@ export function QueryPreview({ query }: Props) {
return (
<EditorRow>
<EditorFieldGroup>
<EditorField label="Raw query">
<RawQuery query={query} lang={{ grammar: promqlGrammar, name: 'promql' }} />
</EditorField>
<RawQuery query={query} lang={{ grammar: promqlGrammar, name: 'promql' }} />
</EditorFieldGroup>
</EditorRow>
);