Fix table sizing/resizing

Signed-off-by: Volker Theile <vtheile@suse.com>
longhorn · Sep 12, 2023 · 78284d6 · 78284d6
1 parent 74ad6ef
commit 78284d6
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 2 deletions.
diff --git a/src/routes/objectStorage/ObjectStoreList.js b/src/routes/objectStorage/ObjectStoreList.js
@@ -80,7 +80,7 @@ function list({
   ]
 
   return (
-    <div id="objectStoreTable">
+    <div id="objectStoreTable" style={{ flex: 1, height: '1px', overflow: 'hidden' }}>
       <Table
         className="common-table-class"
         bordered={false}
@@ -99,7 +99,7 @@ function list({
 
 list.propTypes = {
   dataSource: PropTypes.array,
-  heigth: PropTypes.number,
+  height: PropTypes.number,
   loading: PropTypes.bool,
   rowSelection: PropTypes.object,
   editObjectStore: PropTypes.func,

diff --git a/src/routes/objectStorage/index.js b/src/routes/objectStorage/index.js
@@ -10,6 +10,7 @@ import EditObjectStore from './EditObjectStore'
 import ObjectStoreList from './ObjectStoreList'
 import ObjectStoreBulkActions from './ObjectStoreBulkActions'
 import { generateRandomKey } from './helper/index'
+import C from '../../utils/constants'
 
 class ObjectStore extends React.Component {
   constructor(props) {
@@ -24,6 +25,20 @@ class ObjectStore extends React.Component {
     }
   }
 
+  componentDidMount() {
+    let height = document.getElementById('objectStoreTable').offsetHeight - C.ContainerMarginHeight
+    this.setState({
+      height,
+    })
+    window.onresize = () => {
+      height = document.getElementById('objectStoreTable').offsetHeight - C.ContainerMarginHeight
+      this.setState({
+        height,
+      })
+      this.props.dispatch({ type: 'app/changeNavbar' })
+    }
+  }
+
   showCreateModal = () => {
     this.setState({
       ...this.state,