{% extends 'generic/object.html' %}
{% load static %}
{% load oxidized_viewer %}

{% block head %}
{{ block.super }}
{# Prism is vendored (static/netbox_oxidized_viewer/prism/) — air-gapped NetBox installs are the norm for this plugin's audience #}
<link rel="stylesheet" href="{% static 'netbox_oxidized_viewer/prism/prism-tomorrow.min.css' %}">
{% endblock head %}

{% block content %}
<div class="row">
    <div class="col col-md-12">

        <div class="card mb-3">
            <div class="card-header d-flex justify-content-between align-items-center">
                <strong>Current Configuration</strong>
                <div class="d-flex align-items-center gap-2">
                    {% if latest_commit %}
                    <span class="text-muted small">Last backed up: {{ latest_commit.timestamp|date:"Y-m-d H:i:s T" }}</span>
                    <a href="{% url 'plugins:netbox_oxidized_viewer:device_config_download' pk=object.pk %}" class="btn btn-sm btn-ghost-secondary">Download</a>
                    {% endif %}
                    {% if sync_enabled %}
                    <form action="{% url 'plugins:netbox_oxidized_viewer:device_sync' pk=object.pk %}" method="post" class="d-inline">
                        {% csrf_token %}
                        <button type="submit" class="btn btn-sm btn-ghost-primary" title="Ask Oxidized to back up this device now">
                            <i class="mdi mdi-sync"></i> Sync now
                        </button>
                    </form>
                    {% endif %}
                </div>
            </div>
            <div class="card-body">
                {% if error_message %}
                <div class="alert alert-warning mb-0">{{ error_message }}</div>
                {% elif config_content %}
                <div class="mb-3">
                    <a href="{% url 'plugins:netbox_oxidized_viewer:device_commit' pk=object.pk sha_new=latest_commit.sha %}" class="btn btn-sm btn-ghost-primary me-2">
                        <code>{{ latest_commit.sha|slice:":7" }}</code>
                    </a>
                    <strong>{{ latest_commit.subject }}</strong>
                    <span class="text-muted ms-2">— {{ latest_commit.author_name }}</span>
                </div>
                <pre class="rounded" style="max-height: 600px; overflow-y: auto; margin: 0;"><code class="language-bash">{{ config_content }}</code></pre>
                {% endif %}
            </div>
        </div>

        <div class="card">
            <div class="card-header">
                <strong>Commit History</strong>
            </div>
            <div class="card-body p-0">
                <table class="table table-hover table-headings mb-0">
                    <thead>
                        <tr>
                            <th>Timestamp</th>
                            <th>Commit</th>
                            <th>Message</th>
                            <th>Author</th>
                            <th>Notes</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for commit in commits %}
                        <tr>
                            <td>{{ commit.timestamp|date:"Y-m-d H:i:s T" }}</td>
                            <td><code>{{ commit.sha|slice:":7" }}</code></td>
                            <td>{{ commit.subject }}</td>
                            <td>{{ commit.author_name }}</td>
                            <td>
                                {% with n=note_counts|dictkey:commit.sha %}
                                {% if n %}<span class="badge text-bg-info" title="{{ n }} note{{ n|pluralize }}"><i class="mdi mdi-comment-text-outline"></i> {{ n }}</span>{% endif %}
                                {% endwith %}
                            </td>
                            <td class="text-end">
                                <a href="{% url 'plugins:netbox_oxidized_viewer:device_commit_download' pk=object.pk sha=commit.sha %}" class="btn btn-sm btn-ghost-secondary me-1">Download</a>
                                <a href="{% url 'plugins:netbox_oxidized_viewer:device_commit' pk=object.pk sha_new=commit.sha %}" class="btn btn-sm btn-ghost-primary">Diff</a>
                            </td>
                        </tr>
                        {% empty %}
                        <tr>
                            <td colspan="6" class="text-center text-muted">No commits found.</td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>

    </div>
</div>
{% endblock content %}

{% block javascript %}
{{ block.super }}
<script src="{% static 'netbox_oxidized_viewer/prism/prism.min.js' %}"></script>
<script src="{% static 'netbox_oxidized_viewer/prism/prism-bash.min.js' %}"></script>
{% endblock javascript %}