{% extends "sentry/projects/manage.html" %}

{% load crispy_forms_tags %}
{% load i18n %}
{% load sentry_helpers %}

{% block title %}{% trans "Edit API Key" %} | {{ block.super }}{% endblock %}

{% block main %}
    <div class="page-header">
        <h2>{% trans "Edit API Key" %}</h2>
    </div>
    <form class="form-stacked" action="" method="post">
        {% csrf_token %}

        {{ form|as_crispy_errors }}

        <div class="box">
            <div class="box-header">
              <h3>Details</h3>
            </div>
            <div class="box-content with-padding">
              {{ form.label|as_crispy_field }}
              <div class="form-group">
                  <label>{% trans "Created" %}</label>
                  <div class="controls">
                      {{ key.date_added|timesince }}
                  </div>
              </div>
            </div>
        </div>

        <div class="box dsn-credentials">
            <div class="box-header">
              <h3>Credentials</h3>
            </div>
            <div class="box-content with-padding">
              <p>{% blocktrans %}Your credentials are bound to public and secret key (though both should be considered semi-secret). Different clients will require different credentials, so make sure you check the documentation before plugging things in.{% endblocktrans %}</p>
              <div class="form-group">
                  <label>{% trans "DSN" %}</label>
                  <div class="controls">
                      <div class="form-control disabled auto-select">{{ key.dsn_private }}</div>
                  </div>
              </div>
              <div class="form-group">
                  <label>{% trans "DSN (Public)" %}</label>
                  <div class="controls">
                      <div class="form-control disabled auto-select">{{ key.dsn_public }}</div>
                  </div>
                  <div class="help-block">{% blocktrans with 'https://github.com/getsentry/raven-js' as link %}Use your public DSN with browser-based clients such as <a href="{{ link }}">raven-js</a>.{% endblocktrans %}</div>
              </div>
              <div class="form-group">
                  <label>{% trans "Public Key" %}</label>
                  <div class="controls">
                      <div class="form-control disabled auto-select">{{ key.public_key }}</div>
                  </div>
              </div>
              <div class="form-group">
                  <label>{% trans "Secret Key" %}</label>
                  <div class="controls">
                      <div class="form-control disabled auto-select">{{ key.secret_key }}</div>
                  </div>
              </div>
              <div class="form-group">
                  <label>{% trans "Project ID" %}</label>
                  <div class="controls">
                      <div class="form-control disabled auto-select">{{ key.project_id }}</div>
                  </div>
              </div>
            </div>
        </div>

        <div class="actions">
            <button type="submit" class="btn btn-primary">{% trans "Save Changes" %}</button>
        </div>
    </form>
{% endblock %}
