Add message history

app/templates/components/sms-message.html

@@ -10,3 +10,13 @@
     </div>
   </div>
 {% endmacro %}
+
+{% macro message_history(title, log, heading_level=2) %}
+  <dl class="sms-message-history">
+    <h{{heading_level}} class="sms-message-history-heading">{{ title }}</h{{heading_level}}>
+    {% for update in log %}
+      <dt class="sms-message-history-time">{{ update.time }}</dt>
+      <dd class="sms-message-history-status">{{ update.status }}</dd>
+    {% endfor %}
+  </dl>
+{% endmacro %}

app/templates/views/job.html

@@ -53,7 +53,7 @@ GOV.UK Notify | Notifications activity
         <a href="{{ url_for('.shownotification', notification_id=item.id) }}">{{item.phone}}</a>
       {% endcall %}
       {% call field() %}
-        <a href="{{ url_for('.shownotification', notification_id=item.id) }}">{{item.message}}</a>
+        <a href="{{ url_for('.shownotification', notification_id=item.id) }}">{{item.message[:50]}}…</a>
       {% endcall %}
       {% call field(
         align='right',

app/templates/views/notification.html

@@ -1,5 +1,5 @@
 {% extends "withnav_template.html" %}
-{% from "components/sms-message.html" import sms_message %}
+{% from "components/sms-message.html" import sms_message, message_history %}
 
 {% block page_title %}
 GOV.UK Notify | Notifications activity
@@ -9,10 +9,17 @@ GOV.UK Notify | Notifications activity
 
 
 		<h1 class="heading-large">
-			Text message to {{ message.phone }}
+			Text message
 		</h1>
 
-		{{ sms_message(message.message) }}
+		<div class="grid-row">
+			<div class="column-two-thirds">
+				{{ sms_message(message.message, message.phone) }}
+			</div>
+			<div class="column-one-third">
+				{{ message_history("Message history", history) }}
+			</div>
+		</div>
 
   	<p>
 	  	<a href="{{ url_for('.showjob') }}">View other notifications in this job</a>