fix(data set table): make table use min-required width

dhis2 · Sep 30, 2021 · 62432f9 · 62432f9
1 parent a9e5676
commit 62432f9
Showing 1 changed file with 4 additions and 3 deletions.
diff --git a/src/data-workspace/display/table.js b/src/data-workspace/display/table.js
@@ -12,23 +12,24 @@ import styles from './table.module.css'
 
 // Needs to have the same width as the table, so can't use the one from
 // @dhis2/ui
-const DataTableToolbar = ({ children }) => (
+const DataTableToolbar = ({ children, columns }) => (
     <tr>
-        <th className={styles.titleCell} colSpan="2">
+        <th className={styles.titleCell} colSpan={columns.toString()}>
             {children}
         </th>
     </tr>
 )
 
 DataTableToolbar.propTypes = {
     children: PropTypes.any.isRequired,
+    columns: PropTypes.number.isRequired,
 }
 
 const Table = ({ title, columns, rows }) => (
     <>
         <DataTable className={styles.dataTable}>
             <TableHead>
-                <DataTableToolbar>{title}</DataTableToolbar>
+                <DataTableToolbar columns={columns.length}>{title}</DataTableToolbar>
                 <DataTableRow>
                     {columns.map(column => (
                         <DataTableColumnHeader key={column}>