[Lens] Legacy metric expression types improvement. (#144236)

* FontFn converted to builder.

* labelFontFn added.

* visdimensionFn added.

* Added legacyMetricVisFn.

* Added expression-legacy-metric-plugin as optional dependency to lens.
This commit is contained in:
Yaroslav Kuznietsov 2022-11-02 17:19:06 +02:00 committed by GitHub
parent 79f3e44873
commit 2db1920f94
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 58 additions and 73 deletions

View file

@ -368,7 +368,9 @@ describe('metric_visualization', () => {
"type": "expression",
},
],
"palette": Array [],
"percentageMode": Array [
false,
],
"showLabels": Array [
true,
],

View file

@ -16,6 +16,15 @@ import { ColorMode, CustomPaletteState } from '@kbn/charts-plugin/common';
import { VIS_EVENT_TO_TRIGGER } from '@kbn/visualizations-plugin/public';
import { IconChartMetric } from '@kbn/chart-icons';
import { LayerTypes } from '@kbn/expression-xy-plugin/public';
import {
buildExpression,
buildExpressionFunction,
ExpressionFunctionFont,
FontWeight,
TextAlignment,
} from '@kbn/expressions-plugin/common';
import { ExpressionFunctionVisDimension } from '@kbn/visualizations-plugin/common';
import type { MetricVisExpressionFunctionDefinition } from '@kbn/expression-legacy-metric-vis-plugin/common';
import { getSuggestions } from './metric_suggestions';
import { Visualization, OperationMetadata, DatasourceLayers } from '../../types';
import type { LegacyMetricState } from '../../../common/types';
@ -97,78 +106,48 @@ const toExpression = (
};
const metricFontSize = labelToMetricFontSizeMap[state?.size || DEFAULT_TITLE_SIZE];
const fontFn = buildExpressionFunction<ExpressionFunctionFont>('font', {
align: (state?.textAlign || DEFAULT_TEXT_ALIGNMENT) as TextAlignment,
size: metricFontSize,
weight: '600' as FontWeight,
lHeight: metricFontSize * 1.5,
sizeUnit: labelFont.sizeUnit,
});
const labelFontFn = buildExpressionFunction<ExpressionFunctionFont>('font', {
align: (state?.textAlign || DEFAULT_TEXT_ALIGNMENT) as TextAlignment,
size: labelFont.size,
lHeight: labelFont.size * 1.5,
sizeUnit: labelFont.sizeUnit,
});
const visdimensionFn = buildExpressionFunction<ExpressionFunctionVisDimension>('visdimension', {
accessor: state.accessor,
});
const legacyMetricVisFn = buildExpressionFunction<MetricVisExpressionFunctionDefinition>(
'legacyMetricVis',
{
autoScaleMetricAlignment: state?.autoScaleMetricAlignment,
labelPosition: state?.titlePosition || DEFAULT_TITLE_POSITION,
font: buildExpression([fontFn]),
labelFont: buildExpression([labelFontFn]),
metric: buildExpression([visdimensionFn]),
showLabels: !attributes?.mode || attributes?.mode === 'full',
colorMode: !canColor ? ColorMode.None : state?.colorMode || ColorMode.None,
autoScale: true,
colorFullBackground: true,
palette:
state?.colorMode && state?.colorMode !== ColorMode.None
? paletteService.get(CUSTOM_PALETTE).toExpression(paletteParams)
: undefined,
percentageMode: false,
}
);
return {
type: 'expression',
chain: [
...(datasourceExpression?.chain ?? []),
{
type: 'function',
function: 'legacyMetricVis',
arguments: {
...(state?.autoScaleMetricAlignment
? { autoScaleMetricAlignment: [state?.autoScaleMetricAlignment] }
: {}),
labelPosition: [state?.titlePosition || DEFAULT_TITLE_POSITION],
font: [
{
type: 'expression',
chain: [
{
type: 'function',
function: 'font',
arguments: {
align: [state?.textAlign || DEFAULT_TEXT_ALIGNMENT],
size: [metricFontSize],
weight: ['600'],
lHeight: [metricFontSize * 1.5],
sizeUnit: [labelFont.sizeUnit],
},
},
],
},
],
labelFont: [
{
type: 'expression',
chain: [
{
type: 'function',
function: 'font',
arguments: {
align: [state?.textAlign || DEFAULT_TEXT_ALIGNMENT],
size: [labelFont.size],
lHeight: [labelFont.size * 1.5],
sizeUnit: [labelFont.sizeUnit],
},
},
],
},
],
metric: [
{
type: 'expression',
chain: [
{
type: 'function',
function: 'visdimension',
arguments: {
accessor: [state.accessor],
},
},
],
},
],
showLabels: [!attributes?.mode || attributes?.mode === 'full'],
colorMode: !canColor ? [ColorMode.None] : [state?.colorMode || ColorMode.None],
autoScale: [true],
colorFullBackground: [true],
palette:
state?.colorMode && state?.colorMode !== ColorMode.None
? [paletteService.get(CUSTOM_PALETTE).toExpression(paletteParams)]
: [],
},
},
],
chain: [...(datasourceExpression?.chain ?? []), legacyMetricVisFn.toAst()],
};
};