refactor: switch SimpleTable to JSX

DataBiosphere · Nov 13, 2023 · 8195b6c · 8195b6c
1 parent cf91edf
commit 8195b6c
Showing 1 changed file with 11 additions and 14 deletions.
diff --git a/src/components/SimpleTable.js b/src/components/SimpleTable.js
@@ -1,3 +1,4 @@
+import React from 'react';
 import { isNil } from 'lodash/fp';
 import { div, h } from 'react-hyperscript-helpers';
 import { Styles } from '../libs/theme';
@@ -8,27 +9,23 @@ import loadingImage from '../images/loading-indicator.svg';
 
 // Renders spinning circle while table loading
 const TableLoading = () => {
-  return div({className: 'table-loading-placeholder'},
-    [
-      h(SpinnerComponent, {
-        show: true,
-        name: 'loadingSpinner',
-        loadingImage
-      }, [])
-    ]
+  return (
+    <div className='table-loading-placeholder'>
+      <SpinnerComponent show={true} name='loadingSpinner' loadingImage={loadingImage} />
+    </div>
   );
 };
 
-//Simple cell text display
+// Simple cell text display
 const SimpleTextCell = ({ text, style, keyProp }) => {
-  text = isNil(text) ? '- -' : text;
-  return div({ style, role: 'cell', key: keyProp }, [text]);
+  text = text ?? '- -';
+  return <div style={style} role='cell' key={keyProp}>{text}</div>;
 };
 
-//Simple cell text that carries onClick functionality
+// Simple cell text that carries onClick functionality
 const OnClickTextCell = ({ text, style, onClick, keyProp }) => {
-  text = isNil(text) ? '- -' : text;
-  return div({ style, onClick, role: 'cell', key: keyProp }, [text]);
+  text = text ?? '- -';
+  return <div style={style} onClick={onClick} role='cell' key={keyProp}>{text}</div>;
 };
 
 //Column component that renders the column row based on column headers