diff --git a/app/assets/stylesheets/unc_custom.css.scss b/app/assets/stylesheets/unc_custom.css.scss
index a0a46eb5d..c63614bd6 100644
--- a/app/assets/stylesheets/unc_custom.css.scss
+++ b/app/assets/stylesheets/unc_custom.css.scss
@@ -1314,3 +1314,10 @@ Hide it entirely until the issue is resolved upstreeam
 .work-reports .nav-pills .nav-link.active {
   color: white;
 }
+
+// Fix from https://github.com/samvera/hyrax/blob/hyrax-v5.0.1/app/assets/stylesheets/hyrax/_file_upload.scss#L40
+// fix blueimp jQuery-File-Upload display problems under Bootstrap 4+
+// found here: https://stackoverflow.com/a/48162651
+.fade.in {
+  opacity: 1
+}
\ No newline at end of file
diff --git a/app/views/hyrax/uploads/_js_templates_versioning.html.erb b/app/views/hyrax/uploads/_js_templates_versioning.html.erb
new file mode 100644
index 000000000..3ae808eb9
--- /dev/null
+++ b/app/views/hyrax/uploads/_js_templates_versioning.html.erb
@@ -0,0 +1,184 @@
+<%# [hyc-override] https://github.com/samvera/hyrax/blob/hyrax-v4.0.0/app/views/hyrax/uploads/_js_templates_versioning.html.erb %>
+<!-- The template to display files available for upload -->
+<% fade_class_if_not_test = Rails.env.test? ? 'show' : 'fade show' %>
+Hello World!
+<script id="versioning-template-upload" type="text/x-tmpl">
+{% for (var i=0, file; file=o.files[i]; i++) { %}
+    <tr class="template-upload <%= fade_class_if_not_test %>">
+        <td>
+            <span class="preview"></span>
+        </td>
+        <td>
+            <p class="name">{%=file.name%}</p>
+            <strong class="error text-danger"></strong>
+        </td>
+        <td>
+            <p class="size">Processing...</p>
+            <div class="progress"
+                 role="progressbar"
+                 aria-valuemin="0"
+                 aria-valuemax="100"
+                 aria-valuenow="0">
+               <div class="progress-bar progress-bar-striped progress-bar-animated bg-success" style="width:0%;"></div>
+             </div>
+        </td>
+        <td class="text-right">
+            {% if (!i && !o.options.autoUpload) { %}
+                <button class="btn btn-primary start" disabled>
+                    <span class="fa fa-upload"></span>
+                    <span><%= t('.start') %></span>
+                </button>
+            {% } %}
+            {% if (!i) { %}
+                <button class="btn btn-sm btn-warning cancel">
+                    <span class="fa fa-ban"></span>
+                    <span><%= t('helpers.action.cancel') %></span>
+                </button>
+            {% } %}
+        </td>
+    </tr>
+{% } %}
+</script>
+
+<!-- function used by the following template -->
+<script type="text/javascript">
+  function setAllResourceTypesVersioning(resourceTypeId) {
+    var firstResourceType = $("#resource_type_" + resourceTypeId.toString())[0];
+    var selected_options = [];
+    for (var i = 0; i < firstResourceType.length; i++) {
+      if (firstResourceType.options[i].selected) {
+        selected_options.push(firstResourceType.options[i].value);
+      }
+    }
+    $(".resource_type_dropdown").each(function(index, element) {
+      for(var i=0; i< this.length; i++) {
+        this.options[i].selected =
+            $.inArray(this.options[i].value, selected_options) > -1 ? true : false;
+      }
+    });
+  }
+</script>
+
+<!-- The template to display files available for download -->
+<script id="versioning-batch-template-download" type="text/x-tmpl">
+{% for (var i=0, file; file=o.files[i]; i++) { %}
+    <tr class="template-download add-batch-work-file-wrapper <%= fade_class_if_not_test %>">
+        <td>
+          <div class="row padding-bottom">
+            <div class="col-sm-6 name">
+                <span>{%=file.name%}</span>
+                <input type="hidden" name="uploaded_files[]" value="{%=file.id%}">
+            </div>
+            <div class="col-sm-6">
+              {% if (file.error) { %}
+                  <div><span class="badge badge-danger">Error</span> {%=file.error%}</div>
+              {% } %}
+              <span class="size">{%=o.formatFileSize(file.size)%}</span>
+              <button class="btn btn-sm btn-danger delete float-right"
+                      data-type="{%=file.deleteType%}"
+                      data-url="{%=file.deleteUrl%}"
+                      {% if (file.deleteWithCredentials) { %} data-xhr-fields='{"withCredentials":true}'{% } %}>
+                  <span class="fa fa-trash"></span>
+                  <span><%= t('helpers.action.delete') %></span>
+              </button>
+            </div>
+          </div>
+          <div class="row">
+            <div class="col-sm-12">
+              <div class="form-group row">
+                <label for="title_{%=file.id%}" class="col-sm-5 col-form-label"><%= t('.display_label') %></label>
+                <div class="col-sm-7 padding-bottom">
+                  <input type="text" class="form-control" name="title[{%=file.id%}]" id="title_{%=file.id%}" value="{%=file.name%}">
+                </div>
+                <label for="resource_type_{%=file.id%}" class="col-sm-5 col-form-label">Resource Type</label>
+                <div class="col-sm-7 padding-bottom">
+                  <select class="form-control resource_type_dropdown"
+                          multiple="multiple"
+                          size="6"
+                          name="resource_type[{%=file.id%}][]"
+                           id="resource_type_{%=file.id%}"
+                           value="{%=file.name%}">
+                    <%= options_for_select(Hyrax::ResourceTypesService.select_options) %>
+                  </select>
+                  <button class="btn btn-secondary float-right resource_type_button"
+                          onClick="setAllResourceTypesVersioning({%= file.id %}); return false;">
+                          <%= t('.set_all_to_this_resource_type') %>
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </td>
+    </tr>
+{% } %}
+</script>
+
+<!-- Simpler display of files available for download. Originally from hyrax/base/_form_files -->
+<!-- TODO: further consolidate with template-download above -->
+<!-- The template to display the files once upload is complete -->
+<script id="versioning-template-download" type="text/x-tmpl">
+{% for (var i=0, file; file=o.files[i]; i++) { %}
+        <span class="template-download fade">
+          <div id="files">
+            <div class="row versioning-files-row">
+              <div class="col-sm-3">
+                <span class="name">
+                  <span>{%=file.name%}</span>
+                  <input type="hidden" name="files_files[]" value="{%=file.id%}">
+                </span>
+                {% if (file.error) { %}
+                  <span><span class="badge badge-danger"><%= t('.error') %></span> {%=file.error%}</span>
+                {% } %}
+              </div>
+
+              <div class="col-sm-2">
+                <button class="btn btn-link remove versioning-files-remove"
+                        data-type="{%=file.deleteType%}"
+                        data-url="{%=file.deleteUrl%}"
+                        onclick=$("#files").remove(); {% if (file.deleteWithCredentials) { %} data-xhr-fields='{"withCredentials":true}'{% } %}>
+                  <span class="fa fa-times"></span>
+                  <span class="controls-remove-text"><%= t('.remove') %></span>
+                  <span class="sr-only">
+                    <%= t('.previous') %>
+                    <span class="controls-field-name-text"><%= t('.remove_new_version') %></span>
+                  </span>
+                </button>
+              </div> <!-- end col-sm-2 -->
+            </div> <!-- row versioning-files-row -->
+          </div> <!-- end container files -->
+        </span>
+{% }  $("div#files").remove(); %}
+</script>
+
+<script>
+    $(function () {
+        $("button[name='update_versioning']").prop('disabled', true);
+
+        // will run after DOM is loaded
+        $('#fileuploadVersioning').hyraxUploader({downloadTemplateId: 'versioning-template-download',
+            uploadTemplateId: 'versioning-template-upload',
+            // The regular expression for allowed file types, matches
+            // against either file type or file name:
+            //acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
+            // The maximum allowed file size in bytes:
+            maxFileSize: <%= Hyrax.config.uploader[:maxFileSize] %>,
+            // The minimum allowed file size in bytes:
+            //minFileSize: undefined, // No minimal file size
+            // The limit of files to be uploaded:
+            //maxNumberOfFiles: 100,
+            messages: {
+                acceptFileTypes: '<%= t(".options.messages.accept_file_types") %>',
+                maxFileSize: '<%= t(".options.messages.max_file_size") %>',
+                maxNumberOfFiles: '<%= t(".options.messages.max_number_of_files") %>',
+                minFileSize: '<%= t(".options.messages.min_file_size") %>',
+            }});
+        $('#fileuploadVersioning').on('fileuploadchange', function (e, data) {
+            $("button[name='update_versioning']").prop('disabled', data.files.length === 0);
+        });
+        $(document).on('click', '.versioning-files-remove', function (e) {
+            var rowsCount = $('.versioning-files-row').length;
+            console.log('custom trigger', rowsCount);
+            $("button[name='update_versioning']").prop('disabled', rowsCount === 0);
+        });
+    });
+</script>