Files
notifications-admin/app/templates/views/api/index.html

102 lines
3.5 KiB
HTML
Raw Normal View History

{% 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 %}
{% block page_title %}
API integration GOV.UK Notify
{% endblock %}
{% block maincolumn_content %}
<h1 class="heading-large bottom-gutter">
API integration
</h1>
{% if current_service.restricted %}
{% call banner_wrapper(type='warning') %}
<h2 class="heading-medium">Your service is in trial mode</h2>
<p>
Add a page to manage a service’s whitelist Services who are in alpha or building prototypes need a way of sending to any email address or phone number without having to sign the MOU. This commit adds a page where they can whitelist up to 5 email addresses and 5 phone numbers. It uses the ‘list entry’ UI pattern from the Digital Marketplace frontend toolkit [1] [2] [3]. I had to do some modification: - of the Javascript, to make it work with the GOV.UK Module pattern - of the template to make it work with WTForms - of the content security policy, because the list entry pattern uses Hogan[1], which needs to use `eval()` (this should be fine if we’re only allowing it for scripts that we serve) - of our SASS lint config, to allow browser-targeting mixins to come after normal rules (so that they can override them) This commit also adds a new form class to validate and populate the two whitelists. The validation is fairly rudimentary at the moment, and doesn’t highlight which item in the list has the error, but it’s probably good enough. The list can only be updated all-at-once, this is how it’s possible to remove items from the list without having to make multiple `POST` requests. 1. https://github.com/alphagov/digitalmarketplace-frontend-toolkit/blob/434ad307913651ecb041ab94bdee748ebe066d1a/toolkit/templates/forms/list-entry.html 2. https://github.com/alphagov/digitalmarketplace-frontend-toolkit/blob/434ad307913651ecb041ab94bdee748ebe066d1a/toolkit/scss/forms/_list-entry.scss 3. https://github.com/alphagov/digitalmarketplace-frontend-toolkit/blob/434ad307913651ecb041ab94bdee748ebe066d1a/toolkit/javascripts/list-entry.js 4. http://twitter.github.io/hogan.js/
2016-09-20 12:30:00 +01:00
You can only send messages to people in your team or whitelist.
</p>
{% endcall %}
{% endif %}
<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('.api_documentation', service_id=current_service.id) }}">Documentation</a>
</div>
</nav>
<div class="grid-row">
<div class="column-half">
<h2 class="heading-medium">
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 theyll 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">
<summary class="api-notifications-item-title">
<h3 class="api-notifications-item-recipient">
{{ notification.to }}
</h3>
<span class="grid-row api-notifications-item-meta">
<span class="column-half api-notifications-item-key">
{{notification.key_name}}
</span>
<span class="column-half api-notifications-item-time">
<time class="timeago" datetime="{{ notification.created_at }}">
{{ notification.created_at|format_delta }}
</time>
</span>
</span>
</summary>
<div>
<dl id="notification-{{ notification.id }}" class="api-notifications-item-data bottom-gutter-1-2">
{% for key in [
'id', 'notification_type', 'created_at', 'updated_at', 'sent_at', 'status'
] %}
<dt>{{ key }}:</dt>
<dd class="api-notifications-item-data-item">{{ notification[key] }}</dd>
{% endfor %}
</dl>
</div>
</details>
{% endfor %}
{% if api_notifications.notifications %}
<div class="api-notifications-item">
{% if api_notifications.links %}
<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 %}