better time and status position

lib/chat/views/chat_builders/vc_text_message_widget.dart

@@ -22,7 +22,6 @@ class VcTextMessageWidget extends StatelessWidget {
     this.timeStyle,
     this.showTime = true,
     this.showStatus = true,
-    this.timeAndStatusPosition = TimeAndStatusPosition.end,
     super.key,
   });
 
@@ -63,9 +62,6 @@ class VcTextMessageWidget extends StatelessWidget {
   /// for sent messages.
   final bool showStatus;
 
-  /// Position of the timestamp and status indicator relative to the text.
-  final TimeAndStatusPosition timeAndStatusPosition;
-
   bool get _isOnlyEmoji => message.metadata?['isOnlyEmoji'] == true;
 
   @override
@@ -98,7 +94,11 @@ class VcTextMessageWidget extends StatelessWidget {
           : textStyle,
     );
 
-    return Container(
+    return Column(
+        crossAxisAlignment:
+            isSentByMe ? CrossAxisAlignment.end : CrossAxisAlignment.start,
+        children: [
+          Container(
               padding: _isOnlyEmoji
                   ? EdgeInsets.symmetric(
                       horizontal: (padding?.horizontal ?? 0) / 2,
@@ -111,49 +111,9 @@ class VcTextMessageWidget extends StatelessWidget {
                       color: backgroundColor,
                       borderRadius: borderRadius ?? chatTheme.shape,
                     ),
-      child: _buildContentBasedOnPosition(
+              child: textContent),
-        context: context,
+          if (timeAndStatus != null) timeAndStatus,
-        textContent: textContent,
+        ]);
-        timeAndStatus: timeAndStatus,
-        textStyle: textStyle,
-      ),
-    );
-  }
-
-  Widget _buildContentBasedOnPosition({
-    required BuildContext context,
-    required Widget textContent,
-    TimeAndStatus? timeAndStatus,
-    TextStyle? textStyle,
-  }) {
-    if (timeAndStatus == null) {
-      return textContent;
-    }
-
-    switch (timeAndStatusPosition) {
-      case TimeAndStatusPosition.start:
-        return Column(
-          crossAxisAlignment: CrossAxisAlignment.start,
-          mainAxisSize: MainAxisSize.min,
-          children: [textContent, timeAndStatus],
-        );
-      case TimeAndStatusPosition.inline:
-        return Row(
-          mainAxisSize: MainAxisSize.min,
-          crossAxisAlignment: CrossAxisAlignment.end,
-          children: [
-            Flexible(child: textContent),
-            const SizedBox(width: 4),
-            timeAndStatus,
-          ],
-        );
-      case TimeAndStatusPosition.end:
-        return Column(
-          crossAxisAlignment: CrossAxisAlignment.end,
-          mainAxisSize: MainAxisSize.min,
-          children: [textContent, timeAndStatus],
-        );
-    }
   }
 
   Color _resolveBackgroundColor(bool isSentByMe, ScaleChatTheme theme) {
@@ -170,11 +130,8 @@ class VcTextMessageWidget extends StatelessWidget {
     return receivedTextStyle ?? theme.receivedMessageBodyTextStyle;
   }
 
-  TextStyle _resolveTimeStyle(bool isSentByMe, ScaleChatTheme theme) {
+  TextStyle _resolveTimeStyle(bool isSentByMe, ScaleChatTheme theme) =>
-    final ts = _resolveTextStyle(isSentByMe, theme);
+      theme.timeStyle;
-
-    return theme.timeStyle.copyWith(color: ts.color);
-  }
 
   @override
   void debugFillProperties(DiagnosticPropertiesBuilder properties) {
@@ -193,9 +150,7 @@ class VcTextMessageWidget extends StatelessWidget {
           'receivedTextStyle', receivedTextStyle))
       ..add(DiagnosticsProperty<TextStyle?>('timeStyle', timeStyle))
       ..add(DiagnosticsProperty<bool>('showTime', showTime))
-      ..add(DiagnosticsProperty<bool>('showStatus', showStatus))
+      ..add(DiagnosticsProperty<bool>('showStatus', showStatus));
-      ..add(EnumProperty<TimeAndStatusPosition>(
-          'timeAndStatusPosition', timeAndStatusPosition));
   }
 }
 

lib/chat/views/chat_component_widget.dart

@@ -261,18 +261,36 @@ class _ChatComponentWidgetState extends State<ChatComponentWidget> {
                           chatAnimatedListBuilder: (context, itemBuilder) =>
                               ChatAnimatedListReversed(
                                   scrollController: _scrollController,
+                                  messageGroupingTimeoutInSeconds: 60,
                                   itemBuilder: itemBuilder),
                           // Text message builder
-                          textMessageBuilder: (context, message, index) =>
+                          textMessageBuilder: (context, message, index) {
-                              VcTextMessageWidget(
+                            var showTime = true;
+                            if (_chatController.messages.length > 1 &&
+                                index < _chatController.messages.length - 1 &&
+                                message.time != null) {
+                              final nextMessage =
+                                  _chatController.messages[index + 1];
+                              if (nextMessage.time != null) {
+                                if (nextMessage.time!
+                                            .difference(message.time!)
+                                            .inSeconds <
+                                        60 &&
+                                    nextMessage.authorId == message.authorId) {
+                                  showTime = false;
+                                }
+                              }
+                            }
+                            return VcTextMessageWidget(
                               message: message,
                               index: index,
                               padding: const EdgeInsets.symmetric(
                                       vertical: 12, horizontal: 16)
-                                      .scaled(context)
+                                  .scaled(context),
-                                  // showTime: true,
+                              showTime: showTime,
-                                  // showStatus: true,
+                              showStatus: showTime,
-                                  ),
+                            );
+                          },
                           // Composer builder
                           composerBuilder: (ctx) => VcComposerWidget(
                             autofocus: true,

lib/chat_list/views/chat_list_widget.dart

@@ -56,11 +56,9 @@ class ChatListWidget extends StatelessWidget {
           valueMapper: (c) => c.value);
 
       final chatListV = context.watch<ChatListCubit>().state;
-      return chatListV
+      return chatListV.builder((context, chatList) => SizedBox.expand(
-          .builder((context, chatList) => SizedBox.expand(
+              child: styledContainer(
-                  child: styledTitleContainer(
             context: context,
-                title: translate('chat_list.chats'),
             child: (chatList.isEmpty)
                 ? const SizedBox.expand(child: EmptyChatListWidget())
                 : TapRegion(
@@ -77,22 +75,19 @@ class ChatListWidget extends StatelessWidget {
                               contactMap,
                             );
                           case proto.Chat_Kind.group:
-                                return const Text(
+                            return const Text('group chats not yet supported!');
-                                    'group chats not yet supported!');
                           case proto.Chat_Kind.notSet:
                             throw StateError('unknown chat kind');
                         }
                       },
                       filter: (value) =>
                           _itemFilter(contactMap, chatList, value),
-                          searchFieldPadding:
+                      searchFieldPadding: const EdgeInsets.fromLTRB(0, 0, 0, 4),
-                              const EdgeInsets.fromLTRB(0, 0, 0, 4),
                       inputDecoration: InputDecoration(
                         labelText: translate('chat_list.search'),
                       ),
                     )).paddingAll(8),
-              )))
+          )));
-          .paddingLTRB(8, 0, 8, 8);
     });
   }
 }

lib/theme/models/scale_theme/scale_chat_theme.dart

@@ -354,7 +354,10 @@ extension ScaleChatThemeExt on ScaleTheme {
               : scheme.primaryScale.calloutText,
         ),
         onlyEmojiFontSize: 64,
-        timeStyle: textTheme.bodySmall!.copyWith(fontSize: 9),
+        timeStyle: textTheme.bodySmall!.copyWith(fontSize: 9).copyWith(
+            color: config.preferBorders || config.useVisualIndicators
+                ? scheme.primaryScale.calloutBackground
+                : scheme.primaryScale.borderText),
         receivedMessageBodyTextStyle: textTheme.bodyLarge!.copyWith(
           color: config.preferBorders
               ? scheme.secondaryScale.calloutBackground

lib/theme/views/widget_helpers.dart

@@ -464,6 +464,38 @@ Widget styledTitleContainer({
       ]));
 }
 
+Widget styledContainer({
+  required BuildContext context,
+  required Widget child,
+  Color? borderColor,
+  Color? backgroundColor,
+}) {
+  final theme = Theme.of(context);
+  final scale = theme.extension<ScaleScheme>()!;
+  final scaleConfig = theme.extension<ScaleConfig>()!;
+
+  return DecoratedBox(
+      decoration: ShapeDecoration(
+          color: borderColor ?? scale.primaryScale.border,
+          shape: RoundedRectangleBorder(
+            borderRadius:
+                BorderRadius.circular(8 * scaleConfig.borderRadiusScale),
+          )),
+      child: Column(children: [
+        DecoratedBox(
+                decoration: ShapeDecoration(
+                    color:
+                        backgroundColor ?? scale.primaryScale.subtleBackground,
+                    shape: RoundedRectangleBorder(
+                      borderRadius: BorderRadius.circular(
+                          8 * scaleConfig.borderRadiusScale),
+                    )),
+                child: child)
+            .paddingAll(4)
+            .expanded()
+      ]));
+}
+
 Widget styledCard({
   required BuildContext context,
   required Widget child,