From 92d865cccef8779a477eecdb5748e2d3aee246fe Mon Sep 17 00:00:00 2001
From: Adela Almasan <88068998+adela-almasan@users.noreply.github.com>
Date: Mon, 15 May 2023 17:34:20 -0500
Subject: [PATCH] Canvas: Fix field not found (#68415)

---
 .../grafana-ui/src/components/MatchersUI/utils.ts     |  5 ++++-
 public/app/features/canvas/elements/metricValue.tsx   | 11 ++++++++---
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/packages/grafana-ui/src/components/MatchersUI/utils.ts b/packages/grafana-ui/src/components/MatchersUI/utils.ts
index d3a9c216545..c60679524a4 100644
--- a/packages/grafana-ui/src/components/MatchersUI/utils.ts
+++ b/packages/grafana-ui/src/components/MatchersUI/utils.ts
@@ -31,7 +31,10 @@ export function frameHasName(name: string | undefined, names: FrameFieldsDisplay
 /**
  * Returns the distinct names in a set of frames
  */
-function getFrameFieldsDisplayNames(data: DataFrame[], filter?: (field: Field) => boolean): FrameFieldsDisplayNames {
+export function getFrameFieldsDisplayNames(
+  data: DataFrame[],
+  filter?: (field: Field) => boolean
+): FrameFieldsDisplayNames {
   const names: FrameFieldsDisplayNames = {
     display: new Set<string>(),
     raw: new Set<string>(),
diff --git a/public/app/features/canvas/elements/metricValue.tsx b/public/app/features/canvas/elements/metricValue.tsx
index e9506f9b2a4..5ae95019ea1 100644
--- a/public/app/features/canvas/elements/metricValue.tsx
+++ b/public/app/features/canvas/elements/metricValue.tsx
@@ -7,11 +7,12 @@ import { DataFrame, FieldNamePickerConfigSettings, GrafanaTheme2, StandardEditor
 import { TextDimensionMode } from '@grafana/schema';
 import { usePanelContext, useStyles2 } from '@grafana/ui';
 import { FieldNamePicker } from '@grafana/ui/src/components/MatchersUI/FieldNamePicker';
+import { frameHasName, getFrameFieldsDisplayNames } from '@grafana/ui/src/components/MatchersUI/utils';
 import { DimensionContext } from 'app/features/dimensions/context';
 import { ColorDimensionEditor } from 'app/features/dimensions/editors/ColorDimensionEditor';
 import { TextDimensionEditor } from 'app/features/dimensions/editors/TextDimensionEditor';
+import { getDataLinks } from 'app/plugins/panel/canvas/utils';
 
-import { getDataLinks } from '../../../plugins/panel/canvas/utils';
 import { CanvasElementItem, CanvasElementProps, defaultBgColor, defaultTextColor } from '../element';
 import { ElementState } from '../runtime/element';
 import { Align, TextConfig, TextData, VAlign } from '../types';
@@ -37,12 +38,16 @@ const MetricValueDisplay = (props: CanvasElementProps<TextConfig, TextData>) =>
       return 'Field not found';
     }
 
+    if (panelData && config.text?.field && !data?.text) {
+      return 'No data';
+    }
+
     return data?.text ? data.text : 'Double click to set field';
   };
 
   const fieldNotFound = () => {
-    const field = panelData.filter((series) => series.fields.find((field) => field.name === config.text?.field));
-    return !field.length;
+    const fieldNames = getFrameFieldsDisplayNames(panelData);
+    return !frameHasName(config.text?.field, fieldNames);
   };
 
   if (isEditMode && isSelected) {