Merge pull request #2621 from getsentry/keys

Stylize disabled client keys more obviously

Author: mattrobenolt

src/sentry/static/sentry/less/project-settings.less

@@ -162,4 +162,7 @@
         color: #fff;
       }
     }
+    .client-key-item.disabled {
+      opacity: 0.5;
+    }
   }

src/sentry/templates/sentry/projects/keys.html

@@ -19,8 +19,8 @@ <h2>{% trans "Client Keys" %}</h2>
     a look at our <a href="https://docs.getsentry.com">documentation</a>.</p>
 
     <div class="client-key-list">
-      {% for key in key_list %}
-        <div class="client-key-item">
+      {% for key in key_list|dictsortreversed:"is_active" %}
+        <div class="client-key-item{% if not key.is_active %} disabled{% endif %}">
           <div class="pull-right">
             <a class="btn btn-default btn-sm" href="{% url 'sentry-edit-project-key' project.organization.slug project.slug key.id %}">{% trans "Details" %}</a>
             {% if ACCESS.project_write %}
@@ -32,7 +32,7 @@ <h2>{% trans "Client Keys" %}</h2>
               {% else %}
               <form method="POST" action="{% url 'sentry-enable-project-key' project.organization.slug project.slug key.id %}" style="display:inline">
                 {% csrf_token %}
-                <input type="submit" class="btn btn-primary btn-sm" value="{% trans "Enable" %}">
+                <input type="submit" class="btn btn-default btn-sm" value="{% trans "Enable" %}">
               </form>
               {% endif %}
             {% endif %}
@@ -44,9 +44,9 @@ <h2>{% trans "Client Keys" %}</h2>
             {% endif %}
           </div>
           {% if key.label %}
-            <h5><a href="{% url 'sentry-edit-project-key' project.organization.slug project.slug key.id %}">{{ key.label }}</a></h5>
+            <h5><a href="{% url 'sentry-edit-project-key' project.organization.slug project.slug key.id %}">{{ key.label }}</a>{% if not key.is_active %} <small><i class="icon-ban"></i> Disabled</small>{% endif %}</h5>
           {% else %}
-            <h5><a href="{% url 'sentry-edit-project-key' project.organization.slug project.slug key.id %}">{{ key.public_key }}</a></h5>
+            <h5><a href="{% url 'sentry-edit-project-key' project.organization.slug project.slug key.id %}">{{ key.public_key }}</a>{% if not key.is_active %} <small><i class="icon-ban"></i> Disabled</small>{% endif %}</h5>
           {% endif %}
 
           <div class="form-group">