{% extends "base.html" %}

{% block title %}dashboard - irc.now{% endblock %}

{% block banner %}{% include "partials/announcement.html" %}{% endblock %}
{% block flash %}{% include "partials/flash.html" %}{% endblock %}
{% block content %}
<div class="content">
  <h1>dashboard</h1>

  <div class="card">
    <h2>bouncer</h2>
    {% if has_bouncer %}
    {% if bouncer_ready %}
    <p>your bouncer is <span style="color: var(--g);">running</span></p>
    {% else %}
    <p>your bouncer is <span style="color: #E08080;">not ready</span></p>
    {% endif %}
    <div class="stats-grid">
      <div class="stat">
        <span class="stat-value">{{ bouncer_uptime }}</span>
        <span class="stat-label">uptime</span>
      </div>
      <div class="stat">
        <span class="stat-value">{{ networks }}</span>
        <span class="stat-label">networks</span>
      </div>
      <div class="stat">
        <span class="stat-value">{{ channels }}</span>
        <span class="stat-label">channels</span>
      </div>
      <div class="stat">
        <span class="stat-value">{{ messages_relayed }}</span>
        <span class="stat-label">messages</span>
      </div>
    </div>
    <div class="card-actions">
      <a href="/bouncers" class="btn-fill">manage bouncers</a>
      <a href="https://chat.irc.now" class="btn-outline">open chat</a>
    </div>
    {% else %}
    <p>no bouncer configured</p>
    <a href="/bouncers" class="btn-fill">create bouncer</a>
    {% endif %}
  </div>

  <div class="card">
    <h2>content</h2>
    <div class="stats-grid">
      <div class="stat">
        <span class="stat-value">{{ paste_count }}</span>
        <span class="stat-label">pastes ({{ paste_storage }})</span>
      </div>
      <div class="stat">
        <span class="stat-value">{{ pic_count }}</span>
        <span class="stat-label">images ({{ pic_storage }})</span>
      </div>
    </div>
  </div>

  <div class="card">
    <h2>plan</h2>
    <p>{{ plan }}</p>
    {% if !is_pro %}
    <a href="/billing" class="btn-fill">upgrade to pro</a>
    {% endif %}
  </div>

  <div class="card">
    <h2>account</h2>
    <p>manage your display name, email, and password.</p>
    <a href="/profile" class="btn-fill">edit profile</a>
  </div>
</div>
{% endblock %}
