CaseAttribute: List out the diffs

List out the diffs and create placeholders for active elements that do
not yet have the back-end code that handles them.

3 files changed, 76 insertions, 2 deletions

diff --git a/wqflask/wqflask/templates/list_case_attribute_diffs.html b/wqflask/wqflask/templates/list_case_attribute_diffs.html
index 391b8c99..6882a3fb 100644
--- a/wqflask/wqflask/templates/list_case_attribute_diffs.html
+++ b/wqflask/wqflask/templates/list_case_attribute_diffs.html
@@ -39,6 +39,33 @@
     <tbody>
       {%for diff in diffs%}
       <tr>
+	<td>
+	  <a href="#"
+	     title="View the user that submitted the edit.">
+	    {{diff.editor}}
+	  </a>
+	</td>
+	<td>{{diff.time_stamp}}</td>
+	<td>
+	  <a href="#view-diff"
+	     title="View the diff">
+	    {{diff.filename}}
+	  </a>
+	</td>
+	<td>
+	  <a href="#approve-diff"
+	     title="Approve the changes"
+	     class="btn btn-warning">
+	    Approve
+	  </a>
+	</td>
+	<td>
+	  <a href="#reject-diff"
+	     title="Reject the changes"
+	     class="btn btn-danger">
+	    Reject
+	  </a>
+	</td>
       </tr>
       {%else%}
       <tr>
diff --git a/wqflask/wqflask/templates/list_case_attribute_diffs_error.html b/wqflask/wqflask/templates/list_case_attribute_diffs_error.html
new file mode 100644
index 00000000..6ca70984
--- /dev/null
+++ b/wqflask/wqflask/templates/list_case_attribute_diffs_error.html
@@ -0,0 +1,37 @@
+{%extends "base.html"%}
+{%block title%}List Case Attribute Diffs{%endblock%}
+
+{%block css%}
+<link rel="stylesheet" type="text/css"
+      href="/css/DataTables/css/jquery.dataTables.css" />
+<link rel="stylesheet" type="text/css"
+      href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
+<link rel="stylesheet" type="text/css" href="/static/new/css/show_trait.css" />
+
+<style>
+  .table-fixed-head {overflow-y: auto; height: 32em;}
+  .table-fixed-head thead th {position: sticky; top: 0;}
+</style>
+{%endblock%}
+
+{%block content%}
+<div class="container">
+  <h1>List Diffs</h1>
+
+  {{flash_me()}}
+
+  {%set the_error = error.json()%}
+
+  <p class="text-danger">
+    <span class="glyphicon glyphicon-exclamation-sign">
+    </span>
+    <strong>{{error.status_code}}: {{the_error["error"]}}</strong>
+    {{the_error.error_description}}
+  </p>
+{%endblock%}
+
+{%block js%}
+<script language="javascript"
+	type="text/javascript"
+	src="{{url_for('js', filename='DataTables/js/jquery.js')}}"></script>
+{%endblock%}
diff --git a/wqflask/wqflask/views.py b/wqflask/wqflask/views.py
index bf9148c7..f1d5d71c 100644
--- a/wqflask/wqflask/views.py
+++ b/wqflask/wqflask/views.py
@@ -1232,5 +1232,15 @@ def edit_case_attributes(inbredset_id: int) -> Response:
 @app.route("/case-attribute/<int:inbredset_id>/list-diffs", methods=["GET"])
 def list_case_attribute_diffs(inbredset_id: int) -> Response:
     """List any diffs awaiting review."""
-    return render_template(
-        "list_case_attribute_diffs.html", inbredset_id=inbredset_id, diffs=[])
+    return monad_requests.get(urljoin(
+        current_app.config["GN_SERVER_URL"],
+        f"/api/case-attribute/{inbredset_id}/diff/list")).then(
+            lambda resp: resp.json()).either(
+                lambda err: render_template(
+                    "list_case_attribute_diffs_error.html",
+                    inbredset_id=inbredset_id,
+                    error=err),
+                lambda diffs: render_template(
+                "list_case_attribute_diffs.html",
+                    inbredset_id=inbredset_id,
+                    diffs=diffs))