feat(processings): tools integrate operation generation (#4325)

Author: tpoisseau

package-lock.json

@@ -65,9 +65,9 @@
     "@hookform/resolvers": "^5.9.1",
     "@tanstack/react-form": "^1.33.5",
     "@tanstack/react-store": "^0.11.1",
-    "@zakodium/nmr-types": "^0.5.25",
-    "@zakodium/nmrium-core": "^0.7.62",
-    "@zakodium/nmrium-core-plugins": "^0.7.83",
+    "@zakodium/nmr-types": "^0.5.26",
+    "@zakodium/nmrium-core": "^0.7.64",
+    "@zakodium/nmrium-core-plugins": "^0.7.86",
     "@zakodium/pdnd-esm": "^1.1.1",
     "@zakodium/utils": "^0.5.1",
     "@zip.js/zip.js": "^2.8.53",

package.json

@@ -103,7 +103,7 @@ export function ProcessingsSectionsPanel() {
           {operatorsUI.map((operatorUI) => (
             <CoreOperatorPanelTool
               key={operatorUI.id}
-              operator={operatorUI}
+              operatorUI={operatorUI}
               activeOperatorId={selected}
               spectrum={spectrum}
               onTriggerOperation={(operation) =>

src/component/panels/filtersPanel/processings_sections_panel.tsx

@@ -536,7 +536,7 @@ export default function NMRToolbar() {
           pluginTools.map((operatorUI) => (
             <CoreOperatorTool
               key={operatorUI.id}
-              operator={operatorUI}
+              operatorUI={operatorUI}
               spectrum={stableSpectrum}
               activeOperatorId={activeOperatorId}
               onTriggerOperation={(operation) => {

src/component/toolbar/nmr_toolbar.tsx

@@ -1,41 +1,23 @@
-import type { ProcessingOperatorId } from '@zakodium/nmr-types';
-import type {
-  ProcessingOperatorUI,
-  ProcessingOperatorUIToolProps,
-} from '@zakodium/nmrium-core';
-import type { PartialPick } from '@zakodium/utils';
 import { ErrorBoundary } from 'react-error-boundary';
 
-import { useCore } from '../../context/CoreContext.tsx';
 import { ToolbarItemError } from '../toolbar_item_error.tsx';
 
-interface CoreOperatorPanelToolProps {
-  operator: ProcessingOperatorUI<ProcessingOperatorId>;
-}
+import type { CoreOperatorToolProps } from './core_operator_tool.commons.ts';
+import { useToolProps } from './core_operator_tool.commons.ts';
 
-export function CoreOperatorPanelTool(
-  props: PartialPick<
-    Omit<ProcessingOperatorUIToolProps<ProcessingOperatorId>, 'core'>,
-    'spectrum'
-  > &
-    CoreOperatorPanelToolProps,
-) {
-  const { spectrum, activeOperatorId, onTriggerOperation, operator } = props;
-  const core = useCore();
+export function CoreOperatorPanelTool(props: CoreOperatorToolProps) {
+  const { spectrum, operatorUI } = props;
+  const toolProps = useToolProps(props);
 
   if (!spectrum) return null;
-  if (!operator.PanelTool) return null;
+  if (!toolProps) return null;
+  if (!operatorUI.PanelTool) return null;
 
-  const { PanelTool } = operator;
+  const { PanelTool } = operatorUI;
 
   return (
     <ErrorBoundary FallbackComponent={ToolbarItemError}>
-      <PanelTool
-        core={core}
-        spectrum={spectrum}
-        activeOperatorId={activeOperatorId}
-        onTriggerOperation={onTriggerOperation}
-      />
+      <PanelTool {...toolProps} />
     </ErrorBoundary>
   );
 }

src/component/utility/core_slots/core_operator_panel_tool.tsx

@@ -0,0 +1,63 @@
+import type {
+  ProcessingOperatorId,
+  SpectrumProcessingOperation,
+} from '@zakodium/nmr-types';
+import type {
+  ProcessingOperatorUI,
+  ProcessingOperatorUIToolProps,
+} from '@zakodium/nmrium-core';
+import { generateID } from '@zakodium/nmrium-core';
+import type { PartialPick } from '@zakodium/utils';
+import { assertDefined, assertNotNullish } from '@zakodium/utils';
+import { useEventCallback } from 'usehooks-ts';
+
+import { useCore } from '../../context/CoreContext.tsx';
+
+interface CoreOperatorToolExtraProps {
+  operatorUI: ProcessingOperatorUI<ProcessingOperatorId>;
+  onTriggerOperation: (
+    operation: SpectrumProcessingOperation<any, any>,
+  ) => void;
+}
+
+export type CoreOperatorToolProps = PartialPick<
+  Omit<ProcessingOperatorUIToolProps, 'core' | 'onTriggerOperation'>,
+  'spectrum'
+> &
+  CoreOperatorToolExtraProps;
+
+export function useToolProps(
+  props: CoreOperatorToolProps,
+): ProcessingOperatorUIToolProps | null {
+  const {
+    spectrum,
+    activeOperatorId,
+    onTriggerOperation: onTriggerOperationProp,
+    operatorUI,
+  } = props;
+  const core = useCore();
+
+  const onTriggerOperation = useEventCallback(() => {
+    const operator = core.getOperator(operatorUI.id);
+    assertNotNullish(operator);
+    assertDefined(spectrum);
+
+    onTriggerOperationProp({
+      operatorId: operatorUI.id,
+      uid: generateID(),
+      settings: operator.getDefaultSettings(spectrum),
+      options: undefined,
+      enabled: true,
+      error: undefined,
+    });
+  });
+
+  if (!spectrum) return null;
+
+  return {
+    core,
+    spectrum,
+    activeOperatorId,
+    onTriggerOperation,
+  };
+}

src/component/utility/core_slots/core_operator_tool.commons.ts

@@ -1,41 +1,23 @@
-import type { ProcessingOperatorId } from '@zakodium/nmr-types';
-import type {
-  ProcessingOperatorUI,
-  ProcessingOperatorUIToolProps,
-} from '@zakodium/nmrium-core';
-import type { PartialPick } from '@zakodium/utils';
 import { ErrorBoundary } from 'react-error-boundary';
 
-import { useCore } from '../../context/CoreContext.tsx';
 import { ToolbarItemError } from '../toolbar_item_error.tsx';
 
-interface CoreOperatorToolProps {
-  operator: ProcessingOperatorUI<ProcessingOperatorId>;
-}
+import type { CoreOperatorToolProps } from './core_operator_tool.commons.ts';
+import { useToolProps } from './core_operator_tool.commons.ts';
 
-export function CoreOperatorTool(
-  props: PartialPick<
-    Omit<ProcessingOperatorUIToolProps<ProcessingOperatorId>, 'core'>,
-    'spectrum'
-  > &
-    CoreOperatorToolProps,
-) {
-  const { spectrum, activeOperatorId, onTriggerOperation, operator } = props;
-  const core = useCore();
+export function CoreOperatorTool(props: CoreOperatorToolProps) {
+  const { spectrum, operatorUI } = props;
+  const toolProps = useToolProps(props);
 
   if (!spectrum) return null;
-  if (!operator.Tool) return null;
+  if (!toolProps) return null;
+  if (!operatorUI.Tool) return null;
 
-  const { Tool } = operator;
+  const { Tool } = operatorUI;
 
   return (
     <ErrorBoundary FallbackComponent={ToolbarItemError}>
-      <Tool
-        core={core}
-        spectrum={spectrum}
-        activeOperatorId={activeOperatorId}
-        onTriggerOperation={onTriggerOperation}
-      />
+      <Tool {...toolProps} />
     </ErrorBoundary>
   );
 }