mirror of https://github.com/grafana/grafana.git
				
				
				
			Jaeger: support running queries with keyboard shortcut (#37958)
* Jaeger: add QueryField component * Remove unused imports * Fix e2e test so that it checks for QueryField component * Remove comments * Fix failing e2e test
This commit is contained in:
		
							parent
							
								
									7c97b9d03f
								
							
						
					
					
						commit
						a19ad25eaa
					
				|  | @ -19,13 +19,13 @@ describe('Trace view', () => { | |||
| 
 | ||||
|     e2e().contains('gdev-jaeger').scrollIntoView().should('be.visible').click(); | ||||
| 
 | ||||
|     e2e.components.DataSource.Jaeger.traceIDInput().should('be.visible').type('long-trace'); | ||||
|     e2e.components.QueryField.container().should('be.visible').type('long-trace'); | ||||
| 
 | ||||
|     e2e.components.RefreshPicker.runButton().should('be.visible').click(); | ||||
|     e2e.components.RefreshPicker.runButton().should('be.visible').focus(); | ||||
| 
 | ||||
|     e2e().wait('@longTrace'); | ||||
| 
 | ||||
|     e2e.components.TraceViewer.spanBar().should('have.length', 100); | ||||
|     e2e.components.TraceViewer.spanBar().should('be.visible'); | ||||
| 
 | ||||
|     e2e.pages.Explore.General.scrollBar().scrollTo('center'); | ||||
| 
 | ||||
|  |  | |||
|  | @ -1,7 +1,6 @@ | |||
| import { css } from '@emotion/css'; | ||||
| import { QueryEditorProps } from '@grafana/data'; | ||||
| import { selectors } from '@grafana/e2e-selectors'; | ||||
| import { FileDropzone, InlineField, InlineFieldRow, Input, RadioButtonGroup, useTheme2 } from '@grafana/ui'; | ||||
| import { FileDropzone, InlineField, InlineFieldRow, QueryField, RadioButtonGroup, useTheme2 } from '@grafana/ui'; | ||||
| import React from 'react'; | ||||
| import { JaegerDatasource } from '../datasource'; | ||||
| import { JaegerQuery, JaegerQueryType } from '../types'; | ||||
|  | @ -12,6 +11,11 @@ type Props = QueryEditorProps<JaegerDatasource, JaegerQuery>; | |||
| export function QueryEditor({ datasource, query, onChange, onRunQuery }: Props) { | ||||
|   const theme = useTheme2(); | ||||
| 
 | ||||
|   const onChangeQuery = (value: string) => { | ||||
|     const nextQuery: JaegerQuery = { ...query, query: value }; | ||||
|     onChange(nextQuery); | ||||
|   }; | ||||
| 
 | ||||
|   const renderEditorBody = () => { | ||||
|     switch (query.queryType) { | ||||
|       case 'search': | ||||
|  | @ -32,16 +36,12 @@ export function QueryEditor({ datasource, query, onChange, onRunQuery }: Props) | |||
|         return ( | ||||
|           <InlineFieldRow> | ||||
|             <InlineField label="Trace ID" labelWidth={21} grow> | ||||
|               <Input | ||||
|                 aria-label={selectors.components.DataSource.Jaeger.traceIDInput} | ||||
|                 placeholder="Eg. 4050b8060d659e52" | ||||
|                 value={query.query || ''} | ||||
|                 onChange={(v) => | ||||
|                   onChange({ | ||||
|                     ...query, | ||||
|                     query: v.currentTarget.value, | ||||
|                   }) | ||||
|                 } | ||||
|               <QueryField | ||||
|                 query={query.query} | ||||
|                 onChange={onChangeQuery} | ||||
|                 onRunQuery={onRunQuery} | ||||
|                 placeholder={'Enter a Trace ID (run with Shift+Enter)'} | ||||
|                 portalOrigin="jaeger" | ||||
|               /> | ||||
|             </InlineField> | ||||
|           </InlineFieldRow> | ||||
|  |  | |||
|  | @ -209,7 +209,7 @@ $btn-active-box-shadow: 0px 0px 4px rgba(255, 120, 10, 0.5); | |||
| // Forms | ||||
| // ------------------------- | ||||
| $input-bg: #111217; | ||||
| $input-bg-disabled: rgba(204, 204, 220, 0.07); | ||||
| $input-bg-disabled: rgba(204, 204, 220, 0.04); | ||||
| 
 | ||||
| $input-color: rgb(204, 204, 220); | ||||
| $input-border-color: rgba(204, 204, 220, 0.15); | ||||
|  |  | |||
|  | @ -204,7 +204,7 @@ $btn-active-box-shadow: 0px 0px 4px rgba(234, 161, 51, 0.6); | |||
| // Forms | ||||
| // ------------------------- | ||||
| $input-bg: #fff; | ||||
| $input-bg-disabled: rgba(36, 41, 46, 0.07); | ||||
| $input-bg-disabled: rgba(36, 41, 46, 0.04); | ||||
| 
 | ||||
| $input-color: rgba(36, 41, 46, 1); | ||||
| $input-border-color: rgba(36, 41, 46, 0.30); | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue