uploads: show thumbnails in dropzone widget.

app/javascript/src/javascripts/uploads.js.erb

@@ -150,10 +150,13 @@ Upload.initialize_dropzone = function() {
   let dropzone = new Dropzone("#filedropzone", {
     paramName: "upload[file]",
     url: "/uploads/preprocess",
-    createImageThumbnails: false,
+    thumbnailHeight: 150,
+    thumbnailWidth: 150,
+    thumbnailMethod: "contain",
     addRemoveLinks: false,
     maxFiles: 1,
     maxFilesize: Upload.MAX_FILE_SIZE,
+    maxThumbnailFilesize: Upload.MAX_FILE_SIZE,
     timeout: 0,
     acceptedFiles: "image/jpeg,image/png,image/gif,video/mp4,video/webm,.swf",
     previewTemplate: $("#dropzone-preview-template").html(),

app/javascript/src/styles/specific/dropzone.scss

@@ -10,6 +10,20 @@
   cursor: pointer;
   position: relative;
 
+  .dz-preview {
+    display: flex;
+
+    img[data-dz-thumbnail] {
+      padding: 1em;
+    }
+
+    .dz-details {
+      display: flex;
+      flex-direction: column;
+      align-self: center;
+    }
+  }
+
   &.dz-started .dropzone-hint {
     display: none;
   }

app/views/uploads/_dropzone_preview.html.erb

@@ -1,4 +1,5 @@
 <div class="dz-preview dz-file-preview">
+  <img data-dz-thumbnail/>
   <div class="dz-details">
     <div class="dz-filename">
       <span data-dz-name></span>