From a9e5676980f5d71450366b7819934ead5bab10fc Mon Sep 17 00:00:00 2001
From: Jan-Gerke Salomon <jgs.salomon@gmail.com>
Date: Thu, 30 Sep 2021 10:41:19 +0200
Subject: [PATCH 1/4] chore(jest tests): remove ".only"

---
 src/selection-context/use-selection-context.test.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/selection-context/use-selection-context.test.js b/src/selection-context/use-selection-context.test.js
index 9a926a28..ccb755b5 100644
--- a/src/selection-context/use-selection-context.test.js
+++ b/src/selection-context/use-selection-context.test.js
@@ -115,7 +115,7 @@ describe('useSelectionContext', () => {
     })
 
     describe('functions returned from the hook update the state and url', () => {
-        it.only('setOpenedSelect', () => {
+        it('setOpenedSelect', () => {
             const mock = jest.fn()
             pushStateToHistory.mockImplementation(mock)
 

From 62432f978b3b57964c9bc2fba6226e05952ee831 Mon Sep 17 00:00:00 2001
From: Jan-Gerke Salomon <jgs.salomon@gmail.com>
Date: Thu, 30 Sep 2021 11:20:39 +0200
Subject: [PATCH 2/4] fix(data set table): make table use min-required width

---
 src/data-workspace/display/table.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/data-workspace/display/table.js b/src/data-workspace/display/table.js
index 56b9f3d8..1e063bf1 100644
--- a/src/data-workspace/display/table.js
+++ b/src/data-workspace/display/table.js
@@ -12,9 +12,9 @@ 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>
@@ -22,13 +22,14 @@ const DataTableToolbar = ({ children }) => (
 
 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}>

From 6377e6ac7e661662f7b658aa886d677b9ac4ef0b Mon Sep 17 00:00:00 2001
From: Jan-Gerke Salomon <jgs.salomon@gmail.com>
Date: Thu, 30 Sep 2021 11:21:10 +0200
Subject: [PATCH 3/4] fix(data set table): ensure 480px max-width rule works

---
 src/data-workspace/display/table.js         | 26 ++++++++++++++-------
 src/data-workspace/display/table.module.css | 10 +++++++-
 2 files changed, 27 insertions(+), 9 deletions(-)

diff --git a/src/data-workspace/display/table.js b/src/data-workspace/display/table.js
index 1e063bf1..6d6db960 100644
--- a/src/data-workspace/display/table.js
+++ b/src/data-workspace/display/table.js
@@ -31,11 +31,19 @@ const Table = ({ title, columns, rows }) => (
             <TableHead>
                 <DataTableToolbar columns={columns.length}>{title}</DataTableToolbar>
                 <DataTableRow>
-                    {columns.map(column => (
-                        <DataTableColumnHeader key={column}>
-                            {column}
-                        </DataTableColumnHeader>
-                    ))}
+                    <DataTableColumnHeader className={styles.cell}>
+                        <span className={styles.labelCellContent}>
+                            {columns[0]}
+                        </span>
+                    </DataTableColumnHeader>
+
+                    {columns.slice(1).map(column => {
+                        return (
+                            <DataTableColumnHeader key={column} className={styles.cell}>
+                                {column}
+                            </DataTableColumnHeader>
+                        )
+                    })}
                 </DataTableRow>
             </TableHead>
             <TableBody>
@@ -44,12 +52,14 @@ const Table = ({ title, columns, rows }) => (
 
                     return (
                         <DataTableRow key={index}>
-                            <DataTableCell className={styles.labelCell}>
-                                {firstCell}
+                            <DataTableCell className={styles.cell}>
+                                <span className={styles.labelCellContent}>
+                                    {firstCell}
+                                </span>
                             </DataTableCell>
 
                             {cells.map((value, index) => (
-                                <DataTableCell key={index}>
+                                <DataTableCell key={index} className={styles.cell}>
                                     {value}
                                 </DataTableCell>
                             ))}
diff --git a/src/data-workspace/display/table.module.css b/src/data-workspace/display/table.module.css
index b4793d2e..cbafc6ad 100644
--- a/src/data-workspace/display/table.module.css
+++ b/src/data-workspace/display/table.module.css
@@ -9,6 +9,14 @@ table.dataTable {
     width: auto;
 }
 
-td.labelCell {
+th.cell, td.cell {
+    height: auto;
+    min-height: 45px;
+    padding-top: 14px;
+    padding-bottom: 14px;
+}
+
+.labelCellContent, .labelCellContent {
+    display: block;
     max-width: 480px;
 }

From 8fa7b7411be5675c7735e469007827807b9d7297 Mon Sep 17 00:00:00 2001
From: Jan-Gerke Salomon <jgs.salomon@gmail.com>
Date: Thu, 30 Sep 2021 11:31:05 +0200
Subject: [PATCH 4/4] refactor: fix linter issues (DHIS2-11840)

---
 src/data-workspace/display/table.js | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/data-workspace/display/table.js b/src/data-workspace/display/table.js
index 6d6db960..d8abaa81 100644
--- a/src/data-workspace/display/table.js
+++ b/src/data-workspace/display/table.js
@@ -29,7 +29,9 @@ const Table = ({ title, columns, rows }) => (
     <>
         <DataTable className={styles.dataTable}>
             <TableHead>
-                <DataTableToolbar columns={columns.length}>{title}</DataTableToolbar>
+                <DataTableToolbar columns={columns.length}>
+                    {title}
+                </DataTableToolbar>
                 <DataTableRow>
                     <DataTableColumnHeader className={styles.cell}>
                         <span className={styles.labelCellContent}>
@@ -39,7 +41,10 @@ const Table = ({ title, columns, rows }) => (
 
                     {columns.slice(1).map(column => {
                         return (
-                            <DataTableColumnHeader key={column} className={styles.cell}>
+                            <DataTableColumnHeader
+                                key={column}
+                                className={styles.cell}
+                            >
                                 {column}
                             </DataTableColumnHeader>
                         )
@@ -59,7 +64,10 @@ const Table = ({ title, columns, rows }) => (
                             </DataTableCell>
 
                             {cells.map((value, index) => (
-                                <DataTableCell key={index} className={styles.cell}>
+                                <DataTableCell
+                                    key={index}
+                                    className={styles.cell}
+                                >
                                     {value}
                                 </DataTableCell>
                             ))}