{% extends "base.html" %}

{% block title %}View Source: {{ source.name }} - PoliSage{% endblock %}

{% block content %}
<div class="container mt-4">
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ url_for("index") }}">Dashboard</a></li>
            <li class="breadcrumb-item"><a href="{{ url_for("monitoring.list_sources") }}">Monitoring Sources</a></li>
            <li class="breadcrumb-item active" aria-current="page">{{ source.name }}</li>
        </ol>
    </nav>

    <h2>{{ source.name }}</h2>
    <p class="text-muted">Source ID: {{ source.id }} | Added: {{ source.created_at.strftime("%Y-%m-%d") }}</p>

    <div class="card mb-4">
        <div class="card-header">
            Source Details
        </div>
        <div class="card-body">
            <dl class="row">
                <dt class="col-sm-3">URL</dt>
                <dd class="col-sm-9"><a href="{{ source.url }}" target="_blank">{{ source.url }}</a></dd>

                <dt class="col-sm-3">Type</dt>
                <dd class="col-sm-9"><span class="badge bg-secondary">{{ source.type }}</span></dd>

                <dt class="col-sm-3">Check Frequency</dt>
                <dd class="col-sm-9">{{ source.frequency_minutes }} minutes</dd>

                <dt class="col-sm-3">Status</dt>
                <dd class="col-sm-9"><span class="badge {{ "bg-success" if source.is_active else "bg-danger" }}">{{ "Active" if source.is_active else "Inactive" }}</span></dd>

                <dt class="col-sm-3">Last Checked</dt>
                <dd class="col-sm-9">{{ source.last_checked.strftime("%Y-%m-%d %H:%M") if source.last_checked else "Never" }}</dd>
            </dl>
        </div>
        <div class="card-footer">
            <!-- Add buttons for editing, triggering check, etc. later -->
            <a href="#" class="btn btn-secondary disabled">Edit Source (Not Implemented)</a>
            <a href="#" class="btn btn-info disabled">Check Now (Not Implemented)</a>
        </div>
    </div>

    <h4>Recent Events from this Source</h4>
    {% set events = source.events | sort(attribute=\"detected_at\", reverse=True) %}
    {% if events %}
        <div class="list-group">
            {% for event in events[:10] %} {# Show latest 10 events #}
                <a href="{{ url_for("monitoring.view_event", event_id=event.id) }}" class="list-group-item list-group-item-action flex-column align-items-start">
                    <div class="d-flex w-100 justify-content-between">
                        <h5 class="mb-1">{{ event.event_summary | truncate(100) }}</h5>
                        <small>{{ event.detected_at.strftime("%Y-%m-%d %H:%M") }}</small>
                    </div>
                    <p class="mb-1">Status: <span class="badge bg-light text-dark">{{ event.status }}</span></p>
                </a>
            {% endfor %}
        </div>
        {% if events|length > 10 %}
            <p class="mt-2"><a href="{{ url_for("monitoring.list_events", source_id=source.id) }}">View all events from this source...</a></p>
        {% endif %}
    {% else %}
        <div class="alert alert-light" role="alert">
            No events detected from this source yet.
        </div>
    {% endif %}

</div>
{% endblock %}