Rendering queue of Transfers via DataTables

app/views/transfer/_empty.html.erb

@@ -0,0 +1,3 @@
+<tr class="empty">
+  <td colspan="6">There were no transfers matching your parameters.
+</tr>

app/views/transfer/_transfer.html.erb

@@ -0,0 +1,8 @@
+<tr>
+  <td data-sort="<%= transfer.created_at %>"><%= link_to transfer.created_at.in_time_zone('Eastern Time (US & Canada)').strftime('%b %-d, %Y<br>%l:%M %p').html_safe, url_for(transfer) %></td>
+  <td data-sort="<%= transfer.grad_date %>"><%= transfer.graduation_month[...3] %> <%= transfer.graduation_year %></td>
+  <td><%= transfer.department.name_dw %></td>
+  <td><%= transfer.user.display_name %></td>
+  <td><%= transfer.files.count %></td>
+  <td><%= transfer.note.present? ? "<span title='#{transfer.note}'>#{transfer.note[..10]}...</span>".html_safe : "" %></td>
+</tr>

app/views/transfer/select.html.erb

@@ -1 +1,63 @@
-<p>This is the transfer select view.</p>
+<%= content_for(:title, "Transfer Processing | MIT Libraries") %>
+
+<% content_for :additional_js do %>
+  <script src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js"></script>
+<% end %>
+
+<link href="https://cdn.datatables.net/1.10.24/css/jquery.dataTables.min.css" rel="stylesheet">
+
+<h3 class="title title-page">Transfer Processing Queue</h3>
+
+<div id="term-list" class="filter-row">
+  <button data-filter="*">Show<br>all</button>
+</div>
+
+<table class="table" id="transferQueue">
+  <thead>
+    <tr>
+      <th scope="col">Transfer date</th>
+      <th scope="col">Degree date</th>
+      <th scope="col">Department</th>
+      <th scope="col">Dept. Admin</th>
+      <th scope="col">Files</th>
+      <th scope="col">Notes</th>
+    </tr>
+  </thead>
+  <tbody>
+    <%= render(partial: 'transfer/transfer', collection: @transfers) || render('empty') %>
+  </tbody>
+</table>
+
+<script type="text/javascript">
+$(document).ready( function () {
+  if( document.getElementById('transferQueue').getElementsByClassName('empty').length === 0 ) {
+    var table = $('#transferQueue').DataTable({
+      "order": [[ 1, "asc" ]]
+    });
+
+    // Populate filter buttons with found values
+    var terms = [...new Set( table.columns(1).data()[0] )];
+    terms.forEach(element => {
+      document
+        .getElementById("term-list")
+        .insertAdjacentHTML("beforeend", `
+        <button data-filter="${element}">${element.replace(' ', '<br>')}</button>
+      `);
+    });
+
+    // Perform filtering when buttons are clicked
+    $(".filter-row button").click(function() {
+      var needle = $(this).data("filter");
+      $.fn.dataTable.ext.search.push(
+        function( settings, data, dataIndex ) {
+          return ( data[1] === needle || needle === "*" )
+            ? true
+            : false
+        }
+      );
+      table.draw();
+      $.fn.dataTable.ext.search.pop();
+    });
+  }
+});
+</script>

app/views/transfer/show.html.erb

@@ -1 +1,7 @@
-<%= content_for(:title, "Thesis Transfer Submission | MIT Libraries") %>
+<%= content_for(:title, "Transfer Processing | MIT Libraries") %>
+
+<h3 class="title title-page">Transfer file list</h3>
+
+<p><%= link_to "Back to Transfer queue", transfer_select_path %></p>
+
+<p>This will be the display of all files in this Transfer, for processing into Thesis records.</p>

test/fixtures/transfers.yml

@@ -20,8 +20,3 @@ alsovalid:
   department: one
   grad_date: 2020-05-01
   user: thesis_admin
-
-baduser:
-  department: one
-  grad_date: 2020-05-01
-  user: invalid

test/models/transfer_test.rb

@@ -28,7 +28,9 @@ class TransferTest < ActiveSupport::TestCase
   end
 
   test 'needs valid user' do
-    @transfer = transfers(:baduser)
+    @transfer = transfers(:valid)
+    assert @transfer.valid?
+    @transfer.user = nil
     assert @transfer.invalid?
   end