💄 Optimize displaying of message

lib/screens/chat.dart

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_expandable_fab/flutter_expandable_fab.dart';
 import 'package:gap/gap.dart';
 import 'package:go_router/go_router.dart';
+import 'package:google_fonts/google_fonts.dart';
 import 'package:material_symbols_icons/symbols.dart';
 import 'package:provider/provider.dart';
 import 'package:responsive_framework/responsive_framework.dart';
@@ -136,6 +137,28 @@ class _ChatScreenState extends State<ChatScreen> {
     _fetchWhatsNew();
   }
 
+  void _onTapChannel(SnChannel channel) {
+    final doExpand = ResponsiveBreakpoints.of(context).largerOrEqualTo(DESKTOP);
+
+    if (doExpand) {
+      setState(() => _focusChannel = channel);
+      return;
+    }
+    GoRouter.of(context).pushNamed(
+      'chatRoom',
+      pathParameters: {
+        'scope': channel.realm?.alias ?? 'global',
+        'alias': channel.alias,
+      },
+    ).then((value) {
+      if (mounted) {
+        _unreadCounts?[channel.id] = 0;
+        setState(() => _unreadCounts?[channel.id] = 0);
+        _refreshChannels(noRemote: true);
+      }
+    });
+  }
+
   @override
   Widget build(BuildContext context) {
     final ud = context.read<UserDirectoryProvider>();
@@ -285,23 +308,7 @@ class _ChatScreenState extends State<ChatScreen> {
                               ?.avatar,
                         ),
                         onTap: () {
-                          if (doExpand) {
+                          _onTapChannel(channel);
-                            setState(() => _focusChannel = channel);
-                            return;
-                          }
-                          GoRouter.of(context).pushNamed(
-                            'chatRoom',
-                            pathParameters: {
-                              'scope': channel.realm?.alias ?? 'global',
-                              'alias': channel.alias,
-                            },
-                          ).then((value) {
-                            if (mounted) {
-                              _unreadCounts?[channel.id] = 0;
-                              setState(() => _unreadCounts?[channel.id] = 0);
-                              _refreshChannels(noRemote: true);
-                            }
-                          });
                         },
                       );
                     }
@@ -319,10 +326,43 @@ class _ChatScreenState extends State<ChatScreen> {
                         ],
                       ),
                       subtitle: lastMessage != null
-                          ? Text(
+                          ? Row(
-                              '${ud.getAccountFromCache(lastMessage.sender.accountId)?.nick}: ${lastMessage.body['text'] ?? 'Unable preview'}',
+                              children: [
-                              maxLines: 1,
+                                Badge(
-                              overflow: TextOverflow.ellipsis,
+                                  label: Text(ud
+                                          .getAccountFromCache(
+                                              lastMessage.sender.accountId)
+                                          ?.nick ??
+                                      'unknown'.tr()),
+                                  backgroundColor:
+                                      Theme.of(context).colorScheme.primary,
+                                ),
+                                const Gap(6),
+                                Expanded(
+                                  child: Text(
+                                    lastMessage.body['text'] ??
+                                        'Unable preview',
+                                    maxLines: 1,
+                                    overflow: TextOverflow.ellipsis,
+                                  ),
+                                ),
+                                Text(
+                                  DateFormat(
+                                    lastMessage.createdAt.toLocal().day ==
+                                            DateTime.now().day
+                                        ? 'HH:mm'
+                                        : lastMessage.createdAt
+                                                    .toLocal()
+                                                    .year ==
+                                                DateTime.now().year
+                                            ? 'MM/dd'
+                                            : 'yy/MM/dd',
+                                  ).format(lastMessage.createdAt.toLocal()),
+                                  style: GoogleFonts.robotoMono(
+                                    fontSize: 12,
+                                  ),
+                                ),
+                              ],
                             )
                           : Text(
                               channel.description,
@@ -332,7 +372,7 @@ class _ChatScreenState extends State<ChatScreen> {
                       contentPadding:
                           const EdgeInsets.symmetric(horizontal: 16),
                       leading: AccountImage(
-                        content: null,
+                        content: channel.realm?.avatar,
                         fallbackWidget: const Icon(Symbols.chat, size: 20),
                       ),
                       onTap: () {
@@ -341,18 +381,7 @@ class _ChatScreenState extends State<ChatScreen> {
                           setState(() => _focusChannel = channel);
                           return;
                         }
-                        GoRouter.of(context).pushNamed(
+                        _onTapChannel(channel);
-                          'chatRoom',
-                          pathParameters: {
-                            'scope': channel.realm?.alias ?? 'global',
-                            'alias': channel.alias,
-                          },
-                        ).then((value) {
-                          if (mounted) {
-                            setState(() => _unreadCounts?[channel.id] = 0);
-                            _refreshChannels(noRemote: true);
-                          }
-                        });
                       },
                     );
                   },

lib/screens/home.dart

@@ -93,8 +93,12 @@ class _HomeScreenState extends State<HomeScreen> {
                       : MainAxisAlignment.start,
                   children: [
                     _HomeDashUpdateWidget(
-                        padding: const EdgeInsets.only(
+                      padding: const EdgeInsets.only(
-                            bottom: 8, left: 8, right: 8)),
+                        bottom: 8,
+                        left: 8,
+                        right: 8,
+                      ),
+                    ),
                     _HomeDashSpecialDayWidget().padding(horizontal: 8),
                     StaggeredGrid.extent(
                       maxCrossAxisExtent: 280,

lib/widgets/chat/chat_message.dart

@@ -161,7 +161,7 @@ class ChatMessage extends StatelessWidget {
                           if (data.preload?.quoteEvent != null)
                             StyledWidget(Container(
                               constraints: BoxConstraints(
-                                maxWidth: 480,
+                                maxWidth: 360,
                               ),
                               decoration: BoxDecoration(
                                 borderRadius:
@@ -210,9 +210,8 @@ class ChatMessage extends StatelessWidget {
               AttachmentList(
                 data: data.preload!.attachments!,
                 bordered: true,
-                maxHeight: 560,
+                maxHeight: 360,
-                maxWidth: 480,
+                maxWidth: 480 - 48 - padding.left,
-                minWidth: 480,
                 padding: padding.copyWith(top: 8, left: 48 + padding.left),
               ),
             if (!hasMerged && !isCompact)
@@ -292,14 +291,11 @@ class _ChatMessageText extends StatelessWidget {
                 buttonItems: items,
               );
             },
-            child: Container(
+            child: MarkdownTextContent(
-              constraints: const BoxConstraints(maxWidth: 480),
+              content: data.body['text'],
-              child: MarkdownTextContent(
+              isAutoWarp: true,
-                content: data.body['text'],
+              isEnlargeSticker:
-                isAutoWarp: true,
+                  RegExp(r"^:([-\w]+):$").hasMatch(data.body['text'] ?? ''),
-                isEnlargeSticker:
-                    RegExp(r"^:([-\w]+):$").hasMatch(data.body['text'] ?? ''),
-              ),
             ),
           ),
           if (data.updatedAt != data.createdAt)