From 23fa8e458c4cd308b57750554d84792ccc114d24 Mon Sep 17 00:00:00 2001
From: Pierre-Yves Chibon <pingou@pingoured.fr>
Date: Sep 28 2018 12:54:52 +0000
Subject: Hide expired API keys by default but add a button to show them


Fixes https://pagure.io/pagure/issue/3687

Signed-off-by: Pierre-Yves Chibon <pingou@pingoured.fr>

---

diff --git a/pagure/static/pagure.css b/pagure/static/pagure.css
index 025b390..621db34 100644
--- a/pagure/static/pagure.css
+++ b/pagure/static/pagure.css
@@ -242,7 +242,7 @@ th[data-sort] {
   margin-left:2em;
 }
 
-.hidden, .milestone_inactive{
+.hidden, .milestone_inactive, .expired_api_keys{
   display: none;
 }
 
@@ -338,4 +338,4 @@ th[data-sort] {
 
 .line-height-1{
   line-height: 1em;
-}
\ No newline at end of file
+}
diff --git a/pagure/templates/settings.html b/pagure/templates/settings.html
index 4bdb9ac..45e772f 100644
--- a/pagure/templates/settings.html
+++ b/pagure/templates/settings.html
@@ -1309,6 +1309,17 @@ $('.milestone_order_bottom').click(function(e) {
     }
 });
 
+$('#show_old_keys').click(function(e) {
+  var _el = $('.expired_api_keys')
+  if (_el.css('display') == 'none'){
+    _el.css('display', 'flex');
+    $('#show_old_keys').text('Hide old API keys');
+  } else {
+    $('#show_old_keys').text('Show old API keys');
+   _el.hide();
+  }
+});
+
 {% if config.get('ENABLE_GIVE_PROJECTS', True)
           and repo.user.user == g.fas_user.username
           and not repo.is_fork %}
diff --git a/pagure/templates/settings_api_keys.html b/pagure/templates/settings_api_keys.html
index 470a63b..c78f1c5 100644
--- a/pagure/templates/settings_api_keys.html
+++ b/pagure/templates/settings_api_keys.html
@@ -1,17 +1,29 @@
 
-<h3 class="font-weight-bold mb-3">
-  API Keys
-  <a href="{{ url_for(
-    'ui_ns.add_token',
-    repo=repo.name,
-    username=username,
-    namespace=repo.namespace) }}" method="post" class="icon float-right">
-      <button class="btn btn-sm btn-outline-primary" type="submit"
-        title="Generate a new API token">
+<div class="row mb-3">
+  <h3 class="col-6 font-weight-bold mb-3">
+    API Keys
+  </h3>
+  <div class="col-6 text-right">
+    <div class="btn-group">
+      <a href="{{ url_for(
+        'ui_ns.add_token',
+        repo=repo.name,
+        username=username,
+        namespace=repo.namespace) }}"
+          class="btn btn-sm btn-outline-primary"
+          title="Generate a new API token">
         Create new API Key
-      </button>
       </a>
-</h3>
+      <div class="btn-group">
+        <a href="javascript:void(0)" method="post" class="btn btn-sm btn-outline-primary"
+          title="Show old API token" id="show_old_keys">
+          Show old API Keys
+        </a>
+      </div>
+    </div>
+  </div>
+</div>
+
 <div class="row">
   <div class="col">
     <p>
@@ -33,7 +45,7 @@
     {% if repo.tokens %}
     {% for token in repo.tokens %}
       {% if token.user.username == g.fas_user.username %}
-          <div class="form-group">
+          <div class="form-group{% if token.expired %} expired_api_keys{% endif %}">
             <div class="input-group">
               <div class="input-group-prepend">
                 <span class="input-group-text">