Merge lp:~deadlight/canonical-identity-provider/table-header into lp:canonical-identity-provider/release

[Karl Williams]

Update home page recently authenticated table to display more clearly. Also correct grammar of section heading

Updated home page recently authenticated table to display more clearly
Also corrected grammar of the section heading

[Karl Williams (deadlight)]

This is quite difficult to QA locally but here is a screenshot of some sample data:
https://imgur.com/a/x1eX6ok

[Anthony Dillon (ya-bo-ng)]

LGTM +1

review: Approve

[Daniel Manrique (roadmr)]

+1! THanks!

Fair to land this and do any final QA on staging.

review: Approve

[Otto Co-Pilot (otto-copilot)]

Running landing tests failed
https://jenkins.ols.canonical.com/online-services/job/canonical-identity-provider/286/

=== modified file 'src/identityprovider/tests/sso_server/test_home_page.py'
--- src/identityprovider/tests/sso_server/test_home_page.py	2020-02-06 17:49:06 +0000
+++ src/identityprovider/tests/sso_server/test_home_page.py	2020-02-11 16:47:35 +0000
@@ -33,7 +33,10 @@
 
         self.assertContains(response, "Test Account")
         self.assertContains(response, self.account.displayname)
-        self.assertContains(response, "Sites you last authenticated to")
+        self.assertContains(
+            response,
+            "Sites to which you have recently authenticated"
+        )
 
         # == Previously Visited Sites ==
 
@@ -47,8 +50,11 @@
         # Now reload the page
         response = self.client.get(self.base_url)
         visited = self.get_from_response(
-            response, '.last-authenticated-sites').text()
-        self.assertIn("Sites you last authenticated to", visited)
+            response, '#authenticated-sites').text()
+        self.assertIn(
+            "Sites to which you have recently authenticated",
+            visited
+        )
         self.assertIn("Site", visited)
         self.assertIn("Date", visited)
         for summary in OpenIDRPSummary.objects.all():

=== modified file 'src/webui/templates/widgets/last_auth_sites.html'
--- src/webui/templates/widgets/last_auth_sites.html	2014-12-10 15:30:54 +0000
+++ src/webui/templates/widgets/last_auth_sites.html	2020-02-11 16:47:35 +0000
@@ -1,28 +1,35 @@
 {% comment %}
-Copyright 2010 Canonical Ltd.  This software is licensed under the
+Copyright 2010-2020 Canonical Ltd.  This software is licensed under the
 GNU Affero General Public License version 3 (see the file  LICENSE).
 {% endcomment %}
 
 {% load i18n %}
 
 {% if last_authenticated_sites %}
-<section class="last-authenticated-sites listing-section">
-    <h3>{% trans "Sites you last authenticated to" %} <span class="subtitle">Date</span></h3>
+<div class="p-strip is-shallow"><hr></div>
 
-    <table class="listing">
-        <tbody>
-        {% for site in last_authenticated_sites %}
-            <tr>
-                <td class="site-url">
-                    {% if embedded %}{{ site.trust_root }}{% else %}
-                    <a href="{{ site.trust_root }}" data-qa-id="visited_site_url">{{ site.trust_root }}</a>{% endif %}
-                </td>
-                <td class="site-date" data-qa-id="visited_site_date">
-                    {{ site.date_last_used|date:"Y/m/d" }}
-                </td>
-            </tr>
-        {% endfor %}
-        </tbody>
-    </table>
+<section id="authenticated-sites">
+  <h2 class="p-heading--four">{% trans "Sites to which you have recently authenticated" %}</h2>
+  <table class="p-table">
+    <thead>
+      <tr>
+        <th>Site</th>
+        <th class="u-align--right">Date</th>
+      </tr>
+    </thead>
+    <tbody>
+      {% for site in last_authenticated_sites %}
+      <tr>
+        <td>
+          {% if embedded %}{{ site.trust_root }}{% else %}
+          <a href="{{ site.trust_root }}" data-qa-id="visited_site_url">{{ site.trust_root }}</a>{% endif %}
+        </td>
+        <td  class="u-align--right" data-qa-id="visited_site_date">
+          {{ site.date_last_used|date:"Y/m/d" }}
+        </td>
+      </tr>
+      {% endfor %}
+    </tbody>
+  </table>
 </section>
 {% endif %}