fix update experiment paramters bug (#3556)

ts/webui/src/components/overview/count/EditExperimentParam.tsx

@@ -30,6 +30,7 @@ export const EditExperimentParam = (): any => {
     const { title, field, editType, maxExecDuration, maxTrialNum, trialConcurrency, updateOverviewPage } = useContext(
         EditExpeParamContext
     );
+    const originMaxDurationStr = EXPERIMENT.profile.params.maxExperimentDuration;
     const { maxDurationUnit, changeMaxDurationUnit } = useContext(AppContext);
     const [unit, setUnit] = useState(maxDurationUnit);
     let defaultVal = '';
@@ -112,8 +113,10 @@ export const EditExperimentParam = (): any => {
                 params: { update_type: editType }
             });
             if (res.status === 200) {
-                showMessageInfo(`Successfully updated experiment's ${field}`, 'success');
+                if (isMaxDuration) {
                     changeMaxDurationUnit(unit);
+                }
+                showMessageInfo(`Successfully updated experiment's ${field}`, 'success');
                 updateOverviewPage();
             }
         } catch (error) {
@@ -127,6 +130,12 @@ export const EditExperimentParam = (): any => {
                 showMessageInfo(`Failed to update trial ${field}\nUnknown error`, 'error');
             }
             setEditValInput(defaultVal);
+            // confirm trial config panel val
+            if (isMaxDuration) {
+                newProfile.params[field] = originMaxDurationStr;
+            } else {
+                newProfile.params[field] = beforeParam;
+            }
         }
         showPencil();
     }

ts/webui/src/components/slideNav/TrialConfigPanel.tsx

@@ -3,8 +3,7 @@ import { Stack, Panel, PrimaryButton } from '@fluentui/react';
 import { EXPERIMENT } from '../../static/datamodel';
 import MonacoEditor from 'react-monaco-editor';
 import { MONACO } from '../../static/const';
-import { AppContext } from '../../App';
-import { convertDuration, convertTimeAsUnit, caclMonacoEditorHeight } from '../../static/function';
+import { convertDuration, caclMonacoEditorHeight } from '../../static/function';
 import { prettyStringify } from '../../static/json_util';
 import lodash from 'lodash';
 import '../../static/style/logDrawer.scss';
@@ -69,14 +68,6 @@ class TrialConfigPanel extends React.Component<LogDrawerProps, LogDrawerState> {
 
         const prettyWidth = innerWidth > 1400 ? 100 : 60;
 
-        return (
-            <AppContext.Consumer>
-                {(value): React.ReactNode => {
-                    const unit = value.maxDurationUnit;
-                    profile.params.maxExperimentDuration = `${convertTimeAsUnit(
-                        unit,
-                        profile.params.maxExperimentDuration
-                    )}${unit}`;
         const showProfile = JSON.stringify(profile, filter, 2);
         return (
             <Stack>
@@ -117,9 +108,6 @@ class TrialConfigPanel extends React.Component<LogDrawerProps, LogDrawerState> {
                 </Panel>
             </Stack>
         );
-                }}
-            </AppContext.Consumer>
-        );
     }
 }