From 0633af4e4a5b7f951e23f51ed89f783ab5208f6a Mon Sep 17 00:00:00 2001
From: Katie Smith <katie.smith@digital.cabinet-office.gov.uk>
Date: Thu, 7 Jun 2018 10:55:48 +0100
Subject: [PATCH] Truncate contact link text on settings page

The contact link on the settings page should be truncated instead of the
text being wrapped and overflowing on to multiple lines. This adds in an
option to the text_field macro to truncate long text fields. This
setting has been used to truncate the API callback URLs too on the
services/<service_id>/api/callbacks page.
---
 app/assets/stylesheets/components/table.scss |  6 ++++++
 app/templates/components/table.html          | 13 +++++++++----
 app/templates/views/api/callbacks.html       |  4 ++--
 app/templates/views/service-settings.html    |  2 +-
 4 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/app/assets/stylesheets/components/table.scss b/app/assets/stylesheets/components/table.scss
index 4e66d2452..9de3550e6 100644
--- a/app/assets/stylesheets/components/table.scss
+++ b/app/assets/stylesheets/components/table.scss
@@ -265,3 +265,9 @@ a.table-show-more-link {
   overflow: hidden;
   text-overflow: ellipsis;
 }
+
+.truncate-text {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
diff --git a/app/templates/components/table.html b/app/templates/components/table.html
index e43f2bfa9..e47858de0 100644
--- a/app/templates/components/table.html
+++ b/app/templates/components/table.html
@@ -78,7 +78,7 @@
   </td>
 {%- endmacro %}
 
-{% macro text_field(text, status='') -%}
+{% macro text_field(text, status='', truncate=false) -%}
   {% call field(status=status) %}
     {% if text is iterable and text is not string %}
       <ul class="list list-bullet">
@@ -89,15 +89,20 @@
         {% endfor %}
       </ul>
     {% else %}
-      {{ text }}
+      {% if truncate %}
+        <div class="truncate-text" title="{{ text }}">{{text}}</div>
+      {% else %}
+        {{ text }}
+      {% endif %}
     {% endif %}
   {% endcall %}
 {%- endmacro %}
 
-{% macro optional_text_field(text, default='Not set') -%}
+{% macro optional_text_field(text, default='Not set', truncate=false) -%}
   {{ text_field(
     text or default,
-    status='' if text else 'default'
+    status='' if text else 'default',
+    truncate=truncate
   ) }}
 {%- endmacro %}
 
diff --git a/app/templates/views/api/callbacks.html b/app/templates/views/api/callbacks.html
index be53a3717..6ed1c4f06 100644
--- a/app/templates/views/api/callbacks.html
+++ b/app/templates/views/api/callbacks.html
@@ -19,13 +19,13 @@
 	  ) %}
 	    {% call row() %}
 	      {{ text_field('Callbacks for delivery receipts') }}
-	      {{ optional_text_field(delivery_status_callback) }}
+	      {{ optional_text_field(delivery_status_callback, truncate=true) }}
 	      {{ edit_field('Change', url_for('.delivery_status_callback', service_id=current_service.id)) }}
 	    {% endcall %}
 
 	    {% call row() %}
 	      {{ text_field('Callbacks for received text messages') }}
-          {{ optional_text_field(received_text_messages_callback) }}
+          {{ optional_text_field(received_text_messages_callback, truncate=true) }}
 	   	  {{ edit_field('Change', url_for('.received_text_messages_callback', service_id=current_service.id)) }}
 	    {% endcall %}
 	  {% endcall %}
diff --git a/app/templates/views/service-settings.html b/app/templates/views/service-settings.html
index 494eae496..751ad11e3 100644
--- a/app/templates/views/service-settings.html
+++ b/app/templates/views/service-settings.html
@@ -49,7 +49,7 @@
         {% if 'upload_document' in current_service.permissions %}
         {% call row() %}
           {{ text_field('Contact link') }}
-          {{ text_field(current_service.contact_link) }}
+          {{ text_field(current_service.contact_link, truncate=true) }}
           {{ edit_field(
               'Change',
               url_for('.service_set_contact_link',