Add live-search to set-email-branding page

app/main/views/service_settings.py

@@ -34,6 +34,7 @@ from app.main.forms import (
     OrganisationTypeForm,
     RenameServiceForm,
     RequestToGoLiveForm,
+    SearchTemplatesForm,
     ServiceContactDetailsForm,
     ServiceDataRetentionEditForm,
     ServiceDataRetentionForm,
@@ -886,7 +887,9 @@ def service_set_email_branding(service_id):
     return render_template(
         'views/service-settings/set-email-branding.html',
         form=form,
-        branding_dict=get_branding_as_dict(email_branding)
+        branding_dict=get_branding_as_dict(email_branding),
+        search_form=SearchTemplatesForm(),
+        show_search_box=(len(email_branding) > 6)
     )
 
 

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

@@ -1,6 +1,7 @@
 {% extends "withnav_template.html" %}
 {% from "components/radios.html" import radios %}
 {% from "components/page-footer.html" import page_footer %}
+{% from "components/live-search.html" import live_search %}
 
 {% block service_page_title %}
   Set email branding
@@ -10,11 +11,16 @@
 
   <h1 class="heading-large">Set email branding</h1>
   <form method="post">
+    <div class="grid-row">
+      <div class="column-one-whole">
+      </div>
+    </div>
     <div class="grid-row">
       <div class="column-one-half">
         {{ radios(form.branding_type) }}
       </div>
-      <div class="column-one-half">
+      <div class="column-one-half brand_styles">
+        {{ live_search(target_selector='.brand_styles .multiple-choice', show=show_search_box, form=search_form, label='Search branding styles by name') }}
         {{ radios(form.branding_style) }}
       </div>
     </div>