Tpp 801/ensure text in table wraps (#297)

orchestrated-io · Jun 28, 2024 · d2b4dc8 · d2b4dc8
1 parent 8260e85
commit d2b4dc8
Showing 1 changed file with 15 additions and 4 deletions.
diff --git a/lib/components/Table/getExpandColumnConfig.js b/lib/components/Table/getExpandColumnConfig.js
@@ -1,7 +1,8 @@
 import { Stack } from "@mui/material";
-import { MRT_ExpandAllButton } from "material-react-table";
+import { MRT_ExpandAllButton, MRT_ExpandButton } from "material-react-table";
 import React from "react";
 import Box from "../Box";
+import Flex from "../Flex";
 import { get } from "lodash";
 import styled from "styled-components";
 import { PropTypes } from "prop-types";
@@ -51,10 +52,14 @@ const GroupedCell = (props) => {
   }
 
   if (firstCol.Cell) {
-    return <firstCol.Cell {...props} renderedCellValue={renderedCellValue} />;
+    return (
+      <Flex alignItems="center">
+        <firstCol.Cell {...props} renderedCellValue={renderedCellValue} />
+      </Flex>
+    );
   }
 
-  return renderedCellValue;
+  return <Flex alignItems="center">{renderedCellValue} </Flex>;
 };
 
 GroupedCell.propTypes = PropTypes.Obj;
@@ -87,7 +92,13 @@ export default (firstCol, tableConfig) => ({
     Header: (props) => (
       <HeaderCell {...props} firstCol={firstCol} tableConfig={tableConfig} />
     ),
-    GroupedCell: (props) => <GroupedCell {...props} firstCol={firstCol} />,
+    Cell: (props) => (
+      <Flex alignItems="center">
+        <MRT_ExpandButton {...props} />
+
+        <GroupedCell {...props} firstCol={firstCol} />
+      </Flex>
+    ),
     enableResizing: true,
     size: 200
   }