add overflow

elastic · Aug 23, 2021 · a291a87 · a291a87
1 parent d495191
commit a291a87
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/x-pack/plugins/timelines/public/components/t_grid/body/helpers.tsx b/x-pack/plugins/timelines/public/components/t_grid/body/helpers.tsx
@@ -192,18 +192,21 @@ export const allowSorting = ({
 export const addBuildingBlockStyle = (
   ecs: Ecs,
   theme: EuiTheme,
-  setCellProps: EuiDataGridCellValueElementProps['setCellProps']
+  setCellProps: EuiDataGridCellValueElementProps['setCellProps'],
+  defaultStyles: React.CSSProperties
 ) => {
   if (isEventBuildingBlockType(ecs)) {
     setCellProps({
       style: {
+        ...defaultStyles,
         backgroundColor: `${theme.eui.euiColorHighlight}`,
       },
     });
   } else {
     // reset cell style
     setCellProps({
       style: {
+        ...defaultStyles,
         backgroundColor: 'inherit',
       },
     });

diff --git a/x-pack/plugins/timelines/public/components/t_grid/body/index.tsx b/x-pack/plugins/timelines/public/components/t_grid/body/index.tsx
@@ -595,10 +595,17 @@ export const BodyComponent = React.memo<StatefulBodyProps>(
         const rowData = rowIndex < data.length ? data[rowIndex].data : null;
         const header = columnHeaders.find((h) => h.id === columnId);
         const eventId = rowIndex < data.length ? data[rowIndex]._id : null;
+        const defaultStyles = useMemo(
+          () => ({
+            overflow: 'hidden',
+          }),
+          []
+        );
+        setCellProps({ style: { ...defaultStyles } });
 
         useEffect(() => {
-          addBuildingBlockStyle(data[rowIndex].ecs, theme, setCellProps);
-        }, [rowIndex, setCellProps]);
+          addBuildingBlockStyle(data[rowIndex].ecs, theme, setCellProps, defaultStyles);
+        }, [rowIndex, setCellProps, defaultStyles]);
 
         if (rowData == null || header == null || eventId == null) {
           return null;