{% extends "base.html" %}
{% block title %}Manage Projects — Ontoref{% endblock title %}

{% block content %}
<div class="mb-6 flex items-center justify-between">
  <h1 class="text-xl font-bold">Manage Projects</h1>
  <div class="flex items-center gap-2">
    {% if daemon_admin_enabled %}
    <a href="/ui/manage/logout" class="btn btn-xs btn-ghost gap-1 text-base-content/40 hover:text-error">
      <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
              d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"/>
      </svg>
      logout
    </a>
    {% endif %}
  </div>
</div>

{% if error %}
<div class="alert alert-error mb-4 text-sm">
  <svg class="w-5 h-5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
  </svg>
  <span>{{ error }}</span>
</div>
{% endif %}

<!-- Registered Projects -->
<div class="mb-6">
  <h2 class="text-sm font-semibold text-base-content/50 uppercase tracking-wider mb-3">Registered Projects</h2>
  {% if projects %}
  <div class="overflow-x-auto rounded-lg border border-base-content/10">
    <table class="table table-sm w-full">
      <thead>
        <tr class="text-xs text-base-content/40 uppercase tracking-wider">
          <th>Slug</th>
          <th>Root</th>
          <th>Mode</th>
          <th>Auth</th>
          <th>Persisted</th>
          <th class="text-right">Actions</th>
        </tr>
      </thead>
      <tbody>
        {% for p in projects %}
        <tr class="hover:bg-base-200/50">
          <td class="font-mono font-medium">
            {% if not p.push_only %}
            <a href="/ui/{{ p.slug }}/" class="link link-hover text-primary">{{ p.slug }}</a>
            {% else %}
            <span class="text-base-content/60">{{ p.slug }}</span>
            {% endif %}
          </td>
          <td class="font-mono text-xs text-base-content/60 max-w-xs truncate" title="{{ p.root }}">{{ p.root }}</td>
          <td>
            {% if p.opmode == "daemon" %}
            <span class="badge badge-xs badge-success gap-1">
              <span class="w-1 h-1 rounded-full bg-current inline-block"></span>daemon
            </span>
            {% else %}
            <span class="badge badge-xs badge-info">push</span>
            {% endif %}
          </td>
          <td>
            {% if p.auth %}
            <span class="badge badge-xs badge-warning" title="{{ p.roles | join(sep=', ') }}">
              {{ p.key_count }} key{% if p.key_count != 1 %}s{% endif %}
            </span>
            {% else %}
            <span class="badge badge-xs badge-ghost">open</span>
            {% endif %}
          </td>
          <td>
            {% if p.in_projects_ncl %}
            <span class="badge badge-xs badge-ghost text-success">✓</span>
            {% else %}
            <span class="badge badge-xs badge-warning" title="In memory only — will be lost on restart">memory only</span>
            {% endif %}
          </td>
          <td class="text-right">
            <form method="post" action="/ui/manage/remove" class="inline"
                  onsubmit="return confirm('Remove project {{ p.slug }}?')">
              <input type="hidden" name="slug" value="{{ p.slug }}">
              <button type="submit" class="btn btn-xs btn-error btn-outline">Remove</button>
            </form>
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
  {% else %}
  <div class="text-center py-10 text-base-content/30 text-sm border border-base-content/10 rounded-lg">
    No projects registered. Add one below.
  </div>
  {% endif %}
</div>

<!-- Add Project Form -->
<div class="card bg-base-200 border border-base-content/10">
  <div class="card-body p-5">
    <h2 class="card-title text-sm font-semibold">Add Project</h2>
    <p class="text-xs text-base-content/40 -mt-1">Slug and import paths are read from <code>.ontoref/project.ncl</code>. Change is persisted to <code>~/.config/ontoref/projects.ncl</code>.</p>
    <form method="post" action="/ui/manage/add" class="flex flex-col sm:flex-row gap-3 mt-2">
      <div class="form-control flex-1">
        <label class="label py-1">
          <span class="label-text text-xs text-base-content/60">Absolute root path</span>
        </label>
        <input type="text" name="root" required placeholder="/path/to/project"
               class="input input-bordered input-sm font-mono">
      </div>
      <div class="flex items-end">
        <button type="submit" class="btn btn-sm btn-primary">Add</button>
      </div>
    </form>
  </div>
</div>
{% endblock content %}