mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-04-14 14:21:58 -04:00
The GOV.UK Frontend details component macro wraps its `<summary>` text in a `<span>`. We put a `<h3>` in the `<summary>` (actually valid use, based on the spec) so this breaks when the `<span>` wraps it. This converts the existing `<details>` tag to use all the class names the macro creates, but with all the `<summary>` contents in the `<h3>`. Also adds font-smoothing to the messages on the API page. This was previously set globally for all fonts in the GOV.UK Template CSS but is now just set for the New Transport 'nta' font. Included because the messages use the monospace font so don't have it by default.
101 lines
4.0 KiB
HTML
101 lines
4.0 KiB
HTML
{% extends "withnav_template.html" %}
|
||
{% from "components/table.html" import list_table, field, hidden_field_heading %}
|
||
{% from "components/api-key.html" import api_key %}
|
||
{% from "components/banner.html" import banner_wrapper %}
|
||
{% from "components/message-count-label.html" import message_count_label %}
|
||
|
||
{% block service_page_title %}
|
||
API integration
|
||
{% endblock %}
|
||
|
||
{% block maincolumn_content %}
|
||
|
||
<h1 class="heading-medium bottom-gutter-3-2">
|
||
API integration
|
||
</h1>
|
||
|
||
<nav class="grid-row bottom-gutter-1-2">
|
||
<div class="column-one-third">
|
||
<a class="pill-separate-item" href="{{ url_for('.api_keys', service_id=current_service.id) }}">API keys</a>
|
||
</div>
|
||
<div class="column-one-third">
|
||
<a class="pill-separate-item" href="{{ url_for('.whitelist', service_id=current_service.id) }}">Whitelist</a>
|
||
</div>
|
||
<div class="column-one-third">
|
||
<a class="pill-separate-item" href="{{ url_for(callbacks_link, service_id=current_service.id) }}">Callbacks</a>
|
||
</div>
|
||
</nav>
|
||
|
||
<div class="grid-row">
|
||
<div class="column-half">
|
||
<h2 class="heading-small">
|
||
Message log
|
||
</h2>
|
||
</div>
|
||
<div class="column-half align-with-heading-copy-right">
|
||
<a href="{{ url_for('.api_integration', service_id=current_service.id) }}">Refresh</a>
|
||
</div>
|
||
</div>
|
||
<div class="api-notifications">
|
||
{% if not api_notifications.notifications %}
|
||
<div class="api-notifications-item">
|
||
<p class="api-notifications-item__meta">
|
||
When you send messages via the API they’ll appear here.
|
||
</p>
|
||
<p class="api-notifications-item__meta">
|
||
Notify deletes messages after 7 days.
|
||
</p>
|
||
</div>
|
||
{% endif %}
|
||
{% for notification in api_notifications.notifications %}
|
||
<details class="api-notifications-item govuk-details govuk-!-margin-bottom-0" data-module="govuk-details">
|
||
<summary class="govuk-details__summary govuk-clearfix api-notifications-item__heading">
|
||
<h3>
|
||
<span class="govuk-details__summary-text">
|
||
{{ notification.to }}
|
||
</span>
|
||
<span class="govuk-grid-row api-notifications-item__meta">
|
||
<span class="govuk-grid-column-one-half api-notifications-item__meta-key">
|
||
{{notification.key_name}}
|
||
</span>
|
||
<span class="govuk-grid-column-one-half api-notifications-item__meta-time">
|
||
<time class="timeago" datetime="{{ notification.created_at }}">
|
||
{{ notification.created_at|format_delta }}
|
||
</time>
|
||
</span>
|
||
</span>
|
||
</h3>
|
||
</summary>
|
||
<div class="govuk-details__text api-notifications-item__data govuk-!-padding-top-0">
|
||
<dl id="notification-{{ notification.id }}">
|
||
{% for key in [
|
||
'id', 'client_reference', 'notification_type', 'created_at', 'updated_at', 'sent_at', 'status'
|
||
] %}
|
||
{% if notification[key] %}
|
||
<dt class="api-notifications-item__data-name">{{ key }}:</dt>
|
||
<dd class="api-notifications-item__data-value">{{ notification[key] }}</dd>
|
||
{% endif %}
|
||
{% endfor %}
|
||
{% if notification.status not in ('pending-virus-check', 'virus-scan-failed') %}
|
||
<a class="api-notifications-item__view" href="{{ url_for('.view_notification', service_id=current_service.id, notification_id=notification.id) }}">View {{ message_count_label(1, notification.template.template_type, suffix='') }}</a>
|
||
{% endif %}
|
||
</dl>
|
||
</div>
|
||
</details>
|
||
{% endfor %}
|
||
{% if api_notifications.notifications %}
|
||
<div class="api-notifications-item">
|
||
{% if api_notifications.notifications|length == 50 %}
|
||
<p class="api-notifications-item__meta">
|
||
Only showing the first 50 messages.
|
||
</p>
|
||
{% endif %}
|
||
<p class="api-notifications-item__meta">
|
||
Notify deletes messages after 7 days.
|
||
</p>
|
||
</div>
|
||
{% endif %}
|
||
</div>
|
||
|
||
{% endblock %}
|