TSVB field list performance issue on using annotations

elastic · Nov 26, 2020 · 56e8412 · 56e8412
1 parent 459263f
commit 56e8412
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 8 deletions.
diff --git a/src/plugins/vis_type_timeseries/common/constants.ts b/src/plugins/vis_type_timeseries/common/constants.ts
@@ -22,4 +22,5 @@ export const INDEXES_SEPARATOR = ',';
 export const AUTO_INTERVAL = 'auto';
 export const ROUTES = {
  VIS_DATA: '/api/metrics/vis/data',
+ FIELDS: '/api/metrics/fields',
 };
diff --git a/src/plugins/vis_type_timeseries/public/application/components/aggs/field_select.js b/src/plugins/vis_type_timeseries/public/application/components/aggs/field_select.js
@@ -91,7 +91,7 @@ function FieldSelectUi({
 }
 
 FieldSelectUi.defaultProps = {
- indexPattern: '*',
+ indexPattern: '',
  disabled: false,
  restrict: [],
  placeholder: i18n.translate('visTypeTimeseries.fieldSelect.selectFieldPlaceholder', {

diff --git a/src/plugins/vis_type_timeseries/public/application/components/annotations_editor.js b/src/plugins/vis_type_timeseries/public/application/components/annotations_editor.js
@@ -43,13 +43,14 @@ import {
  EuiCode,
  EuiText,
 } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n/react';
 
 function newAnnotation() {
  return {
  id: uuid.v1(),
  color: '#F00',
- index_pattern: '*',
+ index_pattern: '',
  time_field: '@timestamp',
  icon: 'fa-tag',
  ignore_global_filters: 1,
@@ -84,7 +85,7 @@ export class AnnotationsEditor extends Component {
  const defaults = {
  fields: '',
  template: '',
- index_pattern: '*',
+ index_pattern: '',
  query_string: { query: '', language: getDefaultQueryLanguage() },
  };
  const model = { ...defaults, ...row };
@@ -100,6 +101,8 @@ export class AnnotationsEditor extends Component {
  const htmlId = htmlIdGenerator(model.id);
  const handleAdd = collectionActions.handleAdd.bind(null, this.props, newAnnotation);
  const handleDelete = collectionActions.handleDelete.bind(null, this.props, model);
+ const defaultIndexPattern = this.props.model.default_index_pattern;
+
  return (
  <div className="tvbAnnotationsEditor" key={model.id}>
  <EuiFlexGroup responsive={false}>
@@ -120,14 +123,22 @@ export class AnnotationsEditor extends Component {
  label={
  <FormattedMessage
  id="visTypeTimeseries.annotationsEditor.indexPatternLabel"
- defaultMessage="Index pattern (required)"
+ defaultMessage="Index pattern"
  />
  }
+ helpText={
+ defaultIndexPattern &&
+ !model.index_pattern &&
+ i18n.translate('visTypeTimeseries.indexPattern.searchByDefaultIndex', {
+ defaultMessage: 'Default index pattern is used. To query all indexes use *',
+ })
+ }
  fullWidth
  >
  <EuiFieldText
  onChange={this.handleChange(model, 'index_pattern')}
  value={model.index_pattern}
+ placeholder={defaultIndexPattern}
  fullWidth
  />
  </EuiFormRow>

diff --git a/src/plugins/vis_type_timeseries/public/application/components/vis_editor.js b/src/plugins/vis_type_timeseries/public/application/components/vis_editor.js
@@ -36,6 +36,12 @@ import { Storage } from '../../../../../plugins/kibana_utils/public';
 const VIS_STATE_DEBOUNCE_DELAY = 200;
 const APP_NAME = 'VisEditor';
 
+const debouncedFetchFields = debounce(
+ (extractedIndexPatterns) => fetchFields(extractedIndexPatterns),
+ VIS_STATE_DEBOUNCE_DELAY,
+ { leading: true }
+);
+
 export class VisEditor extends Component {
  constructor(props) {
  super(props);
@@ -94,7 +100,7 @@ export class VisEditor extends Component {
 
  const extractedIndexPatterns = extractIndexPatterns(nextModel);
  if (!isEqual(this.state.extractedIndexPatterns, extractedIndexPatterns)) {
- fetchFields(extractedIndexPatterns).then((visFields) =>
+ debouncedFetchFields(extractedIndexPatterns).then((visFields) =>
  this.setState({
  visFields,
  extractedIndexPatterns,

diff --git a/src/plugins/vis_type_timeseries/public/application/lib/fetch_fields.js b/src/plugins/vis_type_timeseries/public/application/lib/fetch_fields.js
@@ -19,13 +19,14 @@
 import { i18n } from '@kbn/i18n';
 import { extractIndexPatterns } from '../../../common/extract_index_patterns';
 import { getCoreStart } from '../../services';
+import { ROUTES } from '../../../common/constants';
 
-export async function fetchFields(indexPatterns = ['*']) {
+export async function fetchFields(indexPatterns = []) {
  const patterns = Array.isArray(indexPatterns) ? indexPatterns : [indexPatterns];
  try {
  const indexFields = await Promise.all(
  patterns.map((pattern) => {
- return getCoreStart().http.get('/api/metrics/fields', {
+ return getCoreStart().http.get(ROUTES.FIELDS, {
  query: {
  index: pattern,
  },

diff --git a/src/plugins/vis_type_timeseries/server/routes/fields.ts b/src/plugins/vis_type_timeseries/server/routes/fields.ts
@@ -21,11 +21,12 @@ import { isBoom } from '@hapi/boom';
 import { schema } from '@kbn/config-schema';
 import { getFields } from '../lib/get_fields';
 import { Framework } from '../plugin';
+import { ROUTES } from '../../common/constants';
 
 export const fieldsRoutes = (framework: Framework) => {
  framework.router.get(
  {
- path: '/api/metrics/fields',
+ path: ROUTES.FIELDS,
  validate: {
  query: schema.object({ index: schema.string() }),
  },