From dca6d1690fa09942e954f788e4a58c0236716c90 Mon Sep 17 00:00:00 2001
From: Katie Smith <katie.smith@digital.cabinet-office.gov.uk>
Date: Mon, 3 Feb 2020 12:21:39 +0000
Subject: [PATCH] Use govuk-button in page footer component

---
 .../stylesheets/components/page-footer.scss   | 18 ++++------------
 app/templates/components/page-footer.html     | 21 +++++++++++--------
 tests/app/main/views/test_manage_users.py     |  4 ++--
 tests/app/main/views/test_template_folders.py |  2 +-
 tests/app/main/views/test_uploads.py          |  4 ++--
 5 files changed, 21 insertions(+), 28 deletions(-)

diff --git a/app/assets/stylesheets/components/page-footer.scss b/app/assets/stylesheets/components/page-footer.scss
index 14ecdc901..cdf95ff65 100644
--- a/app/assets/stylesheets/components/page-footer.scss
+++ b/app/assets/stylesheets/components/page-footer.scss
@@ -51,27 +51,17 @@
 
   }
 
-  .button,
-  .button-destructive {
+  &__button {
     margin-right: 10px;
   }
 
-  .button-destructive {
-    @include button($error-colour);
-    padding: 0.52632em 0.78947em 0.26316em 0.78947em;
-  }
-
   .js-cancel {
     margin: 0;
   }
 
-  &-centered-button {
-
-    .button {
-      display: block;
-      margin: 0 auto;
-    }
-
+  &__button--centred {
+    display: block;
+    margin: 0 auto;
   }
 
 }
diff --git a/app/templates/components/page-footer.html b/app/templates/components/page-footer.html
index b9bb4a0a0..fb9f478be 100644
--- a/app/templates/components/page-footer.html
+++ b/app/templates/components/page-footer.html
@@ -1,3 +1,5 @@
+{% from "components/button/macro.njk" import govukButton %}
+
 {% macro page_footer(
   button_text=None,
   button_name=None,
@@ -9,17 +11,18 @@
   delete_link_text="delete",
   centered_button=False
 ) %}
-  <div class="page-footer {% if centered_button %}page-footer-centered-button{% endif %}">
+  <div class="page-footer">
     {% if button_text %}
       <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
-      <button
-        type="submit"
-        class="button{% if destructive %}-destructive{% endif %}"
-        {% if button_name %}name="{{ button_name }}"{% endif %}
-        {% if button_value %}value="{{ button_value }}"{% endif %}
-      >
-        {{- button_text -}}
-      </button>
+
+      {% set button_data = {"text": button_text, "classes": "page-footer__button"} %}
+      {% if destructive %}{% set _ = button_data.update({"classes": "govuk-button--warning page-footer__button"}) %}{% endif %}
+      {% if centered_button %}{% set _ = button_data.update({"classes": "page-footer__button--centred"}) %}{% endif %}
+      {% if button_name %}{% set _ = button_data.update({"name": button_name}) %}{% endif %}
+      {% if button_value %}{% set _ = button_data.update({"value": button_value}) %}{% endif %}
+
+      {{ govukButton(button_data) }}
+
     {% endif %}
     {% if delete_link %}
       <span class="page-footer-delete-link {% if not button_text %}page-footer-delete-link-without-button{% endif %}">
diff --git a/tests/app/main/views/test_manage_users.py b/tests/app/main/views/test_manage_users.py
index bdaac53d0..34abf5c44 100644
--- a/tests/app/main/views/test_manage_users.py
+++ b/tests/app/main/views/test_manage_users.py
@@ -1046,7 +1046,7 @@ def test_edit_user_email_page(
     assert page.find('h1').text == "Change team member’s email address"
     assert page.select('p[id=user_name]')[0].text == "This will change the email address for {}.".format(user['name'])
     assert page.select('input[type=email]')[0].attrs["value"] == user['email_address']
-    assert page.select('main button[type=submit]')[0].text == "Save"
+    assert normalize_spaces(page.select('main button[type=submit]')[0].text) == "Save"
 
 
 def test_edit_user_email_page_404_for_non_team_member(
@@ -1367,7 +1367,7 @@ def test_edit_user_mobile_number_page(
         "This will change the mobile number for {}."
     ).format(active_user_with_permissions['name'])
     assert page.select('input[name=mobile_number]')[0].attrs["value"] == "0770••••762"
-    assert page.select('main button[type=submit]')[0].text == "Save"
+    assert normalize_spaces(page.select('main button[type=submit]')[0].text) == "Save"
 
 
 def test_edit_user_mobile_number_redirects_to_confirmation(
diff --git a/tests/app/main/views/test_template_folders.py b/tests/app/main/views/test_template_folders.py
index 1046c36b2..ba15b5d6b 100644
--- a/tests/app/main/views/test_template_folders.py
+++ b/tests/app/main/views/test_template_folders.py
@@ -846,7 +846,7 @@ def test_delete_template_folder_should_request_confirmation(
         service_id=service_one['id'],
         template_folder_id=folder_id,
     )
-    assert page.select('main form button')[1].text == 'Save'
+    assert normalize_spaces(page.select('main form button')[1].text) == 'Save'
 
 
 def test_delete_template_folder_should_detect_non_empty_folder_on_get(
diff --git a/tests/app/main/views/test_uploads.py b/tests/app/main/views/test_uploads.py
index 8d9e29efb..b4d1c9804 100644
--- a/tests/app/main/views/test_uploads.py
+++ b/tests/app/main/views/test_uploads.py
@@ -112,7 +112,7 @@ def test_post_upload_letter_redirects_for_valid_file(
     assert not page.find(id='validation-error-message')
 
     assert page.find('input', {'type': 'hidden', 'name': 'file_id', 'value': fake_uuid})
-    assert page.select('main button[type=submit]')[0].text == 'Send 1 letter'
+    assert normalize_spaces(page.select('main button[type=submit]')[0].text) == 'Send 1 letter'
 
 
 def test_post_upload_letter_shows_letter_preview_for_valid_file(
@@ -383,7 +383,7 @@ def test_uploaded_letter_preview(
     assert page.find('h1').text == 'my_letter.pdf'
     assert page.find('div', class_='letter-sent')
     assert not page.find("label", {"class": "file-upload-button"})
-    assert page.find('button', {'class': 'button', 'type': 'submit'})
+    assert page.find('button', {'class': 'govuk-button', 'type': 'submit'})
 
 
 def test_uploaded_letter_preview_does_not_show_send_button_if_service_in_trial_mode(