Allow elaboration when ‘something else’ is chosen

Letting people input a bit of free text should reduce the amount of back
and forth we have to do over support tickets when setting up someone’s
branding.

If something else is the only option then we don’t show the radio button
at all and have just the free text input on the page (not behind a
progressive disclosure).

app/main/forms.py

@@ -1359,16 +1359,17 @@ class LinkOrganisationsForm(StripWhitespaceForm):
 
 class BrandingOptionsEmail(StripWhitespaceForm):
 
-    options = RadioField(
-        'Choose your new email branding',
-        validators=[
-            DataRequired()
-        ],
-    )
+    FALLBACK_OPTION_VALUE = 'something_else'
+    FALLBACK_OPTION = (FALLBACK_OPTION_VALUE, 'Something else')
+
+    options = RadioField('Choose your new email branding')
+    something_else = TextAreaField('Describe the branding you want')
 
     def __init__(self, service, *args, **kwargs):
         super().__init__(*args, **kwargs)
         self.options.choices = tuple(self.get_available_choices(service))
+        if not self.something_else_is_only_option:
+            self.options.validators.append(DataRequired())
 
     @staticmethod
     def get_available_choices(service):
@@ -1404,7 +1405,21 @@ class BrandingOptionsEmail(StripWhitespaceForm):
         ):
             yield ('organisation', service.organisation.name)
 
-        yield ('something_else', 'Something else')
+        yield BrandingOptionsEmail.FALLBACK_OPTION
+
+    @property
+    def something_else_is_only_option(self):
+        return self.options.choices == (self.FALLBACK_OPTION,)
+
+    def validate_something_else(self, field):
+        if (
+            self.something_else_is_only_option or
+            self.options.data == self.FALLBACK_OPTION_VALUE
+        ) and not field.data:
+            raise ValidationError('Can’t be empty')
+
+        if self.options.data != self.FALLBACK_OPTION_VALUE:
+            field.data = ''
 
 
 class ServiceDataRetentionForm(StripWhitespaceForm):

app/main/views/service_settings.py

@@ -1047,12 +1047,17 @@ def branding_request(service_id):
                 '\n---'
                 '\nCurrent branding: {current_branding}'
                 '\nBranding requested: {branding_requested}'
+                '{new_paragraph}'
+                '{detail}'
+                '\n'
             ).format(
                 organisation=current_service.organisation.as_info_for_branding_request(current_user.email_domain),
                 service_name=current_service.name,
                 dashboard_url=url_for('main.service_dashboard', service_id=current_service.id, _external=True),
                 current_branding=current_service.email_branding_name,
                 branding_requested=dict(form.options.choices)[form.options.data],
+                new_paragraph='\n\n' if form.something_else.data else '',
+                detail=form.something_else.data or ''
             ),
             ticket_type=zendesk_client.TYPE_QUESTION,
             user_email=current_user.email_address,

app/templates/views/service-settings/branding/email-options.html

@@ -1,5 +1,6 @@
 {% extends "withnav_template.html" %}
-{% from "components/radios.html" import radios %}
+{% from "components/radios.html" import radio, conditional_radio_panel %}
+{% from "components/select-input.html" import select_wrapper %}
 {% from "components/textbox.html" import textbox %}
 {% from "components/page-header.html" import page_header %}
 {% from "components/page-footer.html" import page_footer %}
@@ -17,7 +18,26 @@
   ) }}
 
   {% call form_wrapper() %}
-    {{ radios(form.options) }}
+    {% if form.something_else_is_only_option %}
+      {{ textbox(
+        form.something_else,
+        hint='Include links to your brand guidelines or examples of how to use your branding',
+        width='1-1',
+      ) }}
+    {% else %}
+      {% call select_wrapper(form.options) %}
+        {% for option in form.options %}
+          {{ radio(option, data_target='panel-something-else' if option.data == form.FALLBACK_OPTION_VALUE else '') }}
+        {% endfor %}
+      {% endcall %}
+      {% call conditional_radio_panel('panel-something-else') %}
+        {{ textbox(
+          form.something_else,
+          hint='Include links to your brand guidelines or examples of how to use your branding',
+          width='1-1',
+        ) }}
+      {% endcall %}
+    {% endif %}
     <p class="form-group">
       We’ll email you once your branding’s ready to use, or if we need any
       more information.