{% extends 'core/base.html' %}

{% block content %}

<div class="page-head page-head-width-850">
    <div>
        <h1>{{ credential.name }}</h1>
        <p>{{ org.name }} · Protected credential view</p>
    </div>

    <a class="button secondary" href="{{ back_url }}">
        Back
    </a>
</div>

<div class="secret-card">
    <label>Username</label>
    <code>{{ credential.username|default:'—' }}</code>

    <label>Password / secret</label>
    <code class="secret">{{ secret }}</code>

    {% if totp_seed %}
        <label>TOTP Seed</label>
        <code class="secret">{{ totp_seed }}</code>
    {% endif %}

    {% if totp %}
        <label>Current OTP</label>

        <code
            class="otp"
            id="credential-otp"
            {% if totp_refresh_url %}
                data-refresh-url="{{ totp_refresh_url }}"
                data-server-now="{{ totp_server_now }}"
                data-expires-at="{{ totp_expires_at }}"
            {% endif %}
        >{{ totp }}</code>

        {% if totp_refresh_url %}
            <div class="otp-meta">
                <span id="otp-countdown">
                    Calculating expiration…
                </span>

                <span
                    id="otp-refresh-status"
                    aria-live="polite"
                ></span>
            </div>
        {% endif %}
    {% endif %}

    {% if credential.url %}
        <label>URL</label>
        <a
            href="{{ credential.url }}"
            rel="noreferrer"
        >{{ credential.url }}</a>
    {% endif %}

    <p class="warn">
        This reveal was written to the audit log.
        The page should not be cached or shared.
    </p>
</div>



{% endblock %}

{% block scripts %}
{% if totp_refresh_url %}<script src="/static/js/credential-reveal.js"></script>{% endif %}
{% endblock %}