From 23c192f330e57b99d6f9f89e7416143333abf7cb Mon Sep 17 00:00:00 2001
From: Galen Kistler <109082771+gtk-grafana@users.noreply.github.com>
Date: Thu, 13 Nov 2025 13:48:40 -0600
Subject: [PATCH] TableCellInspector: fix runtime error thrown when inspecting
 non-string table cells (#113865)

* fix: old table throwing error on inspect of dates and empty cells

---------

Co-authored-by: Paul Marbach <paul.marbach@grafana.com>
---
 .../Table/TableCellInspector.test.tsx           | 17 +++++++++++++++++
 .../src/components/Table/TableCellInspector.tsx | 12 +++++++++---
 2 files changed, 26 insertions(+), 3 deletions(-)
 create mode 100644 packages/grafana-ui/src/components/Table/TableCellInspector.test.tsx

diff --git a/packages/grafana-ui/src/components/Table/TableCellInspector.test.tsx b/packages/grafana-ui/src/components/Table/TableCellInspector.test.tsx
new file mode 100644
index 00000000000..c4a6e823add
--- /dev/null
+++ b/packages/grafana-ui/src/components/Table/TableCellInspector.test.tsx
@@ -0,0 +1,17 @@
+import { screen, render } from '@testing-library/react';
+
+import { TableCellInspector, TableCellInspectorMode } from './TableCellInspector';
+
+describe('TableCellInspector', () => {
+  it.each([
+    { type: 'string', value: 'simple string' },
+    { type: 'number', value: 12345 },
+    { type: 'object', value: { key: 'value', anotherKey: 42 } },
+    { type: 'array', value: [1, 2, 3, 4, 5] },
+    { type: 'null', value: null },
+    { type: 'undefined', value: undefined },
+  ])('should successfully render for input of type $type', ({ value }) => {
+    render(<TableCellInspector value={value} onDismiss={() => {}} mode={TableCellInspectorMode.text} />);
+    expect(screen.getByText('Copy to Clipboard')).toBeInTheDocument();
+  });
+});
diff --git a/packages/grafana-ui/src/components/Table/TableCellInspector.tsx b/packages/grafana-ui/src/components/Table/TableCellInspector.tsx
index 10169328ba4..e1ecae5b355 100644
--- a/packages/grafana-ui/src/components/Table/TableCellInspector.tsx
+++ b/packages/grafana-ui/src/components/Table/TableCellInspector.tsx
@@ -18,15 +18,21 @@ export enum TableCellInspectorMode {
 }
 
 interface TableCellInspectorProps {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  value: string;
+  value: unknown;
   onDismiss: () => void;
   mode: TableCellInspectorMode;
 }
 
+const toString = (value: unknown): string => {
+  if (typeof value === 'string') {
+    return value;
+  }
+  return value?.toString?.() ?? '';
+};
+
 export function TableCellInspector({ value, onDismiss, mode }: TableCellInspectorProps) {
   const [currentMode, setMode] = useState(mode);
-  const text = value.trim();
+  const text = toString(value).trim();
   const styles = useStyles2(getStyles);
 
   const tabs = [