Convert create API key radios to GOVUK Frontend

app/main/forms.py

@@ -1523,7 +1523,7 @@ class CreateKeyForm(StripWhitespaceForm):
         ]
         super().__init__(*args, **kwargs)
 
-    key_type = RadioField(
+    key_type = GovukRadiosField(
         'Type of key',
         thing='the type of key',
     )

app/main/views/api_keys.py

@@ -85,17 +85,21 @@ def create_api_key(service_id):
         (KEY_TYPE_TEAM, 'Team and guest list – limits who you can send to'),
         (KEY_TYPE_TEST, 'Test – pretends to send messages'),
     ]
-    disabled_options, option_hints = [], {}
+    # preserve order of items extended by starting with empty dicts
+    form.key_type.param_extensions = {'items': [{}, {}]}
     if current_service.trial_mode:
-        disabled_options = [KEY_TYPE_NORMAL]
+        form.key_type.param_extensions['items'][0] = {
-        option_hints[KEY_TYPE_NORMAL] = Markup(
+            'disabled': True,
-            'Not available because your service is in '
+            'hint': {
-            '<a class="govuk-link govuk-link--no-visited-state" href="/features/trial-mode">trial mode</a>'
+                'html': Markup(
-        )
+                    'Not available because your service is in '
+                    '<a class="govuk-link govuk-link--no-visited-state" href="/features/trial-mode">trial mode</a>')
+            }
+        }
     if current_service.has_permission('letter'):
-        option_hints[KEY_TYPE_TEAM] = 'Cannot be used to send letters'
+        form.key_type.param_extensions['items'][1]['hint'] = {'text': 'Cannot be used to send letters'}
     if form.validate_on_submit():
-        if form.key_type.data in disabled_options:
+        if current_service.trial_mode and form.key_type.data == KEY_TYPE_NORMAL:
             abort(400)
         secret = api_key_api_client.create_api_key(
             service_id=service_id,
@@ -110,9 +114,7 @@ def create_api_key(service_id):
         )
     return render_template(
         'views/api/keys/create.html',
-        form=form,
+        form=form
-        disabled_options=disabled_options,
-        option_hints=option_hints
     )
 
 

app/templates/views/api/keys/create.html

@@ -1,7 +1,6 @@
 {% extends "withnav_template.html" %}
 {% from "components/page-header.html" import page_header %}
 {% from "components/page-footer.html" import page_footer %}
-{% from "components/radios.html" import radios %}
 {% from "components/banner.html" import banner_wrapper %}
 {% from "components/form.html" import form_wrapper %}
 
@@ -18,7 +17,7 @@
 
   {% call form_wrapper() %}
     {{ form.key_name }}
-    {{ radios(form.key_type, disable=disabled_options, option_hints=option_hints) }}
+    {{ form.key_type }}
     {{ page_footer('Continue') }}
   {% endcall %}
 

tests/app/main/views/test_api_integration.py

@@ -205,7 +205,7 @@ def test_should_show_api_keys_page(
 @pytest.mark.parametrize('restricted, can_send_letters, expected_options', [
     (True, False, [
         (
-            'Live – sends to anyone '
+            'Live – sends to anyone',
             'Not available because your service is in trial mode'
         ),
         'Team and guest list – limits who you can send to',
@@ -219,7 +219,7 @@ def test_should_show_api_keys_page(
     (False, True, [
         'Live – sends to anyone',
         (
-            'Team and guest list – limits who you can send to '
+            'Team and guest list – limits who you can send to',
             'Cannot be used to send letters'
         ),
         'Test – pretends to send messages',
@@ -244,7 +244,12 @@ def test_should_show_create_api_key_page(
     page = client_request.get('main.create_api_key', service_id=SERVICE_ONE_ID)
 
     for index, option in enumerate(expected_options):
-        assert normalize_spaces(page.select('.block-label')[index].text) == option
+        item = page.select('.govuk-radios__item')[index]
+        if type(option) is tuple:
+            assert normalize_spaces(item.select_one('.govuk-label').text) == option[0]
+            assert normalize_spaces(item.select_one('.govuk-hint').text) == option[1]
+        else:
+            assert normalize_spaces(item.select_one('.govuk-label').text) == option
 
 
 def test_should_create_api_key_with_type_normal(