feat: reset automatic assignments

close #1488

src/component/panels/AutomaticAssignment/AutomaticAssignment.tsx

@@ -1,16 +1,17 @@
 /** @jsxImportSource @emotion/react */
 import { SvgNmrAssignment2 } from 'cheminfo-font';
+import { FaBolt } from 'react-icons/fa';
 
 import Button from '../../elements/ButtonToolTip';
 import { tablePanelStyle } from '../extra/BasicPanelStyle';
 import DefaultPanelHeader from '../header/DefaultPanelHeader';
 import { SpectraAutomaticPickingButton } from '../header/SpectraAutomaticPickingButton';
 
 import AutomaticAssignmentTable from './AutomaticAssignmentTable';
-import { useGetAssignments } from './useGetAssignments';
+import { useAutoAssignments } from './useAutoAssignments';
 
 function AutomaticAssignment() {
-  const { getAssignments, assignments } = useGetAssignments();
+  const { getAssignments, assignments, restAssignments } = useAutoAssignments();
   return (
     <div css={tablePanelStyle}>
       {
@@ -19,6 +20,9 @@ function AutomaticAssignment() {
           <Button popupTitle="automatic assignment" onClick={getAssignments}>
             <SvgNmrAssignment2 style={{ fontSize: '18px' }} />
           </Button>
+          <Button popupTitle="reset assignment" onClick={restAssignments}>
+            <FaBolt />
+          </Button>
         </DefaultPanelHeader>
       }
 

src/component/panels/AutomaticAssignment/AutomaticAssignmentTable.tsx

@@ -7,13 +7,13 @@ import { CustomColumn } from '../../elements/ReactTable/utility/addCustomColumn'
 import { SET_AUTOMATIC_ASSIGNMENTS } from '../../reducer/types/Types';
 import NoTableData from '../extra/placeholder/NoTableData';
 
-import { AutoAssignmentsData } from './useGetAssignments';
+import { AutoAssignmentsData } from './useAutoAssignments';
 
 interface AutomaticAssignmentTableProps {
   data: AutoAssignmentsData[];
 }
 
-function PeaksTable({ data }: AutomaticAssignmentTableProps) {
+function AutomaticAssignmentTable({ data }: AutomaticAssignmentTableProps) {
   const dispatch = useDispatch();
 
   const assignHandler = useCallback(
@@ -77,4 +77,4 @@ function PeaksTable({ data }: AutomaticAssignmentTableProps) {
   );
 }
 
-export default memo(PeaksTable);
+export default memo(AutomaticAssignmentTable);

src/component/panels/AutomaticAssignment/useGetAssignments.ts → src/component/panels/AutomaticAssignment/useAutoAssignments.ts

@@ -5,7 +5,7 @@ import {
   SpectraData2D,
 } from 'nmr-processing';
 import OCL from 'openchemlib/full';
-import { useCallback, useMemo, useState } from 'react';
+import { useCallback, useMemo, useRef, useState } from 'react';
 
 import { Datum1D } from '../../../data/types/data1d';
 import { Datum2D } from '../../../data/types/data2d/Datum2D';
@@ -34,17 +34,30 @@ function mapSpectra(data: (Datum1D | Datum2D)[]) {
   }, []);
 }
 
-export function useGetAssignments() {
+export function useAutoAssignments() {
   const dispatch = useDispatch();
   const { data, molecules } = useChartData();
+  const originData = useRef<SpectraData[]>();
   const alert = useAlert();
   const [assignments, setAssignments] = useState<AutoAssignmentsData[]>([]);
 
+  const restAssignments = useCallback(() => {
+    dispatch({
+      type: SET_AUTOMATIC_ASSIGNMENTS,
+      payload: { assignments: originData.current },
+    });
+  }, [dispatch]);
+
   const getAssignments = useCallback(() => {
     void (async () => {
       const hideLoading = await alert.showLoading('Auto Assignments');
       const molecule = OCL.Molecule.fromMolfile(molecules[0]?.molfile || '');
       const spectra = mapSpectra(data);
+
+      if (!originData.current) {
+        originData.current = spectra;
+      }
+
       const result = await getAssignmentsData(
         {
           spectra,
@@ -66,8 +79,9 @@ export function useGetAssignments() {
     () => ({
       getAssignments,
       assignments,
+      restAssignments,
     }),
 
-    [assignments, getAssignments],
+    [assignments, getAssignments, restAssignments],
   );
 }