From d43911d786b46eab03a1347f3c4c3ace79d24903 Mon Sep 17 00:00:00 2001
From: hamed musallam <hamed.musallam@gmail.com>
Date: Tue, 9 Jul 2024 13:30:33 +0200
Subject: [PATCH] fix: apply zero filling on the fly when opening its options
 panel

---
 .../header/ZeroFillingOptionsPanel.tsx        | 33 +++++++++++++------
 1 file changed, 23 insertions(+), 10 deletions(-)

diff --git a/src/component/header/ZeroFillingOptionsPanel.tsx b/src/component/header/ZeroFillingOptionsPanel.tsx
index 369ab44e6..0cfeb86d0 100644
--- a/src/component/header/ZeroFillingOptionsPanel.tsx
+++ b/src/component/header/ZeroFillingOptionsPanel.tsx
@@ -1,7 +1,7 @@
 import { Checkbox } from '@blueprintjs/core';
 import { NmrData1D } from 'cheminfo-types';
 import { Filters } from 'nmr-processing';
-import { memo, useRef } from 'react';
+import { memo, useCallback, useEffect, useRef } from 'react';
 import { useForm } from 'react-hook-form';
 
 import generateNumbersPowerOfX from '../../data/utilities/generateNumbersPowerOfX';
@@ -36,6 +36,23 @@ function ZeroFillingOptionsInnerPanel(props: { size: number }) {
     defaultValues: { nbPoints: size, livePreview: true },
   });
 
+  const onChange = useCallback(
+    (values) => {
+      const { livePreview, ...options } = values;
+
+      if (livePreview || previousPreviewRef !== livePreview) {
+        dispatch({
+          type: 'CALCULATE_ZERO_FILLING_FILTER',
+          payload: {
+            options,
+            livePreview,
+          },
+        });
+      }
+    },
+    [dispatch],
+  );
+
   function handleApplyFilter(
     values,
     triggerSource: 'apply' | 'onChange' = 'apply',
@@ -43,15 +60,7 @@ function ZeroFillingOptionsInnerPanel(props: { size: number }) {
     const { livePreview, ...options } = values;
     switch (triggerSource) {
       case 'onChange': {
-        if (livePreview || previousPreviewRef !== livePreview) {
-          dispatch({
-            type: 'CALCULATE_ZERO_FILLING_FILTER',
-            payload: {
-              options,
-              livePreview,
-            },
-          });
-        }
+        onChange(values);
         break;
       }
 
@@ -83,6 +92,10 @@ function ZeroFillingOptionsInnerPanel(props: { size: number }) {
     void handleSubmit((values) => handleApplyFilter(values, triggerSource))();
   }
 
+  useEffect(() => {
+    void handleSubmit((values) => onChange(values))();
+  }, [handleSubmit, onChange]);
+
   return (
     <HeaderContainer>
       <Label title="Size:" style={headerLabelStyle}>