Add two-way messaging view

> Once an inbound message has been received, there should be a way to
> see the other messages in the system from the same service to the same
> number. Both in and outbound. Nice inbox/whatsapp stylee view or some
> such. This way the context of the reply is understood.
>
> Initially will only see the outbound template, not the actual message,
> but we’re going to change this for the rest (soon), so that you can
> always see the full message for all outbound.

tests/__init__.py

@@ -248,7 +248,9 @@ def notification_json(
             'template': {
                 'id': template['id'],
                 'name': template['name'],
-                'template_type': template['template_type']},
+                'template_type': template['template_type'],
+                'content': template['content'],
+            },
             'job': job_payload,
             'sent_at': sent_at,
             'status': status,

tests/app/main/views/test_conversation.py

@@ -0,0 +1,98 @@
+import pytest
+from bs4 import BeautifulSoup
+
+from flask import (
+    url_for,
+)
+from tests.conftest import (
+    SERVICE_ONE_ID,
+)
+from tests.app.test_utils import normalize_spaces
+from freezegun import freeze_time
+
+
+@pytest.mark.parametrize('index, expected', enumerate([
+    (
+        'message-8',
+        'Failed (sent yesterday at 2:59pm)',
+    ),
+    (
+        'message-7',
+        'Failed (sent yesterday at 2:59pm)',
+    ),
+    (
+        'message-6',
+        'Failed (sent yesterday at 4:59pm)',
+    ),
+    (
+        'message-5',
+        'Failed (sent yesterday at 6:59pm)',
+    ),
+    (
+        'message-4',
+        'Failed (sent yesterday at 8:59pm)',
+    ),
+    (
+        'message-3',
+        'Failed (sent yesterday at 10:59pm)',
+    ),
+    (
+        'message-2',
+        'Failed (sent yesterday at 10:59pm)',
+    ),
+    (
+        'message-1',
+        'Failed (sent yesterday at 11:00pm)',
+    ),
+    (
+        'template content',
+        'yesterday at midnight',
+    ),
+    (
+        'template content',
+        'yesterday at midnight',
+    ),
+    (
+        'template content',
+        'yesterday at midnight',
+    ),
+    (
+        'template content',
+        'yesterday at midnight',
+    ),
+    (
+        'template content',
+        'yesterday at midnight',
+    ),
+]))
+@freeze_time("2012-01-01 00:00:00")
+def test_view_conversation(
+    logged_in_client,
+    fake_uuid,
+    mock_get_notification,
+    mock_get_inbound_sms,
+    mock_get_notifications,
+    index,
+    expected,
+):
+
+    print(index)
+
+    response = logged_in_client.get(url_for(
+        'main.conversation',
+        service_id=SERVICE_ONE_ID,
+        notification_id=fake_uuid,
+    ))
+    assert response.status_code == 200
+    page = BeautifulSoup(response.data.decode('utf-8'), 'html.parser')
+
+    messages = page.select('.sms-message-wrapper')
+    statuses = page.select('.sms-message-status')
+
+    for elements in (messages, statuses):
+        assert len(elements) == 13
+
+    assert (
+        normalize_spaces(messages[index].text),
+        normalize_spaces(statuses[index].text),
+    ) == expected

tests/conftest.py

@@ -1096,6 +1096,22 @@ def mock_get_notifications(mocker, api_user_active):
     )
 
 
+@pytest.fixture(scope='function')
+def mock_get_notification(mocker, api_user_active):
+    def _get_notification(
+        service_id,
+        notification_id,
+    ):
+        return single_notification_json(
+            service_id,
+        )
+
+    return mocker.patch(
+        'app.notification_api_client.get_notification',
+        side_effect=_get_notification
+    )
+
+
 @pytest.fixture(scope='function')
 def mock_get_notifications_with_previous_next(mocker):
     def _get_notifications(service_id,
@@ -1138,11 +1154,13 @@ def mock_get_notifications_with_no_notifications(mocker):
 def mock_get_inbound_sms(mocker):
     def _get_inbound_sms(
         service_id,
+        user_number=None,
     ):
         return [{
             'user_number': '0790090000' + str(i),
             'content': 'message-{}'.format(index + 1),
-            'created_at': (datetime.utcnow() - timedelta(minutes=60 * (i + 1))).isoformat()
+            'created_at': (datetime.utcnow() - timedelta(minutes=60 * (i + 1), seconds=index)).isoformat(),
+            'id': sample_uuid(),
         } for index, i in enumerate([0, 0, 0, 2, 4, 6, 8, 8])]
 
     return mocker.patch(