[TSVB] Hides ticks on the y axis for layers with the same format and different template (#123598)

* [TSVB] Hides ticks on the y axis for layers with the same format and different template

* fix PR comment

* fix JEST

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Alexey Antonov 2022-01-27 12:02:49 +03:00 committed by GitHub
parent 36722fada9
commit 61ef26d511
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 40 additions and 40 deletions

View file

@ -26,7 +26,7 @@ describe('checkIfSeriesHaveSameFormatters(seriesModel, fieldFormatMap)', () => {
expect(result).toBe(true);
});
it('should return false for the different value_template series formatters', () => {
it('should return true for the different value_template series formatters', () => {
const seriesModel = [
{
formatter: DATA_FORMATTERS.PERCENT,
@ -39,13 +39,13 @@ describe('checkIfSeriesHaveSameFormatters(seriesModel, fieldFormatMap)', () => {
] as Series[];
const result = checkIfSeriesHaveSameFormatters(seriesModel, fieldFormatMap);
expect(result).toBe(false);
expect(result).toBe(true);
});
it('should return true for the same field formatters', () => {
const seriesModel = [
{ formatter: DATA_FORMATTERS.DEFAULT, metrics: [{ field: 'someField' }] },
{ formatter: DATA_FORMATTERS.DEFAULT, metrics: [{ field: 'someField' }] },
{ formatter: DATA_FORMATTERS.DEFAULT, metrics: [{ type: 'avg', field: 'someField' }] },
{ formatter: DATA_FORMATTERS.DEFAULT, metrics: [{ type: 'avg', field: 'someField' }] },
] as Series[];
const result = checkIfSeriesHaveSameFormatters(seriesModel, fieldFormatMap);
@ -54,11 +54,11 @@ describe('checkIfSeriesHaveSameFormatters(seriesModel, fieldFormatMap)', () => {
it('should return false for the different field formatters', () => {
const seriesModel = [
{ formatter: DATA_FORMATTERS.DEFAULT, metrics: [{ field: 'someField' }] },
{ formatter: DATA_FORMATTERS.DEFAULT, metrics: [{ type: 'avg', field: 'someField' }] },
{
formatter: DATA_FORMATTERS.DEFAULT,
metrics: [{ field: 'anotherField' }],
metrics: [{ id: 'avg', field: 'anotherField' }],
},
] as Series[];
const result = checkIfSeriesHaveSameFormatters(seriesModel, fieldFormatMap);
@ -71,9 +71,12 @@ describe('checkIfSeriesHaveSameFormatters(seriesModel, fieldFormatMap)', () => {
{
formatter: DATA_FORMATTERS.DEFAULT,
metrics: [{ field: 'someField' }, { field: 'field' }],
metrics: [
{ type: 'avg', field: 'someField' },
{ type: 'avg', field: 'field' },
],
},
{ formatter: DATA_FORMATTERS.DEFAULT, metrics: [{ field: 'someField' }] },
{ formatter: DATA_FORMATTERS.DEFAULT, metrics: [{ type: 'avg', field: 'someField' }] },
] as Series[];
const result = checkIfSeriesHaveSameFormatters(seriesModel, fieldFormatMap);

View file

@ -6,8 +6,8 @@
* Side Public License, v 1.
*/
import { last, isEqual } from 'lodash';
import { DATA_FORMATTERS } from '../../../../common/enums';
import { aggs } from '../../../../common/agg_utils';
import type { Series } from '../../../../common/types';
import type { FieldFormatMap } from '../../../../../../data/common';
@ -15,19 +15,28 @@ export const checkIfSeriesHaveSameFormatters = (
seriesModel: Series[],
fieldFormatMap?: FieldFormatMap
) => {
const allSeriesHaveDefaultFormatting = seriesModel.every(
(seriesGroup) => seriesGroup.formatter === DATA_FORMATTERS.DEFAULT
);
const uniqFormatters = new Set();
return allSeriesHaveDefaultFormatting && fieldFormatMap
? seriesModel
.map(({ metrics }) => fieldFormatMap[last(metrics)?.field ?? ''])
.every((fieldFormat, index, [firstSeriesFieldFormat]) =>
isEqual(fieldFormat, firstSeriesFieldFormat)
)
: seriesModel.every(
(series) =>
series.formatter === seriesModel[0].formatter &&
series.value_template === seriesModel[0].value_template
);
seriesModel.forEach((seriesGroup) => {
if (seriesGroup.formatter === DATA_FORMATTERS.DEFAULT) {
const activeMetric = seriesGroup.metrics[seriesGroup.metrics.length - 1];
const aggMeta = aggs.find((agg) => agg.id === activeMetric.type);
if (
activeMetric.field &&
aggMeta?.meta.isFieldRequired &&
fieldFormatMap?.[activeMetric.field]
) {
return uniqFormatters.add(JSON.stringify(fieldFormatMap[activeMetric.field]));
}
}
uniqFormatters.add(
JSON.stringify({
// requirement: in the case of using TSVB formatters, we do not need to check the value_template, just formatter!
formatter: seriesGroup.formatter,
})
);
});
return uniqFormatters.size === 1;
};

View file

@ -239,7 +239,7 @@ class TimeseriesVisualization extends Component {
} else if (!mainDomainAdded) {
const tickFormatter = checkIfSeriesHaveSameFormatters(seriesModel, fieldFormatMap)
? seriesGroupTickFormatter
: (val) => val;
: createTickFormatter(undefined, undefined, getConfig);
TimeseriesVisualization.addYAxis(yAxis, {
tickFormatter,

View file

@ -153,7 +153,7 @@ describe('TimeseriesVisualization', () => {
const yAxisFormattedValue = timeSeriesProps.yAxis[0].tickFormatter(value);
expect(yAxisFormattedValue).toBe(value);
expect(yAxisFormattedValue).toBe(`${value}`);
});
test('should return the same stringified number from yAxis formatter for byte and percent series', () => {
@ -173,18 +173,6 @@ describe('TimeseriesVisualization', () => {
expect(yAxis[0].tickFormatter(value)).toBe('500B');
});
test('should return simple number from yAxis formatter and different values from the same byte formatters, but with different value templates', () => {
const timeSeriesProps = setupTimeSeriesProps(
['byte', 'byte'],
['{{value}}', '{{value}} value']
);
const { series, yAxis } = timeSeriesProps;
expect(series[0].tickFormat(value)).toBe('500B');
expect(series[1].tickFormat(value)).toBe('500B value');
expect(yAxis[0].tickFormatter(value)).toBe(value);
});
test('should return percent formatted value from yAxis formatter and three percent formatted series with the same value templates', () => {
const timeSeriesProps = setupTimeSeriesProps(['percent', 'percent', 'percent']);
@ -204,7 +192,7 @@ describe('TimeseriesVisualization', () => {
expect(series[0].tickFormat(value)).toBe('500 template');
expect(series[1].tickFormat(value)).toBe('500B template');
expect(yAxis[0].tickFormatter(value)).toBe(value);
expect(yAxis[0].tickFormatter(value)).toBe(`${value}`);
});
test('should return field formatted value for yAxis and single series with default formatter', () => {
@ -232,7 +220,7 @@ describe('TimeseriesVisualization', () => {
expect(series[1].tickFormat(value)).toBe('500 years');
expect(series[2].tickFormat(value)).toBe('42 years');
expect(series[3].tickFormat(value)).toBe('$500');
expect(yAxis[0].tickFormatter(value)).toBe(value);
expect(yAxis[0].tickFormatter(value)).toBe(`${value}`);
});
test('should return simple number from yAxis formatter and correctly formatted series values', () => {
@ -243,7 +231,7 @@ describe('TimeseriesVisualization', () => {
expect(series[1].tickFormat(value)).toBe('500B');
expect(series[2].tickFormat(value)).toBe('50000%');
expect(series[3].tickFormat(value)).toBe('$500');
expect(yAxis[0].tickFormatter(value)).toBe(value);
expect(yAxis[0].tickFormatter(value)).toBe(`${value}`);
});
});
});