#8 Added marker to indicate read status in talk chats

lib/view/pages/talk/chatView.dart

@@ -53,6 +53,7 @@ class _ChatViewState extends State<ChatView> {
             DateTime elementDate = DateTime.fromMillisecondsSinceEpoch(element.timestamp * 1000);
 
             if(element.systemMessage.contains("reaction")) return;
+            int commonRead = int.parse(data.getChatResponse.headers?['x-chat-last-common-read'] ?? "0");
 
             if(!elementDate.isSameDay(lastDate)) {
               lastDate = elementDate;
@@ -66,11 +67,12 @@ class _ChatViewState extends State<ChatView> {
             }
             messages.add(
               ChatBubble(
-                  context: context,
-                  isSender: element.actorId == widget.selfId && element.messageType == GetRoomResponseObjectMessageType.comment,
-                  bubbleData: element,
-                  chatData: widget.room,
-                  refetch: _query
+                context: context,
+                isSender: element.actorId == widget.selfId && element.messageType == GetRoomResponseObjectMessageType.comment,
+                bubbleData: element,
+                chatData: widget.room,
+                refetch: _query,
+                isRead: element.id <= commonRead,
               )
             );
           });

lib/view/pages/talk/components/chatBubble.dart

@@ -27,6 +27,11 @@ class ChatBubble extends StatefulWidget {
   final bool isSender;
   final GetChatResponseObject bubbleData;
   final GetRoomResponseObject chatData;
+  final bool isRead;
+
+  final double spacing = 3;
+  final double timeIconSize = 11;
+  final Color timeIconColor = Colors.grey;
 
   final void Function({bool renew}) refetch;
 
@@ -36,6 +41,7 @@ class ChatBubble extends StatefulWidget {
     required this.bubbleData,
     required this.chatData,
     required this.refetch,
+    this.isRead = false,
     super.key});
 
   @override
@@ -110,7 +116,7 @@ class _ChatBubbleState extends State<ChatBubble> {
     Text timeText = Text(
       Jiffy.parseFromMillisecondsSinceEpoch(widget.bubbleData.timestamp * 1000).format(pattern: "HH:mm"),
       textAlign: TextAlign.end,
-      style: const TextStyle(color: Colors.grey, fontSize: 12),
+      style: TextStyle(color: widget.timeIconColor, fontSize: widget.timeIconSize),
     );
 
     return Column(
@@ -128,7 +134,7 @@ class _ChatBubbleState extends State<ChatBubble> {
                 maxWidth: MediaQuery.of(context).size.width * 0.9,
                 minWidth: showActorDisplayName
                     ? actorText.size.width
-                    : timeText.size.width,
+                    : timeText.size.width + (widget.isSender ? widget.spacing + widget.timeIconSize : 0) + 3,
               ),
               child: Stack(
                 children: [
@@ -149,7 +155,18 @@ class _ChatBubbleState extends State<ChatBubble> {
                     child: Positioned(
                       bottom: 0,
                       right: 0,
-                      child: timeText
+                      child: Row(
+                        children: [
+                          timeText,
+                          if(widget.isSender) ...[
+                            SizedBox(width: widget.spacing),
+                            if(widget.isRead)
+                              Icon(Icons.done_all_outlined, size: widget.timeIconSize, color: widget.timeIconColor)
+                            else
+                              Icon(Icons.done_outlined, size: widget.timeIconSize, color: widget.timeIconColor)
+                          ]
+                        ],
+                      )
                     ),
                   ),
                   Visibility(