{% extends "base.html" %}
{% block title %}Projects - FC CI{% endblock %}
{% block auth %}
{% if !auth_name.is_empty() %}
<span class="auth-user">{{ auth_name }}</span>
<form method="POST" action="/logout"><button type="submit">Logout</button></form>
{% else %}
<a href="/login">Login</a>
{% endif %}
{% endblock %}
{% block content %}
<h1>Projects</h1>

{% if is_admin %}
<p class="action-bar"><a href="/projects/new" class="btn">New Project (Setup Wizard)</a></p>
<details>
  <summary>Quick create (no probe)</summary>
  <div class="form-card">
    <form id="create-project-form">
      <div class="form-group">
        <label for="project-name">Name</label>
        <input type="text" id="project-name" required>
      </div>
      <div class="form-group">
        <label for="project-repo">Repository URL</label>
        <input type="url" id="project-repo" required>
      </div>
      <div class="form-group">
        <label for="project-desc">Description</label>
        <textarea id="project-desc"></textarea>
      </div>
      <button type="submit" class="btn">Create Project</button>
    </form>
    <div id="project-msg"></div>
  </div>
</details>
{% endif %}

{% if projects.is_empty() %}
<div class="empty">
  <div class="empty-title">No projects yet</div>
  {% if is_admin %}
  <div class="empty-hint">Create a project using the button above to get started.</div>
  {% else %}
  <div class="empty-hint">Projects will appear here once an administrator creates them.</div>
  {% endif %}
</div>
{% else %}
<div class="table-wrap">
<table>
  <thead>
    <tr><th>Name</th><th>Repository</th><th>Created</th></tr>
  </thead>
  <tbody>
    {% for p in projects %}
    <tr>
      <td><a href="/project/{{ p.id }}">{{ p.name }}</a></td>
      <td>{{ p.repository_url }}</td>
      <td>{{ p.created_at.format("%Y-%m-%d %H:%M") }}</td>
    </tr>
    {% endfor %}
  </tbody>
</table>
</div>
{% if total_pages > 1 %}
<div class="pagination">
  {% if has_prev %}
  <a href="/projects?offset={{ prev_offset }}&limit={{ limit }}">&laquo; Previous</a>
  {% endif %}
  <span>Page {{ page }} of {{ total_pages }}</span>
  {% if has_next %}
  <a href="/projects?offset={{ next_offset }}&limit={{ limit }}">Next &raquo;</a>
  {% endif %}
</div>
{% endif %}
{% endif %}
{% endblock %}
{% block scripts %}
{% if is_admin %}
<script>
document.getElementById('create-project-form')?.addEventListener('submit', async (e) => {
  e.preventDefault();
  const msg = document.getElementById('project-msg');
  try {
    const res = await fetch('/api/v1/projects', {
      method: 'POST',
      headers: {'Content-Type': 'application/json'},
      body: JSON.stringify({
        name: document.getElementById('project-name').value,
        repository_url: document.getElementById('project-repo').value,
        description: document.getElementById('project-desc').value || null,
      }),
    });
    if (!res.ok) {
      const err = await res.json().catch(() => ({ error: res.statusText }));
      throw new Error(err.error || err.message || 'Unknown error');
    }
    window.location.reload();
  } catch(err) {
    showError(msg, err.message);
  }
});
</script>
{% endif %}
{% endblock %}