{% from "components/big-number.html" import big_number_with_status %}
{% from "components/message-count-label.html" import message_count_label %}

<div class="ajax-block-container">
  <div class="grid-row">
    <div id="total-email" class="{{column_width}}">
      {{ big_number_with_status(
        statistics['email']['requested'],
        message_count_label(statistics['email']['requested'], 'email', suffix='sent'),
        statistics['email']['failed'],
        statistics['email']['failed_percentage'],
        statistics['email']['show_warning'],
        failure_link=url_for(".view_notifications", service_id=service_id, message_type='email', status='failed'),
        link=url_for(".view_notifications", service_id=service_id, message_type='email', status='sending,delivered,failed'),
        smaller=smaller_font_size
      ) }}
    </div>
    <div id="total-sms" class="{{column_width}}">
      {{ big_number_with_status(
        statistics['sms']['requested'],
        message_count_label(statistics['sms']['requested'], 'sms', suffix='sent'),
        statistics['sms']['failed'],
        statistics['sms']['failed_percentage'],
        statistics['sms']['show_warning'],
        failure_link=url_for(".view_notifications", service_id=service_id, message_type='sms', status='failed'),
        link=url_for(".view_notifications", service_id=service_id, message_type='sms', status='sending,delivered,failed'),
        smaller=smaller_font_size
      ) }}
    </div>
    {% if current_service.has_permission('letter') %}
      <div id="total-letters" class="{{column_width}}">
        {{ big_number_with_status(
          statistics['letter']['requested'],
          message_count_label(statistics['letter']['requested'], 'letter', suffix='sent'),
          statistics['letter']['failed'],
          statistics['letter']['failed_percentage'],
          statistics['letter']['show_warning'],
          failure_link=url_for(".view_notifications", service_id=service_id, message_type='letter', status='failed'),
          link=url_for(".view_notifications", service_id=service_id, message_type='letter', status=''),
          smaller=smaller_font_size
        ) }}
      </div>
    {% endif %}
  </div>
</div>
