💄 Mergeable chat messages

lib/screens/chat/room.dart

@@ -76,9 +76,10 @@ class _ChatRoomScreenState extends State<ChatRoomScreen> {
                 Expanded(
                   child: InfiniteList(
                     reverse: true,
-                    padding: const EdgeInsets.symmetric(
+                    padding: const EdgeInsets.only(
-                      horizontal: 12,
+                      left: 12,
-                      vertical: 12,
+                      right: 12,
+                      top: 12,
                     ),
                     hasReachedMax: _messageController.isAllLoaded,
                     itemCount: _messageController.messages.length,
@@ -88,8 +89,32 @@ class _ChatRoomScreenState extends State<ChatRoomScreen> {
                     },
                     itemBuilder: (context, idx) {
                       final message = _messageController.messages[idx];
+                      final nextMessage =
+                          idx < _messageController.messages.length - 1
+                              ? _messageController.messages[idx + 1]
+                              : null;
+                      final previousMessage =
+                          idx > 0 ? _messageController.messages[idx - 1] : null;
+
+                      final canMerge = nextMessage != null &&
+                          nextMessage.senderId == message.senderId &&
+                          message.createdAt
+                                  .difference(nextMessage.createdAt)
+                                  .inMinutes
+                                  .abs() <=
+                              3;
+                      final canMergePrevious = previousMessage != null &&
+                          previousMessage.senderId == message.senderId &&
+                          message.createdAt
+                                  .difference(previousMessage.createdAt)
+                                  .inMinutes
+                                  .abs() <=
+                              3;
+
                       return ChatMessage(
                         data: message,
+                        isMerged: canMerge,
+                        hasMerged: canMergePrevious,
                         isPending: _messageController.unconfirmedMessages
                             .contains(message.uuid),
                       );

lib/widgets/chat/chat_message.dart

@@ -1,3 +1,4 @@
+import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:gap/gap.dart';
 import 'package:provider/provider.dart';
@@ -9,32 +10,60 @@ import 'package:surface/widgets/markdown_content.dart';
 
 class ChatMessage extends StatelessWidget {
   final SnChatMessage data;
+  final bool isMerged;
+  final bool hasMerged;
   final bool isPending;
-  const ChatMessage({super.key, required this.data, this.isPending = false});
+  const ChatMessage({
+    super.key,
+    required this.data,
+    this.isMerged = false,
+    this.hasMerged = false,
+    this.isPending = false,
+  });
 
   @override
   Widget build(BuildContext context) {
     final ud = context.read<UserDirectoryProvider>();
     final user = ud.getAccountFromCache(data.sender.accountId);
 
+    final dateFormatter = DateFormat('MM/dd HH:mm');
+
     return Row(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
-        AccountImage(
+        if (!isMerged)
-          content: user?.avatar,
+          AccountImage(
-        ),
+            content: user?.avatar,
+          )
+        else
+          const Gap(40),
         const Gap(8),
         Expanded(
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
-              Text(
+              if (!isMerged)
-                (data.sender.nick?.isNotEmpty ?? false)
+                Row(
-                    ? data.sender.nick!
+                  crossAxisAlignment: CrossAxisAlignment.baseline,
-                    : user!.nick,
+                  textBaseline: TextBaseline.alphabetic,
-              ).bold(),
+                  children: [
+                    Text(
+                      (data.sender.nick?.isNotEmpty ?? false)
+                          ? data.sender.nick!
+                          : user!.nick,
+                    ).bold(),
+                    const Gap(6),
+                    Text(
+                      dateFormatter.format(data.createdAt.toLocal()),
+                    ).fontSize(13),
+                  ],
+                ),
               if (data.body['text'] != null)
-                MarkdownTextContent(content: data.body['text']),
+                MarkdownTextContent(
+                  content: data.body['text'],
+                  isAutoWarp: true,
+                ),
+              if (!hasMerged) const Gap(8),
             ],
           ),
         )