{% extends "base.html" %}

{% block content %}
  <div class="d-flex flex-column gap-3">
    <div class="d-flex flex-column flex-md-row align-items-md-center justify-content-between gap-3">
      {% include "partials/repo_heading.html" %}
      <div class="d-flex flex-column flex-md-row align-items-md-center gap-2">
        <div class="text-muted">
          Branch: <span class="fw-semibold">{{ branch_label }}</span>
        </div>
        {% if not empty_repo %}
          <div class="dropdown">
            <button
              class="btn btn-sm btn-outline-secondary dropdown-toggle"
              type="button"
              id="repo-download-dropdown"
              data-bs-toggle="dropdown"
              aria-expanded="false"
            >
              Download
            </button>
            <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="repo-download-dropdown">
              <li><a class="dropdown-item" href="{{ download_tar_path }}">.tar.gz</a></li>
              <li><a class="dropdown-item" href="{{ download_zip_path }}">.zip</a></li>
            </ul>
          </div>
        {% endif %}
        {% set repo_tab = "files" %}
        {% set repo_tab_label = "Files" %}
        {% set repo_view_files_href = breadcrumbs[0].href %}
        {% include "partials/repo_tabs.html" %}
      </div>
    </div>

    {% include "partials/repo_clone_url.html" %}

    <div class="card">
      <div class="card-header d-flex align-items-center justify-content-between">
        <div>
          <span class="fw-semibold">Files</span>
          <span class="text-muted small ms-2">
            {{ dir_count }} dirs · {{ file_count }} files{% if other_count > 0 %} · {{ other_count }} others{% endif %}
          </span>
        </div>
        <div class="d-flex align-items-center gap-2">
          {% if repo.visibility == "public" %}
            <span class="badge text-bg-success">Public</span>
          {% else %}
            <span class="badge text-bg-secondary">Private</span>
          {% endif %}
        </div>
      </div>
      <div class="card-body">
        {% if empty_repo %}
          <p class="text-muted mb-0">No commits yet.</p>
        {% else %}
          {% set nav_class = "mb-3 pearing-breadcrumb-case" %}
          {% set list_class = "breadcrumb mb-0" %}
          {% include "partials/breadcrumbs.html" %}
          <div class="table-responsive">
            <table class="table table-sm align-middle mb-0">
              <thead>
                <tr>
                  <th scope="col">Name</th>
                  <th scope="col" class="text-end">Size</th>
                </tr>
              </thead>
              <tbody>
                {% for entry in entries %}
                  <tr>
                    <td>
                      {% if entry.kind == "dir" %}
                        <span class="badge text-bg-primary text-uppercase small me-2">{{ entry.kind }}</span>
                      {% elif entry.kind == "file" %}
                        <span class="badge text-bg-secondary text-uppercase small me-2">{{ entry.kind }}</span>
                      {% elif entry.kind == "symlink" %}
                        <span class="badge text-bg-info text-uppercase small me-2">{{ entry.kind }}</span>
                      {% elif entry.kind == "submodule" %}
                        <span class="badge text-bg-dark text-uppercase small me-2">{{ entry.kind }}</span>
                      {% else %}
                        <span class="badge text-bg-light border text-muted text-uppercase small me-2">{{ entry.kind }}</span>
                      {% endif %}
                      {% if entry.href %}
                        <a class="font-monospace" href="{{ entry.href }}">{{ entry.name }}</a>
                      {% else %}
                        <span class="font-monospace">{{ entry.name }}</span>
                      {% endif %}
                    </td>
                    <td class="text-end text-muted small">{{ entry.size }}</td>
                  </tr>
                {% endfor %}
              </tbody>
            </table>
          </div>
        {% endif %}
      </div>
    </div>
  </div>
{% endblock %}