{% extends "base.html" %}
{% block title %}Accounts — Mastodon Collector{% endblock %}

{% block content %}
<div class="flex justify-between items-center mb-4">
    <h1>Monitored Accounts</h1>
</div>

<div class="card mb-4">
    <h2>Add Account</h2>
    <form method="POST" action="{{ url_for('accounts_add') }}" class="form-inline mt-2">
        <input type="text" name="handle" placeholder="@user@instance.social" style="width: 320px;" required>
        <button type="submit" class="btn btn-primary">Add Account</button>
    </form>
    <p class="text-muted text-sm mt-2">
        You can also add accounts by editing <code>accounts.txt</code> — the collector picks them up automatically.
    </p>
</div>

<div class="card">
    <table>
        <thead>
            <tr>
                <th>Handle</th>
                <th>Display Name</th>
                <th>Account ID</th>
                <th>Status</th>
                <th>Last Collected</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
            {% for acct in accounts %}
            <tr>
                <td>
                    <a href="{{ url_for('statuses_list', account_id=acct.id) }}" style="color: var(--accent);">
                        {{ acct.handle }}
                    </a>
                </td>
                <td>{{ acct.display_name or '—' }}</td>
                <td class="text-muted text-sm">{{ acct.account_id or 'unresolved' }}</td>
                <td>
                    {% if acct.is_active %}
                        <span class="badge badge-active">Active</span>
                    {% else %}
                        <span class="badge badge-paused">Paused</span>
                    {% endif %}
                </td>
                <td class="text-muted text-sm">
                    {{ acct.last_collected_at.strftime('%Y-%m-%d %H:%M') if acct.last_collected_at else 'Never' }}
                </td>
                <td>
                    <div class="flex gap-2">
                        <form method="POST" action="{{ url_for('accounts_toggle', account_id=acct.id) }}">
                            <button type="submit" class="btn btn-outline btn-sm">
                                {{ 'Pause' if acct.is_active else 'Resume' }}
                            </button>
                        </form>
                        <form method="POST" action="{{ url_for('accounts_delete', account_id=acct.id) }}"
                              onsubmit="return confirm('Delete {{ acct.handle }} and ALL collected data? This cannot be undone.')">
                            <button type="submit" class="btn btn-danger btn-sm">Delete</button>
                        </form>
                    </div>
                </td>
            </tr>
            {% endfor %}
            {% if not accounts %}
            <tr>
                <td colspan="6" class="text-muted" style="text-align:center; padding: 24px;">
                    No accounts yet. Add one above or edit <code>accounts.txt</code>.
                </td>
            </tr>
            {% endif %}
        </tbody>
    </table>
</div>
{% endblock %}