[Discover] Prevent wrapping of time series cells

Signed-off-by: Miki <miki@amazon.com>
opensearch-project · Feb 2, 2024 · 5bce3a4 · 5bce3a4
1 parent 40e61ba
commit 5bce3a4
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 6 deletions.
diff --git a/src/plugins/discover/public/application/components/default_discover_table/table_cell.tsx b/src/plugins/discover/public/application/components/default_discover_table/table_cell.tsx
@@ -18,6 +18,7 @@ import { DocViewFilterFn } from '../../doc_views/doc_views_types';
 
 export interface TableCellProps {
   columnId: string;
+  isTimeField?: boolean;
   onFilter: DocViewFilterFn;
   filterable?: boolean;
   fieldMapping?: any;
@@ -26,16 +27,14 @@ export interface TableCellProps {
 
 export const TableCell = ({
   columnId,
+  isTimeField,
   onFilter,
   fieldMapping,
   sanitizedCellValue,
 }: TableCellProps) => {
-  return (
-    // eslint-disable-next-line react/no-danger
-    <td
-      data-test-subj="docTableField"
-      className="osdDocTableCell eui-textBreakAll eui-textBreakWord"
-    >
+  const content = (
+    <>
+      {/* eslint-disable-next-line react/no-danger */}
       <span dangerouslySetInnerHTML={{ __html: sanitizedCellValue }} />
       <span className="osdDocTableCell__filter">
         <EuiToolTip
@@ -69,6 +68,19 @@ export const TableCell = ({
           />
         </EuiToolTip>
       </span>
+    </>
+  );
+
+  return isTimeField ? (
+    <td data-test-subj="docTableField" className="osdDocTableCell eui-textNoWrap">
+      {content}
+    </td>
+  ) : (
+    <td
+      data-test-subj="docTableField"
+      className="osdDocTableCell eui-textBreakAll eui-textBreakWord"
+    >
+      <div className="osdDocTable__limitedHeight">{content}</div>
     </td>
   );
 };
diff --git a/src/plugins/discover/public/application/components/default_discover_table/table_rows.tsx b/src/plugins/discover/public/application/components/default_discover_table/table_rows.tsx
@@ -108,6 +108,7 @@ export const TableRow = ({
           <TableCell
             columnId={columnId}
             onFilter={onFilter}
+            isTimeField={indexPattern.timeFieldName === columnId}
             fieldMapping={fieldMapping}
             sanitizedCellValue={sanitizedCellValue}
           />