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

Loki, Prometheus: Change the placement for query type explanation (#31784)

Browse Source 
* Fix tooltip in the way

* Add more info for instant query

* Update public/app/plugins/datasource/loki/components/LokiOptionFields.tsx

* Update public/app/plugins/datasource/prometheus/components/PromExploreExtraField.tsx
This commit is contained in:
Ivana Huckova 2021-03-09 14:17:04 +01:00 committed by GitHub
parent 3d459b556a
commit 53ba6456d4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
public/app/plugins/datasource/loki/components/LokiOptionFields.tsx
View File

@ -18,8 +18,12 @@ export interface LokiOptionFieldsProps {
type LokiQueryType = 'instant' | 'range';
const queryTypeOptions = [
{ value: 'range', label: 'Range' },
{ value: 'instant', label: 'Instant' },
{ value: 'range', label: 'Range', description: 'Run query over a range of time.' },
{
value: 'instant',
label: 'Instant',
description: 'Run query against a single point in time. For this query, the "To" time is used.',
},
];
export function LokiOptionFields(props: LokiOptionFieldsProps) {
@ -79,12 +83,7 @@ export function LokiOptionFields(props: LokiOptionFieldsProps) {
)}
aria-label="Query type field"
>
<InlineFormLabel
tooltip="Choose the type of query you would like to run. An instant query queries against a single point in time. A range query queries over a range of time."
width="auto"
>
Query type
</InlineFormLabel>
<InlineFormLabel width="auto">Query type</InlineFormLabel>
<RadioButtonGroup
options={queryTypeOptions}

17
public/app/plugins/datasource/prometheus/components/PromExploreExtraField.tsx
View File

@ -20,9 +20,13 @@ export interface PromExploreExtraFieldProps {
export const PromExploreExtraField: React.FC<PromExploreExtraFieldProps> = memo(
({ queryType, stepValue, query, onChange, onStepChange, onQueryTypeChange, onKeyDownFunc }) => {
const rangeOptions = [
{ value: 'range', label: 'Range' },
{ value: 'instant', label: 'Instant' },
{ value: 'both', label: 'Both' },
{ value: 'range', label: 'Range', description: 'Run query over a range of time.' },
{
value: 'instant',
label: 'Instant',
description: 'Run query against a single point in time. For this query, the "To" time is used.',
},
{ value: 'both', label: 'Both', description: 'Run an Instant query and a Range query.' },
];
return (
@ -38,12 +42,7 @@ export const PromExploreExtraField: React.FC<PromExploreExtraFieldProps> = memo(
)}
aria-label="Query type field"
>
<InlineFormLabel
width="auto"
tooltip="Choose the type of query you would like to run. An instant query queries against a single point in time. A range query queries over a range of time. With both, you'll run two queries - one instant and one range. "
>
Query type
</InlineFormLabel>
<InlineFormLabel width="auto">Query type</InlineFormLabel>
<RadioButtonGroup options={rangeOptions} value={queryType} onChange={onQueryTypeChange} />
</div>