diff --git a/x-pack/plugins/ml/public/application/components/annotations/annotations_table/__snapshots__/annotations_table.test.js.snap b/x-pack/plugins/ml/public/application/components/annotations/annotations_table/__snapshots__/annotations_table.test.js.snap index 63ec1744b62d0..9eb44c71aa799 100644 --- a/x-pack/plugins/ml/public/application/components/annotations/annotations_table/__snapshots__/annotations_table.test.js.snap +++ b/x-pack/plugins/ml/public/application/components/annotations/annotations_table/__snapshots__/annotations_table.test.js.snap @@ -77,6 +77,7 @@ exports[`AnnotationsTable Initialization with annotations prop. 1`] = ` "dataType": "boolean", "field": "current_series", "name": "current_series", + "render": [Function], "width": "0px", }, ] diff --git a/x-pack/plugins/ml/public/application/components/annotations/annotations_table/annotations_table.js b/x-pack/plugins/ml/public/application/components/annotations/annotations_table/annotations_table.js index cf4d25f159a1a..86398a57c3a45 100644 --- a/x-pack/plugins/ml/public/application/components/annotations/annotations_table/annotations_table.js +++ b/x-pack/plugins/ml/public/application/components/annotations/annotations_table/annotations_table.js @@ -13,7 +13,7 @@ import _ from 'lodash'; import PropTypes from 'prop-types'; import rison from 'rison-node'; import React, { Component, Fragment } from 'react'; - +import memoizeOne from 'memoize-one'; import { EuiBadge, EuiButtonIcon, @@ -130,7 +130,7 @@ export class AnnotationsTable extends Component { } } - getAnnotationsWithExtraInfo(annotations) { + getAnnotationsWithExtraInfo = memoizeOne((annotations) => { // if there is a specific view/chart entities that the annotations can be scoped to // add a new column called 'current_series' if (Array.isArray(this.props.chartDetails?.entityData?.entities)) { @@ -147,7 +147,7 @@ export class AnnotationsTable extends Component { // if not make it return the original annotations return annotations; } - } + }); getJob(jobId) { // check if the job was supplied via props and matches the supplied jobId @@ -438,7 +438,7 @@ export class AnnotationsTable extends Component { name: i18n.translate('xpack.ml.annotationsTable.labelColumnName', { defaultMessage: 'Label', }), - sortable: true, + sortable: (key) => +key, width: '60px', render: (key) => { return {key}; @@ -644,15 +644,18 @@ export class AnnotationsTable extends Component { name: CURRENT_SERIES, dataType: 'boolean', width: '0px', + render: () => '', } ); + + const items = this.getAnnotationsWithExtraInfo(annotations); return ( { - d.key = String.fromCharCode(65 + i); + d.key = (i + 1).toString(); return d; }), aggregations: resp.aggregations, diff --git a/x-pack/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/get_focus_data.ts b/x-pack/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/get_focus_data.ts index 8bac9a51af174..d213d371f1d90 100644 --- a/x-pack/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/get_focus_data.ts +++ b/x-pack/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/get_focus_data.ts @@ -156,8 +156,8 @@ export function getFocusData( .sort((a, b) => { return a.timestamp - b.timestamp; }) - .map((d, i) => { - d.key = String.fromCharCode(65 + i); + .map((d, i: number) => { + d.key = (i + 1).toString(); return d; });