@haniffalab/cherita-react 0.2.0-dev.2024-05-09.97c686f2 → 0.2.0-dev.2024-05-21.ca7d726c

package/dist/helpers/color-helper.js

@@ -3,27 +3,35 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ColorHelper = void 0;
+exports.useColor = void 0;
 var _chromaJs = _interopRequireDefault(require("chroma-js"));
 var _lodash = _interopRequireDefault(require("lodash"));
 var _constants = require("../constants/constants");
+var _DatasetContext = require("../context/DatasetContext");
+var _react = require("react");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(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); }
-class ColorHelper {
-  constructor() {
-    _defineProperty(this, "getScale", (colorScale, values) => {
-      return _chromaJs.default.scale(_constants.CHROMA_COLORSCALES[colorScale]).domain([_lodash.default.min(values), _lodash.default.max(values)]);
-    });
-    _defineProperty(this, "getColor", function (colorEncoding, state, value) {
-      let scale = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : _chromaJs.default.scale();
-      if (colorEncoding === "var") {
-        return scale(value).rgb();
-      } else if (colorEncoding === "obs") {
-        return state.hasOwnProperty(value) ? state[value]["color"] : null;
-      }
-    });
-  }
-}
-exports.ColorHelper = ColorHelper;
+const useColor = () => {
+  var _dataset$selectedObs2;
+  const dataset = (0, _DatasetContext.useDataset)();
+  const getScale = (0, _react.useCallback)(function () {
+    let values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+    const c = _chromaJs.default.scale(_constants.CHROMA_COLORSCALES[dataset.controls.colorScale]).domain(values ? [_lodash.default.min(values), _lodash.default.max(values)] : [0, 1]);
+    return c;
+  }, [dataset.controls.colorScale]);
+  const getColor = (0, _react.useCallback)(function (scale, value) {
+    let colorEncoding = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : dataset.colorEncoding;
+    if (colorEncoding === "var") {
+      return scale(value).rgb();
+    } else if (colorEncoding === "obs") {
+      var _dataset$obs$dataset$, _dataset$selectedObs;
+      return (_dataset$obs$dataset$ = dataset.obs[(_dataset$selectedObs = dataset.selectedObs) === null || _dataset$selectedObs === void 0 ? void 0 : _dataset$selectedObs.name]) === null || _dataset$obs$dataset$ === void 0 || (_dataset$obs$dataset$ = _dataset$obs$dataset$.state) === null || _dataset$obs$dataset$ === void 0 || (_dataset$obs$dataset$ = _dataset$obs$dataset$[value]) === null || _dataset$obs$dataset$ === void 0 ? void 0 : _dataset$obs$dataset$["color"];
+    } else {
+      return null;
+    }
+  }, [dataset.colorEncoding, dataset.obs, (_dataset$selectedObs2 = dataset.selectedObs) === null || _dataset$selectedObs2 === void 0 ? void 0 : _dataset$selectedObs2.name]);
+  return {
+    getScale,
+    getColor
+  };
+};
+exports.useColor = useColor;

package/dist/helpers/zarr-helper.js

@@ -3,7 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ZarrHelper = exports.GET_OPTIONS = void 0;
+exports.useZarr = exports.ZarrHelper = exports.GET_OPTIONS = void 0;
+var _react = require("react");
 var _zarr = require("zarr");
 const GET_OPTIONS = exports.GET_OPTIONS = {
   concurrencyLimit: 10,
@@ -26,4 +27,38 @@ class ZarrHelper {
     return z;
   }
 }
-exports.ZarrHelper = ZarrHelper;
+exports.ZarrHelper = ZarrHelper;
+const useZarr = function (_ref2) {
+  let {
+    url,
+    path
+  } = _ref2;
+  let s = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  let opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  const [data, setData] = (0, _react.useState)(null);
+  const [isPending, setIsPending] = (0, _react.useState)(true);
+  const [serverError, setServerError] = (0, _react.useState)(null);
+  (0, _react.useEffect)(() => {
+    const fetchData = async () => {
+      try {
+        setIsPending(true);
+        setServerError(null);
+        const zarrHelper = new ZarrHelper();
+        const z = await zarrHelper.open(url, path);
+        const result = await z.get(s, opts);
+        setData(result.data);
+      } catch (error) {
+        setServerError(error.message);
+      } finally {
+        setIsPending(false);
+      }
+    };
+    fetchData();
+  }, [opts, path, s, url]);
+  return {
+    data,
+    isPending,
+    serverError
+  };
+};
+exports.useZarr = useZarr;

package/dist/index.js

@@ -111,6 +111,12 @@ Object.defineProperty(exports, "ScatterplotControls", {
     return _Scatterplot.ScatterplotControls;
   }
 });
+Object.defineProperty(exports, "SearchBar", {
+  enumerable: true,
+  get: function () {
+    return _SearchBar.SearchBar;
+  }
+});
 Object.defineProperty(exports, "VIOLIN_MODES", {
   enumerable: true,
   get: function () {
@@ -138,6 +144,7 @@ Object.defineProperty(exports, "ViolinControls", {
 var _ObsList = require("./components/obs-list/ObsList");
 var _ObsmList = require("./components/obsm-list/ObsmList");
 var _VarList = require("./components/var-list/VarList");
+var _SearchBar = require("./components/search-bar/SearchBar");
 var _Heatmap = require("./components/heatmap/Heatmap");
 var _Dotplot = require("./components/dotplot/Dotplot");
 var _Scatterplot = require("./components/scatterplot/Scatterplot");

package/dist/utils/requests.js

@@ -11,7 +11,8 @@ var _errors = require("./errors");
 async function fetchData(endpoint, params) {
   let signal = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
   let ms = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 300000;
-  const apiUrl = process.env.REACT_APP_API_URL;
+  let apiUrl = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
+  apiUrl = apiUrl || process.env.REACT_APP_API_URL;
   const controller = new AbortController();
   const timeout = setTimeout(() => {
     controller.abort(DOMException.TIMEOUT_ERR);
@@ -40,6 +41,10 @@ async function fetchData(endpoint, params) {
 }
 const useFetch = function (endpoint, params) {
   let opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+  let apiUrl = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+  const {
+    enabled = true
+  } = opts;
   const {
     data: fetchedData,
     isLoading: isPending,
@@ -50,7 +55,11 @@ const useFetch = function (endpoint, params) {
       let {
         signal
       } = _ref;
-      return fetchData(endpoint, params, signal);
+      if (enabled) {
+        return fetchData(endpoint, params, signal, apiUrl);
+      } else {
+        return;
+      }
     },
     ...opts
   });
@@ -64,6 +73,10 @@ exports.useFetch = useFetch;
 const useDebouncedFetch = function (endpoint, params) {
   let delay = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 500;
   let opts = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+  let apiUrl = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
+  const {
+    enabled = true
+  } = opts;
   const debouncedParams = (0, _usehooks.useDebounce)(params, delay);
   const {
     data: fetchedData,
@@ -75,7 +88,11 @@ const useDebouncedFetch = function (endpoint, params) {
       let {
         signal
       } = _ref2;
-      return fetchData(endpoint, debouncedParams, signal);
+      if (enabled) {
+        return fetchData(endpoint, debouncedParams, signal, apiUrl);
+      } else {
+        return;
+      }
     },
     ...opts
   });

package/dist/utils/search.js

@@ -0,0 +1,97 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useVarSearch = exports.useGetDisease = exports.useDiseaseSearch = void 0;
+var _react = require("react");
+var _DatasetContext = require("../context/DatasetContext");
+var _requests = require("./requests");
+const useDiseaseSearch = () => {
+  const ENDPOINT = "diseases";
+  const dataset = (0, _DatasetContext.useDataset)();
+  const [params, setParams] = (0, _react.useState)({
+    url: dataset.url,
+    diseaseDatasets: dataset.diseaseDatasets,
+    text: ""
+  });
+  const data = (0, _requests.useFetch)(ENDPOINT, params, {
+    enabled: !!params.text.length
+  });
+  return {
+    params,
+    setParams,
+    data
+  };
+};
+exports.useDiseaseSearch = useDiseaseSearch;
+const useVarSearch = () => {
+  const ENDPOINT = "var/names";
+  const dataset = (0, _DatasetContext.useDataset)();
+  const dispatch = (0, _DatasetContext.useDatasetDispatch)();
+  const [params, setParams] = (0, _react.useState)({
+    url: dataset.url,
+    text: ""
+  });
+  const data = (0, _requests.useFetch)(ENDPOINT, params, {
+    enabled: !!params.text.length
+  });
+  const onSelect = item => {
+    dispatch({
+      type: "varSelected",
+      var: item
+    });
+    dispatch({
+      type: "multiVarSelected",
+      var: item
+    });
+    dispatch({
+      type: "set.colorEncoding",
+      value: "var"
+    });
+  };
+  return {
+    params,
+    setParams,
+    data,
+    onSelect
+  };
+};
+exports.useVarSearch = useVarSearch;
+const useGetDisease = () => {
+  var _dataset$selectedDise, _dataset$selectedDise2, _params$diseaseName;
+  const ENDPOINT = "disease/genes";
+  const dataset = (0, _DatasetContext.useDataset)();
+  const dispatch = (0, _DatasetContext.useDatasetDispatch)();
+  const [params, setParams] = (0, _react.useState)({
+    url: dataset.url,
+    col: dataset.varNamesCol,
+    diseaseName: (_dataset$selectedDise = dataset.selectedDisease) === null || _dataset$selectedDise === void 0 ? void 0 : _dataset$selectedDise.name,
+    diseaseDatasets: dataset.diseaseDatasets
+  });
+  (0, _react.useEffect)(() => {
+    setParams(p => {
+      return {
+        ...p,
+        diseaseName: dataset.selectedDisease.name
+      };
+    });
+  }, [(_dataset$selectedDise2 = dataset.selectedDisease) === null || _dataset$selectedDise2 === void 0 ? void 0 : _dataset$selectedDise2.name]);
+  const {
+    fetchedData,
+    isPending,
+    serverError
+  } = (0, _requests.useFetch)(ENDPOINT, params, {
+    enabled: !!((_params$diseaseName = params.diseaseName) !== null && _params$diseaseName !== void 0 && _params$diseaseName.length)
+  });
+  (0, _react.useEffect)(() => {
+    if (!isPending && !serverError) {
+      dispatch({
+        type: "set.disease.genes",
+        genes: fetchedData
+      });
+    }
+  }, [dispatch, fetchedData, isPending, serverError]);
+  return;
+};
+exports.useGetDisease = useGetDisease;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@haniffalab/cherita-react",
-  "version": "0.2.0-dev.2024-05-09.97c686f2",
+  "version": "0.2.0-dev.2024-05-21.ca7d726c",
   "author": "",
   "license": "",
   "main": "dist/index.js",
@@ -78,5 +78,5 @@
     "url": "https://github.com/haniffalab/cherita-react/issues"
   },
   "homepage": "https://github.com/haniffalab/cherita-react#readme",
-  "prereleaseSha": "97c686f2f71b9fd317123f14ba380ca42cbbbe7f"
+  "prereleaseSha": "ca7d726c238e548f4db9899190cd6773f79ea5d0"
 }