Tell user why validation failed on letter validation page - part 1

app/main/views/platform_admin.py

@@ -5,6 +5,7 @@ from datetime import datetime
 
 from flask import abort, flash, redirect, render_template, request, url_for
 from notifications_python_client.errors import HTTPError
+from notifications_utils import LETTER_MAX_PAGE_COUNT
 from requests import RequestException
 
 from app import (
@@ -34,6 +35,7 @@ from app.utils import (
     Spreadsheet,
     generate_next_dict,
     generate_previous_dict,
+    get_letter_validation_error,
     get_page_from_request,
     user_has_permissions,
     user_is_platform_admin,
@@ -425,7 +427,18 @@ def letter_validation_preview(from_platform_admin):
             response = validate_letter(pdf_file)
             response.raise_for_status()
             if response.status_code == 200:
-                pages, message, result = response.json()["pages"], response.json()["message"], response.json()["result"]
+                pages, message = response.json()["pages"], response.json()["message"],
+                passed_validation = response.json()["result"]
+                invalid_pages = response.json().get('invalid_pages')
+                page_count = len(pages)
+                if page_count > LETTER_MAX_PAGE_COUNT:
+                    message = "letter-too-long"
+                    passed_validation = False
+
+                if not passed_validation:
+                    message = get_letter_validation_error(
+                        message, invalid_pages=invalid_pages, page_count=page_count
+                    )
         except RequestException as error:
             if error.response and error.response.status_code == 400:
                 message = "Something was wrong with the file you tried to upload. Please upload a valid PDF file."

app/templates/partials/check/letter-validation-failed-banner.html

@@ -0,0 +1,14 @@
+{% from "components/banner.html" import banner_wrapper %}
+
+{% call banner_wrapper(type='dangerous') %}
+  {% if message is string %}
+    <h1 class="banner-title">{{ message }}</h1>
+  {% else %}
+    <h1 class="banner-title">{{ message.title }}</h1>
+    {% if message.detail %}
+      <p>
+        {{ message.detail | safe }}
+      </p>
+    {% endif %}
+  {% endif %}
+{% endcall %}

app/templates/views/letter-validation-preview.html

@@ -14,10 +14,10 @@
 
 <div class="grid-row">
   <div class="column-whole">
-    {% if result %}
+    {% if passed_validation %}
       {{ banner(message, with_tick=True) }}
     {% elif message %}
-      {{ banner(message, 'dangerous')}}
+      {% include "partials/check/letter-validation-failed-banner.html" %}
     {% endif %}
 
       <h1 class="heading-large">Letter validation preview</h1>

app/templates/views/platform-admin/letter-validation-preview.html

@@ -21,10 +21,10 @@
     )}}
   </div>
   <div class="column-whole template-container">
-    {% if result %}
+    {% if passed_validation %}
       {{ banner(message, with_tick=True) }}
     {% elif message %}
-      {{ banner(message, 'dangerous')}}
+      {% include "partials/check/letter-validation-failed-banner.html" %}
     {% endif %}
 
     {% for page in pages %}