diff --git a/common/constants/shared.ts b/common/constants/shared.ts
index 2d10c08e2..6922a12ed 100644
--- a/common/constants/shared.ts
+++ b/common/constants/shared.ts
@@ -85,7 +85,7 @@ export const SAVED_OBJECT = '/object';
// Color Constants
export const PLOTLY_COLOR = [
'#3CA1C7',
- '#8C55A3',
+ '#54B399',
'#DB748A',
'#F2BE4B',
'#68CCC2',
diff --git a/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap b/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap
index 6a9095181..adf75a180 100644
--- a/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap
+++ b/public/components/custom_panels/helpers/__tests__/__snapshots__/utils.test.tsx.snap
@@ -1423,7 +1423,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = `
"barmode": "group",
"colorway": Array [
"#3CA1C7",
- "#8C55A3",
+ "#54B399",
"#DB748A",
"#F2BE4B",
"#68CCC2",
@@ -1516,7 +1516,7 @@ exports[`Utils helper functions renders displayVisualization function 1`] = `
"barmode": "group",
"colorway": Array [
"#3CA1C7",
- "#8C55A3",
+ "#54B399",
"#DB748A",
"#F2BE4B",
"#68CCC2",
@@ -2057,7 +2057,7 @@ exports[`Utils helper functions renders displayVisualization function 2`] = `
"layout": Object {
"colorway": Array [
"#3CA1C7",
- "#8C55A3",
+ "#54B399",
"#DB748A",
"#F2BE4B",
"#68CCC2",
@@ -2573,7 +2573,7 @@ exports[`Utils helper functions renders displayVisualization function 2`] = `
"layout": Object {
"colorway": Array [
"#3CA1C7",
- "#8C55A3",
+ "#54B399",
"#DB748A",
"#F2BE4B",
"#68CCC2",
@@ -3103,7 +3103,7 @@ exports[`Utils helper functions renders displayVisualization function 2`] = `
"layout": Object {
"colorway": Array [
"#3CA1C7",
- "#8C55A3",
+ "#54B399",
"#DB748A",
"#F2BE4B",
"#68CCC2",
@@ -4768,7 +4768,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = `
"barmode": "group",
"colorway": Array [
"#3CA1C7",
- "#8C55A3",
+ "#54B399",
"#DB748A",
"#F2BE4B",
"#68CCC2",
@@ -4861,7 +4861,7 @@ exports[`Utils helper functions renders displayVisualization function 3`] = `
"barmode": "group",
"colorway": Array [
"#3CA1C7",
- "#8C55A3",
+ "#54B399",
"#DB748A",
"#F2BE4B",
"#68CCC2",
diff --git a/public/components/event_analytics/explorer/explorer.tsx b/public/components/event_analytics/explorer/explorer.tsx
index 52c9abaa9..35f7091db 100644
--- a/public/components/event_analytics/explorer/explorer.tsx
+++ b/public/components/event_analytics/explorer/explorer.tsx
@@ -12,6 +12,7 @@ import {
EuiHorizontalRule,
EuiLink,
EuiLoadingSpinner,
+ EuiPanel,
EuiSpacer,
EuiTabbedContent,
EuiTabbedContentTab,
@@ -506,108 +507,111 @@ export const Explorer = ({
{explorerData && !isEmpty(explorerData.jsonData) ? (
-
-
- {countDistribution?.data && !isLiveTailOnRef.current && (
- <>
-
{}}
- />
- {
- const intervalOptionsIndex = timeIntervalOptions.findIndex(
- (item) => item.value === selectedIntrv
- );
- const intrv = selectedIntrv.replace(/^auto_/, '');
- getCountVisualizations(intrv);
- selectedIntervalRef.current = timeIntervalOptions[intervalOptionsIndex];
- getPatterns(intrv, getErrorHandler('Error fetching patterns'));
- }}
- stateInterval={selectedIntervalRef.current?.value}
- startTime={appLogEvents ? startTime : dateRange[0]}
- endTime={appLogEvents ? endTime : dateRange[1]}
- />
-
-
-
- >
- )}
-
-
-
-
-
-
- {isLiveTailOnRef.current && (
+
+
+
+
+ {countDistribution?.data && !isLiveTailOnRef.current && (
<>
-
-
-
-
- Live streaming
-
-
- {}}
- />
-
- since {liveTimestamp}
-
-
+ {}}
+ />
+ {
+ const intervalOptionsIndex = timeIntervalOptions.findIndex(
+ (item) => item.value === selectedIntrv
+ );
+ const intrv = selectedIntrv.replace(/^auto_/, '');
+ getCountVisualizations(intrv);
+ selectedIntervalRef.current = timeIntervalOptions[intervalOptionsIndex];
+ getPatterns(intrv, getErrorHandler('Error fetching patterns'));
+ }}
+ stateInterval={selectedIntervalRef.current?.value}
+ startTime={appLogEvents ? startTime : dateRange[0]}
+ endTime={appLogEvents ? endTime : dateRange[1]}
+ />
+
>
)}
- {countDistribution?.data && (
-
-
- Events
-
- {' '}
- (
- {reduce(
- countDistribution.data['count()'],
- (sum, n) => {
- return sum + n;
- },
- 0
- )}
- )
-
-
-
- )}
-
-
+
+
+
+
+
+
+
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+ {isLiveTailOnRef.current && (
+ <>
+
+
+
+
+ Live streaming
+
+
+ {}}
+ />
+
+ since {liveTimestamp}
+
+
+ >
+ )}
+
+
+
+
+
+
+
+
+
+
) : (
)}
diff --git a/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap b/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap
index 5be9321c7..6162e2a46 100644
--- a/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap
+++ b/public/components/event_analytics/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap
@@ -1602,7 +1602,7 @@ exports[`Config panel component Renders config panel with visualization data 1`]
"layout": Object {
"colorway": Array [
"#3CA1C7",
- "#8C55A3",
+ "#54B399",
"#DB748A",
"#F2BE4B",
"#68CCC2",
@@ -1835,7 +1835,7 @@ exports[`Config panel component Renders config panel with visualization data 1`]
"layout": Object {
"colorway": Array [
"#3CA1C7",
- "#8C55A3",
+ "#54B399",
"#DB748A",
"#F2BE4B",
"#68CCC2",
@@ -2333,7 +2333,7 @@ exports[`Config panel component Renders config panel with visualization data 1`]
"layout": Object {
"colorway": Array [
"#3CA1C7",
- "#8C55A3",
+ "#54B399",
"#DB748A",
"#F2BE4B",
"#68CCC2",
diff --git a/public/components/visualizations/charts/__tests__/__snapshots__/bar.test.tsx.snap b/public/components/visualizations/charts/__tests__/__snapshots__/bar.test.tsx.snap
index fbaa0739f..1529919ed 100644
--- a/public/components/visualizations/charts/__tests__/__snapshots__/bar.test.tsx.snap
+++ b/public/components/visualizations/charts/__tests__/__snapshots__/bar.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Veritcal Bar component Renders veritcal bar component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
@@ -698,7 +698,7 @@ exports[`Veritcal Bar component Renders veritcal bar component 1`] = `
"bargroupgap": 0.030000000000000027,
"barmode": "group",
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"hovermode": "closest",
@@ -756,7 +756,7 @@ exports[`Veritcal Bar component Renders veritcal bar component 1`] = `
"bargroupgap": 0.030000000000000027,
"barmode": "group",
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"hovermode": "closest",
diff --git a/public/components/visualizations/charts/__tests__/__snapshots__/gauge.test.tsx.snap b/public/components/visualizations/charts/__tests__/__snapshots__/gauge.test.tsx.snap
index 4acd7cae0..bb2075dc0 100644
--- a/public/components/visualizations/charts/__tests__/__snapshots__/gauge.test.tsx.snap
+++ b/public/components/visualizations/charts/__tests__/__snapshots__/gauge.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Gauge component Renders gauge component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
diff --git a/public/components/visualizations/charts/__tests__/__snapshots__/heatmap.test.tsx.snap b/public/components/visualizations/charts/__tests__/__snapshots__/heatmap.test.tsx.snap
index fe48e3228..013b2106b 100644
--- a/public/components/visualizations/charts/__tests__/__snapshots__/heatmap.test.tsx.snap
+++ b/public/components/visualizations/charts/__tests__/__snapshots__/heatmap.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Heatmap component Renders heatmap component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
@@ -710,7 +710,7 @@ exports[`Heatmap component Renders heatmap component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
@@ -763,7 +763,7 @@ exports[`Heatmap component Renders heatmap component 1`] = `
"autosize": true,
"barmode": "stack",
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"hovermode": "closest",
diff --git a/public/components/visualizations/charts/__tests__/__snapshots__/histogram.test.tsx.snap b/public/components/visualizations/charts/__tests__/__snapshots__/histogram.test.tsx.snap
index 1857b0bc5..f56257ba0 100644
--- a/public/components/visualizations/charts/__tests__/__snapshots__/histogram.test.tsx.snap
+++ b/public/components/visualizations/charts/__tests__/__snapshots__/histogram.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Histogram component Renders histogram component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
@@ -711,7 +711,7 @@ exports[`Histogram component Renders histogram component 1`] = `
Object {
"barmode": "group",
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"legend": Object {
@@ -767,7 +767,7 @@ exports[`Histogram component Renders histogram component 1`] = `
"autosize": true,
"barmode": "group",
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"hovermode": "closest",
diff --git a/public/components/visualizations/charts/__tests__/__snapshots__/horizontal_bar.test.tsx.snap b/public/components/visualizations/charts/__tests__/__snapshots__/horizontal_bar.test.tsx.snap
index 65d40ade3..fd5d086b1 100644
--- a/public/components/visualizations/charts/__tests__/__snapshots__/horizontal_bar.test.tsx.snap
+++ b/public/components/visualizations/charts/__tests__/__snapshots__/horizontal_bar.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Horizontal bar component Renders horizontal bar component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
@@ -698,7 +698,7 @@ exports[`Horizontal bar component Renders horizontal bar component 1`] = `
"bargroupgap": 0.030000000000000027,
"barmode": "group",
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"hovermode": "closest",
@@ -756,7 +756,7 @@ exports[`Horizontal bar component Renders horizontal bar component 1`] = `
"bargroupgap": 0.030000000000000027,
"barmode": "group",
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"hovermode": "closest",
diff --git a/public/components/visualizations/charts/__tests__/__snapshots__/line.test.tsx.snap b/public/components/visualizations/charts/__tests__/__snapshots__/line.test.tsx.snap
index ecab56aa6..87f23bc1d 100644
--- a/public/components/visualizations/charts/__tests__/__snapshots__/line.test.tsx.snap
+++ b/public/components/visualizations/charts/__tests__/__snapshots__/line.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Line component Renders line component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
@@ -697,7 +697,7 @@ exports[`Line component Renders line component 1`] = `
Object {
"autosize": true,
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"legend": Object {
@@ -749,7 +749,7 @@ exports[`Line component Renders line component 1`] = `
"autosize": true,
"barmode": "stack",
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"hovermode": "closest",
diff --git a/public/components/visualizations/charts/__tests__/__snapshots__/metrics.test.tsx.snap b/public/components/visualizations/charts/__tests__/__snapshots__/metrics.test.tsx.snap
index ee792c625..0d2c4eea3 100644
--- a/public/components/visualizations/charts/__tests__/__snapshots__/metrics.test.tsx.snap
+++ b/public/components/visualizations/charts/__tests__/__snapshots__/metrics.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Metrics component Renders Metrics component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
@@ -618,7 +618,7 @@ exports[`Metrics component Renders Metrics component 1`] = `
"layout": Object {
"colorway": Array [
"#3CA1C7",
- "#8C55A3",
+ "#54B399",
"#DB748A",
"#F2BE4B",
"#68CCC2",
diff --git a/public/components/visualizations/charts/__tests__/__snapshots__/pie.test.tsx.snap b/public/components/visualizations/charts/__tests__/__snapshots__/pie.test.tsx.snap
index 2efd9326f..67b8a1360 100644
--- a/public/components/visualizations/charts/__tests__/__snapshots__/pie.test.tsx.snap
+++ b/public/components/visualizations/charts/__tests__/__snapshots__/pie.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Pie component Renders pie component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
@@ -686,7 +686,7 @@ exports[`Pie component Renders pie component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"grid": Object {
"columns": 0,
@@ -733,7 +733,7 @@ exports[`Pie component Renders pie component 1`] = `
"autosize": true,
"barmode": "stack",
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"grid": Object {
"columns": 0,
diff --git a/public/components/visualizations/charts/__tests__/__snapshots__/treemap.test.tsx.snap b/public/components/visualizations/charts/__tests__/__snapshots__/treemap.test.tsx.snap
index dbe192ad4..483149850 100644
--- a/public/components/visualizations/charts/__tests__/__snapshots__/treemap.test.tsx.snap
+++ b/public/components/visualizations/charts/__tests__/__snapshots__/treemap.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Treemap component Renders treemap component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
@@ -723,7 +723,7 @@ exports[`Treemap component Renders treemap component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
@@ -790,7 +790,7 @@ exports[`Treemap component Renders treemap component 1`] = `
"autosize": true,
"barmode": "stack",
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"hovermode": "closest",
diff --git a/public/components/visualizations/plotly/__tests__/__snapshots__/plotly.test.tsx.snap b/public/components/visualizations/plotly/__tests__/__snapshots__/plotly.test.tsx.snap
index af24195dd..5ed2e0512 100644
--- a/public/components/visualizations/plotly/__tests__/__snapshots__/plotly.test.tsx.snap
+++ b/public/components/visualizations/plotly/__tests__/__snapshots__/plotly.test.tsx.snap
@@ -36,7 +36,7 @@ exports[`Ploty base component Renders Ploty base component 1`] = `
layout={
Object {
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"margin": Object {
@@ -101,7 +101,7 @@ exports[`Ploty base component Renders Ploty base component 1`] = `
"autosize": true,
"barmode": "stack",
"colorway": Array [
- "#8C55A3",
+ "#54B399",
],
"height": 220,
"hovermode": "closest",