{% extends 'base.html' %}
{% block content %}
<div class="container mt-4">
  <h3>Document Management</h3>

  <!-- Add New Category Form -->
  <form method="post" action="{{ url_for('documents.add_document_category') }}" class="row g-2 my-3">
    <div class="col-md-4">
      <input type="text" name="name" class="form-control" placeholder="Category Name" required>
    </div>
    <div class="col-md-5">
      <input type="text" name="description" class="form-control" placeholder="Description">
    </div>
    <div class="col-md-3">
      <button class="btn btn-primary w-100" type="submit">Add Category</button>
    </div>
  </form>

  <hr>

  {% for cat in categories %}
    <div class="card my-3">
      <div class="card-header d-flex justify-content-between align-items-center">
        <h5 class="mb-0">{{ cat.name }}</h5>
        <form method="post" action="{{ url_for('documents.delete_document_category', cat_id=cat.id) }}">
          <button class="btn btn-sm btn-danger" onclick="return confirm('Delete category and its documents?')">Delete</button>
        </form>
      </div>
      <div class="card-body">

        <!-- Upload Form -->
        <form method="post" action="{{ url_for('documents.upload_document') }}" enctype="multipart/form-data" class="row g-2 mb-3">
          <input type="hidden" name="category_id" value="{{ cat.id }}">
          <div class="col-md-8">
            <input type="file" name="file" class="form-control" required>
          </div>
          <div class="col-md-4">
            <button class="btn btn-success w-100" type="submit">Upload Document</button>
          </div>
        </form>

        <!-- List Documents -->
        <ul class="list-group">
          {% for doc in cat.documents %}
            <li class="list-group-item d-flex justify-content-between align-items-center">
              {{ doc.filename }}
              <div>
                <a href="{{ url_for('documents.download_document', doc_id=doc.id) }}" class="btn btn-sm btn-outline-primary">Download</a>
                <form method="post" action="{{ url_for('documents.delete_document', doc_id=doc.id) }}" style="display:inline;">
                  <button class="btn btn-sm btn-outline-danger" onclick="return confirm('Delete this document?')">Delete</button>
                </form>
              </div>
            </li>
          {% else %}
            <li class="list-group-item">No documents uploaded.</li>
          {% endfor %}
        </ul>
      </div>
    </div>
  {% else %}
    <p>No categories created yet.</p>
  {% endfor %}
</div>
{% endblock %}