Simplify showing/hiding attached file name

Note we have to render the `<p>` tag in one line because at the time of
writing browsers don't consider elements with whitespace inside as empty
[1].

[1] https://developer.mozilla.org/en-US/docs/Web/CSS/:empty

app/assets/javascripts/documentable.js

@@ -92,7 +92,6 @@
     },
     clearFilename: function(data) {
       $(data.fileNameContainer).text("");
-      $(data.fileNameContainer).hide();
     },
     clearInputErrors: function(data) {
       $(data.errorContainer).find("small.error").remove();
@@ -102,7 +101,6 @@
     },
     setFilename: function(data, file_name) {
       $(data.fileNameContainer).text(file_name);
-      $(data.fileNameContainer).show();
     },
     setProgressBar: function(data, klass) {
       $(data.progressBar).find(".loading-bar").addClass(klass);

app/assets/javascripts/imageable.js

@@ -92,7 +92,6 @@
     },
     clearFilename: function(data) {
       $(data.fileNameContainer).text("");
-      $(data.fileNameContainer).hide();
     },
     clearInputErrors: function(data) {
       $(data.errorContainer).find("small.error").remove();
@@ -105,7 +104,6 @@
     },
     setFilename: function(data, file_name) {
       $(data.fileNameContainer).text(file_name);
-      $(data.fileNameContainer).show();
     },
     setProgressBar: function(data, klass) {
       $(data.progressBar).find(".loading-bar").addClass(klass);

app/assets/stylesheets/mixins/uploads.scss

@@ -42,6 +42,10 @@
 
   .file-name {
     margin-top: 0;
+
+    &:empty {
+      display: none;
+    }
   }
 
   .loading-bar {

app/components/documents/fields_component.html.erb

@@ -17,9 +17,7 @@
   </div>
 
   <div class="small-6 column">
-    <p class="file-name">
+    <p class="file-name"><%= document_attachment_file_name %></p>
-      <%= document_attachment_file_name %>
-    </p>
   </div>
 
   <div class="small-12 column">

app/components/images/fields_component.html.erb

@@ -19,9 +19,7 @@
   </div>
 
   <div class="small-6 column">
-    <p class="file-name">
+    <p class="file-name"><%= image_attachment_file_name %></p>
-      <%= image_attachment_file_name %>
-    </p>
   </div>
 
   <div class="small-12 column">