fix: crash when add spectra filter

close #1083
cheminfo · May 17, 2021 · 1a6ab62 · 1a6ab62
1 parent d9a42e3
commit 1a6ab62
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 16 deletions.
diff --git a/src/component/modal/ModalStyle.js b/src/component/modal/ModalStyle.js
@@ -47,7 +47,7 @@ export const ModalStyles = css`
   }
 
   .primary {
-    background-color: #d5d5d5;
+    background-color: #e2e2e2;
   }
 
   .footer-container {

diff --git a/src/component/modal/MultipleSpectraFiltersModal/index.jsx b/src/component/modal/MultipleSpectraFiltersModal/index.jsx
@@ -68,20 +68,23 @@ function MultipleSpectraFiltersModal({ onClose, nucleus }) {
 
     return baseList.concat(list);
   }, [nucleus]);
-  const handleSave = useCallback(() => {
+  const handleSave = useCallback((e) => {
+    e.preventDefault();
     if (refForm.current) {
       refForm.current.submitForm();
     }
   }, []);
 
   const submitHandler = useCallback(
     (options) => {
-      dispatch({
-        type: APPLY_MULTIPLE_SPECTRA_FILTER,
-        payload: [{ name: filter, options }],
-      });
+      if (options) {
+        dispatch({
+          type: APPLY_MULTIPLE_SPECTRA_FILTER,
+          payload: [{ name: filter, options }],
+        });
 
-      onClose();
+        onClose();
+      }
     },
     [dispatch, filter, onClose],
   );
@@ -110,6 +113,11 @@ function MultipleSpectraFiltersModal({ onClose, nucleus }) {
       case Filters.equallySpaced.id:
         return <EquallySpacedFilter onSubmit={submitHandler} ref={refForm} />;
       default:
+        <FormikForm
+          ref={refForm}
+          initialValues={null}
+          onSubmit={submitHandler}
+        />;
         break;
     }
   }, [filter, submitHandler]);
@@ -130,17 +138,14 @@ function MultipleSpectraFiltersModal({ onClose, nucleus }) {
             onChange={filterChangeHandler}
           />
         </div>
-        {filterOptions || (
-          <FormikForm
-            ref={refForm}
-            initialValues={{}}
-            onSubmit={submitHandler}
-          />
-        )}
+        {filterOptions}
       </div>
       <div className="footer-container">
-        <button type="button" onClick={handleSave} className="btn">
-          Done
+        <button type="button" onClick={handleSave} className="btn primary">
+          Apply
+        </button>
+        <button type="button" onClick={onClose} className="btn">
+          Close
         </button>
       </div>
     </div>