From 154868e624dcccc654a5d337902b413dab224e48 Mon Sep 17 00:00:00 2001
From: Kyle Cunningham <codeincarnate@users.noreply.github.com>
Date: Mon, 25 Mar 2024 16:13:24 -0500
Subject: [PATCH] Table Panel: Fix image disappearing when datalinks applied
 (#84625)

* Fix link image disappearing

* Prettier

* i18n

* Fix offset to compensate for padding

* Prettier

---------

Co-authored-by: nmarrs <nathanielmarrs@gmail.com>
---
 packages/grafana-ui/src/components/Table/ImageCell.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/grafana-ui/src/components/Table/ImageCell.tsx b/packages/grafana-ui/src/components/Table/ImageCell.tsx
index 33c87d22b9f..d4a164cebce 100644
--- a/packages/grafana-ui/src/components/Table/ImageCell.tsx
+++ b/packages/grafana-ui/src/components/Table/ImageCell.tsx
@@ -8,6 +8,8 @@ import { DataLinksContextMenu } from '../DataLinks/DataLinksContextMenu';
 
 import { TableCellProps } from './types';
 
+const DATALINKS_HEIGHT_OFFSET = 10;
+
 export const ImageCell = (props: TableCellProps) => {
   const { field, cell, tableStyles, row, cellProps } = props;
 
@@ -20,7 +22,10 @@ export const ImageCell = (props: TableCellProps) => {
     <div {...cellProps} className={tableStyles.cellContainer}>
       {!hasLinks && <img src={displayValue.text} className={tableStyles.imageCell} alt="" />}
       {hasLinks && (
-        <DataLinksContextMenu style={{ height: '100%' }} links={() => getCellLinks(field, row) || []}>
+        <DataLinksContextMenu
+          style={{ height: tableStyles.cellHeight - DATALINKS_HEIGHT_OFFSET, width: 'auto' }}
+          links={() => getCellLinks(field, row) || []}
+        >
           {(api) => {
             const img = <img src={displayValue.text} className={tableStyles.imageCell} alt="" />;
             if (api.openMenu) {