diff --git a/client/modules/IDE/components/NewFileForm.jsx b/client/modules/IDE/components/NewFileForm.jsx
index 2cc93566ae..9620e321dc 100644
--- a/client/modules/IDE/components/NewFileForm.jsx
+++ b/client/modules/IDE/components/NewFileForm.jsx
@@ -55,11 +55,15 @@ function NewFileForm() {
                 </React.Fragment>
               )}
             </Field>
-            <Button type="submit" disabled={invalid || submitting}>
-              {t('NewFileForm.AddFileSubmit')}
-            </Button>
+            <Field name="submitButton">
+              {() => (
+                <Button type="submit" disabled={submitting}>
+                  {t('NewFileForm.AddFileSubmit')}
+                </Button>
+              )}
+            </Field>
           </div>
-          {touched.name && errors.name && (
+          {touched.submitButton && errors.name && (
             <span className="form-error">{errors.name}</span>
           )}
         </form>
diff --git a/client/modules/IDE/components/NewFolderForm.jsx b/client/modules/IDE/components/NewFolderForm.jsx
index bc305b8b18..b0935397ff 100644
--- a/client/modules/IDE/components/NewFolderForm.jsx
+++ b/client/modules/IDE/components/NewFolderForm.jsx
@@ -52,11 +52,15 @@ function NewFolderForm() {
                 </React.Fragment>
               )}
             </Field>
-            <Button type="submit" disabled={invalid || submitting}>
-              {t('NewFolderForm.AddFolderSubmit')}
-            </Button>
+            <Field name="submitButton">
+              {() => (
+                <Button type="submit" disabled={submitting}>
+                  {t('NewFolderForm.AddFolderSubmit')}
+                </Button>
+              )}
+            </Field>
           </div>
-          {touched.name && errors.name && (
+          {touched.submitButton && errors.name && (
             <span className="form-error">{errors.name}</span>
           )}
         </form>