@complat/react-spectra-editor 1.7.0 → 1.8.0

package/dist/layer_init.js

@@ -11,18 +11,34 @@ var _reactRedux = require("react-redux");
 var _redux = require("redux");
 var _styles = require("@mui/styles");
 var _submit = require("./actions/submit");
+var _layout = require("./actions/layout");
 var _manager = require("./actions/manager");
 var _meta = require("./actions/meta");
 var _jcamp = require("./actions/jcamp");
 var _layer_prism = _interopRequireDefault(require("./layer_prism"));
 var _format = _interopRequireDefault(require("./helpers/format"));
+var _extractEntityLCMS = require("./helpers/extractEntityLCMS");
 var _multi_jcamps_viewer = _interopRequireDefault(require("./components/multi_jcamps_viewer"));
+var _hplc_viewer = _interopRequireDefault(require("./components/hplc_viewer"));
 var _curve = require("./actions/curve");
+var _hplc_ms = require("./actions/hplc_ms");
 var _jsxRuntime = require("react/jsx-runtime");
 /* eslint-disable prefer-object-spread, default-param-last */
 
 const styles = () => ({});
 class LayerInit extends _react.default.Component {
+  static entitySignature(e) {
+    if (!e) return 'none';
+    const id = e.idDt ?? e.id ?? e.datasetId;
+    if (id != null && id !== '') return `id:${id}`;
+    const firstFeature = (Array.isArray(e.features) ? e.features[0] : null) || (Array.isArray(e.spectra) ? e.spectra[0] : null) || null;
+    const data0 = firstFeature?.data?.[0];
+    const xs = data0?.x;
+    const xLen = Array.isArray(xs) ? xs.length : 0;
+    const xHead = Array.isArray(xs) && xs.length > 0 ? xs[0] : '';
+    const xTail = Array.isArray(xs) && xs.length > 0 ? xs[xs.length - 1] : '';
+    return `sig:${e.layout || ''}|${e.title || ''}|${xLen}|${xHead}|${xTail}`;
+  }
   constructor(props) {
     super(props);
     this.normChange = this.normChange.bind(this);
@@ -38,15 +54,40 @@ class LayerInit extends _react.default.Component {
     this.updateMultiEntities();
   }
   componentDidUpdate(prevProps) {
+    const {
+      others,
+      multiEntities,
+      entity,
+      operations
+    } = this.props;
     this.normChange(prevProps);
-    this.updateOthers();
-    this.updateMultiEntities();
+    if (prevProps.operations !== operations || prevProps.entity !== entity) {
+      this.initReducer();
+    }
+    if (prevProps.others !== others) {
+      this.updateOthers();
+    }
+    if (prevProps.multiEntities !== multiEntities || prevProps.entity !== entity) {
+      this.updateMultiEntities();
+    }
   }
   normChange(prevProps) {
     const {
-      entity
+      entity,
+      multiEntities,
+      clearHplcMsStateAct
     } = this.props;
     if (prevProps.entity !== entity) {
+      const prevIsLcms = _format.default.isLCMsLayout(prevProps.entity?.layout);
+      const nextIsLcms = _format.default.isLCMsLayout(entity?.layout);
+      const lcmsSessionActive = prevIsLcms && nextIsLcms && Array.isArray(multiEntities) && (0, _extractEntityLCMS.isLcMsGroup)(multiEntities);
+      if ((prevIsLcms || nextIsLcms) && !lcmsSessionActive) {
+        const prevSig = LayerInit.entitySignature(prevProps.entity);
+        const nextSig = LayerInit.entitySignature(entity);
+        if (prevSig !== nextSig) {
+          clearHplcMsStateAct();
+        }
+      }
       this.execReset();
     }
   }
@@ -60,14 +101,17 @@ class LayerInit extends _react.default.Component {
       resetInitCommonWithIntergationAct,
       resetDetectorAct,
       updateDSCMetaDataAct,
-      resetMultiplicityAct
+      resetMultiplicityAct,
+      updateLayoutAct
     } = this.props;
+    if (!entity || !entity.layout) return;
     resetInitCommonAct();
     resetDetectorAct();
     const {
       layout,
-      features
+      features = {}
     } = entity;
+    updateLayoutAct(layout);
     if (_format.default.isMsLayout(layout)) {
       // const { autoPeak, editPeak } = features; // TBD
       const autoPeak = features.autoPeak || features[0];
@@ -108,14 +152,18 @@ class LayerInit extends _react.default.Component {
       operations,
       updateOperationAct
     } = this.props;
-    updateOperationAct(operations[0]);
+    if (Array.isArray(operations) && operations.length > 0) {
+      updateOperationAct(operations[0]);
+    }
   }
   updateOthers() {
     const {
       others,
       addOthersAct
     } = this.props;
-    addOthersAct(others);
+    if (others) {
+      addOthersAct(others);
+    }
   }
   updateMultiEntities() {
     const {
@@ -123,9 +171,37 @@ class LayerInit extends _react.default.Component {
       setAllCurvesAct,
       entity
     } = this.props;
+    if (!entity || !entity.layout) return;
+    const lcmsCurveMeta = () => {
+      const uvvisFromMulti = Array.isArray(multiEntities) ? multiEntities.find(e => (0, _extractEntityLCMS.getLcMsInfo)(e).kind === 'uvvis') : null;
+      const mzFromMulti = Array.isArray(multiEntities) ? multiEntities.find(e => (0, _extractEntityLCMS.getLcMsInfo)(e).kind === 'mz') : null;
+      const idDt = uvvisFromMulti?.idDt ?? uvvisFromMulti?.id ?? uvvisFromMulti?.datasetId ?? entity?.idDt ?? entity?.id ?? entity?.datasetId ?? null;
+      const lcmsUvvisWavelength = entity?.lcms_uvvis_wavelength ?? entity?.lcmsUvvisWavelength ?? uvvisFromMulti?.lcms_uvvis_wavelength ?? uvvisFromMulti?.lcmsUvvisWavelength;
+      const lcmsMzPage = entity?.lcms_mz_page ?? entity?.lcmsMzPage ?? mzFromMulti?.lcms_mz_page ?? mzFromMulti?.lcmsMzPage ?? uvvisFromMulti?.lcms_mz_page ?? uvvisFromMulti?.lcmsMzPage;
+      const mzInfo = mzFromMulti ? (0, _extractEntityLCMS.getLcMsInfo)(mzFromMulti) : null;
+      const lcmsPolarity = entity?.lcms_polarity ?? entity?.lcmsPolarity ?? entity?.ticPolarity ?? mzFromMulti?.lcms_polarity ?? mzFromMulti?.lcmsPolarity ?? (mzInfo?.kind === 'mz' ? mzInfo.polarity : null);
+      const out = {};
+      if (idDt != null) out.idDt = idDt;
+      if (lcmsUvvisWavelength != null && lcmsUvvisWavelength !== '') {
+        out.lcmsUvvisWavelength = lcmsUvvisWavelength;
+      }
+      if (lcmsMzPage != null && lcmsMzPage !== '') {
+        out.lcmsMzPage = lcmsMzPage;
+      }
+      if (lcmsPolarity != null && lcmsPolarity !== '') {
+        out.lcmsPolarity = lcmsPolarity;
+      }
+      return Object.keys(out).length ? out : undefined;
+    };
     const isMultiSpectra = Array.isArray(multiEntities) && multiEntities.length > 1;
     if (isMultiSpectra) {
-      setAllCurvesAct(multiEntities);
+      const meta = _format.default.isLCMsLayout(entity.layout) ? lcmsCurveMeta() : undefined;
+      setAllCurvesAct(multiEntities, meta);
+      return;
+    }
+    if (_format.default.isLCMsLayout(entity.layout)) {
+      const payload = Array.isArray(multiEntities) && multiEntities.length > 0 ? multiEntities : [entity];
+      setAllCurvesAct(payload, lcmsCurveMeta());
       return;
     }
     if (_format.default.isCyclicVoltaLayout(entity.layout)) {
@@ -151,15 +227,35 @@ class LayerInit extends _react.default.Component {
       onDescriptionChanged,
       multiEntities,
       entityFileNames,
-      userManualLink
+      userManualLink,
+      onLcmsPageRequest
     } = this.props;
-    const target = entity.spectra[0];
     const {
       layout
     } = entity;
-    const xxLabel = !xLabel && xLabel === '' ? `X (${target.xUnit})` : xLabel;
-    const yyLabel = !yLabel && yLabel === '' ? `Y (${target.yUnit})` : yLabel;
+    const hasMultiEntities = Array.isArray(multiEntities) && multiEntities.length > 0;
+    const hasLcmsEntity = hasMultiEntities && multiEntities.some(multiEntity => _format.default.isLCMsLayout(multiEntity?.layout));
+    const isDetectedLcmsGroup = hasLcmsEntity && (0, _extractEntityLCMS.isLcMsGroup)(multiEntities);
+    // For multi mode, trust multiEntities over single entity to avoid mixed-layout misrouting.
+    const isLcms = hasMultiEntities ? isDetectedLcmsGroup : _format.default.isLCMsLayout(layout);
+    const target = isLcms ? null : entity.spectra && Array.isArray(entity.spectra) && entity.spectra[0] || null;
+    const xxLabel = !xLabel && xLabel === '' && target && target.xUnit ? `X (${target.xUnit})` : xLabel;
+    const yyLabel = !yLabel && yLabel === '' && target && target.yUnit ? `Y (${target.yUnit})` : yLabel;
     const isMultiSpectra = Array.isArray(multiEntities) && multiEntities.length > 1;
+    if (isLcms) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_hplc_viewer.default, {
+        entityFileNames: entityFileNames,
+        userManualLink: userManualLink,
+        molSvg: molSvg,
+        forecast: forecast,
+        operations: operations,
+        descriptions: descriptions,
+        canChangeDescription: canChangeDescription,
+        onDescriptionChanged: onDescriptionChanged,
+        editorOnly: editorOnly,
+        onLcmsPageRequest: onLcmsPageRequest
+      });
+    }
     if (isMultiSpectra) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_multi_jcamps_viewer.default, {
         multiEntities: multiEntities,
@@ -167,6 +263,8 @@ class LayerInit extends _react.default.Component {
         userManualLink: userManualLink,
         molSvg: molSvg,
         exactMass: exactMass,
+        forecast: forecast,
+        editorOnly: editorOnly,
         operations: operations,
         descriptions: descriptions,
         canChangeDescription: canChangeDescription,
@@ -180,6 +278,8 @@ class LayerInit extends _react.default.Component {
         userManualLink: userManualLink,
         molSvg: molSvg,
         exactMass: exactMass,
+        forecast: forecast,
+        editorOnly: editorOnly,
         operations: operations,
         descriptions: descriptions,
         canChangeDescription: canChangeDescription,
@@ -197,6 +297,8 @@ class LayerInit extends _react.default.Component {
       molSvg: molSvg,
       editorOnly: editorOnly,
       exactMass: exactMass,
+      entityFileNames: entityFileNames,
+      userManualLink: userManualLink,
       canChangeDescription: canChangeDescription,
       onDescriptionChanged: onDescriptionChanged
     });
@@ -213,10 +315,12 @@ const mapDispatchToProps = dispatch => (0, _redux.bindActionCreators)({
   resetDetectorAct: _manager.resetDetector,
   resetMultiplicityAct: _manager.resetMultiplicity,
   updateOperationAct: _submit.updateOperation,
+  updateLayoutAct: _layout.updateLayout,
   updateMetaPeaksAct: _meta.updateMetaPeaks,
   addOthersAct: _jcamp.addOthers,
   setAllCurvesAct: _curve.setAllCurves,
-  updateDSCMetaDataAct: _meta.updateDSCMetaData
+  updateDSCMetaDataAct: _meta.updateDSCMetaData,
+  clearHplcMsStateAct: _hplc_ms.clearHplcMsState
 }, dispatch);
 LayerInit.propTypes = {
   entity: _propTypes.default.object.isRequired,
@@ -239,17 +343,23 @@ LayerInit.propTypes = {
   resetInitMsAct: _propTypes.default.func.isRequired,
   resetInitCommonWithIntergationAct: _propTypes.default.func.isRequired,
   updateOperationAct: _propTypes.default.func.isRequired,
+  updateLayoutAct: _propTypes.default.func.isRequired,
   updateMetaPeaksAct: _propTypes.default.func.isRequired,
   addOthersAct: _propTypes.default.func.isRequired,
   canChangeDescription: _propTypes.default.bool.isRequired,
   onDescriptionChanged: _propTypes.default.func,
   // eslint-disable-line
+  onLcmsPageRequest: _propTypes.default.func,
   setAllCurvesAct: _propTypes.default.func.isRequired,
   userManualLink: _propTypes.default.object,
   // eslint-disable-line
   resetDetectorAct: _propTypes.default.func.isRequired,
   resetMultiplicityAct: _propTypes.default.func.isRequired,
-  updateDSCMetaDataAct: _propTypes.default.func.isRequired
+  updateDSCMetaDataAct: _propTypes.default.func.isRequired,
+  clearHplcMsStateAct: _propTypes.default.func.isRequired
+};
+LayerInit.defaultProps = {
+  onLcmsPageRequest: null
 };
 var _default = exports.default = (0, _reactRedux.connect)(
 // eslint-disable-line

package/dist/layer_prism.js

@@ -22,6 +22,13 @@ react/function-component-definition, react/require-default-props
 */
 
 const styles = () => ({});
+const getThresholdState = state => {
+  const curveIdx = state?.curve?.curveIdx;
+  const thresholdList = state?.threshold?.list;
+  if (!Array.isArray(thresholdList)) return {};
+  if (!Number.isInteger(curveIdx)) return thresholdList[0] || {};
+  return thresholdList[curveIdx] || thresholdList[0] || {};
+};
 const LayerPrism = ({
   entity,
   cLabel,
@@ -36,16 +43,25 @@ const LayerPrism = ({
   thresSt,
   scanSt,
   uiSt,
+  curveSt,
+  integrationSt,
   canChangeDescription,
-  onDescriptionChanged
+  onDescriptionChanged,
+  entityFileNames,
+  userManualLink
 }) => {
   const {
     topic,
     feature,
     hasEdit,
-    integration
+    integration: initialIntegration,
+    features
   } = (0, _extractParams.extractParams)(entity, thresSt, scanSt);
   if (!topic) return null;
+  const curveIdx = curveSt && Number.isFinite(curveSt.curveIdx) ? curveSt.curveIdx : 0;
+  const liveIntegrations = integrationSt && Array.isArray(integrationSt.integrations) ? integrationSt.integrations : null;
+  const liveIntegration = liveIntegrations ? liveIntegrations[curveIdx] : null;
+  const integration = liveIntegration || initialIntegration;
   const {
     viewer
   } = uiSt;
@@ -67,6 +83,7 @@ const LayerPrism = ({
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_layer_content.default, {
               topic: topic,
               feature: feature,
+              features: features || [],
               cLabel: cLabel,
               xLabel: xLabel,
               yLabel: yLabel,
@@ -95,6 +112,7 @@ const LayerPrism = ({
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_layer_content.default, {
             topic: topic,
             feature: feature,
+            features: features || [],
             cLabel: cLabel,
             xLabel: xLabel,
             yLabel: yLabel,
@@ -111,6 +129,8 @@ const LayerPrism = ({
             editorOnly: editorOnly,
             molSvg: molSvg,
             exactMass: exactMass,
+            entityFileNames: entityFileNames,
+            userManualLink: userManualLink,
             descriptions: descriptions,
             canChangeDescription: canChangeDescription,
             onDescriptionChanged: onDescriptionChanged
@@ -124,8 +144,10 @@ const mapStateToProps = (state, props) => (
 // eslint-disable-line
 {
   scanSt: state.scan,
-  thresSt: state.threshold.list[state.curve.curveIdx],
-  uiSt: state.ui
+  thresSt: getThresholdState(state),
+  uiSt: state.ui,
+  curveSt: state.curve,
+  integrationSt: state.integration.present
 });
 const mapDispatchToProps = dispatch => (0, _redux.bindActionCreators)({}, dispatch);
 LayerPrism.propTypes = {
@@ -142,8 +164,12 @@ LayerPrism.propTypes = {
   thresSt: _propTypes.default.object.isRequired,
   scanSt: _propTypes.default.object.isRequired,
   uiSt: _propTypes.default.object.isRequired,
+  curveSt: _propTypes.default.object.isRequired,
+  integrationSt: _propTypes.default.object.isRequired,
   canChangeDescription: _propTypes.default.bool.isRequired,
-  onDescriptionChanged: _propTypes.default.func
+  onDescriptionChanged: _propTypes.default.func,
+  entityFileNames: _propTypes.default.array,
+  userManualLink: _propTypes.default.object
 };
 var _default = exports.default = (0, _reactRedux.connect)(
 // eslint-disable-line

package/dist/reducers/index.js

@@ -26,6 +26,7 @@ var _reducer_voltammetry = _interopRequireDefault(require("./reducer_voltammetry
 var _reducer_curve = _interopRequireDefault(require("./reducer_curve"));
 var _reducer_axes = _interopRequireDefault(require("./reducer_axes"));
 var _reducer_detector = _interopRequireDefault(require("./reducer_detector"));
+var _reducer_hplc_ms = _interopRequireDefault(require("./reducer_hplc_ms"));
 const rootReducer = (0, _redux.combineReducers)({
   threshold: _reducer_threshold.default,
   editPeak: _reducer_edit_peak.default,
@@ -46,6 +47,7 @@ const rootReducer = (0, _redux.combineReducers)({
   cyclicvolta: _reducer_voltammetry.default,
   curve: _reducer_curve.default,
   axesUnits: _reducer_axes.default,
-  detector: _reducer_detector.default
+  detector: _reducer_detector.default,
+  hplcMs: _reducer_hplc_ms.default
 });
 var _default = exports.default = rootReducer;

package/dist/reducers/reducer_curve.js

@@ -7,6 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _action_type = require("../constants/action_type");
 var _extractParams = require("../helpers/extractParams");
+var _extractEntityLCMS = require("../helpers/extractEntityLCMS");
+var _list_layout = require("../constants/list_layout");
 var _chem = require("../helpers/chem");
 var _format = _interopRequireDefault(require("../helpers/format"));
 /* eslint-disable prefer-object-spread, default-param-last, max-len */
@@ -20,44 +22,60 @@ const setAllCurves = (state, action) => {
   const {
     payload
   } = action;
-  if (payload) {
-    const entities = payload.map((entity, idx) => {
-      const {
-        topic,
-        feature,
-        hasEdit,
-        integration,
-        multiplicity
-      } = (0, _extractParams.extractParams)(entity, {
-        isEdit: true
-      });
-      // const layout = entity.layout;
-      const {
-        layout
-      } = entity;
-      const maxminPeak = (0, _chem.Convert2MaxMinPeak)(layout, feature, 0);
-      const color = _format.default.mutiEntitiesColors(idx);
-      return {
-        layout,
-        topic,
-        feature,
-        hasEdit,
-        integration,
-        multiplicity,
-        maxminPeak,
-        color,
-        curveIdx: idx
-      };
-    });
-    return Object.assign({}, state, {
-      curveIdx: 0,
-      listCurves: entities
-    });
-  }
-  return Object.assign({}, state, {
+  if (!payload) return {
+    ...state,
     curveIdx: 0,
-    listCurves: payload
+    listCurves: []
+  };
+  const isLcmsGroup = (0, _extractEntityLCMS.isLcMsGroup)(payload);
+  const entities = payload.map((entity, idx) => {
+    const lcmsInfo = (0, _extractEntityLCMS.getLcMsInfo)(entity);
+    const layout = isLcmsGroup && lcmsInfo.kind !== 'unknown' ? _list_layout.LIST_LAYOUT.LC_MS : entity.layout;
+    const extracted = (0, _extractParams.extractParams)(entity, {
+      isEdit: true
+    }, null, {
+      forceLcms: isLcmsGroup && lcmsInfo.kind !== 'unknown'
+    });
+    const {
+      topic,
+      feature,
+      hasEdit,
+      integration,
+      multiplicity,
+      features,
+      entity: entityFromExtract,
+      spectra
+    } = extracted;
+    let finalFeatures = features;
+    if (!finalFeatures || Array.isArray(finalFeatures) && finalFeatures.length === 0) {
+      finalFeatures = entityFromExtract?.features || entity.features || [];
+    }
+    const maxminPeak = (0, _chem.Convert2MaxMinPeak)(layout, feature, 0);
+    const color = _format.default.mutiEntitiesColors(idx);
+    return {
+      layout,
+      lcmsKind: lcmsInfo.kind,
+      lcmsPolarity: lcmsInfo.polarity,
+      topic,
+      feature,
+      hasEdit,
+      integration,
+      multiplicity,
+      maxminPeak,
+      color,
+      curveIdx: idx,
+      features: finalFeatures,
+      entity: entityFromExtract || entity,
+      spectra: spectra || entity.spectra
+    };
   });
+  const maxIdx = entities.length - 1;
+  const safeCurveIdx = Math.min(state.curveIdx || 0, maxIdx);
+  return {
+    ...state,
+    curveIdx: safeCurveIdx,
+    listCurves: entities
+  };
 };
 const curveReducer = (state = initialState, action) => {
   switch (action.type) {