{% extends 'admin/layout.twig' %}
{% block title %}{{ article ? 'Edit Article' : 'New Article' }} — Admin{% endblock %}
{% block content %}
    <div class="admin-page-head">
        <p class="breadcrumbs"><a href="{{ app_url('/admin/kb') }}">Knowledge Base</a> / {{ article ? article.title : 'New Article' }}</p>
        <h1>{{ article ? 'Edit article' : 'New article' }}</h1>
    </div>

    <form method="post" action="{{ article ? app_url('/admin/kb/' ~ article.id ~ '/edit') : app_url('/admin/kb/new') }}" class="form kb-form">
        {{ csrf_field()|raw }}

        <div class="kb-edit-grid">
            <div class="kb-edit-main">
                <div class="form-row">
                    <label>Title</label>
                    <input type="text" name="title" value="{{ article.title ?? old('title') }}" required>
                </div>
                <div class="form-row">
                    <label>Excerpt <span class="muted small">(optional summary)</span></label>
                    <input type="text" name="excerpt" value="{{ article.excerpt ?? old('excerpt') }}" maxlength="200">
                </div>
                <div class="form-row">
                    <label>Content</label>
                    <textarea name="content" id="article-body" rows="20">{{ article.content ?? old('content') }}</textarea>
                </div>
            </div>
            <aside class="kb-edit-side">
                <div class="card">
                    <h3>Publishing</h3>
                    <div class="form-row">
                        <label class="checkbox">
                            <input type="checkbox" name="published" value="1" {{ article and article.published ? 'checked' : '' }}>
                            Published
                        </label>
                    </div>
                    <div class="form-row">
                        <label>Category</label>
                        <select name="category_id">
                            <option value="">Uncategorised</option>
                            {% for c in categories %}
                                <option value="{{ c.id }}" {{ article and article.category_id == c.id ? 'selected' : '' }}>{{ c.name }}</option>
                            {% endfor %}
                        </select>
                    </div>
                    <div class="form-row">
                        <label>Tags <span class="muted small">(comma-separated)</span></label>
                        <input type="text" name="tags" value="{{ article.tags ?? '' }}">
                    </div>
                    <div class="form-actions">
                        <button type="submit" class="btn btn-primary block">{{ article ? 'Save' : 'Create' }}</button>
                    </div>
                </div>
                {% if article %}
                <div class="card">
                    <h3>Stats</h3>
                    <p class="small">
                        Views: <strong>{{ article.views }}</strong><br>
                        Helpful: 👍 {{ article.helpful_yes }} · 👎 {{ article.helpful_no }}<br>
                        Slug: <code>{{ article.slug }}</code><br>
                        Created: {{ article.created_at|time_ago }}
                    </p>
                    <a class="btn btn-light block" href="{{ app_url('/kb/article/' ~ article.slug) }}" target="_blank">View public</a>
                </div>
                {% if current_user().role == 'admin' %}
                <form method="post" action="{{ app_url('/admin/kb/' ~ article.id ~ '/delete') }}" onsubmit="return confirm('Delete this article?');" class="card">
                    {{ csrf_field()|raw }}
                    <button type="submit" class="btn btn-danger block">Delete article</button>
                </form>
                {% endif %}
                {% endif %}
            </aside>
        </div>
    </form>
{% endblock %}
{% block scripts %}
    {% include 'partials/tinymce.twig' with {selector: '#article-body', allow_images: true, height: 600, menubar: true} %}
{% endblock %}