feat: export ranges as TSV file

cheminfo · Jul 19, 2024 · cea8135 · cea8135
1 parent 9c59558
commit cea8135
Show file tree

Hide file tree

Showing 3 changed files with 70 additions and 11 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -92,7 +92,7 @@
     "multiplet-analysis": "^2.1.2",
     "nmr-correlation": "^2.3.3",
     "nmr-load-save": "^0.34.2",
-    "nmr-processing": "^12.7.1",
+    "nmr-processing": "^12.8.0",
     "nmredata": "^0.9.11",
     "numeral": "^2.0.6",
     "openchemlib": "^8.14.0",

diff --git a/src/component/panels/RangesPanel/RangesHeader.tsx b/src/component/panels/RangesPanel/RangesHeader.tsx
@@ -3,10 +3,18 @@ import {
   SvgNmrPeaks,
   SvgNmrPeaksTopLabels,
 } from 'cheminfo-font';
+import { saveAs } from 'file-saver';
 import lodashGet from 'lodash/get';
 import { RangesViewState } from 'nmr-load-save';
-import { rangesToACS } from 'nmr-processing';
-import { FaFileExport, FaUnlink, FaSitemap, FaChartBar } from 'react-icons/fa';
+import { rangesToACS, rangesToTSV } from 'nmr-processing';
+import {
+  FaFileExport,
+  FaUnlink,
+  FaSitemap,
+  FaChartBar,
+  FaCopy,
+  FaDownload,
+} from 'react-icons/fa';
 import { ImLink } from 'react-icons/im';
 import { LuSubtitles } from 'react-icons/lu';
 
@@ -15,6 +23,10 @@ import { useClipboard } from '../../../utils/clipboard/clipboardHooks';
 import { useAssignmentData } from '../../assignment/AssignmentsContext';
 import { useDispatch } from '../../context/DispatchContext';
 import { useToaster } from '../../context/ToasterContext';
+import {
+  ToolbarPopoverItem,
+  ToolbarPopoverMenuItem,
+} from '../../elements/ToolbarPopoverItem';
 import { useModal } from '../../elements/popup/Modal';
 import { useActiveSpectrumRangesViewState } from '../../hooks/useActiveSpectrumRangesViewState';
 import { usePanelPreferences } from '../../hooks/usePanelPreferences';
@@ -24,6 +36,29 @@ import { booleanToString } from '../../utility/booleanToString';
 import { FilterType } from '../../utility/filterType';
 import DefaultPanelHeader from '../header/DefaultPanelHeader';
 
+type ExportRangesType = 'publicationString' | 'rangesToTSV';
+interface ExportData {
+  id: ExportRangesType;
+}
+type ExportItem = ToolbarPopoverMenuItem<ExportData>;
+
+const EXPORT_MENU: ExportItem[] = [
+  {
+    icon: <FaCopy />,
+    text: 'Preview publication string',
+    data: {
+      id: 'publicationString',
+    },
+  },
+  {
+    icon: <FaDownload />,
+    text: 'Export ranges as TSV',
+    data: {
+      id: 'rangesToTSV',
+    },
+  },
+] as const;
+
 function RangesHeader({
   ranges,
   info,
@@ -162,6 +197,25 @@ function RangesHeader({
     dispatch({ type: 'TOGGLE_RANGES_PEAKS_DISPLAYING_MODE' });
   }
 
+  function handleRangesToTSV() {
+    const tsv = rangesToTSV(ranges.values);
+    const blob = new Blob([tsv], { type: 'text/plain' });
+    saveAs(blob, `${info.name}.tsv`);
+  }
+
+  function exportHandler(data?: ExportData) {
+    switch (data?.id) {
+      case 'publicationString':
+        saveAsHTMLHandler();
+        break;
+      case 'rangesToTSV':
+        handleRangesToTSV();
+        break;
+      default:
+        break;
+    }
+  }
+
   const hasRanges = Array.isArray(ranges?.values) && ranges.values.length > 0;
   const total = ranges?.values?.length || 0;
   return (
@@ -178,10 +232,15 @@ function RangesHeader({
         onSettingClick={onSettingClick}
         leftButtons={[
           {
-            disabled: !hasRanges,
-            icon: <FaFileExport />,
-            tooltip: 'Preview publication string',
-            onClick: saveAsHTMLHandler,
+            component: (
+              <ToolbarPopoverItem<ExportData>
+                disabled={!hasRanges}
+                icon={<FaFileExport />}
+                tooltip="Export as"
+                options={EXPORT_MENU}
+                onClick={exportHandler}
+              />
+            ),
           },
           {
             component: (