From e4274729486656f5899083bc1e6109c6e4a39845 Mon Sep 17 00:00:00 2001
From: Sergi Massaneda <sergi.massaneda@elastic.co>
Date: Wed, 21 Feb 2024 18:52:45 +0100
Subject: [PATCH] [Security Solution] Fix cell actions in Explore pages
 (#177478)

## Summary

issue: https://github.com/elastic/kibana/issues/177410

Adding `overflow: hidden` style was causing the cell actions to
disappear after the upgrade to [EUI upgrade to
v91.3.1](https://github.com/elastic/kibana/pull/173569)

The `overflow: hidden` style is no longer needed, it has been removed.
So cell actions are displayed
---
 .../components/data_table/helpers.tsx          | 18 +++---------------
 .../data_table/components/data_table/index.tsx |  4 +---
 2 files changed, 4 insertions(+), 18 deletions(-)

diff --git a/x-pack/packages/security-solution/data_table/components/data_table/helpers.tsx b/x-pack/packages/security-solution/data_table/components/data_table/helpers.tsx
index 38c1384b3468b..21afed3823b38 100644
--- a/x-pack/packages/security-solution/data_table/components/data_table/helpers.tsx
+++ b/x-pack/packages/security-solution/data_table/components/data_table/helpers.tsx
@@ -85,25 +85,13 @@ export const mapSortingColumns = ({
 export const addBuildingBlockStyle = (
   ecs: Ecs,
   theme: EuiTheme,
-  setCellProps: EuiDataGridCellValueElementProps['setCellProps'],
-  defaultStyles?: React.CSSProperties
+  setCellProps: EuiDataGridCellValueElementProps['setCellProps']
 ) => {
-  const currentStyles = defaultStyles ?? {};
   if (isEventBuildingBlockType(ecs)) {
-    setCellProps({
-      style: {
-        ...currentStyles,
-        backgroundColor: `${theme.eui.euiColorHighlight}`,
-      },
-    });
+    setCellProps({ style: { backgroundColor: `${theme.eui.euiColorHighlight}` } });
   } else {
     // reset cell style
-    setCellProps({
-      style: {
-        ...currentStyles,
-        backgroundColor: 'inherit',
-      },
-    });
+    setCellProps({ style: { backgroundColor: 'inherit' } });
   }
 };
 
diff --git a/x-pack/packages/security-solution/data_table/components/data_table/index.tsx b/x-pack/packages/security-solution/data_table/components/data_table/index.tsx
index 3350263513099..a4b6cef88feae 100644
--- a/x-pack/packages/security-solution/data_table/components/data_table/index.tsx
+++ b/x-pack/packages/security-solution/data_table/components/data_table/index.tsx
@@ -410,10 +410,8 @@ export const DataTableComponent = React.memo<DataTableProps>(
         const ecs = pageRowIndex < data.length ? data[pageRowIndex].ecs : null;
 
         useEffect(() => {
-          const defaultStyles = { overflow: 'hidden' };
-          setCellProps({ style: { ...defaultStyles } });
           if (ecs && rowData) {
-            addBuildingBlockStyle(ecs, theme, setCellProps, defaultStyles);
+            addBuildingBlockStyle(ecs, theme, setCellProps);
           } else {
             // disable the cell when it has no data
             setCellProps({ style: { display: 'none' } });