Split up email branding form into separate pages

We were showing the form to request email branding with a button which submits your choice immediately. Now, we only submit the form immediately if "Something else" is the only branding option available to you. If you select any other radio button (or select "Something else" when it's not the only option) we take you to another page which either contains more information or a textbox to fill in the details for the branding you want. There is currently some duplication between the new pages and their tests, but these will be changed in future versions of the work so will start to differ more.
2026-08-23 15:57:23 -04:00 · 2022-01-28 09:45:59 +00:00
parent d45265fcce
commit 92f76638c8
10 changed files with 708 additions and 96 deletions
--- a/app/main/forms.py
+++ b/app/main/forms.py
@@ -2130,6 +2130,7 @@ class BrandingOptions(StripWhitespaceForm):

    def __init__(self, service, *args, branding_type="email", **kwargs):
        super().__init__(*args, **kwargs)
+        self.branding_type = branding_type
        self.options.choices = tuple(self.get_available_choices(service, branding_type))
        self.options.label.text = 'Choose your new {} branding'.format(branding_type)
        if self.something_else_is_only_option:
@@ -2194,16 +2195,24 @@ class BrandingOptions(StripWhitespaceForm):
        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('Cannot be empty')
+        if self.branding_type == 'email':
+            if self.something_else_is_only_option and not field.data:
+                raise ValidationError('Cannot be empty')
+        elif self.branding_type == 'letter':
+            if (
+                self.something_else_is_only_option
+                or self.options.data == self.FALLBACK_OPTION_VALUE
+            ) and not field.data:
+                raise ValidationError('Cannot be empty')

        if self.options.data != self.FALLBACK_OPTION_VALUE:
            field.data = ''


+class SomethingElseBrandingForm(StripWhitespaceForm):
+    something_else = TextAreaField('', validators=[DataRequired('Cannot be empty')])
+
+
 class ServiceDataRetentionForm(StripWhitespaceForm):

    notification_type = GovukRadiosField(
--- a/app/main/views/service_settings.py
+++ b/app/main/views/service_settings.py
@@ -65,6 +65,7 @@ from app.main.forms import (
    SetEmailBranding,
    SetLetterBranding,
    SMSPrefixForm,
+    SomethingElseBrandingForm,
 )
 from app.utils import DELIVERED_STATUSES, FAILURE_STATUSES, SENDING_STATUSES
 from app.utils.user import (
@@ -1130,34 +1131,58 @@ def link_service_to_organisation(service_id):
    )


+def create_email_branding_zendesk_ticket(form_option_selected, detail=None):
+    form = BrandingOptions(current_service)
+
+    ticket_message = render_template(
+        'support-tickets/branding-request.txt',
+        current_branding=current_service.email_branding_name,
+        branding_requested=dict(form.options.choices)[form_option_selected],
+        detail=detail,
+    )
+    ticket = NotifySupportTicket(
+        subject=f'Email branding request - {current_service.name}',
+        message=ticket_message,
+        ticket_type=NotifySupportTicket.TYPE_QUESTION,
+        user_name=current_user.name,
+        user_email=current_user.email_address,
+        org_id=current_service.organisation_id,
+        org_type=current_service.organisation_type,
+        service_id=current_service.id
+    )
+    zendesk_client.send_ticket_to_zendesk(ticket)
+
+
@main.route("/services/<uuid:service_id>/branding-request/email", methods=['GET', 'POST'])
@user_has_permissions('manage_service')
 def email_branding_request(service_id):
    form = BrandingOptions(current_service, branding_type='email')
    branding_name = current_service.email_branding_name
    if form.validate_on_submit():
-        ticket_message = render_template(
-            'support-tickets/branding-request.txt',
-            current_branding=branding_name,
-            branding_requested=dict(form.options.choices)[form.options.data],
-            detail=form.something_else.data,
-        )
-        ticket = NotifySupportTicket(
-            subject=f'Email branding request - {current_service.name}',
-            message=ticket_message,
-            ticket_type=NotifySupportTicket.TYPE_QUESTION,
-            user_name=current_user.name,
-            user_email=current_user.email_address,
-            org_id=current_service.organisation_id,
-            org_type=current_service.organisation_type,
-            service_id=current_service.id
-        )
-        zendesk_client.send_ticket_to_zendesk(ticket)
-        flash((
-            'Thanks for your branding request. We’ll get back to you '
-            'within one working day.'
-        ), 'default')
-        return redirect(url_for('.service_settings', service_id=current_service.id))
+        if form.something_else_is_only_option:
+            create_email_branding_zendesk_ticket(
+                form_option_selected=form.options.data,
+                detail=form.something_else.data,
+            )
+
+            flash('Thanks for your branding request. We’ll get back to you within one working day.', 'default')
+            return redirect(url_for('.service_settings', service_id=current_service.id))
+        else:
+            endpoint = {
+                'govuk': '.email_branding_govuk',
+                'govuk_and_org': '.email_branding_govuk',
+                'nhs': '.email_branding_nhs',
+                'organisation': '.email_branding_organisation',
+                'something_else': '.email_branding_something_else',
+            }[form.options.data]
+
+            return redirect(
+                url_for(
+                    endpoint,
+                    service_id=current_service.id,
+                    with_org=(True if form.options.data == 'govuk_and_org' else None),
+                )
+            )

    return render_template(
        'views/service-settings/branding/email-branding-options.html',
@@ -1166,6 +1191,58 @@ def email_branding_request(service_id):
    )


+@main.route("/services/<uuid:service_id>/service-settings/email-branding/govuk", methods=['GET', 'POST'])
+@user_has_permissions('manage_service')
+def email_branding_govuk(service_id):
+    with_org = request.args.get('with_org')
+
+    if request.method == 'POST':
+        create_email_branding_zendesk_ticket(request.form['branding_choice'])
+
+        flash('Thanks for your branding request. We’ll get back to you within one working day.', 'default')
+        return redirect(url_for('.service_settings', service_id=current_service.id))
+
+    return render_template('views/service-settings/branding/email-branding-govuk.html', with_org=with_org)
+
+
+@main.route("/services/<uuid:service_id>/service-settings/email-branding/nhs", methods=['GET', 'POST'])
+@user_has_permissions('manage_service')
+def email_branding_nhs(service_id):
+    if request.method == 'POST':
+        create_email_branding_zendesk_ticket('nhs')
+
+        flash('Thanks for your branding request. We’ll get back to you within one working day.', 'default')
+        return redirect(url_for('.service_settings', service_id=current_service.id))
+
+    return render_template('views/service-settings/branding/email-branding-nhs.html')
+
+
+@main.route("/services/<uuid:service_id>/service-settings/email-branding/organisation", methods=['GET', 'POST'])
+@user_has_permissions('manage_service')
+def email_branding_organisation(service_id):
+    if request.method == 'POST':
+        create_email_branding_zendesk_ticket('organisation')
+
+        flash('Thanks for your branding request. We’ll get back to you within one working day.', 'default')
+        return redirect(url_for('.service_settings', service_id=current_service.id))
+
+    return render_template('views/service-settings/branding/email-branding-organisation.html')
+
+
+@main.route("/services/<uuid:service_id>/service-settings/email-branding/something-else", methods=['GET', 'POST'])
+@user_has_permissions('manage_service')
+def email_branding_something_else(service_id):
+    form = SomethingElseBrandingForm()
+
+    if form.validate_on_submit():
+        create_email_branding_zendesk_ticket('something_else', detail=form.something_else.data)
+
+        flash('Thanks for your branding request. We’ll get back to you within one working day.', 'default')
+        return redirect(url_for('.service_settings', service_id=current_service.id))
+
+    return render_template('views/service-settings/branding/email-branding-something-else.html', form=form)
+
+
@main.route("/services/<uuid:service_id>/branding-request/letter", methods=['GET', 'POST'])
@user_has_permissions('manage_service')
 def letter_branding_request(service_id):
--- a/app/navigation.py
+++ b/app/navigation.py
@@ -219,7 +219,11 @@ class MainNavigation(Navigation):
        'settings': {
            'add_organisation_from_gp_service',
            'add_organisation_from_nhs_local_service',
+            'email_branding_govuk',
+            'email_branding_nhs',
+            'email_branding_organisation',
            'email_branding_request',
+            'email_branding_something_else',
            'estimate_usage',
            'letter_branding_request',
            'link_service_to_organisation',
--- a/app/templates/views/service-settings/branding/email-branding-govuk.html
+++ b/app/templates/views/service-settings/branding/email-branding-govuk.html
@@ -0,0 +1,43 @@
+{% extends "withnav_template.html" %}
+{% from "components/form.html" import form_wrapper %}
+{% from "components/back-link/macro.njk" import govukBackLink %}
+{% from "components/page-footer.html" import page_footer %}
+{% from "components/page-header.html" import page_header %}
+
+{% block service_page_title %}
+  Before you request new branding
+{% endblock %}
+
+{% block backLink %}
+  {{ govukBackLink({
+    "href": url_for('.email_branding_request', service_id=current_service.id)
+  }) }}
+{% endblock %}
+
+{% block maincolumn_content %}
+
+  {{ page_header('Before you request new branding') }}
+
+  <p class="govuk-body">Check that your new branding matches the rest of your service.</p>
+
+  <p class="govuk-body">You can use the GOV.UK logo on your emails if:</p>
+  <ul class="list list-bullet">
+    <li>your website looks like GOV.UK</li>
+    <li>your email links to a website that looks like GOV.UK</li>
+    <li>people get an email from your service after using GOV.UK</li>
+  </ul>
+
+  <p class="govuk-body">
+    You cannot use GOV.UK branding if your organisation is
+    <a class="govuk-link govuk-link--no-visited-state"
+      href="https://www.gov.uk/government/publications/govuk-proposition/govuk-proposition#organisations-independent-from-government">independent
+      from government</a>.
+  </p>
+
+  <p class="govuk-body">We’ll email you once your branding’s ready to use, or if we need any more information.</p>
+
+  {% call form_wrapper() %}
+    {{ page_footer('Request new branding', button_name='branding_choice', button_value=('govuk_and_org' if with_org == 'True' else 'govuk')) }}
+  {% endcall %}
+
+{% endblock %}
--- a/app/templates/views/service-settings/branding/email-branding-nhs.html
+++ b/app/templates/views/service-settings/branding/email-branding-nhs.html
@@ -0,0 +1,33 @@
+{% extends "withnav_template.html" %}
+{% from "components/form.html" import form_wrapper %}
+{% from "components/back-link/macro.njk" import govukBackLink %}
+{% from "components/page-footer.html" import page_footer %}
+{% from "components/page-header.html" import page_header %}
+
+{% block service_page_title %}
+  Before you request new branding
+{% endblock %}
+
+{% block backLink %}
+  {{ govukBackLink({
+    "href": url_for('.email_branding_request', service_id=current_service.id)
+  }) }}
+{% endblock %}
+
+{% block maincolumn_content %}
+
+  {{ page_header('Before you request new branding') }}
+
+  <p class="govuk-body">
+    <a class="govuk-link govuk-link--no-visited-state" href="https://www.england.nhs.uk/nhsidentity/identity-guidelines/who-can-use-the-nhs-identity/">Check that your service is allowed to use the NHS identity</a>.
+  </p>
+
+  <p class="govuk-body">Your new branding should match the rest of your service.</p>
+
+  <p class="govuk-body">We’ll email you once your branding’s ready to use, or if we need any more information.</p>
+
+  {% call form_wrapper() %}
+    {{ page_footer('Request new branding') }}
+  {% endcall %}
+
+{% endblock %}
--- a/app/templates/views/service-settings/branding/email-branding-options.html
+++ b/app/templates/views/service-settings/branding/email-branding-options.html
@@ -1,5 +1,5 @@
 {% extends "withnav_template.html" %}
-{% from "components/radios.html" import radio, conditional_radio_panel %}
+{% from "components/radios.html" import radio %}
 {% from "components/select-input.html" import select_wrapper %}
 {% from "components/textbox.html" import textbox %}
 {% from "components/page-header.html" import page_header %}
@@ -31,33 +31,27 @@
    </p>
  {% endif %}

-  {% call form_wrapper() %}
-    {% 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') %}
+  {% if form.something_else_is_only_option %}
+    {% call form_wrapper() %}
        {{ textbox(
          form.something_else,
          hint='Include links to your brand guidelines or examples of how to use your branding',
          width='1-1',
-          autosize=True,
        ) }}
-      {% endcall %}
-    {% endif %}
-    <p class="form-group">
-      We’ll email you once your branding’s ready to use, or if we need any
-      more information.
-    </p>
-    {{ page_footer('Request new branding') }}
-  {% endcall %}
+      <p class="form-group">
+        We’ll email you when your branding is ready, or if we need any more information.
+      </p>
+      {{ page_footer('Request new branding') }}
+    {% endcall %}
+  {% else %}
+    {% call form_wrapper() %}
+        {% call select_wrapper(form.options) %}
+          {% for option in form.options %}
+            {{ radio(option) }}
+          {% endfor %}
+        {% endcall %}
+      {{ page_footer('Continue') }}
+    {% endcall %}
+  {% endif %}

 {% endblock %}
--- a/app/templates/views/service-settings/branding/email-branding-organisation.html
+++ b/app/templates/views/service-settings/branding/email-branding-organisation.html
@@ -0,0 +1,31 @@
+{% extends "withnav_template.html" %}
+{% from "components/form.html" import form_wrapper %}
+{% from "components/back-link/macro.njk" import govukBackLink %}
+{% from "components/page-footer.html" import page_footer %}
+{% from "components/page-header.html" import page_header %}
+
+{% block service_page_title %}
+  When you request new branding
+{% endblock %}
+
+{% block backLink %}
+  {{ govukBackLink({
+    "href": url_for('.email_branding_request', service_id=current_service.id)
+  }) }}
+{% endblock %}
+
+{% block maincolumn_content %}
+
+  {{ page_header('When you request new branding') }}
+
+  <p class="govuk-body">We’ll check if we already have the {{organisation}} logo.</p>
+
+  <p class="govuk-body">If we do, we’ll let you know when your new branding is ready to use.</p>
+
+  <p class="govuk-body">If we don’t, we’ll email you to ask for more information.</p>
+
+  {% call form_wrapper() %}
+    {{ page_footer('Request new branding') }}
+  {% endcall %}
+
+{% endblock %}
--- a/app/templates/views/service-settings/branding/email-branding-something-else.html
+++ b/app/templates/views/service-settings/branding/email-branding-something-else.html
@@ -0,0 +1,32 @@
+{% extends "withnav_template.html" %}
+{% from "components/form.html" import form_wrapper %}
+{% from "components/back-link/macro.njk" import govukBackLink %}
+{% from "components/page-footer.html" import page_footer %}
+{% from "components/page-header.html" import page_header %}
+{% from "components/textbox.html" import textbox %}
+
+{% block service_page_title %}
+  Describe the branding you want
+{% endblock %}
+
+{% block backLink %}
+  {{ govukBackLink({
+    "href": url_for('.email_branding_request', service_id=current_service.id)
+  }) }}
+{% endblock %}
+
+{% block maincolumn_content %}
+
+  {{ page_header('Describe the branding you want') }}
+
+  {% call form_wrapper() %}
+    {{ textbox(
+      form.something_else,
+        hint='Include links to your brand guidelines or examples of how to use your branding',
+        width='1-1',
+    ) }}
+    <p class="form-group">We’ll email you when your branding is ready, or if we need any more information.</p>
+    {{ page_footer('Request new branding') }}
+  {% endcall %}
+
+{% endblock %}