{% extends "library/base.html" %}

{% block title %}Use in a project | clrnoise{% endblock %}

{% block content %}
<section class="view-header">
    <p class="eyebrow">Project assignment</p>
    <h1>Use in a project</h1>
    <p class="lede">{{ paper.title }}</p>
    <div class="header-actions">
        <a class="button button--ghost" href="{% url 'library:paper-detail' paper.pk %}">Cancel</a>
    </div>
</section>

<form method="post" class="editor-layout">
    {% csrf_token %}

    {# ── Existing projects ──────────────────────────────────────────────────── #}
    <section class="panel panel--wide">
        <div class="section-heading">
            <div>
                <p class="section-heading__eyebrow">Select projects</p>
                <h2>Add to existing projects</h2>
            </div>
            <span class="section-count">{{ all_projects|length }} project{{ all_projects|length|pluralize }}</span>
        </div>

        {% if all_projects %}
            <p class="help-text" style="margin-bottom:16px">Check every project this paper belongs to. Unchecking removes it.</p>
            <div class="selection-list">
                {% for project in all_projects %}
                    <label class="selection-row">
                        <input
                            type="checkbox"
                            name="add_project_ids"
                            value="{{ project.pk }}"
                            {% if project.pk in current_project_ids %}checked{% endif %}
                        >
                        <span class="selection-row__body">
                            <strong class="selection-row__title">{{ project.name }}</strong>
                            <span class="selection-row__meta">
                                {{ project.paper_total }} paper{{ project.paper_total|pluralize }}
                                {% if project.focus %} · {{ project.focus }}{% endif %}
                            </span>
                            {% if project.pk in current_project_ids %}
                                <span class="selection-row__text" style="color:var(--accent);font-weight:600;">Already in this project</span>
                            {% endif %}
                        </span>
                    </label>
                {% endfor %}
            </div>
        {% else %}
            <div class="empty-state">
                <h3>No projects yet</h3>
                <p>Create your first project using the form on the right.</p>
            </div>
        {% endif %}
    </section>

    {# ── Create new project ─────────────────────────────────────────────────── #}
    <section class="panel">
        <div class="section-heading">
            <div>
                <p class="section-heading__eyebrow">Or start fresh</p>
                <h2>Create a new project</h2>
            </div>
        </div>
        <div class="form-grid form-grid--single">
            <div class="field">
                <label for="new-name">Project name</label>
                <input
                    class="input-control"
                    type="text"
                    id="new-name"
                    name="new_name"
                    placeholder="e.g. Transformer architectures review"
                >
            </div>
            <div class="field">
                <label for="new-focus">Research focus <span class="help-text">(optional)</span></label>
                <input
                    class="input-control"
                    type="text"
                    id="new-focus"
                    name="new_focus"
                    placeholder="e.g. Attention mechanisms in NLP"
                >
                <p class="help-text">A one-line framing of what this review covers.</p>
            </div>
        </div>
    </section>

    <div class="form-actions">
        <a class="button button--ghost" href="{% url 'library:paper-detail' paper.pk %}">Cancel</a>
        <button class="button" type="submit">Save assignments</button>
    </div>
</form>
{% endblock %}