feat: Minor design improvements

lib/components/list_items/chat_list_item.dart

@@ -5,6 +5,8 @@ import 'package:famedlysdk/famedlysdk.dart';
 import 'package:fluffychat/utils/matrix_locals.dart';
 import 'package:fluffychat/views/chat.dart';
 import 'package:flutter/material.dart';
+import 'package:fluffychat/utils/event_extension.dart';
+import 'package:fluffychat/utils/room_status_extension.dart';
 import 'package:flutter_gen/gen_l10n/l10n.dart';
 import 'package:pedantic/pedantic.dart';
 
@@ -129,6 +131,7 @@ class ChatListItem extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final isMuted = room.pushRuleState != PushRuleState.notify;
+    final typingText = room.getLocalizedTypingText(context);
     return Center(
       child: Material(
         color: chatListItemColor(context, activeChat, selected),
@@ -182,6 +185,9 @@ class ChatListItem extends StatelessWidget {
                   room.timeCreated.localizedTimeShort(context),
                   style: TextStyle(
                     fontSize: 13,
+                    color: room.notificationCount > 0
+                        ? Theme.of(context).primaryColor
+                        : null,
                   ),
                 ),
               ),
@@ -190,37 +196,52 @@ class ChatListItem extends StatelessWidget {
           subtitle: Row(
             mainAxisAlignment: MainAxisAlignment.center,
             children: <Widget>[
+              if (room.typingUsers.isEmpty &&
+                  room.lastEvent?.senderId ==
+                      Matrix.of(context).client.userID) ...{
+                Icon(
+                  room.lastEvent.statusIcon,
+                  size: 14,
+                ),
+                SizedBox(width: 4),
+              },
               Expanded(
-                child: room.membership == Membership.invite
+                child: typingText.isNotEmpty
                     ? Text(
-                        L10n.of(context).youAreInvitedToThisChat,
+                        typingText,
                         style: TextStyle(
                           color: Theme.of(context).primaryColor,
                         ),
                         softWrap: false,
                       )
-                    : Text(
+                    : room.membership == Membership.invite
-                        room.lastEvent?.getLocalizedBody(
+                        ? Text(
-                              MatrixLocals(L10n.of(context)),
+                            L10n.of(context).youAreInvitedToThisChat,
-                              withSenderNamePrefix: !room.isDirectChat ||
+                            style: TextStyle(
-                                  room.lastEvent.senderId == room.client.userID,
+                              color: Theme.of(context).primaryColor,
-                              hideReply: true,
+                            ),
-                            ) ??
+                            softWrap: false,
-                            '',
+                          )
-                        softWrap: false,
+                        : Text(
-                        maxLines: 1,
+                            room.lastEvent?.getLocalizedBody(
-                        overflow: TextOverflow.ellipsis,
+                                  MatrixLocals(L10n.of(context)),
-                        style: TextStyle(
+                                  hideReply: true,
-                          decoration: room.lastEvent?.redacted == true
+                                ) ??
-                              ? TextDecoration.lineThrough
+                                '',
-                              : null,
+                            softWrap: false,
-                        ),
+                            maxLines: 1,
-                      ),
+                            overflow: TextOverflow.ellipsis,
+                            style: TextStyle(
+                              decoration: room.lastEvent?.redacted == true
+                                  ? TextDecoration.lineThrough
+                                  : null,
+                            ),
+                          ),
               ),
               SizedBox(width: 8),
               room.notificationCount > 0
                   ? Container(
-                      padding: EdgeInsets.symmetric(horizontal: 5),
+                      padding: EdgeInsets.symmetric(horizontal: 7),
                       height: 20,
                       decoration: BoxDecoration(
                         color: room.highlightCount > 0
@@ -231,7 +252,9 @@ class ChatListItem extends StatelessWidget {
                       child: Center(
                         child: Text(
                           room.notificationCount.toString(),
-                          style: TextStyle(color: Colors.white),
+                          style: TextStyle(
+                            color: Colors.white,
+                          ),
                         ),
                       ),
                     )

lib/components/list_items/message.dart

@@ -126,7 +126,7 @@ class Message extends StatelessWidget {
                       displayEvent,
                       textColor: textColor,
                     ),
-                    SizedBox(height: 4),
+                    SizedBox(height: 3),
                     Opacity(
                       opacity: 0,
                       child: _MetaRow(
@@ -264,7 +264,7 @@ class _MetaRow extends StatelessWidget {
         if (ownMessage)
           Icon(
             displayEvent.statusIcon,
-            size: 12,
+            size: 14,
             color: color,
           ),
       ],

lib/utils/room_status_extension.dart

@@ -28,4 +28,27 @@ extension RoomStatusExtension on Room {
     }
     return L10n.of(context).countParticipants(mJoinedMemberCount.toString());
   }
+
+  String getLocalizedTypingText(BuildContext context) {
+    var typingText = '';
+    var typingUsers = this.typingUsers;
+    typingUsers.removeWhere((User u) => u.id == client.userID);
+
+    if (typingUsers.length == 1) {
+      typingText = L10n.of(context).isTyping;
+      if (typingUsers.first.id != directChatMatrixID) {
+        typingText =
+            L10n.of(context).userIsTyping(typingUsers.first.calcDisplayname());
+      }
+    } else if (typingUsers.length == 2) {
+      typingText = L10n.of(context).userAndUserAreTyping(
+          typingUsers.first.calcDisplayname(),
+          typingUsers[1].calcDisplayname());
+    } else if (typingUsers.length > 2) {
+      typingText = L10n.of(context).userAndOthersAreTyping(
+          typingUsers.first.calcDisplayname(),
+          (typingUsers.length - 1).toString());
+    }
+    return typingText;
+  }
 }

lib/views/chat.dart

@@ -465,25 +465,7 @@ class _ChatState extends State<_Chat> {
       SimpleDialogs(context).tryRequestWithLoadingDialog(room.join());
     }
 
-    var typingText = '';
+    final typingText = room.getLocalizedTypingText(context);
-    var typingUsers = room.typingUsers;
-    typingUsers.removeWhere((User u) => u.id == client.userID);
-
-    if (typingUsers.length == 1) {
-      typingText = L10n.of(context).isTyping;
-      if (typingUsers.first.id != room.directChatMatrixID) {
-        typingText =
-            L10n.of(context).userIsTyping(typingUsers.first.calcDisplayname());
-      }
-    } else if (typingUsers.length == 2) {
-      typingText = L10n.of(context).userAndUserAreTyping(
-          typingUsers.first.calcDisplayname(),
-          typingUsers[1].calcDisplayname());
-    } else if (typingUsers.length > 2) {
-      typingText = L10n.of(context).userAndOthersAreTyping(
-          typingUsers.first.calcDisplayname(),
-          (typingUsers.length - 1).toString());
-    }
 
     return Scaffold(
       appBar: AppBar(