From ef7d1219270f90698c0deb6f91734fd9bdfadde6 Mon Sep 17 00:00:00 2001
From: Cassie Tarakajian <ctarakajian@gmail.com>
Date: Wed, 19 Oct 2016 17:09:31 -0400
Subject: [PATCH] show errors if file name is invalid

---
 client/modules/IDE/components/NewFileForm.js | 1 +
 client/styles/components/_modal.scss         | 5 +++++
 2 files changed, 6 insertions(+)

diff --git a/client/modules/IDE/components/NewFileForm.js b/client/modules/IDE/components/NewFileForm.js
index 91c39bc1..83a623fa 100644
--- a/client/modules/IDE/components/NewFileForm.js
+++ b/client/modules/IDE/components/NewFileForm.js
@@ -24,6 +24,7 @@ class NewFileForm extends React.Component {
           {...name}
         />
         <input type="submit" value="Add File" aria-label="add file" />
+        {name.touched && name.error && <span className="form-error">{name.error}</span>}
       </form>
     );
   }
diff --git a/client/styles/components/_modal.scss b/client/styles/components/_modal.scss
index e3c37bac..187426fb 100644
--- a/client/styles/components/_modal.scss
+++ b/client/styles/components/_modal.scss
@@ -32,6 +32,11 @@
   margin-bottom: #{20 / $base-font-size}rem;
 }
 
+.new-file-form, .new-file-folder {
+  display: flex;
+  flex-wrap: wrap;
+}
+
 .new-file-form__name-label, .new-folder-form__name-label {
   @extend %hidden-element;
 }