{% extends "withnav_template.html" %}

{% from "components/show-more.html" import show_more %}
{% from "components/table.html" import list_table, field, right_aligned_field_heading, hidden_field_heading %}
{% from "components/ajax-block.html" import ajax_block %}

{% block service_page_title %}
  Dashboard
{% endblock %}

{% block maincolumn_content %}

  <div class="dashboard margin-bottom-8">

    <h1 class="usa-sr-only">Dashboard</h1>
    {% if current_user.has_permissions('manage_templates') and not current_service.all_templates %}
      {% include 'views/dashboard/write-first-messages.html' %}
    {% endif %}

    {{ ajax_block(partials, updates_url, 'upcoming') }}

    <h2 class="font-body-xl margin-0">
      Messages sent
    </h2>
    <p class="margin-top-0">In the last seven days</p>

    {{ ajax_block(partials, updates_url, 'inbox') }}

    {{ ajax_block(partials, updates_url, 'totals') }}

    {{ ajax_block(partials, updates_url, 'template-statistics') }}

    <h2 class="margin-top-4 margin-bottom-1">Usage</h2>
    <h3 class="margin-bottom-0">Daily</h3>
    <p class="margin-0">Across all services</p>
    <table class="usa-table usa-table--borderless margin-top-1 margin-bottom-5">
      <caption class="usa-sr-only">
        Daily
      </caption>
      <thead>
        <tr>
          <th scope="col">Usage</th>
          <th scope="col">Remaining</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>{{ 5000 - daily_global_messages_remaining }}</td>
          <td>
            {{ daily_global_messages_remaining }}
          </td>
        </tr>
      </tbody>
    </table>

    {% if current_user.has_permissions('manage_service') %}
      <h3 class='margin-bottom-0'>2023</h3>
      {{ ajax_block(partials, updates_url, 'usage') }}
      {{ show_more(
        url_for(".usage", service_id=current_service['id']),
        'See all usage'
      ) }}
    {% endif %}
  </div>

{% endblock %}