From 63f2d6647113d66cbb97039a8a780b76644ef727 Mon Sep 17 00:00:00 2001
From: Stratoula Kalafateli <efstratia.kalafateli@elastic.co>
Date: Wed, 11 May 2022 14:16:34 +0300
Subject: [PATCH] [Lens] Fixes bug with empty data and a reference line
 (#131922)

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
---
 .../public/components/xy_chart.test.tsx       | 23 +++++++++++++++++++
 .../public/components/xy_chart.tsx            |  4 ++--
 2 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/src/plugins/chart_expressions/expression_xy/public/components/xy_chart.test.tsx b/src/plugins/chart_expressions/expression_xy/public/components/xy_chart.test.tsx
index 48f2393935413a..1d9d27c8ec9342 100644
--- a/src/plugins/chart_expressions/expression_xy/public/components/xy_chart.test.tsx
+++ b/src/plugins/chart_expressions/expression_xy/public/components/xy_chart.test.tsx
@@ -757,6 +757,29 @@ describe('XYChart component', () => {
     expect(component.find(EmptyPlaceholder).prop('icon')).toBeDefined();
   });
 
+  test('it renders empty placeholder for no results with references layer', () => {
+    const { data, args } = sampleArgsWithReferenceLine();
+    const emptyDataLayers = args.layers.map((layer) => {
+      if (layer.type === 'dataLayer') {
+        return { ...layer, table: { ...data, rows: [] } };
+      } else {
+        return layer;
+      }
+    });
+    const component = shallow(
+      <XYChart
+        {...defaultProps}
+        args={{
+          ...args,
+          layers: emptyDataLayers,
+        }}
+      />
+    );
+
+    expect(component.find(BarSeries)).toHaveLength(0);
+    expect(component.find(EmptyPlaceholder).prop('icon')).toBeDefined();
+  });
+
   test('onBrushEnd returns correct context data for date histogram data', () => {
     const { args } = sampleArgs();
 
diff --git a/src/plugins/chart_expressions/expression_xy/public/components/xy_chart.tsx b/src/plugins/chart_expressions/expression_xy/public/components/xy_chart.tsx
index 6e3f1429969490..4ad1a5e511e23f 100644
--- a/src/plugins/chart_expressions/expression_xy/public/components/xy_chart.tsx
+++ b/src/plugins/chart_expressions/expression_xy/public/components/xy_chart.tsx
@@ -172,7 +172,7 @@ export function XYChart({
     [dataLayers, formatFactory]
   );
 
-  if (filteredLayers.length === 0) {
+  if (dataLayers.length === 0) {
     const icon: IconType = getIconForSeriesType(
       getDataLayers(layers)?.[0]?.seriesType || SeriesTypes.BAR
     );
@@ -253,7 +253,7 @@ export function XYChart({
   const annotationsLayers = getAnnotationsLayers(layers);
   const firstTable = dataLayers[0]?.table;
 
-  const xColumnId = firstTable.columns.find((col) => col.id === dataLayers[0]?.xAccessor)?.id;
+  const xColumnId = firstTable?.columns.find((col) => col.id === dataLayers[0]?.xAccessor)?.id;
 
   const groupedLineAnnotations = getAnnotationsGroupedByInterval(
     annotationsLayers,