fix: Close continue/fork experiment modal [WEB-699] (#5624)

determined-ai · Dec 21, 2022 · 17fce38 · 17fce38
1 parent 6de230f
commit 17fce38
Showing 1 changed file with 8 additions and 8 deletions.
diff --git a/webui/react/src/hooks/useModal/Experiment/useModalExperimentCreate.tsx b/webui/react/src/hooks/useModal/Experiment/useModalExperimentCreate.tsx
@@ -44,9 +44,9 @@ interface ModalState {
   error?: string;
   experiment?: ExperimentBase;
   isAdvancedMode: boolean;
+  open: boolean;
   trial?: TrialItem;
   type: CreateExperimentType;
-  visible: boolean;
 }
 
 interface ModalHooks extends Omit<Hooks, 'modalOpen'> {
@@ -96,8 +96,8 @@ const DEFAULT_MODAL_STATE = {
   config: {},
   configString: '',
   isAdvancedMode: false,
+  open: false,
   type: CreateExperimentType.Fork,
-  visible: false,
 };
 
 const useModalExperimentCreate = ({ onClose }: Props = {}): ModalHooks => {
@@ -151,9 +151,9 @@ const useModalExperimentCreate = ({ onClose }: Props = {}): ModalHooks => {
     (close?: () => void) => {
       /**
        * 'close' is an indicator for if cancel button (show config) is clicked or not.
-       * If cancel button (show config) is not clicked, 'close' is undefined.
+       * If cancel button (show config) is not clicked, 'close' is () => {}.
        */
-      if (!close) {
+      if (!close || close.toString() === 'function () {}') {
         modalClose(ModalCloseReason.Cancel);
       } else {
         setModalState((prev) => {
@@ -351,7 +351,7 @@ const useModalExperimentCreate = ({ onClose }: Props = {}): ModalHooks => {
 
   const getModalProps = useCallback(
     (state: ModalState): ModalFuncProps | undefined => {
-      const { experiment, isAdvancedMode, trial, type, visible } = state;
+      const { experiment, isAdvancedMode, trial, type, open } = state;
       const isFork = type === CreateExperimentType.Fork;
       if (!experiment || (!isFork && !trial)) return;
 
@@ -369,12 +369,12 @@ const useModalExperimentCreate = ({ onClose }: Props = {}): ModalHooks => {
         okText: type,
         onCancel: handleCancel,
         onOk: handleOk,
+        open,
         title: (
           <div className={css.title}>
             <Icon name="fork" /> {titleLabel}
           </div>
         ),
-        visible,
         width: isAdvancedMode ? (isFork ? 760 : 1000) : undefined,
       };
 
@@ -422,9 +422,9 @@ const useModalExperimentCreate = ({ onClose }: Props = {}): ModalHooks => {
         configString: yaml.dump(publicConfig),
         experiment,
         isAdvancedMode: false,
+        open: true,
         trial,
         type,
-        visible: true,
       };
       return isEqual(prev, newModalState) ? prev : newModalState;
     });
@@ -442,7 +442,7 @@ const useModalExperimentCreate = ({ onClose }: Props = {}): ModalHooks => {
    * title, and buttons, update the modal.
    */
   useEffect(() => {
-    if (isEqual(modalState, prevModalState) || !modalState.visible) return;
+    if (isEqual(modalState, prevModalState) || !modalState.open) return;
     openOrUpdate(getModalProps(modalState));
   }, [getModalProps, modalRef, modalState, openOrUpdate, prevModalState]);