@haniffalab/cherita-react 1.3.0-dev.2025-06-06.f1eddad0 → 1.3.1-dev.2025-10-29.6de4119f

package/dist/cjs/components/obs-list/ObsList.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ObsColsList = ObsColsList;
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
 var _reactFontawesome = require("@fortawesome/react-fontawesome");
 var _Comment = _interopRequireDefault(require("@mui/icons-material/Comment"));
@@ -15,14 +15,14 @@ var _reactBootstrap = require("react-bootstrap");
 var _Accordion = _interopRequireDefault(require("react-bootstrap/Accordion"));
 var _AccordionButton = require("react-bootstrap/AccordionButton");
 var _AccordionContext = _interopRequireDefault(require("react-bootstrap/AccordionContext"));
-var _ObsItem = require("./ObsItem");
 var _constants = require("../../constants/constants");
 var _DatasetContext = require("../../context/DatasetContext");
 var _SettingsContext = require("../../context/SettingsContext");
 var _LoadingIndicators = require("../../utils/LoadingIndicators");
 var _requests = require("../../utils/requests");
+var _ObsItem = require("./ObsItem");
+var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -41,48 +41,55 @@ const ObsAccordionToggle = _ref => {
   const decoratedOnClick = (0, _AccordionButton.useAccordionButton)(eventKey, () => {
     handleAccordionToggle(eventKey, isCurrentEventKey);
   });
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: "obs-accordion-header ".concat(isCurrentEventKey ? "active" : ""),
-    onClick: decoratedOnClick
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "obs-accordion-header-chevron"
-  }, /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
-    icon: isCurrentEventKey ? _freeSolidSvgIcons.faChevronDown : _freeSolidSvgIcons.faChevronRight
-  })), /*#__PURE__*/_react.default.createElement("span", {
-    className: "obs-accordion-header-title"
-  }, children));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "obs-accordion-header ".concat(isCurrentEventKey ? 'active' : ''),
+    onClick: decoratedOnClick,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "obs-accordion-header-chevron",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
+        icon: isCurrentEventKey ? _freeSolidSvgIcons.faChevronDown : _freeSolidSvgIcons.faChevronRight
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "obs-accordion-header-span",
+      children: children
+    })]
+  });
 };
 function ObsColsList(_ref2) {
-  var _settings$selectedObs;
+  var _settings$selectedObs, _settings$selectedObs3, _settings$selectedObs4;
   let {
     showColor = true,
     enableObsGroups = true,
     showSelectedAsActive = false,
     showHistograms = true
   } = _ref2;
-  const ENDPOINT = "obs/cols";
+  const ENDPOINT = 'obs/cols';
   const dataset = (0, _DatasetContext.useDataset)();
   const settings = (0, _SettingsContext.useSettings)();
   const dispatch = (0, _SettingsContext.useSettingsDispatch)();
   const [enableGroups, setEnableGroups] = (0, _react.useState)(enableObsGroups);
   const [obsCols, setObsCols] = (0, _react.useState)(null);
-  const [active, setActive] = (0, _react.useState)([...[(_settings$selectedObs = settings.selectedObs) === null || _settings$selectedObs === void 0 ? void 0 : _settings$selectedObs.name]]);
-  const [params, setParams] = (0, _react.useState)({
-    url: dataset.url
-  });
+  const [active, setActive] = (0, _react.useState)([...(settings.selectedObs ? [(_settings$selectedObs = settings.selectedObs) === null || _settings$selectedObs === void 0 ? void 0 : _settings$selectedObs.name] : [])]);
   const obsGroups = (0, _react.useMemo)(() => {
     var _dataset$obsGroups;
     return _objectSpread({
       default: _lodash.default.union(_constants.DEFAULT_OBS_GROUP, (_dataset$obsGroups = dataset.obsGroups) === null || _dataset$obsGroups === void 0 ? void 0 : _dataset$obsGroups.default)
-    }, _lodash.default.omit(dataset.obsGroups, "default"));
+    }, _lodash.default.omit(dataset.obsGroups, 'default'));
   }, [dataset.obsGroups]);
+  const [params, setParams] = (0, _react.useState)(_objectSpread({
+    url: dataset.url
+  }, enableGroups ? {
+    cols: _lodash.default.flatten(_lodash.default.values(obsGroups))
+  } : {}));
   (0, _react.useEffect)(() => {
     setParams(p => {
       return _objectSpread(_objectSpread({}, p), {}, {
         url: dataset.url
-      });
+      }, enableGroups ? {
+        cols: _lodash.default.flatten(_lodash.default.values(obsGroups))
+      } : {});
     });
-  }, [dataset.url]);
+  }, [dataset.url, enableGroups, obsGroups]);
   const {
     fetchedData,
     isPending,
@@ -112,25 +119,34 @@ function ObsColsList(_ref2) {
         return d.type !== _constants.OBS_TYPES.DISCRETE;
       });
       setObsCols(_lodash.default.keyBy(_lodash.default.map(filteredData, d => {
+        var _settings$selectedObs2;
+        if (((_settings$selectedObs2 = settings.selectedObs) === null || _settings$selectedObs2 === void 0 ? void 0 : _settings$selectedObs2.name) === d.name) {
+          return _objectSpread(_objectSpread({}, d), {}, {
+            omit: settings.selectedObs.omit || []
+          });
+        }
         return _objectSpread(_objectSpread({}, d), {}, {
-          codesMap: _lodash.default.invert(d.codes),
           omit: []
         });
-      }), "name"));
+      }), 'name'));
     }
-  }, [fetchedData, isPending, obsGroups, serverError, enableGroups]);
+  }, [fetchedData, isPending, obsGroups, serverError, enableGroups, (_settings$selectedObs3 = settings.selectedObs) === null || _settings$selectedObs3 === void 0 ? void 0 : _settings$selectedObs3.name, (_settings$selectedObs4 = settings.selectedObs) === null || _settings$selectedObs4 === void 0 ? void 0 : _settings$selectedObs4.omit]);
   (0, _react.useEffect)(() => {
-    if (obsCols) {
-      var _settings$selectedObs2;
-      if (!obsCols[(_settings$selectedObs2 = settings.selectedObs) === null || _settings$selectedObs2 === void 0 ? void 0 : _settings$selectedObs2.name]) {
-        setActive([]);
+    if (obsCols && settings.selectedObs) {
+      const {
+        name
+      } = settings.selectedObs;
+      if (!obsCols[name]) {
         dispatch({
-          type: "select.obs",
+          type: 'select.obs',
           obs: null
         });
+        if (active.includes(name)) {
+          setActive(prev => _lodash.default.without(prev, name));
+        }
       }
     }
-  }, [settings.selectedObs, dispatch, obsCols]);
+  }, [settings.selectedObs, dispatch, obsCols, active]);
   const handleAccordionToggle = (itemName, isCurrentEventKey) => {
     if (isCurrentEventKey) {
       _lodash.default.delay(() => setActive(prev => _lodash.default.without(prev, itemName)), 250);
@@ -139,8 +155,8 @@ function ObsColsList(_ref2) {
     }
   };
   const toggleAll = item => {
-    var _settings$selectedObs3;
-    const omit = item.omit.length ? [] : _lodash.default.map(item.values, v => item.codes[v]);
+    var _settings$selectedObs5;
+    const omit = item.omit.length ? [] : item.values;
     setObsCols(o => {
       return _objectSpread(_objectSpread({}, o), {}, {
         [item.name]: _objectSpread(_objectSpread({}, item), {}, {
@@ -148,9 +164,9 @@ function ObsColsList(_ref2) {
         })
       });
     });
-    if (((_settings$selectedObs3 = settings.selectedObs) === null || _settings$selectedObs3 === void 0 ? void 0 : _settings$selectedObs3.name) === item.name) {
+    if (((_settings$selectedObs5 = settings.selectedObs) === null || _settings$selectedObs5 === void 0 ? void 0 : _settings$selectedObs5.name) === item.name) {
       dispatch({
-        type: "select.obs",
+        type: 'select.obs',
         obs: _objectSpread(_objectSpread({}, item), {}, {
           omit: omit
         })
@@ -158,46 +174,42 @@ function ObsColsList(_ref2) {
     }
   };
   const toggleLabel = item => {
-    const inLabelObs = _lodash.default.some(settings.labelObs, i => i.name === item.name);
+    const inLabelObs = _lodash.default.includes(settings.labelObs, item.name);
     if (inLabelObs) {
       dispatch({
-        type: "remove.label.obs",
+        type: 'remove.label.obs',
         obsName: item.name
       });
     } else {
       dispatch({
-        type: "add.label.obs",
-        obs: {
-          name: item.name,
-          type: item.type,
-          codesMap: item.codesMap
-        }
+        type: 'add.label.obs',
+        obs: item
       });
     }
   };
   const toggleSlice = item => {
     dispatch({
-      type: "toggle.slice.obs",
+      type: 'toggle.slice.obs',
       obs: item
     });
   };
   const toggleColor = item => {
     dispatch({
-      type: "select.obs",
+      type: 'select.obs',
       obs: item
     });
     dispatch({
-      type: "set.colorEncoding",
+      type: 'set.colorEncoding',
       value: _constants.COLOR_ENCODINGS.OBS
     });
   };
   const toggleObs = (item, value) => {
-    var _settings$selectedObs4;
+    var _settings$selectedObs6;
     let omit;
-    if (_lodash.default.includes(item.omit, item.codes[value])) {
-      omit = item.omit.filter(i => i !== item.codes[value]);
+    if (_lodash.default.includes(item.omit, value)) {
+      omit = item.omit.filter(i => i !== value);
     } else {
-      omit = [...item.omit, item.codes[value]];
+      omit = [...item.omit, value];
     }
     setObsCols(o => {
       return _objectSpread(_objectSpread({}, o), {}, {
@@ -206,9 +218,9 @@ function ObsColsList(_ref2) {
         })
       });
     });
-    if (((_settings$selectedObs4 = settings.selectedObs) === null || _settings$selectedObs4 === void 0 ? void 0 : _settings$selectedObs4.name) === item.name) {
+    if (((_settings$selectedObs6 = settings.selectedObs) === null || _settings$selectedObs6 === void 0 ? void 0 : _settings$selectedObs6.name) === item.name) {
       dispatch({
-        type: "select.obs",
+        type: 'select.obs',
         obs: _objectSpread(_objectSpread({}, item), {}, {
           omit: omit
         })
@@ -216,103 +228,123 @@ function ObsColsList(_ref2) {
     }
   };
   const obsItem = item => {
-    var _settings$selectedObs5, _settings$selectedObs6;
+    var _settings$selectedObs7, _settings$selectedObs8;
     if (!item) {
       return null;
     }
     if (item.type === _constants.OBS_TYPES.DISCRETE) {
       return null;
     }
-    const inLabelObs = _lodash.default.some(settings.labelObs, i => i.name === item.name);
-    const inSliceObs = settings.sliceBy.obs && ((_settings$selectedObs5 = settings.selectedObs) === null || _settings$selectedObs5 === void 0 ? void 0 : _settings$selectedObs5.name) === item.name;
-    const isColorEncoding = (showSelectedAsActive || settings.colorEncoding === _constants.COLOR_ENCODINGS.OBS) && ((_settings$selectedObs6 = settings.selectedObs) === null || _settings$selectedObs6 === void 0 ? void 0 : _settings$selectedObs6.name) === item.name;
-    return /*#__PURE__*/_react.default.createElement("div", {
+    const inLabelObs = _lodash.default.includes(settings.labelObs, item.name);
+    const inSliceObs = settings.sliceBy.obs && ((_settings$selectedObs7 = settings.selectedObs) === null || _settings$selectedObs7 === void 0 ? void 0 : _settings$selectedObs7.name) === item.name;
+    const isColorEncoding = (showSelectedAsActive || settings.colorEncoding === _constants.COLOR_ENCODINGS.OBS) && ((_settings$selectedObs8 = settings.selectedObs) === null || _settings$selectedObs8 === void 0 ? void 0 : _settings$selectedObs8.name) === item.name;
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "accordion-item",
-      key: item.name
-    }, /*#__PURE__*/_react.default.createElement(ObsAccordionToggle, {
-      eventKey: item.name,
-      handleAccordionToggle: handleAccordionToggle
-    }, /*#__PURE__*/_react.default.createElement("div", null, item.name), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("span", {
-      className: "mx-1 cursor-pointer ".concat(inLabelObs ? "active-icon" : "text-muted opacity-50"),
-      onClick: event => {
-        event.stopPropagation();
-        toggleLabel(item);
-      },
-      title: "Add to tooltip"
-    }, /*#__PURE__*/_react.default.createElement(_Comment.default, null)), /*#__PURE__*/_react.default.createElement("span", {
-      className: "mx-1 cursor-pointer ".concat(inSliceObs ? "active-icon" : "text-muted opacity-50"),
-      onClick: event => {
-        event.stopPropagation();
-        toggleSlice(item);
-      },
-      title: "Filter applied"
-    }, /*#__PURE__*/_react.default.createElement(_JoinInner.default, null)), /*#__PURE__*/_react.default.createElement("span", {
-      className: "mx-1 cursor-pointer ".concat(isColorEncoding ? "active-icon" : "text-muted opacity-50"),
-      onClick: event => {
-        event.stopPropagation();
-        toggleColor(item);
-      },
-      title: showSelectedAsActive ? "Is selected" : "Is color encoding"
-    }, /*#__PURE__*/_react.default.createElement(_WaterDrop.default, null)))), /*#__PURE__*/_react.default.createElement(_Accordion.default.Collapse, {
-      eventKey: item.name
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "obs-accordion-body"
-    }, active.includes(item.name) && (item.type === _constants.OBS_TYPES.CATEGORICAL || item.type === _constants.OBS_TYPES.BOOLEAN ? /*#__PURE__*/_react.default.createElement(_ObsItem.CategoricalObs, {
-      key: item.name,
-      obs: item,
-      toggleAll: () => toggleAll(item),
-      toggleObs: value => toggleObs(item, value),
-      toggleLabel: () => toggleLabel(item),
-      toggleSlice: () => toggleSlice(item),
-      toggleColor: () => toggleColor(item),
-      showColor: showColor && isColorEncoding,
-      showHistograms: showHistograms
-    }) : /*#__PURE__*/_react.default.createElement(_ObsItem.ContinuousObs, {
-      key: item.name,
-      obs: item,
-      toggleAll: () => toggleAll(item),
-      toggleObs: value => toggleObs(item, value),
-      toggleLabel: () => toggleLabel(item),
-      toggleSlice: () => toggleSlice(item),
-      toggleColor: () => toggleColor(item),
-      showHistograms: showHistograms
-    })))));
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(ObsAccordionToggle, {
+        eventKey: item.name,
+        handleAccordionToggle: handleAccordionToggle,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "accordion-header-title",
+          children: item.name
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "accordion-header-toolbar",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "mx-1 cursor-pointer ".concat(inLabelObs ? 'active-icon' : 'text-muted opacity-50'),
+            onClick: event => {
+              event.stopPropagation();
+              toggleLabel(item);
+            },
+            title: "Add to tooltip",
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Comment.default, {})
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "mx-1 cursor-pointer ".concat(inSliceObs ? 'active-icon' : 'text-muted opacity-50'),
+            onClick: event => {
+              event.stopPropagation();
+              toggleSlice(item);
+            },
+            title: "Filter applied",
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_JoinInner.default, {})
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "mx-1 cursor-pointer ".concat(isColorEncoding ? 'active-icon' : 'text-muted opacity-50'),
+            onClick: event => {
+              event.stopPropagation();
+              toggleColor(item);
+            },
+            title: showSelectedAsActive ? 'Is selected' : 'Is color encoding',
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_WaterDrop.default, {})
+          })]
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Accordion.default.Collapse, {
+        eventKey: item.name,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "obs-accordion-body",
+          children: active.includes(item.name) && (item.type === _constants.OBS_TYPES.CATEGORICAL || item.type === _constants.OBS_TYPES.BOOLEAN ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ObsItem.CategoricalObs, {
+            obs: item,
+            toggleAll: () => toggleAll(item),
+            toggleObs: value => toggleObs(item, value),
+            toggleLabel: () => toggleLabel(item),
+            toggleSlice: () => toggleSlice(item),
+            toggleColor: () => toggleColor(item),
+            showColor: showColor && isColorEncoding,
+            showHistograms: showHistograms
+          }, item.name) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ObsItem.ContinuousObs, {
+            obs: item,
+            toggleAll: () => toggleAll(item),
+            toggleObs: value => toggleObs(item, value),
+            toggleLabel: () => toggleLabel(item),
+            toggleSlice: () => toggleSlice(item),
+            toggleColor: () => toggleColor(item),
+            showHistograms: showHistograms
+          }, item.name))
+        })
+      })]
+    }, item.name);
   };
   const groupList = _lodash.default.map(_lodash.default.keys(obsGroups), group => {
     const key = "group-".concat(group);
     const groupItems = _lodash.default.compact(_lodash.default.map(_lodash.default.sortBy(obsGroups[group], o => _lodash.default.lowerCase(o.name)), item => {
       return obsItem(obsCols === null || obsCols === void 0 ? void 0 : obsCols[item]);
     }));
-    if (group === "default") {
+    if (group === 'default') {
       return groupItems;
     } else {
-      return /*#__PURE__*/_react.default.createElement(_Accordion.default.Item, {
-        key: key,
+      return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Accordion.default.Item, {
         eventKey: key,
-        className: "obs-group-accordion-item"
-      }, /*#__PURE__*/_react.default.createElement(_Accordion.default.Header, {
-        className: "obs-group-accordion-header"
-      }, group), /*#__PURE__*/_react.default.createElement(_Accordion.default.Body, {
-        className: "obs-group-accordion-body"
-      }, groupItems));
+        className: "obs-group-accordion-item",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Accordion.default.Header, {
+          className: "obs-group-accordion-header",
+          children: group
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Accordion.default.Body, {
+          className: "obs-group-accordion-body",
+          children: groupItems
+        })]
+      }, key);
     }
   });
-  const obsList = enableGroups ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, groupList) : _lodash.default.map(_lodash.default.sortBy(obsCols, o => _lodash.default.lowerCase(o.name)), item => obsItem(item));
+  const obsList = enableGroups ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: groupList
+  }) : _lodash.default.map(_lodash.default.sortBy(obsCols, o => _lodash.default.lowerCase(o.name)), item => obsItem(item));
   const defaultActiveGroup = enableGroups ? "group-".concat(_lodash.default.findKey(obsGroups, g => g.includes(active === null || active === void 0 ? void 0 : active[0]))) : null;
   if (!serverError) {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "position-relative h-100"
-    }, isPending ? /*#__PURE__*/_react.default.createElement(_LoadingIndicators.LoadingSpinner, null) : !!obsCols && !_lodash.default.size(obsCols) ? /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
-      variant: "danger"
-    }, "No observations found.") : /*#__PURE__*/_react.default.createElement(_Accordion.default, {
-      flush: true,
-      defaultActiveKey: [...active, ...[defaultActiveGroup]],
-      alwaysOpen: true,
-      className: "obs-accordion"
-    }, obsList));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "position-relative h-100",
+      children: isPending ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_LoadingIndicators.LoadingSpinner, {}) : !!obsCols && !_lodash.default.size(obsCols) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Alert, {
+        variant: "danger",
+        children: "No observations found."
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Accordion.default, {
+        flush: true,
+        defaultActiveKey: [...active, ...[defaultActiveGroup]],
+        alwaysOpen: true,
+        className: "obs-accordion",
+        children: obsList
+      })
+    });
   } else {
-    return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
-      variant: "danger"
-    }, serverError.message));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Alert, {
+        variant: "danger",
+        children: serverError.message
+      })
+    });
   }
 }

package/dist/cjs/components/obs-list/ObsToolbar.js

@@ -4,9 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ObsToolbar = ObsToolbar;
-var _react = _interopRequireDefault(require("react"));
 var _reactBootstrap = require("react-bootstrap");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _jsxRuntime = require("react/jsx-runtime");
 function ObsToolbar(_ref) {
   let {
     item,
@@ -14,7 +13,7 @@ function ObsToolbar(_ref) {
     onToggleAllObs
   } = _ref;
   const allToggledOn = !item.omit.length;
-  return showToggleAllObs && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Form.Check, {
+  return showToggleAllObs && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Form.Check, {
     type: "switch",
     id: "custom-switch",
     label: "Toggle all",

package/dist/cjs/components/obsm-list/ObsmList.js

@@ -4,20 +4,26 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ObsmKeysList = ObsmKeysList;
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
+var _lodash = _interopRequireDefault(require("lodash"));
 var _reactBootstrap = require("react-bootstrap");
+var _constants = require("../../constants/constants");
 var _DatasetContext = require("../../context/DatasetContext");
 var _SettingsContext = require("../../context/SettingsContext");
 var _requests = require("../../utils/requests");
 var _Skeleton = require("../../utils/Skeleton");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function ObsmKeysList() {
-  const ENDPOINT = "obsm/keys";
+function ObsmKeysList(_ref) {
+  let {
+    setHasObsm
+  } = _ref;
+  const ENDPOINT = 'obsm/keys';
   const dataset = (0, _DatasetContext.useDataset)();
   const settings = (0, _SettingsContext.useSettings)();
   const dispatch = (0, _SettingsContext.useSettingsDispatch)();
@@ -41,48 +47,81 @@ function ObsmKeysList() {
     refetchOnMount: false
   });
   (0, _react.useEffect)(() => {
-    if (!isPending && !serverError && fetchedData) {
-      setObsmKeysList(fetchedData);
-    }
-  }, [fetchedData, isPending, serverError]);
-  (0, _react.useEffect)(() => {
-    if (settings.selectedObsm) {
-      setActive(settings.selectedObsm);
+    if (!isPending && !serverError) {
+      if (!fetchedData || !fetchedData.length) {
+        setHasObsm(false);
+      } else {
+        setHasObsm(true);
+        setObsmKeysList(fetchedData);
+
+        // Set default obsm if in keys list and not selected
+        if (!settings.selectedObsm) {
+          // Follow DEFAULT_OBSM_KEYS order
+          _lodash.default.each(_constants.DEFAULT_OBSM_KEYS, k => {
+            const defaultObsm = _lodash.default.find(fetchedData, item => item.toLowerCase() === k);
+            if (defaultObsm) {
+              dispatch({
+                type: 'select.obsm',
+                obsm: defaultObsm
+              });
+              return false; // break
+            }
+          });
+        }
+      }
+      if (settings.selectedObsm) {
+        // If selected obsm is not in keys list, reset to null
+        if (!_lodash.default.includes(fetchedData || [], settings.selectedObsm)) {
+          dispatch({
+            type: 'select.obsm',
+            obsm: null
+          });
+        } else {
+          setActive(settings.selectedObsm);
+        }
+      }
     }
-  }, [settings.selectedObsm]);
+  }, [dispatch, fetchedData, isPending, serverError, setHasObsm, settings.selectedObsm]);
   const obsmList = obsmKeysList.map(item => {
-    return /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Item, {
-      key: item,
-      className: "custom ".concat(active === item && "active"),
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Dropdown.Item, {
+      className: "custom ".concat(active === item && 'active'),
       onClick: () => {
         dispatch({
-          type: "select.obsm",
+          type: 'select.obsm',
           obsm: item
         });
-      }
+      },
+      children: item
     }, item);
   });
   if (!serverError) {
     if (isPending) {
-      return /*#__PURE__*/_react.default.createElement(_Skeleton.ObsmKeysListBtn, null);
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.ObsmKeysListBtn, {});
     }
-    return /*#__PURE__*/_react.default.createElement(_reactBootstrap.DropdownButton, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.DropdownButton, {
       as: _reactBootstrap.ButtonGroup,
-      title: settings.selectedObsm || "Select an embedding",
-      variant: settings.selectedObsm ? "primary" : "warning",
+      title: settings.selectedObsm || 'Select an embedding',
+      variant: settings.selectedObsm ? 'primary' : 'warning',
       id: "bg-nested-dropdown",
-      size: "sm"
-    }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Header, null, "Embeddings"), obsmList);
+      size: "sm",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Dropdown.Header, {
+        children: "Embeddings"
+      }), obsmList]
+    });
   } else {
-    return /*#__PURE__*/_react.default.createElement(_reactBootstrap.OverlayTrigger, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.OverlayTrigger, {
       placement: "top",
       delay: {
         show: 100,
         hide: 200
       },
-      overlay: /*#__PURE__*/_react.default.createElement(_reactBootstrap.Tooltip, null, serverError.message)
-    }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
-      variant: "danger"
-    }, "Error"));
+      overlay: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Tooltip, {
+        children: serverError.message
+      }),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Button, {
+        variant: "danger",
+        children: "Error"
+      })
+    });
   }
 }