INFRA-3285 | fix diabled button color

src/coreform/baseform/BaseForm.tsx

@@ -70,10 +70,6 @@ const BaseForm = (props: BaseFormProps) => {
   const [isCrRequired, setCrRequired] = React.useState(false);
   const tabList = BaseFormTabList(props.type);
 
-  const submitChangeRequestStyle = {
-    ...defaultSubmitButtonStyle,
-    ...(!haveValidationError ? { backgroundColor: '#fd7700' } : {}),
-  };
   const isDisabled = (): boolean => {
     if (haveValidationError) return true;
     if (
@@ -110,19 +106,21 @@ const BaseForm = (props: BaseFormProps) => {
       {label}
     </Button>
   );
-
-  const submitCrButton = (
-    type: 'submit' | 'button' = 'button',
-    style = submitChangeRequestStyle,
-    onClick: () => void = () => {},
-  ) => submitButton(submitChangeRequestStyle, submitChangeRequestLabel, type, onClick);
+  const getSubmitChangeRequestStyle = () => {
+    return {
+      ...defaultSubmitButtonStyle,
+      ...(!haveValidationError ? { backgroundColor: '#fd7700' } : {}),
+    };
+  };
+  const submitCrButton = (type: 'submit' | 'button' = 'button', onClick: () => void = () => {}) =>
+    submitButton(getSubmitChangeRequestStyle(), submitChangeRequestLabel, type, onClick);
 
   const submitManifestButton = () =>
     submitButton(defaultSubmitButtonStyle, defaultSubmitButtonLabel);
 
   const renderSubmitButton = () => {
     if (isCrRequired) {
-      return submitCrButton('button', submitChangeRequestStyle, () => setRolloutPopupOpen(true));
+      return submitCrButton('button', () => setRolloutPopupOpen(true));
     } else {
       return submitManifestButton();
     }
@@ -160,16 +158,17 @@ const BaseForm = (props: BaseFormProps) => {
             value,
             preChangeManifest,
           );
-          setCrRequired(breachedValues.length !== 0);
-
+          let errors = {};
           try {
             await validateYupSchema(value, manifestValidationSchema, false, value);
             setHaveValidationError(false);
           } catch (err) {
             setHaveValidationError(true);
-            return yupToFormErrors(err); //for rendering validation errors
+            errors = yupToFormErrors(err); //for rendering validation errors
+          } finally {
+            setCrRequired(breachedValues.length !== 0);
+            return errors;
           }
-          return {};
         }}
         validateOnChange={false}
         onSubmit={values => handleSubmit(values)}
@@ -238,7 +237,7 @@ const BaseForm = (props: BaseFormProps) => {
                 onBlur={({ target: { value } }) => setCrDescription(value)}
                 multiline
               />
-              {submitCrButton('submit', { ...submitChangeRequestStyle }, () => {
+              {submitCrButton('submit', () => {
                 handleSubmit(props.values);
                 setRolloutPopupOpen(false);
               })}