From 14bd05c8a513a3ab0e074d658bf6ba0116e085e9 Mon Sep 17 00:00:00 2001
From: Chris Hill-Scott <me@quis.cc>
Date: Fri, 10 Mar 2017 16:46:28 +0000
Subject: [PATCH] Put actions at the top on single template page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The links to the right of the template take up valuable horizontal
space. This means that the preview of email and letter templates isn’t
as big as it could be. By making the letter preview bigger it removes
the need to click through to the PDF to see a preview.

Reuses the navigation style used on the API integration page, because I
think it damages consistency to create another new button style.
---
 app/templates/views/templates/_template.html | 58 ++++++++++++++------
 tests/app/main/views/test_templates.py       | 51 +++++++++++++++++
 2 files changed, 93 insertions(+), 16 deletions(-)

diff --git a/app/templates/views/templates/_template.html b/app/templates/views/templates/_template.html
index 9b3126ec0..f7e6a7e45 100644
--- a/app/templates/views/templates/_template.html
+++ b/app/templates/views/templates/_template.html
@@ -1,25 +1,51 @@
-<div class="column-two-thirds">
-  {{ template|string }}
-</div>
-<div class="column-one-third">
+<div class="column-whole">
   {% if template._template.archived %}
     <div class="message-updated-at">
       This template was deleted<br/>{{ template._template.updated_at|format_date_normal }}
-    </div>
+    </p>
   {% else %}
-    <div class="message-use-links{% if show_title %}-with-title{% endif %}">
-      {% if current_user.has_permissions(permissions=['send_texts', 'send_emails', 'send_letters']) %}
-        <a href="{{ url_for(".send_messages", service_id=current_service.id, template_id=template.id) }}" class="primary">
+    <div class="bottom-gutter-2-3">
+      <div class="grid-row">
+        {% if current_user.has_permissions(permissions=['send_texts', 'send_emails', 'send_letters']) %}
+        <div class="{{ 'column-half' if template.template_type == 'letter' else 'column-third' }}">
+          <a href="{{ url_for(".send_messages", service_id=current_service.id, template_id=template.id) }}" class="pill-separate-item">
+            Upload recipients
+          </a>
+        </div>
+        <div class="{{ 'column-half' if template.template_type == 'letter' else 'column-third' }}">
+          <a href="{{ url_for(".send_test", service_id=current_service.id, template_id=template.id) }}" class="pill-separate-item">
+            {{ 'Generate preview' if template.template_type == 'letter' else 'Send yourself a test' }}
+          </a>
+        </div>
+        {% endif %}
+        {% if
+          current_user.has_permissions(permissions=['manage_templates'], admin_override=True) and
+          template.template_type != 'letter'
+        %}
+        <div class="column-one-third">
+          <a href="{{ url_for(".edit_service_template", service_id=current_service.id, template_id=template.id) }}" class="pill-separate-item">
+            Edit template
+          </a>
+        </div>
+        {% endif %}
+      </div>
+    </div>
+    {% if current_user.has_permissions(permissions=['send_texts', 'send_emails', 'send_letters']) %}
+      <p class="bottom-gutter-1-2">
+        <a href="{{ url_for(".send_messages", service_id=current_service.id, template_id=template.id) }}" class="heading-medium">
           Upload recipients
         </a>
-      <a href="{{ url_for(".send_test", service_id=current_service.id, template_id=template.id) }}">
-        Send yourself a test
-      </a>
+        &emsp;
+        <a href="{{ url_for(".send_test", service_id=current_service.id, template_id=template.id) }}" class="heading-medium">
+          Send yourself a test
+        </a>
+      </p>
+    {% endif %}
+    {% if current_user.has_permissions(permissions=['manage_templates'], admin_override=True) %}
+       <a href="{{ url_for(".edit_service_template", service_id=current_service.id, template_id=template.id) }}" class="edit-template-link">Edit</a>
     {% endif %}
-      {% if current_user.has_permissions(permissions=['manage_templates'], admin_override=True) %}
-         <a href="{{ url_for(".edit_service_template", service_id=current_service.id, template_id=template.id) }}">Edit template</a>
-      {% endif %}
-      <a href="{{ url_for(".send_from_api", service_id=current_service.id, template_id=template.id) }}">API info</a>
-    </div>
   {% endif %}
 </div>
+<div class="column-whole">
+  {{ template|string }}
+</div>
diff --git a/tests/app/main/views/test_templates.py b/tests/app/main/views/test_templates.py
index 316cfa95a..13aee7319 100644
--- a/tests/app/main/views/test_templates.py
+++ b/tests/app/main/views/test_templates.py
@@ -33,6 +33,57 @@ def test_should_show_page_for_one_template(
     mock_get_service_template.assert_called_with(service_one['id'], template_id)
 
 
+@pytest.mark.parametrize('permissions, links_to_be_shown', [
+    (
+        ['view_activity'],
+        []
+    ),
+    (
+        ['manage_templates'],
+        ['.edit_service_template']
+    ),
+    (
+        ['send_texts', 'send_emails', 'send_letters'],
+        ['.send_messages', '.send_test']
+    ),
+    (
+        ['send_texts', 'send_emails', 'send_letters', 'manage_templates'],
+        ['.send_messages', '.send_test', '.edit_service_template']
+    ),
+])
+def test_should_be_able_to_view_a_template_with_links(
+    client,
+    mock_get_service_template,
+    active_user_with_permissions,
+    mocker,
+    service_one,
+    fake_uuid,
+    permissions,
+    links_to_be_shown,
+):
+    active_user_with_permissions._permissions[service_one['id']] = permissions
+    client.login(active_user_with_permissions, mocker, service_one)
+
+    response = client.get(url_for(
+        '.view_template',
+        service_id=service_one['id'],
+        template_id=fake_uuid
+    ))
+
+    assert response.status_code == 200
+    page = BeautifulSoup(response.data.decode('utf-8'), 'html.parser')
+    links_in_page = page.select('.pill-separate-item')
+
+    assert len(links_in_page) == len(links_to_be_shown)
+
+    for index, link_to_be_shown in enumerate(links_to_be_shown):
+        assert links_in_page[index]['href'] == url_for(
+            link_to_be_shown,
+            service_id=service_one['id'],
+            template_id=fake_uuid,
+        )
+
+
 def test_should_show_sms_template_with_downgraded_unicode_characters(
     logged_in_client,
     mocker,