chore: remove docsBaseUrl and refactor constants

BREAKING CHANGE: The docsBaseUrl prop was removed. Documentation will always be at https://docs.nmrium.org

src/component/NMRium.tsx

@@ -20,6 +20,7 @@ import { ErrorBoundary } from 'react-error-boundary';
 import SplitPane from 'react-split-pane';
 import { useToggle, useFullscreen } from 'react-use';
 
+import { helpList } from '../constants';
 import { Datum1D } from '../data/data1d/Spectrum1D';
 import { Datum2D } from '../data/data2d/Spectrum2D';
 import checkModifierKeyActivated from '../data/utilities/checkModifierKeyActivated';
@@ -29,7 +30,6 @@ import Viewer2D from './2d/Viewer2D';
 import ErrorOverlay from './ErrorOverlay';
 import KeysListenerTracker from './EventsTrackers/KeysListenerTracker';
 import { AssignmentProvider } from './assignment';
-import helpList from './constants/help';
 import { ChartDataProvider } from './context/ChartContext';
 import { DispatchProvider } from './context/DispatchContext';
 import { GlobalProvider } from './context/GlobalContext';
@@ -144,7 +144,6 @@ export enum NMRiumMode {
 
 export interface NMRiumProps {
   data?: NMRiumData;
-  docsBaseUrl?: string;
   onDataChange?: (data: any) => void;
   mode?: NMRiumMode;
   preferences?: NMRiumPreferences;
@@ -207,7 +206,6 @@ function NMRium({
   data: dataProp,
   mode,
   onDataChange,
-  docsBaseUrl,
   preferences,
   getSpinner = defaultGetSpinner,
   emptyText = undefined,
@@ -222,7 +220,6 @@ function NMRium({
   });
   const [isRightPanelHide, hideRightPanel] = useState(false);
   const [isResizeEventStart, setResizeEventStart] = useState(false);
-  const [helpData, setHelpData] = useState(helpList);
 
   const [state, dispatch] = useReducer<Reducer<any, any>>(
     spectrumReducer,
@@ -259,22 +256,16 @@ function NMRium({
       payload: {
         display: preferences,
         mode,
-        docsBaseUrl,
         dispatch: dispatchPreferences,
       },
     });
-  }, [preferences, docsBaseUrl, mode]);
+  }, [preferences, mode]);
 
   useEffect(() => {
     dispatchMiddleWare({ type: SET_LOADING_FLAG, isLoading: true });
     dispatchMiddleWare({ type: INITIATE, payload: dataProp });
   }, [dataProp, dispatchMiddleWare]);
 
-  useEffect(() => {
-    // setBaseUrl(docsBaseUrl);
-    setHelpData(helpList(docsBaseUrl));
-  }, [docsBaseUrl]);
-
   const handleSplitPanelDragFinished = useCallback(
     (size) => {
       if (size && !isRightPanelHide) {
@@ -326,7 +317,7 @@ function NMRium({
           >
             {/* @ts-expect-error: TODO remove when HelpProvider is migrated */}
             <HelpProvider
-              data={helpData}
+              data={helpList}
               wrapperRef={elementsWraperRef.current}
               preventAutoHelp={preventAutoHelp}
             >
@@ -431,7 +422,6 @@ function NMRium({
 }
 
 NMRium.propTypes = {
-  docsBaseUrl: PropTypes.string,
   onDataChange: PropTypes.func,
   mode: PropTypes.oneOf(Object.values(NMRiumMode)),
   preferences: PropTypes.shape({
@@ -469,7 +459,6 @@ NMRium.propTypes = {
 };
 
 NMRium.defaultProps = {
-  docsBaseUrl: 'https://docs.nmrium.org',
   onDataChange: () => null,
   mode: NMRiumMode.DEFAULT,
   preferences: {},

src/component/header/Header.tsx

@@ -9,8 +9,8 @@ import {
   FaQuestionCircle,
 } from 'react-icons/fa';
 
+import { docsBaseUrl } from '../../constants';
 import { useChartData } from '../context/ChartContext';
-import { usePreferences } from '../context/PreferencesContext';
 import Button from '../elements/ButtonToolTip';
 import { useAlert } from '../elements/popup/Alert';
 import { useHelp } from '../elements/popup/Help';
@@ -86,7 +86,6 @@ function Header(props: HeaderProps) {
   const {
     toolOptions: { selectedOptionPanel },
   } = useChartData();
-  const { docsBaseUrl } = usePreferences();
 
   const modal = useModal();
   const alert = useAlert();
@@ -127,9 +126,6 @@ function Header(props: HeaderProps) {
       },
     );
   }, [alert, modal]);
-  const openUserManual = useCallback(() => {
-    window.open(docsBaseUrl, '_blank');
-  }, [docsBaseUrl]);
 
   const openAboutUs = useCallback(() => {
     modal.show(<AboutUsModal />, {
@@ -156,7 +152,7 @@ function Header(props: HeaderProps) {
         <Button
           popupTitle="User Manual"
           popupPlacement="left"
-          onClick={openUserManual}
+          onClick={() => window.open(docsBaseUrl, '_blank')}
           className="windowButton"
         >
           <FaQuestionCircle />

src/component/reducer/helper/Spectrum1DZoomHelper.ts

@@ -1,9 +1,8 @@
-import initSetting from '../../constants/InitSetting';
 import { getLocalStorage, getValue } from '../../utility/LocalStorage';
 
 export const zoomDefaultValues = {
-  lowStep: initSetting.controllers.mws.low,
-  highStep: initSetting.controllers.mws.high,
+  lowStep: 2,
+  highStep: 20,
   speedThreshold: 3,
 };
 

src/component/reducer/preferencesReducer.ts

@@ -51,7 +51,6 @@ export const preferencesInitialState = {
     panels: {},
   },
   dispatch: null,
-  docsBaseUrl: null,
 };
 
 function mapNucleus(draft) {
@@ -85,7 +84,7 @@ export function preferencesReducer(state, action) {
 
       return produce(state, (draft) => {
         if (action.payload) {
-          const { dispatch, docsBaseUrl, mode, ...resProps } = action.payload;
+          const { dispatch, mode, ...resProps } = action.payload;
 
           draft.basePreferences = lodashMerge(
             {},
@@ -111,10 +110,9 @@ export function preferencesReducer(state, action) {
             hiddenFeatures,
           );
           draft.dispatch = dispatch;
-          draft.docsBaseUrl = docsBaseUrl;
           if (localData) {
             Object.entries(localData).forEach(([k, v]) => {
-              if (!['dispatch', 'docsBaseUrl', 'basePreferences'].includes(k)) {
+              if (!['dispatch', 'basePreferences'].includes(k)) {
                 draft[k] = lodashMerge({}, resProps[k] ? resProps[k] : {}, v);
               }
             });

src/constants.ts

@@ -0,0 +1,24 @@
+export const docsBaseUrl = 'https://docs.nmrium.org';
+
+export const helpList: Record<string, { text: string; filePath: string }> = {
+  zoomIn: {
+    text: 'Zoom Tool',
+    filePath: `${docsBaseUrl}/help/zoom-and-scale`,
+  },
+  peakPicking: {
+    text: 'peak picking tool',
+    filePath: `${docsBaseUrl}/help/peaks`,
+  },
+  integralPicking: {
+    text: 'integral tool',
+    filePath: `${docsBaseUrl}/help/integrations`,
+  },
+  fullScreen: {
+    text: 'Full Screen mode',
+    filePath: `${docsBaseUrl}/help/general`,
+  },
+  loadSpectrum: {
+    text: 'load spectrums',
+    filePath: `${docsBaseUrl}/help/loading-a-spectrum`,
+  },
+};