@haniffalab/cherita-react 0.2.0-dev.2025-01-17.f9a0f419 → 0.2.0-dev.2025-01-28.7a60aa67

package/dist/components/var-list/VarList.js

@@ -15,13 +15,10 @@ var _constants = require("../../constants/constants");
 var _DatasetContext = require("../../context/DatasetContext");
 var _LoadingIndicators = require("../../utils/LoadingIndicators");
 var _requests = require("../../utils/requests");
-var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-// @TODO: optimize
-const useVarMean = function (varKeys) {
-  let enabled = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+const useVarMean = (varKeys, enabled = false) => {
   const ENDPOINT = "matrix/mean";
   const dataset = (0, _DatasetContext.useDataset)();
   const [params, setParams] = (0, _react.useState)({
@@ -52,10 +49,9 @@ const useVarMean = function (varKeys) {
 
 // @TODO: display where disease data comes from
 // add to disease dataset metadata
-function DiseaseVarList(_ref) {
-  let {
-    makeListItem
-  } = _ref;
+function DiseaseVarList({
+  makeListItem
+}) {
   const ENDPOINT = "disease/genes";
   const dataset = (0, _DatasetContext.useDataset)();
   const dispatch = (0, _DatasetContext.useDatasetDispatch)();
@@ -102,50 +98,30 @@ function DiseaseVarList(_ref) {
     return makeListItem(item, true);
   });
   const isPending = diseaseData.isPending || varMeans.isPending && dataset.varSort.disease.sort === _constants.VAR_SORT.MATRIX;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: dataset.selectedDisease && (!isPending && !diseaseVars?.length ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: "d-flex justify-content-between mt-3",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("h5", {
-          children: "Disease genes"
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Alert, {
-        variant: "light",
-        children: "No disease genes found."
-      })]
-    }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: "d-flex justify-content-between mt-3",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("h5", {
-          children: "Disease genes"
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Button, {
-          variant: "link",
-          onClick: () => {
-            dispatch({
-              type: "reset.disease"
-            });
-          },
-          children: "clear"
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
-        children: dataset.selectedDisease?.name
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_VarListToolbar.VarListToolbar, {
-        varType: "disease"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: "position-relative",
-        children: [isPending && /*#__PURE__*/(0, _jsxRuntime.jsx)(_LoadingIndicators.LoadingSpinner, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.ListGroup, {
-          children: diseaseVarList
-        })]
-      })]
-    }))
-  });
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, dataset.selectedDisease && (!isPending && !diseaseVars?.length ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: "d-flex justify-content-between mt-3"
+  }, /*#__PURE__*/_react.default.createElement("h5", null, "Disease genes")), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
+    variant: "light"
+  }, "No disease genes found.")) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: "d-flex justify-content-between mt-3"
+  }, /*#__PURE__*/_react.default.createElement("h5", null, "Disease genes"), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
+    variant: "link",
+    onClick: () => {
+      dispatch({
+        type: "reset.disease"
+      });
+    }
+  }, "clear")), /*#__PURE__*/_react.default.createElement("p", null, dataset.selectedDisease?.name), /*#__PURE__*/_react.default.createElement(_VarListToolbar.VarListToolbar, {
+    varType: "disease"
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: "position-relative"
+  }, isPending && /*#__PURE__*/_react.default.createElement(_LoadingIndicators.LoadingSpinner, null), /*#__PURE__*/_react.default.createElement(_reactBootstrap.ListGroup, null, diseaseVarList)))));
 }
-function VarNamesList(_ref2) {
-  let {
-    mode = _constants.SELECTION_MODES.SINGLE,
-    displayName = "genes",
-    showDiseaseVarList = true
-  } = _ref2;
+function VarNamesList({
+  mode = _constants.SELECTION_MODES.SINGLE,
+  displayName = "genes",
+  showDiseaseVarList = true
+}) {
   const dataset = (0, _DatasetContext.useDataset)();
   const dispatch = (0, _DatasetContext.useDatasetDispatch)();
   const [varButtons, setVarButtons] = (0, _react.useState)(mode === _constants.SELECTION_MODES.SINGLE ? dataset.selectedVar ? _lodash.default.unionWith([dataset.selectedVar], dataset.varSets, _lodash.default.isEqual) : [...dataset.varSets] : [...dataset.selectedMultiVar, ...dataset.varSets]);
@@ -177,11 +153,11 @@ function VarNamesList(_ref2) {
   }, [mode, dataset.selectedMultiVar]);
   (0, _react.useEffect)(() => {
     setVarButtons(v => {
-      const updated = _lodash.default.map(v, i => {
+      const updated = _lodash.default.compact(_lodash.default.map(v, i => {
         if (i.isSet) {
           return dataset.varSets.find(s => s.name === i.name);
         } else return i;
-      });
+      }));
       const newSets = _lodash.default.difference(dataset.varSets, updated);
       return [...updated, ...newSets];
     });
@@ -216,26 +192,25 @@ function VarNamesList(_ref2) {
       setSortedVarButtons(varButtons);
     }
   }, [dataset.varSort.var.sort, dataset.varSort.var.sortOrder, varButtons, varMeans.isPending, varMeans.serverError, varMeans.fetchedData]);
-  const makeListItem = function (item) {
-    let isDiseaseGene = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.ListGroup.Item, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_VarItem.VarItem, {
-        item: item,
-        active: active,
-        setVarButtons: setVarButtons,
-        mode: mode,
-        isDiseaseGene: isDiseaseGene
-      })
-    }, item.matrix_index);
+  const makeListItem = (item, isDiseaseGene = false) => {
+    return /*#__PURE__*/_react.default.createElement(_reactBootstrap.ListGroup.Item, {
+      key: item.matrix_index
+    }, /*#__PURE__*/_react.default.createElement(_VarItem.VarItem, {
+      item: item,
+      active: active,
+      setVarButtons: setVarButtons,
+      mode: mode,
+      isDiseaseGene: isDiseaseGene
+    }));
   };
   const makeSetListItem = set => {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.ListGroup.Item, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_VarSet.VarSet, {
-        set: set,
-        active: active,
-        mode: mode
-      })
-    }, set.name);
+    return /*#__PURE__*/_react.default.createElement(_reactBootstrap.ListGroup.Item, {
+      key: set.name
+    }, /*#__PURE__*/_react.default.createElement(_VarSet.VarSet, {
+      set: set,
+      active: active,
+      mode: mode
+    }));
   };
   const varList = _lodash.default.map(sortedVarButtons, item => {
     if (item.isSet) {
@@ -257,60 +232,41 @@ function VarNamesList(_ref2) {
     return setName;
   };
   const isPending = varMeans.isPending && dataset.varSort.var.sort === _constants.VAR_SORT.MATRIX;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: "position-relative",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: "overflow-auto mt-3",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: "d-flex justify-content-between",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("h5", {
-          children: _lodash.default.capitalize(displayName)
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.Button, {
-            variant: "light",
-            className: "p-1",
-            onClick: () => {
-              dispatch({
-                type: "add.varSet",
-                varSet: {
-                  name: newSetName(),
-                  vars: [],
-                  isSet: true
-                }
-              });
-            },
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_iconsMaterial.Add, {}), "New set"]
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Button, {
-            variant: "link",
-            onClick: () => {
-              setVarButtons([]);
-              dispatch({
-                type: mode === _constants.SELECTION_MODES.SINGLE ? "reset.var" : "reset.multiVar"
-              });
-              dispatch({
-                type: "reset.varSets"
-              });
-            },
-            children: "clear"
-          })]
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-        children: !varList.length ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Alert, {
-          variant: "light",
-          children: "Search for a feature."
-        }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_VarListToolbar.VarListToolbar, {}), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-            className: "position-relative",
-            children: [isPending && /*#__PURE__*/(0, _jsxRuntime.jsx)(_LoadingIndicators.LoadingSpinner, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.ListGroup, {
-              children: varList
-            })]
-          })]
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-        children: showDiseaseVarList && /*#__PURE__*/(0, _jsxRuntime.jsx)(DiseaseVarList, {
-          makeListItem: makeListItem
-        })
-      })]
-    })
-  });
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "position-relative"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "overflow-auto mt-3"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "d-flex justify-content-between"
+  }, /*#__PURE__*/_react.default.createElement("h5", null, _lodash.default.capitalize(displayName)), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
+    variant: "light",
+    className: "p-1",
+    onClick: () => {
+      dispatch({
+        type: "add.varSet",
+        varSet: {
+          name: newSetName(),
+          vars: [],
+          isSet: true
+        }
+      });
+    }
+  }, /*#__PURE__*/_react.default.createElement(_iconsMaterial.Add, null), "New set"), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
+    variant: "link",
+    onClick: () => {
+      setVarButtons([]);
+      dispatch({
+        type: mode === _constants.SELECTION_MODES.SINGLE ? "reset.var" : "reset.multiVar"
+      });
+      dispatch({
+        type: "reset.varSets"
+      });
+    }
+  }, "clear"))), /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !varList.length ? /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
+    variant: "light"
+  }, "Search for a feature.") : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_VarListToolbar.VarListToolbar, null), /*#__PURE__*/_react.default.createElement("div", {
+    className: "position-relative"
+  }, isPending && /*#__PURE__*/_react.default.createElement(_LoadingIndicators.LoadingSpinner, null), /*#__PURE__*/_react.default.createElement(_reactBootstrap.ListGroup, null, varList)))), /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, showDiseaseVarList && /*#__PURE__*/_react.default.createElement(DiseaseVarList, {
+    makeListItem: makeListItem
+  }))));
 }

package/dist/components/var-list/VarListToolbar.js

@@ -11,14 +11,12 @@ var _material = require("@mui/material");
 var _reactBootstrap = require("react-bootstrap");
 var _constants = require("../../constants/constants");
 var _DatasetContext = require("../../context/DatasetContext");
-var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 // @TODO: set option for "var" and "disease"
-function VarListToolbar(_ref) {
-  let {
-    varType = "var"
-  } = _ref;
+function VarListToolbar({
+  varType = "var"
+}) {
   const dataset = (0, _DatasetContext.useDataset)();
   const dispatch = (0, _DatasetContext.useDatasetDispatch)();
   const [sort, setSort] = (0, _react.useState)(dataset.varSort.var.sort);
@@ -44,58 +42,49 @@ function VarListToolbar(_ref) {
       });
     }
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Navbar, {
-    className: "var-list-toolbar",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.InputGroup, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.InputGroup.Text, {
-        children: "Sort by:"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.ToggleButtonGroup, {
-        "aria-label": "Sort feature by",
-        size: "small",
-        className: "mh-100",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ToggleButton, {
-          value: _constants.VAR_SORT.NAME,
-          "aria-label": "alphabetical",
-          title: "Sort alphabetically",
-          selected: sort === _constants.VAR_SORT.NAME,
-          onChange: () => {
-            handleSort(_constants.VAR_SORT.NAME, nameSortOrder, setNameSortOrder);
-          },
-          children: nameSortOrder === _constants.VAR_SORT_ORDER.ASC ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
-            icon: _freeSolidSvgIcons.faArrowDownAZ
-          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
-            icon: _freeSolidSvgIcons.faArrowUpZA
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ToggleButton, {
-          value: _constants.VAR_SORT.MATRIX,
-          "aria-label": "matrix value",
-          title: "Sort by matrix value",
-          selected: sort === _constants.VAR_SORT.MATRIX,
-          onChange: () => {
-            handleSort(_constants.VAR_SORT.MATRIX, matrixSortOrder, setMatrixSortOrder);
-          },
-          children: matrixSortOrder === _constants.VAR_SORT_ORDER.ASC ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
-            icon: _freeSolidSvgIcons.faArrowDown19
-          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
-            icon: _freeSolidSvgIcons.faArrowUp91
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.ToggleButton, {
-          value: "none",
-          "aria-label": "none",
-          title: "No sorting",
-          onClick: () => {
-            setSort(_constants.VAR_SORT.NONE);
-            dispatch({
-              type: "set.varSort.sort",
-              var: varType,
-              sort: _constants.VAR_SORT.NONE
-            });
-          },
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
-            icon: _freeSolidSvgIcons.faXmark
-          })
-        })]
-      })]
-    })
-  });
+  return /*#__PURE__*/_react.default.createElement(_reactBootstrap.Navbar, {
+    className: "var-list-toolbar"
+  }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup.Text, null, "Sort by:"), /*#__PURE__*/_react.default.createElement(_material.ToggleButtonGroup, {
+    "aria-label": "Sort feature by",
+    size: "small",
+    className: "mh-100"
+  }, /*#__PURE__*/_react.default.createElement(_material.ToggleButton, {
+    value: _constants.VAR_SORT.NAME,
+    "aria-label": "alphabetical",
+    title: "Sort alphabetically",
+    selected: sort === _constants.VAR_SORT.NAME,
+    onChange: () => {
+      handleSort(_constants.VAR_SORT.NAME, nameSortOrder, setNameSortOrder);
+    }
+  }, nameSortOrder === _constants.VAR_SORT_ORDER.ASC ? /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
+    icon: _freeSolidSvgIcons.faArrowDownAZ
+  }) : /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
+    icon: _freeSolidSvgIcons.faArrowUpZA
+  })), /*#__PURE__*/_react.default.createElement(_material.ToggleButton, {
+    value: _constants.VAR_SORT.MATRIX,
+    "aria-label": "matrix value",
+    title: "Sort by matrix value",
+    selected: sort === _constants.VAR_SORT.MATRIX,
+    onChange: () => {
+      handleSort(_constants.VAR_SORT.MATRIX, matrixSortOrder, setMatrixSortOrder);
+    }
+  }, matrixSortOrder === _constants.VAR_SORT_ORDER.ASC ? /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
+    icon: _freeSolidSvgIcons.faArrowDown19
+  }) : /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
+    icon: _freeSolidSvgIcons.faArrowUp91
+  })), /*#__PURE__*/_react.default.createElement(_material.ToggleButton, {
+    value: "none",
+    "aria-label": "none",
+    title: "No sorting",
+    onClick: () => {
+      setSort(_constants.VAR_SORT.NONE);
+      dispatch({
+        type: "set.varSort.sort",
+        var: varType,
+        sort: _constants.VAR_SORT.NONE
+      });
+    }
+  }, /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
+    icon: _freeSolidSvgIcons.faXmark
+  })))));
 }