mirror of
https://github.com/elastic/kibana.git
synced 2025-04-23 17:28:26 -04:00
Implement tagcloud renderer (#77910)
* Implement toExpressionAst for tagcloud
* Implement tagcloud vis renderer
* Use resize observer
* Use common no data message
* Update build_pipeline.test
* Update tag cloud tests
* Revert "Use common no data message"
This reverts commit fddf019575.
* Update interpreter functional tests
* Add tests for toExpressionAst fn
* Use throttled chart update
* Update renderer
Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
Daniil Suleiman
GitHub
parent
966f00ac59
commit
53d49381c8
30 changed files with 673 additions and 316 deletions
|
|
@ -2,25 +2,9 @@
|
|||
|
||||
exports[`interpreter/functions#tagcloud returns an object with the correct structure 1`] = `
|
||||
Object {
|
||||
"as": "visualization",
|
||||
"as": "tagloud_vis",
|
||||
"type": "render",
|
||||
"value": Object {
|
||||
"params": Object {
|
||||
"listenOnChange": true,
|
||||
},
|
||||
"visConfig": Object {
|
||||
"maxFontSize": 72,
|
||||
"metric": Object {
|
||||
"accessor": 0,
|
||||
"format": Object {
|
||||
"id": "number",
|
||||
},
|
||||
},
|
||||
"minFontSize": 18,
|
||||
"orientation": "single",
|
||||
"scale": "linear",
|
||||
"showLabel": true,
|
||||
},
|
||||
"visData": Object {
|
||||
"columns": Array [
|
||||
Object {
|
||||
|
|
@ -35,6 +19,19 @@ Object {
|
|||
],
|
||||
"type": "kibana_datatable",
|
||||
},
|
||||
"visParams": Object {
|
||||
"maxFontSize": 72,
|
||||
"metric": Object {
|
||||
"accessor": 0,
|
||||
"format": Object {
|
||||
"id": "number",
|
||||
},
|
||||
},
|
||||
"minFontSize": 18,
|
||||
"orientation": "single",
|
||||
"scale": "linear",
|
||||
"showLabel": true,
|
||||
},
|
||||
"visType": "tagcloud",
|
||||
},
|
||||
}
|
||||
|
|
|
|||
171
src/plugins/vis_type_tagcloud/public/__snapshots__/to_ast.test.ts.snap
generated
Normal file
171
src/plugins/vis_type_tagcloud/public/__snapshots__/to_ast.test.ts.snap
generated
Normal file
|
|
@ -0,0 +1,171 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`tagcloud vis toExpressionAst function should match snapshot params fulfilled 1`] = `
|
||||
Object {
|
||||
"chain": Array [
|
||||
Object {
|
||||
"arguments": Object {
|
||||
"aggConfigs": Array [
|
||||
"[]",
|
||||
],
|
||||
"includeFormatHints": Array [
|
||||
false,
|
||||
],
|
||||
"index": Array [
|
||||
"123",
|
||||
],
|
||||
"metricsAtAllLevels": Array [
|
||||
false,
|
||||
],
|
||||
"partialRows": Array [
|
||||
false,
|
||||
],
|
||||
},
|
||||
"function": "esaggs",
|
||||
"type": "function",
|
||||
},
|
||||
Object {
|
||||
"arguments": Object {
|
||||
"bucket": Array [
|
||||
Object {
|
||||
"chain": Array [
|
||||
Object {
|
||||
"arguments": Object {
|
||||
"accessor": Array [
|
||||
0,
|
||||
],
|
||||
"format": Array [
|
||||
"terms",
|
||||
],
|
||||
"formatParams": Array [
|
||||
"{\\"id\\":\\"string\\",\\"otherBucketLabel\\":\\"Other\\",\\"missingBucketLabel\\":\\"Missing\\"}",
|
||||
],
|
||||
},
|
||||
"function": "visdimension",
|
||||
"type": "function",
|
||||
},
|
||||
],
|
||||
"type": "expression",
|
||||
},
|
||||
],
|
||||
"maxFontSize": Array [
|
||||
15,
|
||||
],
|
||||
"metric": Array [
|
||||
Object {
|
||||
"chain": Array [
|
||||
Object {
|
||||
"arguments": Object {
|
||||
"accessor": Array [
|
||||
1,
|
||||
],
|
||||
"format": Array [
|
||||
"number",
|
||||
],
|
||||
},
|
||||
"function": "visdimension",
|
||||
"type": "function",
|
||||
},
|
||||
],
|
||||
"type": "expression",
|
||||
},
|
||||
],
|
||||
"minFontSize": Array [
|
||||
5,
|
||||
],
|
||||
"orientation": Array [
|
||||
"single",
|
||||
],
|
||||
"scale": Array [
|
||||
"linear",
|
||||
],
|
||||
"showLabel": Array [
|
||||
true,
|
||||
],
|
||||
},
|
||||
"function": "tagcloud",
|
||||
"type": "function",
|
||||
},
|
||||
],
|
||||
"type": "expression",
|
||||
}
|
||||
`;
|
||||
|
||||
exports[`tagcloud vis toExpressionAst function should match snapshot without params 1`] = `
|
||||
Object {
|
||||
"chain": Array [
|
||||
Object {
|
||||
"arguments": Object {
|
||||
"aggConfigs": Array [
|
||||
"[]",
|
||||
],
|
||||
"includeFormatHints": Array [
|
||||
false,
|
||||
],
|
||||
"index": Array [
|
||||
"123",
|
||||
],
|
||||
"metricsAtAllLevels": Array [
|
||||
false,
|
||||
],
|
||||
"partialRows": Array [
|
||||
false,
|
||||
],
|
||||
},
|
||||
"function": "esaggs",
|
||||
"type": "function",
|
||||
},
|
||||
Object {
|
||||
"arguments": Object {
|
||||
"bucket": Array [
|
||||
Object {
|
||||
"chain": Array [
|
||||
Object {
|
||||
"arguments": Object {
|
||||
"accessor": Array [
|
||||
0,
|
||||
],
|
||||
"format": Array [
|
||||
"terms",
|
||||
],
|
||||
"formatParams": Array [
|
||||
"{\\"id\\":\\"string\\",\\"otherBucketLabel\\":\\"Other\\",\\"missingBucketLabel\\":\\"Missing\\"}",
|
||||
],
|
||||
},
|
||||
"function": "visdimension",
|
||||
"type": "function",
|
||||
},
|
||||
],
|
||||
"type": "expression",
|
||||
},
|
||||
],
|
||||
"metric": Array [
|
||||
Object {
|
||||
"chain": Array [
|
||||
Object {
|
||||
"arguments": Object {
|
||||
"accessor": Array [
|
||||
1,
|
||||
],
|
||||
"format": Array [
|
||||
"number",
|
||||
],
|
||||
},
|
||||
"function": "visdimension",
|
||||
"type": "function",
|
||||
},
|
||||
],
|
||||
"type": "expression",
|
||||
},
|
||||
],
|
||||
"showLabel": Array [
|
||||
false,
|
||||
],
|
||||
},
|
||||
"function": "tagcloud",
|
||||
"type": "function",
|
||||
},
|
||||
],
|
||||
"type": "expression",
|
||||
}
|
||||
`;
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
.tgcVis {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tgcVisLabel {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-weight: $euiFontWeightBold;
|
||||
}
|
||||
|
|
@ -28,7 +28,7 @@ export class Label extends Component {
|
|||
render() {
|
||||
return (
|
||||
<div
|
||||
className="tgcVisLabel"
|
||||
className="tgcChart__label"
|
||||
style={{ display: this.state.shouldShowLabel ? 'block' : 'none' }}
|
||||
>
|
||||
{this.state.label}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,26 @@
|
|||
// Prefix all styles with "tgc" to avoid conflicts.
|
||||
// Examples
|
||||
// tgcChart
|
||||
// tgcChart__legend
|
||||
// tgcChart__legend--small
|
||||
// tgcChart__legend-isLoading
|
||||
|
||||
.tgcChart__container, .tgcChart__wrapper {
|
||||
flex: 1 1 0;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.tgcChart {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tgcChart__label {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-weight: $euiFontWeightBold;
|
||||
}
|
||||
|
|
@ -0,0 +1,84 @@
|
|||
/*
|
||||
* Licensed to Elasticsearch B.V. under one or more contributor
|
||||
* license agreements. See the NOTICE file distributed with
|
||||
* this work for additional information regarding copyright
|
||||
* ownership. Elasticsearch B.V. licenses this file to you under
|
||||
* the Apache License, Version 2.0 (the "License"); you may
|
||||
* not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
import React, { useEffect, useMemo, useRef } from 'react';
|
||||
import { EuiResizeObserver } from '@elastic/eui';
|
||||
import { throttle } from 'lodash';
|
||||
|
||||
import { TagCloudVisDependencies } from '../plugin';
|
||||
import { TagCloudVisRenderValue } from '../tag_cloud_fn';
|
||||
// @ts-ignore
|
||||
import { TagCloudVisualization } from './tag_cloud_visualization';
|
||||
|
||||
import './tag_cloud.scss';
|
||||
|
||||
type TagCloudChartProps = TagCloudVisDependencies &
|
||||
TagCloudVisRenderValue & {
|
||||
fireEvent: (event: any) => void;
|
||||
renderComplete: () => void;
|
||||
};
|
||||
|
||||
export const TagCloudChart = ({
|
||||
colors,
|
||||
visData,
|
||||
visParams,
|
||||
fireEvent,
|
||||
renderComplete,
|
||||
}: TagCloudChartProps) => {
|
||||
const chartDiv = useRef<HTMLDivElement>(null);
|
||||
const visController = useRef<any>(null);
|
||||
|
||||
useEffect(() => {
|
||||
visController.current = new TagCloudVisualization(chartDiv.current, colors, fireEvent);
|
||||
return () => {
|
||||
visController.current.destroy();
|
||||
visController.current = null;
|
||||
};
|
||||
}, [colors, fireEvent]);
|
||||
|
||||
useEffect(() => {
|
||||
if (visController.current) {
|
||||
visController.current.render(visData, visParams).then(renderComplete);
|
||||
}
|
||||
}, [visData, visParams, renderComplete]);
|
||||
|
||||
const updateChartSize = useMemo(
|
||||
() =>
|
||||
throttle(() => {
|
||||
if (visController.current) {
|
||||
visController.current.render().then(renderComplete);
|
||||
}
|
||||
}, 300),
|
||||
[renderComplete]
|
||||
);
|
||||
|
||||
return (
|
||||
<EuiResizeObserver onResize={updateChartSize}>
|
||||
{(resizeRef) => (
|
||||
<div className="tgcChart__wrapper" ref={resizeRef}>
|
||||
<div className="tgcChart__container" ref={chartDiv} />
|
||||
</div>
|
||||
)}
|
||||
</EuiResizeObserver>
|
||||
);
|
||||
};
|
||||
|
||||
// default export required for React.Lazy
|
||||
// eslint-disable-next-line import/no-default-export
|
||||
export { TagCloudChart as default };
|
||||
|
|
@ -32,126 +32,138 @@ import d3 from 'd3';
|
|||
|
||||
const MAX_TAG_COUNT = 200;
|
||||
|
||||
export function createTagCloudVisualization({ colors }) {
|
||||
const colorScale = d3.scale.ordinal().range(colors.seedColors);
|
||||
return class TagCloudVisualization {
|
||||
constructor(node, vis) {
|
||||
this._containerNode = node;
|
||||
export class TagCloudVisualization {
|
||||
constructor(node, colors, fireEvent) {
|
||||
this._containerNode = node;
|
||||
|
||||
const cloudRelativeContainer = document.createElement('div');
|
||||
cloudRelativeContainer.classList.add('tgcVis');
|
||||
cloudRelativeContainer.setAttribute('style', 'position: relative');
|
||||
const cloudContainer = document.createElement('div');
|
||||
cloudContainer.classList.add('tgcVis');
|
||||
cloudContainer.setAttribute('data-test-subj', 'tagCloudVisualization');
|
||||
this._containerNode.classList.add('visChart--vertical');
|
||||
cloudRelativeContainer.appendChild(cloudContainer);
|
||||
this._containerNode.appendChild(cloudRelativeContainer);
|
||||
const cloudRelativeContainer = document.createElement('div');
|
||||
cloudRelativeContainer.classList.add('tgcChart');
|
||||
cloudRelativeContainer.setAttribute('style', 'position: relative');
|
||||
const cloudContainer = document.createElement('div');
|
||||
cloudContainer.classList.add('tgcChart');
|
||||
cloudContainer.setAttribute('data-test-subj', 'tagCloudVisualization');
|
||||
this._containerNode.classList.add('visChart--vertical');
|
||||
cloudRelativeContainer.appendChild(cloudContainer);
|
||||
this._containerNode.appendChild(cloudRelativeContainer);
|
||||
|
||||
this._vis = vis;
|
||||
this._truncated = false;
|
||||
this._tagCloud = new TagCloud(cloudContainer, colorScale);
|
||||
this._tagCloud.on('select', (event) => {
|
||||
if (!this._visParams.bucket) {
|
||||
return;
|
||||
}
|
||||
this._vis.API.events.filter({
|
||||
table: event.meta.data,
|
||||
column: 0,
|
||||
row: event.meta.rowIndex,
|
||||
});
|
||||
});
|
||||
this._renderComplete$ = Rx.fromEvent(this._tagCloud, 'renderComplete');
|
||||
|
||||
this._feedbackNode = document.createElement('div');
|
||||
this._containerNode.appendChild(this._feedbackNode);
|
||||
this._feedbackMessage = React.createRef();
|
||||
render(
|
||||
<I18nProvider>
|
||||
<FeedbackMessage ref={this._feedbackMessage} />
|
||||
</I18nProvider>,
|
||||
this._feedbackNode
|
||||
);
|
||||
|
||||
this._labelNode = document.createElement('div');
|
||||
this._containerNode.appendChild(this._labelNode);
|
||||
this._label = React.createRef();
|
||||
render(<Label ref={this._label} />, this._labelNode);
|
||||
}
|
||||
|
||||
async render(data, visParams) {
|
||||
this._updateParams(visParams);
|
||||
this._updateData(data);
|
||||
this._resize();
|
||||
|
||||
await this._renderComplete$.pipe(take(1)).toPromise();
|
||||
|
||||
if (data.columns.length !== 2) {
|
||||
this._feedbackMessage.current.setState({
|
||||
shouldShowTruncate: false,
|
||||
shouldShowIncomplete: false,
|
||||
});
|
||||
this._truncated = false;
|
||||
this._tagCloud = new TagCloud(cloudContainer, d3.scale.ordinal().range(colors.seedColors));
|
||||
this._tagCloud.on('select', (event) => {
|
||||
if (!this._visParams.bucket) {
|
||||
return;
|
||||
}
|
||||
|
||||
fireEvent({
|
||||
name: 'filterBucket',
|
||||
data: {
|
||||
data: [
|
||||
{
|
||||
table: event.meta.data,
|
||||
column: 0,
|
||||
row: event.meta.rowIndex,
|
||||
},
|
||||
],
|
||||
},
|
||||
});
|
||||
});
|
||||
this._renderComplete$ = Rx.fromEvent(this._tagCloud, 'renderComplete');
|
||||
|
||||
this._feedbackNode = document.createElement('div');
|
||||
this._containerNode.appendChild(this._feedbackNode);
|
||||
this._feedbackMessage = React.createRef();
|
||||
render(
|
||||
<I18nProvider>
|
||||
<FeedbackMessage ref={this._feedbackMessage} />
|
||||
</I18nProvider>,
|
||||
this._feedbackNode
|
||||
);
|
||||
|
||||
this._labelNode = document.createElement('div');
|
||||
this._containerNode.appendChild(this._labelNode);
|
||||
this._label = React.createRef();
|
||||
render(<Label ref={this._label} />, this._labelNode);
|
||||
}
|
||||
|
||||
async render(data, visParams) {
|
||||
if (data && visParams) {
|
||||
this._updateParams(visParams);
|
||||
this._updateData(data);
|
||||
}
|
||||
|
||||
this._resize();
|
||||
|
||||
await this._renderComplete$.pipe(take(1)).toPromise();
|
||||
|
||||
if (data && data.columns.length !== 2 && this._feedbackMessage.current) {
|
||||
this._feedbackMessage.current.setState({
|
||||
shouldShowTruncate: false,
|
||||
shouldShowIncomplete: false,
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (data && this._label.current) {
|
||||
this._label.current.setState({
|
||||
label: `${data.columns[0].name} - ${data.columns[1].name}`,
|
||||
shouldShowLabel: visParams.showLabel,
|
||||
});
|
||||
}
|
||||
|
||||
if (this._feedbackMessage.current) {
|
||||
this._feedbackMessage.current.setState({
|
||||
shouldShowTruncate: this._truncated,
|
||||
shouldShowIncomplete: this._tagCloud.getStatus() === TagCloud.STATUS.INCOMPLETE,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
destroy() {
|
||||
this._tagCloud.destroy();
|
||||
unmountComponentAtNode(this._feedbackNode);
|
||||
unmountComponentAtNode(this._labelNode);
|
||||
destroy() {
|
||||
this._tagCloud.destroy();
|
||||
unmountComponentAtNode(this._feedbackNode);
|
||||
unmountComponentAtNode(this._labelNode);
|
||||
}
|
||||
|
||||
_updateData(data) {
|
||||
if (!data || !data.rows.length) {
|
||||
this._tagCloud.setData([]);
|
||||
return;
|
||||
}
|
||||
|
||||
_updateData(data) {
|
||||
if (!data || !data.rows.length) {
|
||||
this._tagCloud.setData([]);
|
||||
return;
|
||||
}
|
||||
const bucket = this._visParams.bucket;
|
||||
const metric = this._visParams.metric;
|
||||
const bucketFormatter = bucket ? getFormatService().deserialize(bucket.format) : null;
|
||||
const tagColumn = bucket ? data.columns[bucket.accessor].id : -1;
|
||||
const metricColumn = data.columns[metric.accessor].id;
|
||||
const tags = data.rows.map((row, rowIndex) => {
|
||||
const tag = row[tagColumn] === undefined ? 'all' : row[tagColumn];
|
||||
const metric = row[metricColumn];
|
||||
return {
|
||||
displayText: bucketFormatter ? bucketFormatter.convert(tag, 'text') : tag,
|
||||
rawText: tag,
|
||||
value: metric,
|
||||
meta: {
|
||||
data: data,
|
||||
rowIndex: rowIndex,
|
||||
},
|
||||
};
|
||||
});
|
||||
|
||||
const bucket = this._visParams.bucket;
|
||||
const metric = this._visParams.metric;
|
||||
const bucketFormatter = bucket ? getFormatService().deserialize(bucket.format) : null;
|
||||
const tagColumn = bucket ? data.columns[bucket.accessor].id : -1;
|
||||
const metricColumn = data.columns[metric.accessor].id;
|
||||
const tags = data.rows.map((row, rowIndex) => {
|
||||
const tag = row[tagColumn] === undefined ? 'all' : row[tagColumn];
|
||||
const metric = row[metricColumn];
|
||||
return {
|
||||
displayText: bucketFormatter ? bucketFormatter.convert(tag, 'text') : tag,
|
||||
rawText: tag,
|
||||
value: metric,
|
||||
meta: {
|
||||
data: data,
|
||||
rowIndex: rowIndex,
|
||||
},
|
||||
};
|
||||
});
|
||||
|
||||
if (tags.length > MAX_TAG_COUNT) {
|
||||
tags.length = MAX_TAG_COUNT;
|
||||
this._truncated = true;
|
||||
} else {
|
||||
this._truncated = false;
|
||||
}
|
||||
|
||||
this._tagCloud.setData(tags);
|
||||
if (tags.length > MAX_TAG_COUNT) {
|
||||
tags.length = MAX_TAG_COUNT;
|
||||
this._truncated = true;
|
||||
} else {
|
||||
this._truncated = false;
|
||||
}
|
||||
|
||||
_updateParams(visParams) {
|
||||
this._visParams = visParams;
|
||||
this._tagCloud.setOptions(visParams);
|
||||
}
|
||||
this._tagCloud.setData(tags);
|
||||
}
|
||||
|
||||
_resize() {
|
||||
this._tagCloud.resize();
|
||||
}
|
||||
};
|
||||
_updateParams(visParams) {
|
||||
this._visParams = visParams;
|
||||
this._tagCloud.setOptions(visParams);
|
||||
}
|
||||
|
||||
_resize() {
|
||||
this._tagCloud.resize();
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,8 +19,7 @@
|
|||
|
||||
import 'jest-canvas-mock';
|
||||
|
||||
import { createTagCloudVisTypeDefinition } from '../tag_cloud_type';
|
||||
import { createTagCloudVisualization } from './tag_cloud_visualization';
|
||||
import { TagCloudVisualization } from './tag_cloud_visualization';
|
||||
import { setFormatService } from '../services';
|
||||
import { dataPluginMock } from '../../../data/public/mocks';
|
||||
import { setHTMLElementOffset, setSVGElementGetBBox } from '../../../../test_utils/public';
|
||||
|
|
@ -29,7 +28,7 @@ const seedColors = ['#00a69b', '#57c17b', '#6f87d8', '#663db8', '#bc52bc', '#9e3
|
|||
|
||||
describe('TagCloudVisualizationTest', () => {
|
||||
let domNode;
|
||||
let vis;
|
||||
let visParams;
|
||||
let SVGElementGetBBoxSpyInstance;
|
||||
let HTMLElementOffsetMockInstance;
|
||||
|
||||
|
|
@ -52,11 +51,6 @@ describe('TagCloudVisualizationTest', () => {
|
|||
{ 'col-0': 'BR', 'col-1': 3 },
|
||||
],
|
||||
};
|
||||
const TagCloudVisualization = createTagCloudVisualization({
|
||||
colors: {
|
||||
seedColors,
|
||||
},
|
||||
});
|
||||
|
||||
const originTransformSVGElement = window.SVGElement.prototype.transform;
|
||||
|
||||
|
|
@ -82,67 +76,44 @@ describe('TagCloudVisualizationTest', () => {
|
|||
|
||||
describe('TagCloudVisualization - basics', () => {
|
||||
beforeEach(async () => {
|
||||
const visType = createTagCloudVisTypeDefinition({ colors: seedColors });
|
||||
setupDOM(512, 512);
|
||||
|
||||
vis = {
|
||||
type: visType,
|
||||
params: {
|
||||
bucket: { accessor: 0, format: {} },
|
||||
metric: { accessor: 0, format: {} },
|
||||
scale: 'linear',
|
||||
orientation: 'single',
|
||||
},
|
||||
data: {},
|
||||
visParams = {
|
||||
bucket: { accessor: 0, format: {} },
|
||||
metric: { accessor: 0, format: {} },
|
||||
scale: 'linear',
|
||||
orientation: 'single',
|
||||
};
|
||||
});
|
||||
|
||||
test('simple draw', async () => {
|
||||
const tagcloudVisualization = new TagCloudVisualization(domNode, vis);
|
||||
|
||||
await tagcloudVisualization.render(dummyTableGroup, vis.params, {
|
||||
resize: false,
|
||||
params: true,
|
||||
aggs: true,
|
||||
data: true,
|
||||
uiState: false,
|
||||
const tagcloudVisualization = new TagCloudVisualization(domNode, {
|
||||
seedColors,
|
||||
});
|
||||
|
||||
await tagcloudVisualization.render(dummyTableGroup, visParams);
|
||||
|
||||
const svgNode = domNode.querySelector('svg');
|
||||
expect(svgNode.outerHTML).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('with resize', async () => {
|
||||
const tagcloudVisualization = new TagCloudVisualization(domNode, vis);
|
||||
await tagcloudVisualization.render(dummyTableGroup, vis.params, {
|
||||
resize: false,
|
||||
params: true,
|
||||
aggs: true,
|
||||
data: true,
|
||||
uiState: false,
|
||||
const tagcloudVisualization = new TagCloudVisualization(domNode, {
|
||||
seedColors,
|
||||
});
|
||||
await tagcloudVisualization.render(dummyTableGroup, visParams);
|
||||
|
||||
await tagcloudVisualization.render(dummyTableGroup, vis.params, {
|
||||
resize: true,
|
||||
params: false,
|
||||
aggs: false,
|
||||
data: false,
|
||||
uiState: false,
|
||||
});
|
||||
await tagcloudVisualization.render(dummyTableGroup, visParams);
|
||||
|
||||
const svgNode = domNode.querySelector('svg');
|
||||
expect(svgNode.outerHTML).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('with param change', async function () {
|
||||
const tagcloudVisualization = new TagCloudVisualization(domNode, vis);
|
||||
await tagcloudVisualization.render(dummyTableGroup, vis.params, {
|
||||
resize: false,
|
||||
params: true,
|
||||
aggs: true,
|
||||
data: true,
|
||||
uiState: false,
|
||||
const tagcloudVisualization = new TagCloudVisualization(domNode, {
|
||||
seedColors,
|
||||
});
|
||||
await tagcloudVisualization.render(dummyTableGroup, visParams);
|
||||
|
||||
SVGElementGetBBoxSpyInstance.mockRestore();
|
||||
SVGElementGetBBoxSpyInstance = setSVGElementGetBBox(256, 368);
|
||||
|
|
@ -150,15 +121,9 @@ describe('TagCloudVisualizationTest', () => {
|
|||
HTMLElementOffsetMockInstance.mockRestore();
|
||||
HTMLElementOffsetMockInstance = setHTMLElementOffset(256, 386);
|
||||
|
||||
vis.params.orientation = 'right angled';
|
||||
vis.params.minFontSize = 70;
|
||||
await tagcloudVisualization.render(dummyTableGroup, vis.params, {
|
||||
resize: true,
|
||||
params: true,
|
||||
aggs: false,
|
||||
data: false,
|
||||
uiState: false,
|
||||
});
|
||||
visParams.orientation = 'right angled';
|
||||
visParams.minFontSize = 70;
|
||||
await tagcloudVisualization.render(dummyTableGroup, visParams);
|
||||
|
||||
const svgNode = domNode.querySelector('svg');
|
||||
expect(svgNode.outerHTML).toMatchSnapshot();
|
||||
|
|
|
|||
|
|
@ -1,8 +0,0 @@
|
|||
// Prefix all styles with "tgc" to avoid conflicts.
|
||||
// Examples
|
||||
// tgcChart
|
||||
// tgcChart__legend
|
||||
// tgcChart__legend--small
|
||||
// tgcChart__legend-isLoading
|
||||
|
||||
@import './tag_cloud';
|
||||
|
|
@ -23,12 +23,11 @@ import { VisualizationsSetup } from '../../visualizations/public';
|
|||
import { ChartsPluginSetup } from '../../charts/public';
|
||||
|
||||
import { createTagCloudFn } from './tag_cloud_fn';
|
||||
import { createTagCloudVisTypeDefinition } from './tag_cloud_type';
|
||||
import { tagCloudVisTypeDefinition } from './tag_cloud_type';
|
||||
import { DataPublicPluginStart } from '../../data/public';
|
||||
import { setFormatService } from './services';
|
||||
import { ConfigSchema } from '../config';
|
||||
|
||||
import './index.scss';
|
||||
import { getTagCloudVisRenderer } from './tag_cloud_vis_renderer';
|
||||
|
||||
/** @internal */
|
||||
export interface TagCloudPluginSetupDependencies {
|
||||
|
|
@ -63,9 +62,8 @@ export class TagCloudPlugin implements Plugin<void, void> {
|
|||
colors: charts.colors,
|
||||
};
|
||||
expressions.registerFunction(createTagCloudFn);
|
||||
visualizations.createBaseVisualization(
|
||||
createTagCloudVisTypeDefinition(visualizationDependencies)
|
||||
);
|
||||
expressions.registerRenderer(getTagCloudVisRenderer(visualizationDependencies));
|
||||
visualizations.createBaseVisualization(tagCloudVisTypeDefinition);
|
||||
}
|
||||
|
||||
public start(core: CoreStart, { data }: TagCloudVisPluginStartDependencies) {
|
||||
|
|
|
|||
|
|
@ -26,22 +26,23 @@ const name = 'tagcloud';
|
|||
|
||||
interface Arguments extends TagCloudVisParams {
|
||||
metric: any; // these aren't typed yet
|
||||
bucket: any; // these aren't typed yet
|
||||
bucket?: any; // these aren't typed yet
|
||||
}
|
||||
|
||||
interface RenderValue {
|
||||
export interface TagCloudVisRenderValue {
|
||||
visType: typeof name;
|
||||
visData: KibanaDatatable;
|
||||
visConfig: Arguments;
|
||||
params: any;
|
||||
visParams: Arguments;
|
||||
}
|
||||
|
||||
export const createTagCloudFn = (): ExpressionFunctionDefinition<
|
||||
export type TagcloudExpressionFunctionDefinition = ExpressionFunctionDefinition<
|
||||
typeof name,
|
||||
KibanaDatatable,
|
||||
Arguments,
|
||||
Render<RenderValue>
|
||||
> => ({
|
||||
Render<TagCloudVisRenderValue>
|
||||
>;
|
||||
|
||||
export const createTagCloudFn = (): TagcloudExpressionFunctionDefinition => ({
|
||||
name,
|
||||
type: 'render',
|
||||
inputTypes: ['kibana_datatable'],
|
||||
|
|
@ -95,7 +96,7 @@ export const createTagCloudFn = (): ExpressionFunctionDefinition<
|
|||
},
|
||||
},
|
||||
fn(input, args) {
|
||||
const visConfig = {
|
||||
const visParams = {
|
||||
scale: args.scale,
|
||||
orientation: args.orientation,
|
||||
minFontSize: args.minFontSize,
|
||||
|
|
@ -105,19 +106,16 @@ export const createTagCloudFn = (): ExpressionFunctionDefinition<
|
|||
} as Arguments;
|
||||
|
||||
if (args.bucket !== undefined) {
|
||||
visConfig.bucket = args.bucket;
|
||||
visParams.bucket = args.bucket;
|
||||
}
|
||||
|
||||
return {
|
||||
type: 'render',
|
||||
as: 'visualization',
|
||||
as: 'tagloud_vis',
|
||||
value: {
|
||||
visData: input,
|
||||
visType: name,
|
||||
visConfig,
|
||||
params: {
|
||||
listenOnChange: true,
|
||||
},
|
||||
visParams,
|
||||
},
|
||||
};
|
||||
},
|
||||
|
|
|
|||
|
|
@ -20,15 +20,12 @@
|
|||
import { i18n } from '@kbn/i18n';
|
||||
|
||||
import { Schemas } from '../../vis_default_editor/public';
|
||||
import { VIS_EVENT_TO_TRIGGER } from '../../visualizations/public';
|
||||
|
||||
import { TagCloudOptions } from './components/tag_cloud_options';
|
||||
import { VIS_EVENT_TO_TRIGGER } from '../../../plugins/visualizations/public';
|
||||
import { toExpressionAst } from './to_ast';
|
||||
|
||||
// @ts-ignore
|
||||
import { createTagCloudVisualization } from './components/tag_cloud_visualization';
|
||||
import { TagCloudVisDependencies } from './plugin';
|
||||
|
||||
export const createTagCloudVisTypeDefinition = (deps: TagCloudVisDependencies) => ({
|
||||
export const tagCloudVisTypeDefinition = {
|
||||
name: 'tagcloud',
|
||||
title: i18n.translate('visTypeTagCloud.vis.tagCloudTitle', { defaultMessage: 'Tag Cloud' }),
|
||||
icon: 'visTagCloud',
|
||||
|
|
@ -47,7 +44,7 @@ export const createTagCloudVisTypeDefinition = (deps: TagCloudVisDependencies) =
|
|||
showLabel: true,
|
||||
},
|
||||
},
|
||||
visualization: createTagCloudVisualization(deps),
|
||||
toExpressionAst,
|
||||
editorConfig: {
|
||||
collections: {
|
||||
scales: [
|
||||
|
|
@ -123,5 +120,4 @@ export const createTagCloudVisTypeDefinition = (deps: TagCloudVisDependencies) =
|
|||
},
|
||||
]),
|
||||
},
|
||||
useCustomNoDataScreen: true,
|
||||
});
|
||||
};
|
||||
|
|
|
|||
|
|
@ -0,0 +1,54 @@
|
|||
/*
|
||||
* Licensed to Elasticsearch B.V. under one or more contributor
|
||||
* license agreements. See the NOTICE file distributed with
|
||||
* this work for additional information regarding copyright
|
||||
* ownership. Elasticsearch B.V. licenses this file to you under
|
||||
* the Apache License, Version 2.0 (the "License"); you may
|
||||
* not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
import React, { lazy } from 'react';
|
||||
import { render, unmountComponentAtNode } from 'react-dom';
|
||||
|
||||
import { VisualizationContainer } from '../../visualizations/public';
|
||||
import { ExpressionRenderDefinition } from '../../expressions/common/expression_renderers';
|
||||
import { TagCloudVisDependencies } from './plugin';
|
||||
import { TagCloudVisRenderValue } from './tag_cloud_fn';
|
||||
|
||||
// @ts-ignore
|
||||
const TagCloudChart = lazy(() => import('./components/tag_cloud_chart'));
|
||||
|
||||
export const getTagCloudVisRenderer: (
|
||||
deps: TagCloudVisDependencies
|
||||
) => ExpressionRenderDefinition<TagCloudVisRenderValue> = ({ colors }) => ({
|
||||
name: 'tagloud_vis',
|
||||
displayName: 'Tag Cloud visualization',
|
||||
reuseDomNode: true,
|
||||
render: async (domNode, config, handlers) => {
|
||||
handlers.onDestroy(() => {
|
||||
unmountComponentAtNode(domNode);
|
||||
});
|
||||
|
||||
render(
|
||||
<VisualizationContainer>
|
||||
<TagCloudChart
|
||||
{...config}
|
||||
colors={colors}
|
||||
renderComplete={handlers.done}
|
||||
fireEvent={handlers.event}
|
||||
/>
|
||||
</VisualizationContainer>,
|
||||
domNode
|
||||
);
|
||||
},
|
||||
});
|
||||
84
src/plugins/vis_type_tagcloud/public/to_ast.test.ts
Normal file
84
src/plugins/vis_type_tagcloud/public/to_ast.test.ts
Normal file
|
|
@ -0,0 +1,84 @@
|
|||
/*
|
||||
* Licensed to Elasticsearch B.V. under one or more contributor
|
||||
* license agreements. See the NOTICE file distributed with
|
||||
* this work for additional information regarding copyright
|
||||
* ownership. Elasticsearch B.V. licenses this file to you under
|
||||
* the Apache License, Version 2.0 (the "License"); you may
|
||||
* not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
import { Vis } from 'src/plugins/visualizations/public';
|
||||
import { toExpressionAst } from './to_ast';
|
||||
import { TagCloudVisParams } from './types';
|
||||
|
||||
const mockSchemas = {
|
||||
metric: [{ accessor: 1, format: { id: 'number' }, params: {}, label: 'Count', aggType: 'count' }],
|
||||
segment: [
|
||||
{
|
||||
accessor: 0,
|
||||
format: {
|
||||
id: 'terms',
|
||||
params: {
|
||||
id: 'string',
|
||||
otherBucketLabel: 'Other',
|
||||
missingBucketLabel: 'Missing',
|
||||
},
|
||||
},
|
||||
params: {},
|
||||
label: 'products.product_name.keyword: Descending',
|
||||
aggType: 'terms',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
jest.mock('../../visualizations/public', () => ({
|
||||
getVisSchemas: () => mockSchemas,
|
||||
}));
|
||||
|
||||
describe('tagcloud vis toExpressionAst function', () => {
|
||||
let vis: Vis<TagCloudVisParams>;
|
||||
|
||||
beforeEach(() => {
|
||||
vis = {
|
||||
isHierarchical: () => false,
|
||||
type: {},
|
||||
params: {
|
||||
showLabel: false,
|
||||
},
|
||||
data: {
|
||||
indexPattern: { id: '123' },
|
||||
aggs: {
|
||||
getResponseAggs: () => [],
|
||||
aggs: [],
|
||||
},
|
||||
},
|
||||
} as any;
|
||||
});
|
||||
|
||||
it('should match snapshot without params', () => {
|
||||
const actual = toExpressionAst(vis, {} as any);
|
||||
expect(actual).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('should match snapshot params fulfilled', () => {
|
||||
vis.params = {
|
||||
scale: 'linear',
|
||||
orientation: 'single',
|
||||
minFontSize: 5,
|
||||
maxFontSize: 15,
|
||||
showLabel: true,
|
||||
};
|
||||
const actual = toExpressionAst(vis, {} as any);
|
||||
expect(actual).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
60
src/plugins/vis_type_tagcloud/public/to_ast.ts
Normal file
60
src/plugins/vis_type_tagcloud/public/to_ast.ts
Normal file
|
|
@ -0,0 +1,60 @@
|
|||
/*
|
||||
* Licensed to Elasticsearch B.V. under one or more contributor
|
||||
* license agreements. See the NOTICE file distributed with
|
||||
* this work for additional information regarding copyright
|
||||
* ownership. Elasticsearch B.V. licenses this file to you under
|
||||
* the Apache License, Version 2.0 (the "License"); you may
|
||||
* not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
import { EsaggsExpressionFunctionDefinition } from '../../data/common/search/expressions';
|
||||
import { buildExpression, buildExpressionFunction } from '../../expressions/public';
|
||||
import { getVisSchemas, SchemaConfig, Vis, BuildPipelineParams } from '../../visualizations/public';
|
||||
import { TagcloudExpressionFunctionDefinition } from './tag_cloud_fn';
|
||||
import { TagCloudVisParams } from './types';
|
||||
|
||||
const prepareDimension = (params: SchemaConfig) => {
|
||||
const visdimension = buildExpressionFunction('visdimension', { accessor: params.accessor });
|
||||
|
||||
if (params.format) {
|
||||
visdimension.addArgument('format', params.format.id);
|
||||
visdimension.addArgument('formatParams', JSON.stringify(params.format.params));
|
||||
}
|
||||
|
||||
return buildExpression([visdimension]);
|
||||
};
|
||||
|
||||
export const toExpressionAst = (vis: Vis<TagCloudVisParams>, params: BuildPipelineParams) => {
|
||||
const esaggs = buildExpressionFunction<EsaggsExpressionFunctionDefinition>('esaggs', {
|
||||
index: vis.data.indexPattern!.id!,
|
||||
metricsAtAllLevels: vis.isHierarchical(),
|
||||
partialRows: vis.type.requiresPartialRows || false,
|
||||
aggConfigs: JSON.stringify(vis.data.aggs!.aggs),
|
||||
includeFormatHints: false,
|
||||
});
|
||||
|
||||
const schemas = getVisSchemas(vis, params);
|
||||
|
||||
const tagcloud = buildExpressionFunction<TagcloudExpressionFunctionDefinition>('tagcloud', {
|
||||
...vis.params,
|
||||
metric: prepareDimension(schemas.metric[0]),
|
||||
});
|
||||
|
||||
if (schemas.segment) {
|
||||
tagcloud.addArgument('bucket', prepareDimension(schemas.segment[0]));
|
||||
}
|
||||
|
||||
const ast = buildExpression([esaggs, tagcloud]);
|
||||
|
||||
return ast.toAst();
|
||||
};
|
||||
|
|
@ -42,7 +42,7 @@ export type VisualizeEmbeddableFactoryContract = PublicContract<VisualizeEmbedda
|
|||
export type VisualizeEmbeddableContract = PublicContract<VisualizeEmbeddable>;
|
||||
export { VisualizeInput } from './embeddable';
|
||||
export type ExprVis = ExprVisClass;
|
||||
export { SchemaConfig } from './legacy/build_pipeline';
|
||||
export { SchemaConfig, BuildPipelineParams } from './legacy/build_pipeline';
|
||||
// @ts-ignore
|
||||
export { updateOldState } from './legacy/vis_update_state';
|
||||
export { PersistedState } from './persisted_state';
|
||||
|
|
|
|||
|
|
@ -22,12 +22,6 @@ exports[`visualize loader pipeline helpers: build pipeline buildPipelineVisFunct
|
|||
|
||||
exports[`visualize loader pipeline helpers: build pipeline buildPipelineVisFunction handles table function without splits or buckets 1`] = `"kibana_table visConfig='{\\"foo\\":\\"bar\\",\\"dimensions\\":{\\"metrics\\":[{\\"accessor\\":0,\\"label\\":\\"\\",\\"format\\":{},\\"params\\":{},\\"aggType\\":\\"\\"},{\\"accessor\\":1,\\"label\\":\\"\\",\\"format\\":{},\\"params\\":{},\\"aggType\\":\\"\\"}],\\"buckets\\":[]}}' "`;
|
||||
|
||||
exports[`visualize loader pipeline helpers: build pipeline buildPipelineVisFunction handles tagcloud function with boolean param showLabel 1`] = `"tagcloud metric={visdimension 0} showLabel=false "`;
|
||||
|
||||
exports[`visualize loader pipeline helpers: build pipeline buildPipelineVisFunction handles tagcloud function with buckets 1`] = `"tagcloud metric={visdimension 0} bucket={visdimension 1 } "`;
|
||||
|
||||
exports[`visualize loader pipeline helpers: build pipeline buildPipelineVisFunction handles tagcloud function without buckets 1`] = `"tagcloud metric={visdimension 0} "`;
|
||||
|
||||
exports[`visualize loader pipeline helpers: build pipeline buildPipelineVisFunction handles tile_map function 1`] = `"tilemap visConfig='{\\"metric\\":{},\\"dimensions\\":{\\"metric\\":{\\"accessor\\":0,\\"label\\":\\"\\",\\"format\\":{},\\"params\\":{},\\"aggType\\":\\"\\"},\\"geohash\\":1,\\"geocentroid\\":3}}' "`;
|
||||
|
||||
exports[`visualize loader pipeline helpers: build pipeline buildPipelineVisFunction handles timelion function 1`] = `"timelion_vis expression='foo' interval='bar' "`;
|
||||
|
|
|
|||
|
|
@ -201,28 +201,6 @@ describe('visualize loader pipeline helpers: build pipeline', () => {
|
|||
});
|
||||
});
|
||||
|
||||
describe('handles tagcloud function', () => {
|
||||
it('without buckets', () => {
|
||||
const actual = buildPipelineVisFunction.tagcloud({}, schemasDef, uiState);
|
||||
expect(actual).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('with buckets', () => {
|
||||
const schemas = {
|
||||
...schemasDef,
|
||||
segment: [{ accessor: 1 }],
|
||||
};
|
||||
const actual = buildPipelineVisFunction.tagcloud({}, schemas, uiState);
|
||||
expect(actual).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('with boolean param showLabel', () => {
|
||||
const params = { showLabel: false };
|
||||
const actual = buildPipelineVisFunction.tagcloud(params, schemasDef, uiState);
|
||||
expect(actual).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
||||
describe('handles region_map function', () => {
|
||||
it('without buckets', () => {
|
||||
const params = { metric: {} };
|
||||
|
|
|
|||
|
|
@ -70,6 +70,12 @@ interface BuildVisConfigFunction {
|
|||
[key: string]: buildVisConfigFunction;
|
||||
}
|
||||
|
||||
export interface BuildPipelineParams {
|
||||
timefilter: TimefilterContract;
|
||||
timeRange?: any;
|
||||
abortSignal?: AbortSignal;
|
||||
}
|
||||
|
||||
const vislibCharts: string[] = [
|
||||
'area',
|
||||
'gauge',
|
||||
|
|
@ -80,14 +86,7 @@ const vislibCharts: string[] = [
|
|||
'line',
|
||||
];
|
||||
|
||||
export const getSchemas = (
|
||||
vis: Vis,
|
||||
opts: {
|
||||
timeRange?: any;
|
||||
timefilter: TimefilterContract;
|
||||
}
|
||||
): Schemas => {
|
||||
const { timeRange, timefilter } = opts;
|
||||
export const getSchemas = (vis: Vis, { timeRange, timefilter }: BuildPipelineParams): Schemas => {
|
||||
const createSchemaConfig = (accessor: number, agg: IAggConfig): SchemaConfig => {
|
||||
if (isDateHistogramBucketAggConfig(agg)) {
|
||||
agg.params.timeRange = timeRange;
|
||||
|
|
@ -276,19 +275,6 @@ export const buildPipelineVisFunction: BuildPipelineVisFunction = {
|
|||
};
|
||||
return `kibana_table ${prepareJson('visConfig', visConfig)}`;
|
||||
},
|
||||
tagcloud: (params, schemas) => {
|
||||
const { scale, orientation, minFontSize, maxFontSize, showLabel } = params;
|
||||
const { metric, bucket } = buildVisConfig.tagcloud(schemas);
|
||||
let expr = `tagcloud metric={visdimension ${metric.accessor}} `;
|
||||
expr += prepareValue('scale', scale);
|
||||
expr += prepareValue('orientation', orientation);
|
||||
expr += prepareValue('minFontSize', minFontSize);
|
||||
expr += prepareValue('maxFontSize', maxFontSize);
|
||||
expr += prepareValue('showLabel', showLabel);
|
||||
expr += prepareDimension('bucket', bucket);
|
||||
|
||||
return expr;
|
||||
},
|
||||
region_map: (params, schemas) => {
|
||||
const visConfig = {
|
||||
...params,
|
||||
|
|
@ -333,14 +319,6 @@ const buildVisConfig: BuildVisConfigFunction = {
|
|||
}
|
||||
return visConfig;
|
||||
},
|
||||
tagcloud: (schemas) => {
|
||||
const visConfig = {} as any;
|
||||
visConfig.metric = schemas.metric[0];
|
||||
if (schemas.segment) {
|
||||
visConfig.bucket = schemas.segment[0];
|
||||
}
|
||||
return visConfig;
|
||||
},
|
||||
region_map: (schemas) => {
|
||||
const visConfig = {} as any;
|
||||
visConfig.metric = schemas.metric[0];
|
||||
|
|
@ -370,14 +348,7 @@ const buildVisConfig: BuildVisConfigFunction = {
|
|||
},
|
||||
};
|
||||
|
||||
export const buildVislibDimensions = async (
|
||||
vis: any,
|
||||
params: {
|
||||
timefilter: TimefilterContract;
|
||||
timeRange?: any;
|
||||
abortSignal?: AbortSignal;
|
||||
}
|
||||
) => {
|
||||
export const buildVislibDimensions = async (vis: any, params: BuildPipelineParams) => {
|
||||
const schemas = getSchemas(vis, {
|
||||
timeRange: params.timeRange,
|
||||
timefilter: params.timefilter,
|
||||
|
|
@ -416,14 +387,7 @@ export const buildVislibDimensions = async (
|
|||
return dimensions;
|
||||
};
|
||||
|
||||
export const buildPipeline = async (
|
||||
vis: Vis,
|
||||
params: {
|
||||
timefilter: TimefilterContract;
|
||||
timeRange?: any;
|
||||
abortSignal?: AbortSignal;
|
||||
}
|
||||
) => {
|
||||
export const buildPipeline = async (vis: Vis, params: BuildPipelineParams) => {
|
||||
const { indexPattern, searchSource } = vis.data;
|
||||
const query = searchSource!.getField('query');
|
||||
const filters = searchSource!.getField('filter');
|
||||
|
|
@ -455,10 +419,8 @@ export const buildPipeline = async (
|
|||
${prepareJson('aggConfigs', vis.data.aggs!.aggs)} | `;
|
||||
}
|
||||
|
||||
const schemas = getSchemas(vis, {
|
||||
timeRange: params.timeRange,
|
||||
timefilter: params.timefilter,
|
||||
});
|
||||
const schemas = getSchemas(vis, params);
|
||||
|
||||
if (buildPipelineVisFunction[vis.type.name]) {
|
||||
pipeline += buildPipelineVisFunction[vis.type.name](
|
||||
{ title, ...vis.params },
|
||||
|
|
|
|||
|
|
@ -83,12 +83,12 @@ const getSearchSource = async (inputSearchSource: ISearchSource, savedSearchId?:
|
|||
|
||||
type PartialVisState = Assign<SerializedVis, { data: Partial<SerializedVisData> }>;
|
||||
|
||||
export class Vis {
|
||||
export class Vis<TVisParams = VisParams> {
|
||||
public readonly type: VisType;
|
||||
public readonly id?: string;
|
||||
public title: string = '';
|
||||
public description: string = '';
|
||||
public params: VisParams = {};
|
||||
public params: TVisParams;
|
||||
// Session state is for storing information that is transitory, and will not be saved with the visualization.
|
||||
// For instance, map bounds, which depends on the view port, browser window size, etc.
|
||||
public sessionState: Record<string, any> = {};
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
{"as":"visualization","type":"render","value":{"params":{"listenOnChange":true},"visConfig":{"bucket":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":1,"format":{"id":"number","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visType":"tagcloud"}}
|
||||
{"as":"tagloud_vis","type":"render","value":{"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visParams":{"bucket":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":1,"format":{"id":"number","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visType":"tagcloud"}}
|
||||
|
|
@ -1 +1 @@
|
|||
{"as":"visualization","type":"render","value":{"params":{"listenOnChange":true},"visConfig":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visType":"tagcloud"}}
|
||||
{"as":"tagloud_vis","type":"render","value":{"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visParams":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visType":"tagcloud"}}
|
||||
|
|
@ -1 +1 @@
|
|||
{"as":"visualization","type":"render","value":{"params":{"listenOnChange":true},"visConfig":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":40,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":20,"orientation":"single","scale":"linear","showLabel":true},"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visType":"tagcloud"}}
|
||||
{"as":"tagloud_vis","type":"render","value":{"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visParams":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":40,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":20,"orientation":"single","scale":"linear","showLabel":true},"visType":"tagcloud"}}
|
||||
|
|
@ -1 +1 @@
|
|||
{"as":"visualization","type":"render","value":{"params":{"listenOnChange":true},"visConfig":{"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visType":"tagcloud"}}
|
||||
{"as":"tagloud_vis","type":"render","value":{"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visParams":{"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visType":"tagcloud"}}
|
||||
|
|
@ -1 +1 @@
|
|||
{"as":"visualization","type":"render","value":{"params":{"listenOnChange":true},"visConfig":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"multiple","scale":"log","showLabel":true},"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visType":"tagcloud"}}
|
||||
{"as":"tagloud_vis","type":"render","value":{"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visParams":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"multiple","scale":"log","showLabel":true},"visType":"tagcloud"}}
|
||||
|
|
@ -1 +1 @@
|
|||
{"as":"visualization","type":"render","value":{"params":{"listenOnChange":true},"visConfig":{"bucket":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":1,"format":{"id":"number","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visType":"tagcloud"}}
|
||||
{"as":"tagloud_vis","type":"render","value":{"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visParams":{"bucket":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":1,"format":{"id":"number","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visType":"tagcloud"}}
|
||||
|
|
@ -1 +1 @@
|
|||
{"as":"visualization","type":"render","value":{"params":{"listenOnChange":true},"visConfig":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visType":"tagcloud"}}
|
||||
{"as":"tagloud_vis","type":"render","value":{"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visParams":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visType":"tagcloud"}}
|
||||
|
|
@ -1 +1 @@
|
|||
{"as":"visualization","type":"render","value":{"params":{"listenOnChange":true},"visConfig":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":40,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":20,"orientation":"single","scale":"linear","showLabel":true},"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visType":"tagcloud"}}
|
||||
{"as":"tagloud_vis","type":"render","value":{"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visParams":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":40,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":20,"orientation":"single","scale":"linear","showLabel":true},"visType":"tagcloud"}}
|
||||
|
|
@ -1 +1 @@
|
|||
{"as":"visualization","type":"render","value":{"params":{"listenOnChange":true},"visConfig":{"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visType":"tagcloud"}}
|
||||
{"as":"tagloud_vis","type":"render","value":{"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visParams":{"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"single","scale":"linear","showLabel":true},"visType":"tagcloud"}}
|
||||
|
|
@ -1 +1 @@
|
|||
{"as":"visualization","type":"render","value":{"params":{"listenOnChange":true},"visConfig":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"multiple","scale":"log","showLabel":true},"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visType":"tagcloud"}}
|
||||
{"as":"tagloud_vis","type":"render","value":{"visData":{"columns":[{"id":"col-0-2","meta":{"aggConfigParams":{"field":"response.raw","missingBucket":false,"missingBucketLabel":"Missing","order":"desc","orderBy":"1","otherBucket":false,"otherBucketLabel":"Other","size":4},"indexPatternId":"logstash-*","type":"terms"},"name":"response.raw: Descending"},{"id":"col-1-1","meta":{"aggConfigParams":{},"indexPatternId":"logstash-*","type":"count"},"name":"Count"}],"rows":[{"col-0-2":"200","col-1-1":12891},{"col-0-2":"404","col-1-1":696},{"col-0-2":"503","col-1-1":417}],"type":"kibana_datatable"},"visParams":{"bucket":{"accessor":1,"format":{"id":"string","params":{}},"type":"vis_dimension"},"maxFontSize":72,"metric":{"accessor":0,"format":{"id":"string","params":{}},"type":"vis_dimension"},"minFontSize":18,"orientation":"multiple","scale":"log","showLabel":true},"visType":"tagcloud"}}
|
||||
Loading…
Add table
Add a link
Reference in a new issue