{% extends "base.html" %}

{% block title %}{{ snapshot.Name }}{% endblock %}

{% block content %}
<div class="row">
  <div class="col-12">
    <nav aria-label="breadcrumb">
      <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="{{ url_for('snapshots') }}">Snapshots</a></li>
        <li class="breadcrumb-item active">{{ snapshot.Name }}</li>
      </ol>
    </nav>

    <h2 class="mb-4">{{ snapshot.Name }}</h2>
    
    <div class="card mb-4">
      <div class="card-header">
        <h5 class="mb-0">Snapshot Information</h5>
      </div>
      <div class="card-body">
        <div class="row">
          <div class="col-md-6">
            <p><strong>Name:</strong> {{ snapshot.Name }}</p>
            <p><strong>Description:</strong> {{ snapshot.Description or 'No description' }}</p>
            <p><strong>Created:</strong> {{ snapshot.CreatedAt[:19] if snapshot.CreatedAt else 'Unknown' }}</p>
          </div>
          <div class="col-md-6">
            <p><strong>Source Kind:</strong> 
              {% if snapshot.SourceKind == 'snapshot' %}
                <span class="badge bg-info">Snapshot</span>
              {% elif snapshot.SourceKind == 'repo' %}
                <span class="badge bg-success">Repository</span>
              {% else %}
                <span class="badge bg-secondary">{{ snapshot.SourceKind or 'Unknown' }}</span>
              {% endif %}
            </p>
            <p><strong>Source IDs:</strong> {{ snapshot.SourceIDs|join(', ') if snapshot.SourceIDs else 'None' }}</p>
          </div>
        </div>
      </div>
    </div>

    <div class="card">
      <div class="card-header d-flex justify-content-between align-items-center">
        <h5 class="mb-0">Packages 
          {% if pagination %}
            ({{ pagination.total_items }} total)
          {% else %}
            ({{ packages|length }})
          {% endif %}
        </h5>
        
        <!-- Search Box -->
        <div class="col-md-4">
          <form method="GET" class="d-flex">
            <input type="text" 
                   name="q" 
                   class="form-control form-control-sm" 
                   placeholder="Search packages..." 
                   value="{{ search_query }}">
            <button type="submit" class="btn btn-sm btn-outline-primary ms-2">Search</button>
            {% if search_query %}
              <a href="{{ url_for('snapshot_detail', name=snapshot.Name) }}" 
                 class="btn btn-sm btn-outline-secondary ms-1">Clear</a>
            {% endif %}
          </form>
        </div>
      </div>
      
      {% if packages %}
      <div class="card-body p-0">
        <div class="table-responsive">
          <table class="table table-hover mb-0">
            <thead class="table-light">
              <tr>
                <th>Package</th>
                <th>Version</th>
                <th>Architecture</th>
              </tr>
            </thead>
            <tbody>
              {% for package in packages %}
              <tr>
                <td><strong>{{ package.name }}</strong></td>
                <td>{{ package.version }}</td>
                <td>
                  {% for arch in package.architectures %}
                    <span class="badge bg-light text-dark">{{ arch }}</span>
                  {% endfor %}
                </td>
              </tr>
              {% endfor %}
            </tbody>
          </table>
        </div>
        
        <!-- Pagination Controls -->
        {% if pagination and pagination.total_pages > 1 %}
        <div class="card-footer">
          <nav aria-label="Package pagination">
            <ul class="pagination pagination-sm justify-content-center mb-0">
              
              <!-- Previous Button -->
              {% if pagination.has_previous %}
                <li class="page-item">
                  <a class="page-link" href="{{ url_for('snapshot_detail', name=snapshot.Name, page=pagination.previous_page, q=search_query) }}">
                    &laquo; Previous
                  </a>
                </li>
              {% else %}
                <li class="page-item disabled">
                  <span class="page-link">&laquo; Previous</span>
                </li>
              {% endif %}
              
              <!-- Page Numbers (smart pagination) -->
              {% set start_page = [1, pagination.current_page - 2]|max %}
              {% set end_page = [pagination.total_pages, pagination.current_page + 2]|min %}
              
              <!-- Show first page if we're not starting from 1 -->
              {% if start_page > 1 %}
                <li class="page-item">
                  <a class="page-link" href="{{ url_for('snapshot_detail', name=snapshot.Name, page=1, q=search_query) }}">
                    1
                  </a>
                </li>
                {% if start_page > 2 %}
                  <li class="page-item disabled">
                    <span class="page-link">...</span>
                  </li>
                {% endif %}
              {% endif %}
              
              <!-- Show current page range -->
              {% for page_number in range(start_page, end_page + 1) %}
                {% if page_number == pagination.current_page %}
                  <li class="page-item active">
                    <span class="page-link">{{ page_number }}</span>
                  </li>
                {% else %}
                  <li class="page-item">
                    <a class="page-link" href="{{ url_for('snapshot_detail', name=snapshot.Name, page=page_number, q=search_query) }}">
                      {{ page_number }}
                    </a>
                  </li>
                {% endif %}
              {% endfor %}
              
              <!-- Show last page if we're not ending at the last page -->
              {% if end_page < pagination.total_pages %}
                {% if end_page < pagination.total_pages - 1 %}
                  <li class="page-item disabled">
                    <span class="page-link">...</span>
                  </li>
                {% endif %}
                <li class="page-item">
                  <a class="page-link" href="{{ url_for('snapshot_detail', name=snapshot.Name, page=pagination.total_pages, q=search_query) }}">
                    {{ pagination.total_pages }}
                  </a>
                </li>
              {% endif %}
              
              <!-- Next Button -->
              {% if pagination.has_next %}
                <li class="page-item">
                  <a class="page-link" href="{{ url_for('snapshot_detail', name=snapshot.Name, page=pagination.next_page, q=search_query) }}">
                    Next &raquo;
                  </a>
                </li>
              {% else %}
                <li class="page-item disabled">
                  <span class="page-link">Next &raquo;</span>
                </li>
              {% endif %}
              
            </ul>
          </nav>
          
          <!-- Simple Pagination Info -->
          <div class="text-center mt-2">
            <small class="text-muted">
              Page {{ pagination.current_page }} of {{ pagination.total_pages }} 
              ({{ pagination.total_items }} total packages)
            </small>
          </div>
        </div>
        {% endif %}
      </div>
      {% else %}
      <div class="card-body">
        <div class="alert alert-info mb-0">
          {% if search_query %}
            <p class="mb-0">No packages found matching "{{ search_query }}".</p>
          {% else %}
            <p class="mb-0">No packages found in this snapshot.</p>
          {% endif %}
        </div>
      </div>
      {% endif %}
    </div>
  </div>
</div>
{% endblock %}