Move letter too long banner message over from utils, also refactor

app/templates/components/banner.html

@@ -1,12 +1,15 @@
 {% from "components/form.html" import form_wrapper %}
 
-{% macro banner(body, type=None, with_tick=False, delete_button=None, subhead=None, context=None, action=None) %}
+{% macro banner(body, type=None, with_tick=False, delete_button=None, subhead=None, context=None, action=None, id=None) %}
   <div
     class='banner{% if type %}-{{ type }}{% endif %}{% if with_tick %}-with-tick{% endif %}'
     {% if type == 'dangerous' %}
     role='group'
     tabindex='-1'
     {% endif %}
+    {% if id %}
+    id={{ id }}
+    {% endif %}
   >
     {% if subhead -%}
       <h1 class="banner-title">{{ subhead }}</h1>
@@ -26,6 +29,6 @@
   </div>
 {% endmacro %}
 
-{% macro banner_wrapper(type=None, with_tick=False, delete_button=None, subhead=None, action=None) %}
-  {{ banner(caller()|safe, type=type, with_tick=with_tick, delete_button=delete_button, subhead=subhead, action=action) }}
+{% macro banner_wrapper(type=None, with_tick=False, delete_button=None, subhead=None, action=None, id=None) %}
+  {{ banner(caller()|safe, type=type, with_tick=with_tick, delete_button=delete_button, subhead=subhead, action=action, id=id) }}
 {% endmacro %}

app/templates/partials/check/letter-too-long.html

@@ -0,0 +1,6 @@
+<h1 class='banner-title' data-module="track-error" data-error-type="Trying to send a letter that's too long" data-error-label="{{ upload_id }}">
+  This letter is too long
+</h1>
+<p>
+  Letters must be {{ letter_max_pages }} pages or fewer
+</p>

app/templates/views/check/ok.html

@@ -25,10 +25,15 @@
     back_link=back_link
   ) }}
 
+  {% if letter_too_long %}
+    {% call banner_wrapper(type='dangerous', id='letter-too-long') %}
+        {% include "partials/check/letter-too-long.html" %}
+    {% endcall %}
+  {% endif %}
+
   {{ skip_to_file_contents() }}
 
   {{ template|string }}
-
   <div class="bottom-gutter-3-2">
     <form method="post" enctype="multipart/form-data" action="{{url_for('main.start_job', service_id=current_service.id, upload_id=upload_id, original_file_name=original_file_name)}}" class='page-footer'>
       <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
@@ -39,7 +44,7 @@
           wrapping_class='bottom-gutter-2-3'
         ) }}
       {% endif %}
-      {% if (template.template_type != 'letter' or not request.args.from_test) and (not page_count or page_count <= letter_max_pages) %}
+      {% if (template.template_type != 'letter' or not request.args.from_test) and not letter_too_long %}
       <button type="submit" class="button">Send {{ count_of_recipients }} {{ message_count_label(count_of_recipients, template.template_type, suffix='') }}</button>
       {% else %}
         <a href="{{ url_for('main.check_messages_preview', service_id=current_service.id, template_id=template.id, upload_id=upload_id, filetype='pdf') }}" download class="button">Download as a PDF</a>

app/templates/views/notifications/check.html

@@ -49,6 +49,14 @@
         {% include "partials/check/message-too-long.html" %}
       {% endcall %}
     </div>
+  {% elif letter_too_long %}
+    {% set error = 'letter-too-long' %}
+    {{ govuk_back_link(back_link) }}
+    <div class="bottom-gutter">
+      {% call banner_wrapper(type='dangerous', id='letter-too-long') %}
+          {% include "partials/check/letter-too-long.html" %}
+      {% endcall %}
+    </div>
   {% else %}
     {{ page_header(
       'Preview of ‘{}’'.format(template.name),
@@ -66,7 +74,7 @@
         help='3' if help else 0
       )}}" class='page-footer'>
       <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
-      {% if not error and (not page_count or page_count <= letter_max_pages) %}
+      {% if not error %}
         <button type="submit" class="button">Send 1 {{ message_count_label(1, template.template_type, suffix='') }}</button>
       {% endif %}
       {% if template.template_type == 'letter' %}

app/templates/views/templates/_template.html

@@ -1,4 +1,5 @@
 {% from 'components/message-count-label.html' import message_count_label %}
+{% from "components/banner.html" import banner_wrapper %}
 
 <div class="column-whole">
   {% if template._template.archived %}
@@ -15,7 +16,12 @@
     <div class="bottom-gutter-2-3">
       <div class="grid-row">
         {% if template.template_type == 'letter' %}
-          {% if current_user.has_permissions('send_messages', restrict_admin_usage=True) and page_count <= letter_max_pages %}
+        {% if letter_too_long %}
+          {% call banner_wrapper(type='dangerous', id='letter-too-long') %}
+              {% include "partials/check/letter-too-long.html" %}
+          {% endcall %}
+        {% endif %}
+          {% if current_user.has_permissions('send_messages', restrict_admin_usage=True) and not letter_too_long %}
             <div class="column-half">
               <a href="{{ url_for(".set_sender", service_id=current_service.id, template_id=template.id) }}" class="pill-separate-item">
                 Send

app/templates/views/uploads/preview.html

@@ -1,5 +1,6 @@
 {% extends "withnav_template.html" %}
 {% from "components/page-header.html" import page_header %}
+{% from "components/banner.html" import banner_wrapper %}
 
 {% block service_page_title %}
   {{ original_filename }}
@@ -16,12 +17,16 @@
       Validation failed
     </p>
     {% endif %}
-
+    {% if letter_too_long %}
+      {% call banner_wrapper(type='dangerous', id='letter-too-long') %}
+          {% include "partials/check/letter-too-long.html" %}
+      {% endcall %}
+    {% endif %}
     <div class="letter-sent">
       {{ template|string }}
     </div>
 
-    {% if status == 'valid' %}
+    {% if status == 'valid' and not letter_too_long %}
     <div class="js-stick-at-bottom-when-scrolling">
       <form method="post" enctype="multipart/form-data" action="{{url_for(
           'main.send_uploaded_letter',