{% extends "base.html" %}
{% block content %}

<h2>My Property</h2>

{% if properties %}
    {% for property in properties %}
        <div class="card mb-4">
            <div class="card-body">

                <!-- Property Address -->
                <h5 class="card-title">
                    {{ property.address }}
                </h5>

                <!-- Report History -->
                <h6 class="mt-3">Report History</h6>

                {% if property.reports %}
                    <ul class="list-group list-group-flush">
                        {% for report in property.reports %}
                            <li class="list-group-item d-flex justify-content-between align-items-center">
                                <span>
                                    Report #{{ report.id }} —
                                    {{ report.created_at.strftime("%d %b %Y") }}
                                </span>

                                <a class="btn btn-sm btn-outline-secondary"
                                   href="{{ url_for('reports.export_pdf', report_id=report.id) }}">
                                    Export PDF
                                </a>
                            </li>
                        {% endfor %}
                    </ul>
                {% else %}
                    <p class="text-muted mt-2">
                        No reports for this property yet.
                    </p>
                {% endif %}

            </div>
        </div>
    {% endfor %}
{% else %}
    <p class="text-muted">No properties added yet.</p>
{% endif %}

{% endblock %}