From 4ce57103617534b7440207367409316c5fabbfda Mon Sep 17 00:00:00 2001 From: ruchika-narang Date: Wed, 17 Aug 2022 18:10:30 +0530 Subject: [PATCH 1/5] Fix for app crash and dimension disaapearing Signed-off-by: ruchika-narang --- .../event_analytics/explorer/explorer.tsx | 13 +++ .../config_panel/config_panel.tsx | 2 +- .../data_config_panel_item.tsx | 48 +---------- .../treemap_config_panel_item.tsx | 28 +------ .../charts/helpers/viz_types.ts | 84 ++++++++++++++++++- 5 files changed, 98 insertions(+), 77 deletions(-) diff --git a/dashboards-observability/public/components/event_analytics/explorer/explorer.tsx b/dashboards-observability/public/components/event_analytics/explorer/explorer.tsx index cbf03e884..b1fd98273 100644 --- a/dashboards-observability/public/components/event_analytics/explorer/explorer.tsx +++ b/dashboards-observability/public/components/event_analytics/explorer/explorer.tsx @@ -354,8 +354,21 @@ export const Explorer = ({ // search if (finalQuery.match(PPL_STATS_REGEX)) { + const cusVisIds = userVizConfigs ? Object.keys(userVizConfigs) : []; getVisualizations(); getAvailableFields(`search source=${curIndex}`); + for (const visId of cusVisIds) { + dispatch( + changeVisualizationConfig({ + tabId, + vizId: visId, + data: { + ...userVizConfigs[visId], + dataConfig: {}, + }, + }) + ); + } } else { findAutoInterval(startTime, endTime); if (isLiveTailOnRef.current) { diff --git a/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panel.tsx b/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panel.tsx index bf8698d4c..eb3142cdf 100644 --- a/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panel.tsx +++ b/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panel.tsx @@ -121,7 +121,7 @@ export const ConfigPanel = ({ valueOptions?.valueField?.length !== 0, gauge: true, heatmap: Boolean( - curVisId === HeatMap && valueOptions?.zaxis && valueOptions.zaxis?.length !== 0 + curVisId === HeatMap && valueOptions?.metrics && valueOptions.metrics?.length !== 0 ), bar: isValidValueOptionsXYAxes, line: isValidValueOptionsXYAxes, diff --git a/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panes/config_controls/data_config_panel_item.tsx b/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panes/config_controls/data_config_panel_item.tsx index 986d023e9..cc14f87bd 100644 --- a/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panes/config_controls/data_config_panel_item.tsx +++ b/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panes/config_controls/data_config_panel_item.tsx @@ -47,59 +47,13 @@ export const DataConfigPanelItem = ({ fieldOptionList, visualizations }: any) => const [configList, setConfigList] = useState({}); - useEffect(() => { - if (configList.dimensions && configList.metrics && !userConfigs.dataConfig) { - dispatch( - changeVisualizationConfig({ - tabId, - vizId: curVisId, - data: { - ...userConfigs, - dataConfig: { - ...userConfigs.dataConfig, - valueOptions: { - dimensions: configList.dimensions, - metrics: configList.metrics, - }, - }, - }, - }) - ); - } - }, [configList]); - useEffect(() => { if (userConfigs && userConfigs.dataConfig && userConfigs.dataConfig.valueOptions) { setConfigList({ ...userConfigs.dataConfig.valueOptions, }); - } else if ( - visualizations.vis.name !== visChartTypes.HeatMap && - visualizations.vis.name !== visChartTypes.Histogram && - (data.defaultAxes.xaxis || data.defaultAxes.yaxis) - ) { - const { xaxis, yaxis } = data.defaultAxes; - setConfigList({ - dimensions: [...(xaxis && xaxis)], - metrics: [ - ...(yaxis && yaxis.map((item, i) => ({ ...item, side: i === 0 ? 'left' : 'right' }))), - ], - }); - } else if (visualizations.vis.name === visChartTypes.HeatMap) { - setConfigList({ - dimensions: [initialConfigEntry, initialConfigEntry], - metrics: [initialConfigEntry], - }); - } else if (visualizations.vis.name === visChartTypes.Histogram) { - setConfigList({ - dimensions: [{ bucketSize: '', bucketOffset: '' }], - }); } - }, [ - data.defaultAxes, - data.rawVizData?.[visualizations.vis.name]?.dataConfig, - visualizations.vis.name, - ]); + }, [userConfigs?.dataConfig?.valueOptions, visualizations.vis.name]); const updateList = (value: string, index: number, name: string, field: string) => { let list = { ...configList }; diff --git a/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panes/config_controls/treemap_config_panel_item.tsx b/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panes/config_controls/treemap_config_panel_item.tsx index 03e8a89be..06cb1e8f5 100644 --- a/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panes/config_controls/treemap_config_panel_item.tsx +++ b/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panes/config_controls/treemap_config_panel_item.tsx @@ -38,34 +38,8 @@ export const TreemapConfigPanelItem = ({ fieldOptionList, visualizations, tabID setConfigList({ ...userConfigs.dataConfig.valueOptions, }); - } else if (data.defaultAxes.xaxis || data.defaultAxes.yaxis) { - const { xaxis, yaxis } = data.defaultAxes; - setConfigList({ - dimensions: [{ childField: { ...xaxis[0] }, parentFields: [] }], - metrics: [{ valueField: { ...yaxis[0] } }], - }); - dispatch( - changeVisualizationConfig({ - tabId, - vizId: curVisId, - data: { - ...userConfigs, - dataConfig: { - ...userConfigs.dataConfig, - valueOptions: { - dimensions: [{ childField: { ...xaxis[0] }, parentFields: [] }], - metrics: [{ valueField: { ...yaxis[0] } }], - }, - }, - }, - }) - ); } - }, [ - data.defaultAxes, - data.rawVizData?.[visualizations.vis.name]?.dataConfig, - visualizations.vis.name, - ]); + }, [userConfigs?.dataConfig?.valueOptions, visualizations.vis.name]); const updateList = (configName: string, fieldName: string, value: string | any[]) => { let list = { ...configList }; diff --git a/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts b/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts index 541fb84fa..fad7bce4a 100644 --- a/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts +++ b/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts @@ -27,6 +27,17 @@ interface IVizContainerProps { explorer?: ExplorerData; } +const initialConfigEntry = { + label: '', + aggregation: '', + custom_label: '', + name: '', + side: 'right', + type: '', +}; + +const initialEntryTreemap = { label: '', name: '' }; + const getDefaultXYAxisLabels = (vizFields: IField[], visName: string) => { if (isEmpty(vizFields)) return {}; const vizFieldsWithLabel: { [key: string]: string }[] = vizFields.map((vizField) => ({ @@ -36,7 +47,9 @@ const getDefaultXYAxisLabels = (vizFields: IField[], visName: string) => { const mapXaxis = (): { [key: string]: string }[] => visName === visChartTypes.Line - ? vizFieldsWithLabel.filter((field) => field.type === 'timestamp') + ? vizFieldsWithLabel.filter((field) => field.type === 'timestamp').length === 0 + ? [initialConfigEntry] + : vizFieldsWithLabel.filter((field) => field.type === 'timestamp') : [vizFieldsWithLabel[vizFieldsWithLabel.length - 1]]; const mapYaxis = (): { [key: string]: string }[] => @@ -50,6 +63,71 @@ const getDefaultXYAxisLabels = (vizFields: IField[], visName: string) => { return { xaxis: mapXaxis(), yaxis: mapYaxis() }; }; +const getUserConfigs = (userSelectedConfigs: any, vizFields: IField[], visName: string) => { + let configOfUser = userSelectedConfigs; + const axesData = getDefaultXYAxisLabels(vizFields, visName); + if (!userSelectedConfigs.dataConfig?.valueOptions) { + switch (visName) { + case visChartTypes.HeatMap: + configOfUser = { + ...userSelectedConfigs, + dataConfig: { + ...userSelectedConfigs?.dataConfig, + valueOptions: { + dimensions: [initialConfigEntry, initialConfigEntry], + metrics: [initialConfigEntry], + }, + }, + }; + break; + case visChartTypes.TreeMap: + configOfUser = { + ...userSelectedConfigs, + dataConfig: { + ...userSelectedConfigs?.dataConfig, + valueOptions: { + dimensions: [ + { + childField: { ...(axesData.xaxis ? axesData.xaxis[0] : initialEntryTreemap) }, + parentFields: [], + }, + ], + metrics: [ + { valueField: { ...(axesData.yaxis ? axesData.yaxis[0] : initialEntryTreemap) } }, + ], + }, + }, + }; + break; + case visChartTypes.Histogram: + configOfUser = { + ...userSelectedConfigs, + dataConfig: { + ...userSelectedConfigs?.dataConfig, + valueOptions: { + dimensions: [{ bucketSize: '', bucketOffset: '' }], + metrics: [], + }, + }, + }; + break; + default: + configOfUser = { + ...userSelectedConfigs, + dataConfig: { + ...userSelectedConfigs?.dataConfig, + valueOptions: { + metrics: axesData.yaxis ?? [], + dimensions: axesData.xaxis ?? [], + }, + }, + }; + break; + } + } + return isEmpty(configOfUser) ? userSelectedConfigs : configOfUser; +}; + export const getVizContainerProps = ({ vizId, rawVizData = {}, @@ -70,7 +148,9 @@ export const getVizContainerProps = ({ rawVizData: { ...rawVizData }, query: { ...query }, indexFields: { ...indexFields }, - userConfigs: { ...userConfigs }, + userConfigs: { + ...getUserConfigs(userConfigs, rawVizData?.metadata?.fields, getVisTypeData().name), + }, defaultAxes: { ...getDefaultXYAxisLabels(rawVizData?.metadata?.fields, getVisTypeData().name), }, From 62a6f486273b24b88cf5208ef43558e5b02dfe8d Mon Sep 17 00:00:00 2001 From: Shankha Das Date: Wed, 17 Aug 2022 13:00:13 +0000 Subject: [PATCH 2/5] optimized the code and updated snapshots Signed-off-by: Shankha Das --- .../__snapshots__/utils.test.tsx.snap | 1008 +++++++++++++---- .../charts/helpers/viz_types.ts | 10 +- 2 files changed, 777 insertions(+), 241 deletions(-) diff --git a/dashboards-observability/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap b/dashboards-observability/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap index 0a003aefa..11507283d 100644 --- a/dashboards-observability/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap +++ b/dashboards-observability/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap @@ -123,7 +123,26 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` "size": 4, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "label": "Carrier", + "name": "Carrier", + "type": "keyword", + }, + ], + "metrics": Array [ + Object { + "label": "avg(FlightDelayMin)", + "name": "avg(FlightDelayMin)", + "type": "double", + }, + ], + }, + }, + }, }, "vis": Object { "barwidth": 0.97, @@ -520,7 +539,26 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` "size": 4, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "label": "Carrier", + "name": "Carrier", + "type": "keyword", + }, + ], + "metrics": Array [ + Object { + "label": "avg(FlightDelayMin)", + "name": "avg(FlightDelayMin)", + "type": "double", + }, + ], + }, + }, + }, }, "vis": Object { "barwidth": 0.97, @@ -940,7 +978,26 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` "size": 4, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "label": "Carrier", + "name": "Carrier", + "type": "keyword", + }, + ], + "metrics": Array [ + Object { + "label": "avg(FlightDelayMin)", + "name": "avg(FlightDelayMin)", + "type": "double", + }, + ], + }, + }, + }, }, "vis": Object { "barwidth": 0.97, @@ -1216,83 +1273,186 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` } } > - -
- -
- -
- - - - - - -
- -

- - - No results found - - -

-
- -
- -
- - + id="explorerPlotComponent" + style={ + Object { + "height": "100%", + "width": "100%", + } + } + /> + + @@ -1307,7 +1467,16 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` "data": Object { "appData": Object {}, "defaultAxes": Object { - "xaxis": Array [], + "xaxis": Array [ + Object { + "aggregation": "", + "custom_label": "", + "label": "", + "name": "", + "side": "right", + "type": "", + }, + ], "yaxis": Array [ Object { "label": "avg(FlightDelayMin)", @@ -1421,7 +1590,34 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` "size": 4, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "aggregation": "", + "custom_label": "", + "label": "", + "name": "", + "side": "right", + "type": "", + }, + ], + "metrics": Array [ + Object { + "label": "avg(FlightDelayMin)", + "name": "avg(FlightDelayMin)", + "type": "double", + }, + Object { + "label": "Carrier", + "name": "Carrier", + "type": "keyword", + }, + ], + }, + }, + }, }, "vis": Object { "category": "Visualizations", @@ -1740,7 +1936,16 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` "data": Object { "appData": Object {}, "defaultAxes": Object { - "xaxis": Array [], + "xaxis": Array [ + Object { + "aggregation": "", + "custom_label": "", + "label": "", + "name": "", + "side": "right", + "type": "", + }, + ], "yaxis": Array [ Object { "label": "avg(FlightDelayMin)", @@ -1854,7 +2059,34 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` "size": 4, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "aggregation": "", + "custom_label": "", + "label": "", + "name": "", + "side": "right", + "type": "", + }, + ], + "metrics": Array [ + Object { + "label": "avg(FlightDelayMin)", + "name": "avg(FlightDelayMin)", + "type": "double", + }, + Object { + "label": "Carrier", + "name": "Carrier", + "type": "keyword", + }, + ], + }, + }, + }, }, "vis": Object { "category": "Visualizations", @@ -2227,7 +2459,16 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` "data": Object { "appData": Object {}, "defaultAxes": Object { - "xaxis": Array [], + "xaxis": Array [ + Object { + "aggregation": "", + "custom_label": "", + "label": "", + "name": "", + "side": "right", + "type": "", + }, + ], "yaxis": Array [ Object { "label": "avg(FlightDelayMin)", @@ -2341,7 +2582,34 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` "size": 4, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "aggregation": "", + "custom_label": "", + "label": "", + "name": "", + "side": "right", + "type": "", + }, + ], + "metrics": Array [ + Object { + "label": "avg(FlightDelayMin)", + "name": "avg(FlightDelayMin)", + "type": "double", + }, + Object { + "label": "Carrier", + "name": "Carrier", + "type": "keyword", + }, + ], + }, + }, + }, }, "vis": Object { "category": "Visualizations", @@ -2860,7 +3128,26 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` "size": 4, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "label": "Carrier", + "name": "Carrier", + "type": "keyword", + }, + ], + "metrics": Array [ + Object { + "label": "avg(FlightDelayMin)", + "name": "avg(FlightDelayMin)", + "type": "double", + }, + ], + }, + }, + }, }, "vis": Object { "category": "Visualizations", @@ -3120,7 +3407,26 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` "size": 4, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "label": "Carrier", + "name": "Carrier", + "type": "keyword", + }, + ], + "metrics": Array [ + Object { + "label": "avg(FlightDelayMin)", + "name": "avg(FlightDelayMin)", + "type": "double", + }, + ], + }, + }, + }, }, "vis": Object { "category": "Visualizations", @@ -3403,7 +3709,26 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` "size": 4, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "label": "Carrier", + "name": "Carrier", + "type": "keyword", + }, + ], + "metrics": Array [ + Object { + "label": "avg(FlightDelayMin)", + "name": "avg(FlightDelayMin)", + "type": "double", + }, + ], + }, + }, + }, }, "vis": Object { "category": "Visualizations", @@ -3542,83 +3867,186 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` } } > - -
- -
- -
- - - - - - -
- -

- - - No results found - - -

-
- -
- -
- - + id="explorerPlotComponent" + style={ + Object { + "height": "100%", + "width": "100%", + } + } + /> + + @@ -3694,7 +4122,26 @@ exports[`Utils helper functions renders displayVisualization function 4`] = ` "size": 0, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "label": "span(timestamp,1h)", + "name": "span(timestamp,1h)", + "type": "timestamp", + }, + ], + "metrics": Array [ + Object { + "label": "count('ip')", + "name": "count('ip')", + "type": "integer", + }, + ], + }, + }, + }, }, "vis": Object { "category": "Visualizations", @@ -3900,7 +4347,26 @@ exports[`Utils helper functions renders displayVisualization function 4`] = ` "size": 0, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "label": "span(timestamp,1h)", + "name": "span(timestamp,1h)", + "type": "timestamp", + }, + ], + "metrics": Array [ + Object { + "label": "count('ip')", + "name": "count('ip')", + "type": "integer", + }, + ], + }, + }, + }, }, "vis": Object { "category": "Visualizations", @@ -4129,7 +4595,26 @@ exports[`Utils helper functions renders displayVisualization function 4`] = ` "size": 0, "status": 200, }, - "userConfigs": Object {}, + "userConfigs": Object { + "dataConfig": Object { + "valueOptions": Object { + "dimensions": Array [ + Object { + "label": "span(timestamp,1h)", + "name": "span(timestamp,1h)", + "type": "timestamp", + }, + ], + "metrics": Array [ + Object { + "label": "count('ip')", + "name": "count('ip')", + "type": "integer", + }, + ], + }, + }, + }, }, "vis": Object { "category": "Visualizations", @@ -4268,83 +4753,132 @@ exports[`Utils helper functions renders displayVisualization function 4`] = ` } } > - -
- -
- -
- - - - - - -
- -

- - - No results found - - -

-
- -
- -
- - + id="explorerPlotComponent" + style={ + Object { + "height": "100%", + "width": "100%", + } + } + /> + + diff --git a/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts b/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts index fad7bce4a..ce6851fcd 100644 --- a/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts +++ b/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts @@ -45,12 +45,14 @@ const getDefaultXYAxisLabels = (vizFields: IField[], visName: string) => { label: vizField.name, })); - const mapXaxis = (): { [key: string]: string }[] => - visName === visChartTypes.Line - ? vizFieldsWithLabel.filter((field) => field.type === 'timestamp').length === 0 + const mapXaxis = (): { [key: string]: string }[] => { + const xaxis = vizFieldsWithLabel.filter((field) => field.type === 'timestamp'); + return visName === visChartTypes.Line + ? xaxis.length === 0 ? [initialConfigEntry] - : vizFieldsWithLabel.filter((field) => field.type === 'timestamp') + : xaxis : [vizFieldsWithLabel[vizFieldsWithLabel.length - 1]]; + }; const mapYaxis = (): { [key: string]: string }[] => visName === visChartTypes.Line From bec6990ceb412e09b60d2faf67734703ab90bf7a Mon Sep 17 00:00:00 2001 From: Shankha Das Date: Wed, 17 Aug 2022 14:09:38 +0000 Subject: [PATCH 3/5] resolved PR comments Signed-off-by: Shankha Das --- .../components/visualizations/charts/helpers/viz_types.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts b/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts index ce6851fcd..77e6cf055 100644 --- a/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts +++ b/dashboards-observability/public/components/visualizations/charts/helpers/viz_types.ts @@ -65,7 +65,7 @@ const getDefaultXYAxisLabels = (vizFields: IField[], visName: string) => { return { xaxis: mapXaxis(), yaxis: mapYaxis() }; }; -const getUserConfigs = (userSelectedConfigs: any, vizFields: IField[], visName: string) => { +const getUserConfigs = (userSelectedConfigs: object, vizFields: IField[], visName: string) => { let configOfUser = userSelectedConfigs; const axesData = getDefaultXYAxisLabels(vizFields, visName); if (!userSelectedConfigs.dataConfig?.valueOptions) { From 9f5446681a9949e43438a193404d366be1c33e3b Mon Sep 17 00:00:00 2001 From: Shankha Das Date: Fri, 19 Aug 2022 08:54:57 +0000 Subject: [PATCH 4/5] added tooltip options Signed-off-by: Shankha Das --- .../__snapshots__/utils.test.tsx.snap | 352 ++ .../__snapshots__/config_panel.test.tsx.snap | 3011 ++++++++++++++++- .../config_controls/config_tooltip.tsx | 58 + .../config_panes/config_controls/index.ts | 1 + .../event_analytics/utils/utils.tsx | 36 + .../__tests__/__snapshots__/bar.test.tsx.snap | 58 + .../__snapshots__/heatmap.test.tsx.snap | 58 + .../__snapshots__/histogram.test.tsx.snap | 60 + .../__snapshots__/line.test.tsx.snap | 58 + .../__tests__/__snapshots__/pie.test.tsx.snap | 58 + .../__snapshots__/text.test.tsx.snap | 58 + .../__snapshots__/treemap.test.tsx.snap | 60 + .../visualizations/charts/bar/bar.tsx | 26 +- .../visualizations/charts/bar/bar_type.ts | 10 +- .../charts/histogram/histogram.tsx | 52 +- .../charts/histogram/histogram_type.ts | 9 + .../visualizations/charts/lines/line.tsx | 9 + .../visualizations/charts/lines/line_type.ts | 9 + .../visualizations/charts/maps/heatmap.tsx | 9 + .../charts/maps/heatmap_type.ts | 10 + .../charts/maps/treemap_type.ts | 9 + .../visualizations/charts/maps/treemaps.tsx | 9 + .../visualizations/charts/pie/pie.tsx | 9 + .../visualizations/charts/pie/pie_type.ts | 11 +- 24 files changed, 3900 insertions(+), 140 deletions(-) create mode 100644 dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/config_panes/config_controls/config_tooltip.tsx diff --git a/dashboards-observability/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap b/dashboards-observability/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap index 11507283d..7f0e75395 100644 --- a/dashboards-observability/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap +++ b/dashboards-observability/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap @@ -157,6 +157,64 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -573,6 +631,64 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -1012,6 +1128,64 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -1283,6 +1457,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` data={ Array [ Object { + "hoverinfo": "all", "marker": Object { "color": "rgba(60,161,199,0.4)", "line": Object { @@ -1360,6 +1535,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = ` data={ Array [ Object { + "hoverinfo": "all", "marker": Object { "color": "rgba(60,161,199,0.4)", "line": Object { @@ -1692,6 +1868,64 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` }, ], }, + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "chart_styles", @@ -2161,6 +2395,64 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` }, ], }, + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "chart_styles", @@ -2684,6 +2976,64 @@ exports[`Utils helper functions renders displayVisualization function 2`] = ` }, ], }, + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "chart_styles", @@ -3877,6 +4227,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` data={ Array [ Object { + "hoverinfo": "all", "marker": Object { "color": "rgba(60,161,199,NaN)", "line": Object { @@ -3954,6 +4305,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = ` data={ Array [ Object { + "hoverinfo": "all", "marker": Object { "color": "rgba(60,161,199,NaN)", "line": Object { diff --git a/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap b/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap index f56e711c7..c72fb1478 100644 --- a/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap +++ b/dashboards-observability/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap @@ -213,6 +213,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -520,6 +578,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -852,6 +968,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, ], }, + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "chart_styles", @@ -1159,6 +1333,68 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, ], }, + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "label", + "name": "Label", + }, + Object { + "id": "value", + "name": "Value", + }, + Object { + "id": "percent", + "name": "Percent", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "chart_styles", @@ -1301,6 +1537,68 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dim 1", + }, + Object { + "id": "y", + "name": "Dim 2", + }, + Object { + "id": "z", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -1749,14 +2047,14 @@ exports[`Config panel component Renders config panel with visualization data 1`] "sections": Array [ Object { "editor": [Function], - "id": "legend", - "mapTo": "legend", - "name": "Legend", + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", "schemas": Array [ Object { "component": null, - "mapTo": "showLegend", - "name": "Show colorscale", + "mapTo": "tooltipMode", + "name": "Tooltip mode", "props": Object { "defaultSelections": Array [ Object { @@ -1776,25 +2074,83 @@ exports[`Config panel component Renders config panel with visualization data 1`] ], }, }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "label", + "name": "Label", + }, + Object { + "id": "value", + "name": "Value", + }, + ], + }, + }, ], }, Object { "editor": [Function], - "id": "treemap_options", - "mapTo": "treemapOptions", - "name": "Treemap", + "id": "legend", + "mapTo": "legend", + "name": "Legend", "schemas": Array [ Object { "component": null, - "defaultState": Array [ - Object { - "label": "Squarify", - "name": "Squarify", - "value": "squarify", - }, - ], - "isSingleSelection": true, - "mapTo": "tilingAlgorithm", + "mapTo": "showLegend", + "name": "Show colorscale", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + ], + }, + Object { + "editor": [Function], + "id": "treemap_options", + "mapTo": "treemapOptions", + "name": "Treemap", + "schemas": Array [ + Object { + "component": null, + "defaultState": Array [ + Object { + "label": "Squarify", + "name": "Squarify", + "value": "squarify", + }, + ], + "isSingleSelection": true, + "mapTo": "tilingAlgorithm", "name": "Tiling algorithm", "options": Array [ Object { @@ -2355,6 +2711,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "name": "Color theme", "schemas": Array [], }, + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -2525,6 +2939,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, ], }, + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "chart_styles", @@ -2858,6 +3330,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -3162,6 +3692,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -3471,6 +4059,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -3717,7 +4363,65 @@ exports[`Config panel component Renders config panel with visualization data 1`] "sections": Array [ Object { "editor": [Function], - "id": "legend", + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, + Object { + "editor": [Function], + "id": "legend", "mapTo": "legend", "name": "Legend", "schemas": Array [ @@ -4025,6 +4729,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -4305,6 +5067,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -4769,6 +5589,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -5166,6 +6044,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -5446,14 +6382,14 @@ exports[`Config panel component Renders config panel with visualization data 1`] "sections": Array [ Object { "editor": [Function], - "id": "legend", - "mapTo": "legend", - "name": "Legend", + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", "schemas": Array [ Object { "component": null, - "mapTo": "showLegend", - "name": "Show legend", + "mapTo": "tooltipMode", + "name": "Tooltip mode", "props": Object { "defaultSelections": Array [ Object { @@ -5475,23 +6411,27 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": null, - "mapTo": "position", - "name": "Position", + "mapTo": "tooltipText", + "name": "Tooltip text", "props": Object { "defaultSelections": Array [ Object { - "id": "v", - "name": "Right", + "id": "all", + "name": "All", }, ], "options": Array [ Object { - "id": "v", - "name": "Right", + "id": "all", + "name": "All", }, Object { - "id": "h", - "name": "Bottom", + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", }, ], }, @@ -5500,30 +6440,84 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "editor": [Function], - "id": "chart_styles", - "mapTo": "chartStyles", - "name": "Chart styles", + "id": "legend", + "mapTo": "legend", + "name": "Legend", "schemas": Array [ Object { - "component": [Function], - "eleType": "buttons", - "mapTo": "orientation", - "name": "Orientation", + "component": null, + "mapTo": "showLegend", + "name": "Show legend", "props": Object { "defaultSelections": Array [ Object { - "id": "v", - "name": "Vertical", + "id": "show", + "name": "Show", }, ], "options": Array [ Object { - "id": "v", - "name": "Vertical", + "id": "show", + "name": "Show", }, Object { - "id": "h", - "name": "Horizontal", + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "position", + "name": "Position", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "v", + "name": "Right", + }, + ], + "options": Array [ + Object { + "id": "v", + "name": "Right", + }, + Object { + "id": "h", + "name": "Bottom", + }, + ], + }, + }, + ], + }, + Object { + "editor": [Function], + "id": "chart_styles", + "mapTo": "chartStyles", + "name": "Chart styles", + "schemas": Array [ + Object { + "component": [Function], + "eleType": "buttons", + "mapTo": "orientation", + "name": "Orientation", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "v", + "name": "Vertical", + }, + ], + "options": Array [ + Object { + "id": "v", + "name": "Vertical", + }, + Object { + "id": "h", + "name": "Horizontal", }, ], }, @@ -5841,6 +6835,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -6330,6 +7382,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -6697,6 +7807,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -7094,6 +8262,64 @@ exports[`Config panel component Renders config panel with visualization data 1`] "mapTo": "dataConfig", "name": "Data", "sections": Array [ + Object { + "editor": [Function], + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", + "schemas": Array [ + Object { + "component": null, + "mapTo": "tooltipMode", + "name": "Tooltip mode", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "tooltipText", + "name": "Tooltip text", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "all", + "name": "All", + }, + ], + "options": Array [ + Object { + "id": "all", + "name": "All", + }, + Object { + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", + }, + ], + }, + }, + ], + }, Object { "editor": [Function], "id": "legend", @@ -7581,14 +8807,14 @@ exports[`Config panel component Renders config panel with visualization data 1`] "sections": Array [ Object { "editor": [Function], - "id": "legend", - "mapTo": "legend", - "name": "Legend", + "id": "tooltip_options", + "mapTo": "tooltipOptions", + "name": "Tooltip options", "schemas": Array [ Object { "component": null, - "mapTo": "showLegend", - "name": "Show legend", + "mapTo": "tooltipMode", + "name": "Tooltip mode", "props": Object { "defaultSelections": Array [ Object { @@ -7610,23 +8836,27 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "component": null, - "mapTo": "position", - "name": "Position", + "mapTo": "tooltipText", + "name": "Tooltip text", "props": Object { "defaultSelections": Array [ Object { - "id": "v", - "name": "Right", + "id": "all", + "name": "All", }, ], "options": Array [ Object { - "id": "v", - "name": "Right", + "id": "all", + "name": "All", }, Object { - "id": "h", - "name": "Bottom", + "id": "x", + "name": "Dimension", + }, + Object { + "id": "y", + "name": "Metrics", }, ], }, @@ -7635,19 +8865,73 @@ exports[`Config panel component Renders config panel with visualization data 1`] }, Object { "editor": [Function], - "id": "chart_styles", - "mapTo": "chartStyles", - "name": "Chart styles", + "id": "legend", + "mapTo": "legend", + "name": "Legend", "schemas": Array [ Object { - "component": [Function], - "eleType": "buttons", - "mapTo": "orientation", - "name": "Orientation", + "component": null, + "mapTo": "showLegend", + "name": "Show legend", "props": Object { "defaultSelections": Array [ Object { - "id": "v", + "id": "show", + "name": "Show", + }, + ], + "options": Array [ + Object { + "id": "show", + "name": "Show", + }, + Object { + "id": "hidden", + "name": "Hidden", + }, + ], + }, + }, + Object { + "component": null, + "mapTo": "position", + "name": "Position", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "v", + "name": "Right", + }, + ], + "options": Array [ + Object { + "id": "v", + "name": "Right", + }, + Object { + "id": "h", + "name": "Bottom", + }, + ], + }, + }, + ], + }, + Object { + "editor": [Function], + "id": "chart_styles", + "mapTo": "chartStyles", + "name": "Chart styles", + "schemas": Array [ + Object { + "component": [Function], + "eleType": "buttons", + "mapTo": "orientation", + "name": "Orientation", + "props": Object { + "defaultSelections": Array [ + Object { + "id": "v", "name": "Vertical", }, ], @@ -8020,63 +9304,1390 @@ exports[`Config panel component Renders config panel with visualization data 1`] className="euiFormRow" id="random_html_id-row" > -
+ + + +
+
+ + +