feat: sort spectra by specific parameter

close #3232
cheminfo · Oct 22, 2024 · 1ccb784 · 1ccb784
1 parent a3db8cf
commit 1ccb784
Show file tree

Hide file tree

Showing 4 changed files with 84 additions and 2 deletions.
diff --git a/src/component/panels/multipleAnalysisPanel/AnalysisChart.tsx b/src/component/panels/multipleAnalysisPanel/AnalysisChart.tsx
@@ -8,6 +8,7 @@ import { Button } from 'react-science/ui';
 
 import type { SpectraAnalysisData } from '../../../data/data1d/multipleSpectraAnalysis.js';
 import { useChartData } from '../../context/ChartContext.js';
+import { useDispatch } from '../../context/DispatchContext.js';
 import { useToaster } from '../../context/ToasterContext.js';
 import { Input2 } from '../../elements/Input2.js';
 import Label from '../../elements/Label.js';
@@ -97,6 +98,7 @@ function getAnalysisColumnsPaths(spectraAnalysisData: SpectraAnalysisData) {
 export default function AnalysisChart(props: PlotChartPros) {
   const { spectraAnalysisData } = props;
   const { data } = useChartData();
+  const dispatch = useDispatch();
   const toaster = useToaster();
   const chartParentRef = useRef<HTMLDivElement>(null);
   const [plotOptions, setPlotOptions] = useState<PlotAxisOptions>({
@@ -140,6 +142,15 @@ export default function AnalysisChart(props: PlotChartPros) {
   const xLabel = paths?.[plotOptions.xPath]?.at(-1) || '';
   const yLabel = paths?.[plotOptions.yPath]?.at(-1) || '';
 
+  function handleSort(path) {
+    dispatch({ type: 'SORT_SPECTRA', payload: { path } });
+  }
+
+  const disabledXPath =
+    !plotOptions.xPath || plotOptions.xPath?.split('.').length === 1;
+  const disabledYPath =
+    !plotOptions.yPath || plotOptions.yPath?.split('.').length === 1;
+
   return (
     <div>
       <div style={{ display: 'flex', padding: '5px' }}>
@@ -149,6 +160,14 @@ export default function AnalysisChart(props: PlotChartPros) {
             value={plotOptions.xPath}
             filterItems={datalist}
             onChange={handleChangeKey}
+            rightElement={
+              <Button
+                disabled={disabledXPath}
+                icon="sort-alphabetical"
+                outlined
+                onClick={() => handleSort(plotOptions.xPath)}
+              />
+            }
           />
         </Label>
         <Label title="Y" style={{ container: { paddingLeft: '5px' } }}>
@@ -157,6 +176,14 @@ export default function AnalysisChart(props: PlotChartPros) {
             value={plotOptions.yPath}
             filterItems={datalist}
             onChange={handleChangeKey}
+            rightElement={
+              <Button
+                disabled={disabledYPath}
+                icon="sort-alphabetical"
+                outlined
+                onClick={() => handleSort(plotOptions.yPath)}
+              />
+            }
           />
         </Label>
         <Button

diff --git a/src/component/reducer/Reducer.ts b/src/component/reducer/Reducer.ts
@@ -581,6 +581,8 @@ function innerSpectrumReducer(draft: Draft<State>, action: Action) {
         return SpectraActions.handleSimulateSpectrum(draft, action);
       case 'UPDATE_SPECTRUM_META':
         return SpectraActions.handleUpdateSpectrumMeta(draft, action);
+      case 'SORT_SPECTRA':
+        return SpectraActions.handleSortSpectra(draft, action);
 
       case 'SET_SELECTED_TOOL':
         return ToolsActions.setSelectedTool(draft, action);

diff --git a/src/component/reducer/actions/SpectraActions.ts b/src/component/reducer/actions/SpectraActions.ts
@@ -36,6 +36,7 @@ import {
 } from '../../../data/utilities/generateColor.js';
 import groupByInfoKey from '../../utility/GroupByInfoKey.js';
 import { getSpectraByNucleus } from '../../utility/getSpectraByNucleus.js';
+import nucleusToString from '../../utility/nucleusToString.js';
 import type { State } from '../Reducer.js';
 import { setZoom } from '../helper/Zoom1DManager.js';
 import { getActiveSpectra } from '../helper/getActiveSpectra.js';
@@ -159,6 +160,12 @@ type UpdateSpectrumMetaAction = ActionType<
     meta: Record<string, string>;
   }
 >;
+type SortSpectraAction = ActionType<
+  'SORT_SPECTRA',
+  {
+    path: string;
+  }
+>;
 
 export type SpectrumActions =
   | ActionType<'TOGGLE_SPECTRA_LEGEND'>
@@ -174,7 +181,8 @@ export type SpectrumActions =
   | ReColorSpectraBasedOnDistinctValueAction
   | OrderSpectraAction
   | SimulateSpectrumAction
-  | UpdateSpectrumMetaAction;
+  | UpdateSpectrumMetaAction
+  | SortSpectraAction;
 
 const { applyFilter } = FiltersManager;
 function checkIsVisible2D(datum: Spectrum2D): boolean {
@@ -781,6 +789,50 @@ function handleUpdateSpectrumMeta(
 
   draft.data[activeSpectrum.index].customInfo = meta;
 }
+function handleSortSpectra(draft: Draft<State>, action: SortSpectraAction) {
+  const {
+    payload: { path },
+  } = action;
+  const {
+    spectra: { activeTab },
+  } = draft.view;
+
+  const sortedSpectra: Array<{
+    spectrum: Spectrum;
+    sortValue: string | number;
+  }> = [];
+  const originIndexes: number[] = [];
+  for (let index = 0; index < draft.data.length; index++) {
+    const spectrum = draft.data[index];
+    if (nucleusToString(spectrum.info.nucleus) === activeTab) {
+      sortedSpectra.push({
+        spectrum,
+        sortValue: lodashGet(spectrum, path),
+      });
+      originIndexes.push(index);
+    }
+  }
+
+  sortedSpectra.sort((a, b) => {
+    if (typeof a.sortValue === 'string' && typeof b.sortValue === 'string') {
+      return a.sortValue.localeCompare(b.sortValue);
+    }
+
+    if (typeof a.sortValue === 'number' && typeof b.sortValue === 'number') {
+      return a.sortValue - b.sortValue;
+    }
+
+    if (typeof a.sortValue === 'boolean' && typeof b.sortValue === 'boolean') {
+      return a.sortValue === b.sortValue ? 0 : a.sortValue ? -1 : 1;
+    }
+
+    return 0;
+  });
+
+  for (let index = 0; index < sortedSpectra.length; index++) {
+    draft.data[originIndexes[index]] = sortedSpectra[index].spectrum;
+  }
+}
 
 export {
   handleChangeSpectrumVisibilityById,
@@ -798,4 +850,5 @@ export {
   handleSimulateSpectrum,
   setSpectraMetaInfo,
   handleUpdateSpectrumMeta,
+  handleSortSpectra,
 };
diff --git a/src/component/reducer/preferences/preferencesReducer.ts b/src/component/reducer/preferences/preferencesReducer.ts
@@ -30,7 +30,6 @@ import { changeInformationBlockPosition } from './actions/changeInformationBlock
 import { changePeaksLabelPosition } from './actions/changePeaksLabelPosition.js';
 import { changePrintPageSettings } from './actions/changePrintPageSettings.js';
 import { initPreferences } from './actions/initPreferences.js';
-import type { MatrixGenerationActions } from './actions/matrixGeneration.js';
 import {
   addExclusionZone,
   changeMatrixGenerationScale,
@@ -39,6 +38,7 @@ import {
   setMatrixGenerationOptions,
   toggleMatrixGenerationViewProperty,
 } from './actions/matrixGeneration.js';
+import type { MatrixGenerationActions } from './actions/matrixGeneration.js';
 import { removeWorkspace } from './actions/removeWorkspace.js';
 import { setActiveWorkspace } from './actions/setActiveWorkspace.js';
 import { setPanelsPreferences } from './actions/setPanelsPreferences.js';