feat: add lcms layout

.github/workflows/e2e_testing.yml

@@ -10,6 +10,6 @@ jobs:
       - name: Cypress run
         uses: cypress-io/github-action@v6
         with:
-          build: npm run build
-          start: npm start
+          build: npm run --max_old_space_size=12288 build
+          start: npm --max_old_space_size=12288 start
           browser: chrome

cypress.config.ts

@@ -1,10 +1,16 @@
 import { defineConfig } from "cypress";
 
 export default defineConfig({
+  pageLoadTimeout: 100000,
+  requestTimeout: 100000,
+  responseTimeout: 100000,
   e2e: {
     setupNodeEvents(on, config) {
       // implement node event listeners here
     },
-    experimentalStudio: true
+    experimentalStudio: true,
+    pageLoadTimeout: 100000,
+    requestTimeout: 100000,
+    responseTimeout: 100000,
   },
 });

cypress/e2e/nmr1h_spec.cy.ts

@@ -70,7 +70,7 @@ describe('NMR 1H', () => {
     cy.get('.btn-sv-bar-spctrum').click()
     cy.get('.input-sv-bar-layout').click()
     cy.get('.option-sv-bar-layout').should($li => {
-      expect($li).to.have.length(24)
+      expect($li).to.have.length(25)
     })
     cy.get('ul li:nth-child(9)').click()
 

dist/actions/hplcms.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.selectWavelength = exports.changeTic = void 0;
+var _action_type = require("../constants/action_type");
+const selectWavelength = payload => ({
+  type: _action_type.HPLC_MS.UPDATE_UVVIS_WAVE_LENGTH,
+  payload
+});
+exports.selectWavelength = selectWavelength;
+const changeTic = payload => ({
+  type: _action_type.HPLC_MS.SELECT_TIC_CURVE,
+  payload
+});
+exports.changeTic = changeTic;

dist/components/cmd_bar/08_peak_group.js

@@ -0,0 +1,76 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactRedux = require("react-redux");
+var _redux = require("redux");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _withStyles = _interopRequireDefault(require("@mui/styles/withStyles"));
+var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
+var _Troubleshoot = _interopRequireDefault(require("@mui/icons-material/Troubleshoot"));
+var _ui = require("../../actions/ui");
+var _common = require("./common");
+var _list_ui = require("../../constants/list_ui");
+var _format = _interopRequireDefault(require("../../helpers/format"));
+/* eslint-disable prefer-object-spread, react/function-component-definition */
+
+const styles = () => Object.assign({}, _common.commonStyle);
+const PeakGroup = _ref => {
+  let {
+    classes,
+    feature,
+    isSelectingGroupSt,
+    setUiSweepTypeAct,
+    graphIndex
+  } = _ref;
+  const {
+    operation
+  } = feature;
+  const {
+    layout
+  } = operation;
+  if (!_format.default.isLCMsLayout(layout)) {
+    return null;
+  }
+  const onSelectPeakGroup = () => {
+    const payload = {
+      graphIndex,
+      sweepType: _list_ui.LIST_UI_SWEEP_TYPE.PEAK_GROUP_SELECT
+    };
+    setUiSweepTypeAct(payload);
+  };
+  return /*#__PURE__*/_react.default.createElement("span", {
+    className: classes.group,
+    "data-testid": "Zoom"
+  }, /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
+    title: /*#__PURE__*/_react.default.createElement("span", {
+      className: "txt-sv-tp"
+    }, "Select peak group")
+  }, /*#__PURE__*/_react.default.createElement(_common.MuButton, {
+    className: (0, _classnames.default)((0, _common.focusStyle)(isSelectingGroupSt, classes), 'btn-sv-bar-zoomin'),
+    onClick: onSelectPeakGroup
+  }, /*#__PURE__*/_react.default.createElement(_Troubleshoot.default, {
+    className: (0, _classnames.default)(classes.icon, classes.iconWp)
+  }))));
+};
+const mapStateToProps = (state, _) => (
+// eslint-disable-line
+{
+  isSelectingGroupSt: state.ui.sweepType === _list_ui.LIST_UI_SWEEP_TYPE.PEAK_GROUP_SELECT
+});
+const mapDispatchToProps = dispatch => (0, _redux.bindActionCreators)({
+  setUiSweepTypeAct: _ui.setUiSweepType
+}, dispatch);
+PeakGroup.propTypes = {
+  classes: _propTypes.default.object.isRequired,
+  feature: _propTypes.default.object.isRequired,
+  isSelectingGroupSt: _propTypes.default.bool.isRequired,
+  setUiSweepTypeAct: _propTypes.default.func.isRequired,
+  graphIndex: _propTypes.default.number.isRequired
+};
+var _default = exports.default = (0, _redux.compose)((0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps), (0, _withStyles.default)(styles))(PeakGroup);

dist/components/cmd_bar/r01_layout.js

@@ -144,6 +144,10 @@ const layoutSelect = (classes, layoutSt, updateLayoutAct) => {
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _classnames.default)(classes.txtOpt, 'option-sv-bar-layout')
   }, "MS")), /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
+    value: _list_layout.LIST_LAYOUT.LC_MS
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _classnames.default)(classes.txtOpt, 'option-sv-bar-layout')
+  }, "LC/MS")), /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     value: _list_layout.LIST_LAYOUT.CYCLIC_VOLTAMMETRY
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _classnames.default)(classes.txtOpt, 'option-sv-bar-layout')

dist/components/cmd_bar/r05_submit_btn.js

@@ -16,6 +16,7 @@ var _styles = require("@mui/styles");
 var _chem = require("../../helpers/chem");
 var _common = require("./common");
 var _extractPeaksEdit = require("../../helpers/extractPeaksEdit");
+var _format = _interopRequireDefault(require("../../helpers/format"));
 /* eslint-disable prefer-object-spread, function-paren-newline,
 react/function-component-definition, function-call-argument-newline,
 react/require-default-props */
@@ -70,7 +71,7 @@ const BtnSubmit = _ref => {
   } = _ref;
   const peaksEdit = (0, _extractPeaksEdit.extractPeaksEdit)(feature, editPeakSt, thresSt, shiftSt, layoutSt);
   // const disBtn = peaksEdit.length === 0 || statusSt.btnSubmit || disabled;
-  const scan = (0, _chem.Convert2Scan)(feature, scanSt);
+  const scan = _format.default.isMsLayout(layoutSt) ? (0, _chem.Convert2Scan)(feature, scanSt) : 0;
   const thres = (0, _chem.Convert2Thres)(feature, thresSt);
   const aucValues = (0, _extractPeaksEdit.extractAreaUnderCurve)(allIntegrationSt, integrationSt, layoutSt);
   const {

dist/components/cmd_bar/r06_predict_btn.js

@@ -156,7 +156,7 @@ const BtnPredict = _ref => {
   if (!(is13Cor1H || isIr)) return null;
   const oriPeaksEdit = (0, _extractPeaksEdit.extractPeaksEdit)(feature, editPeakSt, thresSt, shiftSt, layoutSt);
   const peaksEdit = _format.default.rmShiftFromPeaks(oriPeaksEdit, shiftSt);
-  const scan = (0, _chem.Convert2Scan)(feature, scanSt);
+  const scan = _format.default.isMsLayout(layoutSt) ? (0, _chem.Convert2Scan)(feature, scanSt) : 0;
   const thres = (0, _chem.Convert2Thres)(feature, thresSt);
   const simuCount = simulationSt.nmrSimPeaks.length;
   const uniqCount = [...new Set(simulationSt.nmrSimPeaks)].length;

dist/components/common/draw.js

@@ -5,8 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.drawMain = exports.drawLabel = exports.drawDisplay = exports.drawDestroy = exports.drawArrowOnCurve = void 0;
 const d3 = require('d3');
-const drawMain = (klass, w, h) => {
-  d3.select(klass).append('svg').attr('class', 'd3Svg').attr('preserveAspectRatio', 'xMinYMin meet').attr('viewBox', `0 0 ${w} ${h}`);
+const drawMain = function (klass, w, h) {
+  let d3svgClass = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'd3Svg';
+  d3.select(klass).append('svg').attr('class', d3svgClass).attr('preserveAspectRatio', 'xMinYMin meet').attr('viewBox', `0 0 ${w} ${h}`);
 };
 exports.drawMain = drawMain;
 const drawLabel = (klass, cLabel, xLabel, yLabel) => {