opensource/grafana
1
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-09-24 09:34:24 +08:00
Code Issues Packages Projects Releases Wiki Activity

Elasticsearch: Migrate annotation editor to react (#49529)

Browse Source 
* Migrate annotation editor to react

* Gio patch

* Update types

* Optional and conform to older design
This commit is contained in:
Joey Tawadrous
2022-05-31 09:26:40 +01:00
committed by GitHub
parent 8fa8c9dc8b
commit 387267b30a
6 changed files with 121 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
public/app/plugins/datasource/elasticsearch/components/QueryEditor/index.tsx
View File

@ -53,13 +53,31 @@ interface Props {
value: ElasticsearchQuery;
}
export const ElasticSearchQueryField = ({ value, onChange }: { value?: string; onChange: (v: string) => void }) => {
const styles = useStyles2(getStyles);
return (
<div className={styles.queryFieldWrapper}>
<QueryField
query={value}
// By default QueryField calls onChange if onBlur is not defined, this will trigger a rerender
// And slate will claim the focus, making it impossible to leave the field.
onBlur={() => {}}
onChange={onChange}
placeholder="Lucene Query"
portalOrigin="elasticsearch"
/>
</div>
);
};
const QueryEditorForm = ({ value }: Props) => {
const dispatch = useDispatch();
const nextId = useNextId();
const styles = useStyles2(getStyles);
// To be considered a time series query, the last bucked aggregation must be a Date Histogram
const isTimeSeriesQuery = value.bucketAggs?.slice(-1)[0]?.type === 'date_histogram';
const isTimeSeriesQuery = value?.bucketAggs?.slice(-1)[0]?.type === 'date_histogram';
const showBucketAggregationsEditor = value.metrics?.every(
(metric) => !metricAggregationConfig[metric.type].isSingleMetric
@ -69,17 +87,8 @@ const QueryEditorForm = ({ value }: Props) => {
<>
<div className={styles.root}>
<InlineLabel width={17}>Query</InlineLabel>
<div className={styles.queryFieldWrapper}>
<QueryField
query={value.query}
// By default QueryField calls onChange if onBlur is not defined, this will trigger a rerender
// And slate will claim the focus, making it impossible to leave the field.
onBlur={() => {}}
onChange={(query) => dispatch(changeQuery(query))}
placeholder="Lucene Query"
portalOrigin="elasticsearch"
/>
</div>
<ElasticSearchQueryField onChange={(query) => dispatch(changeQuery(query))} value={value?.query} />
<InlineField
label="Alias"
labelWidth={15}