From a349bce10fecc4996149c6743d40aa351878087f Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Thu, 27 Aug 2020 17:27:37 -0500
Subject: [PATCH] Chats: show message date on hover

---
 .../chats/components/chat_message_list.js         | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/app/soapbox/features/chats/components/chat_message_list.js b/app/soapbox/features/chats/components/chat_message_list.js
index 5f5f4db9e..269dfcdb5 100644
--- a/app/soapbox/features/chats/components/chat_message_list.js
+++ b/app/soapbox/features/chats/components/chat_message_list.js
@@ -42,6 +42,20 @@ class ChatMessageList extends ImmutablePureComponent {
     this.scrollToBottom();
   };
 
+  getFormattedTimestamp = (chatMessage) => {
+    const { intl } = this.props;
+    return intl.formatDate(
+      new Date(chatMessage.get('created_at')), {
+        hour12: false,
+        year: 'numeric',
+        month: 'short',
+        day: '2-digit',
+        hour: '2-digit',
+        minute: '2-digit',
+      }
+    );
+  };
+
   componentDidUpdate(prevProps) {
     if (prevProps.chatMessages !== this.props.chatMessages)
       this.scrollToBottom();
@@ -61,6 +75,7 @@ class ChatMessageList extends ImmutablePureComponent {
             key={chatMessage.get('id')}
           >
             <span
+              title={this.getFormattedTimestamp(chatMessage)}
               className='chat-message__bubble'
               dangerouslySetInnerHTML={{ __html: emojify(chatMessage.get('content')) }}
             />