feat:✨Added a feature to show message time in message bubble. Removed…

… enableSwipeToSeeTime(bool) & added showMessageTimeIn(Enum) from FeatureActiveConfig class.(#115)
SimformSolutionsPvtLtd · Sep 28, 2023 · a8cb3c3 · a8cb3c3
1 parent 75e1dbf
commit a8cb3c3
Show file tree

Hide file tree

Showing 17 changed files with 119 additions and 106 deletions.
diff --git a/example/lib/data.dart b/example/lib/data.dart
@@ -131,11 +131,11 @@ class Data {
     ),
     Message(
       id: '116',
-      message: "",
+      message: "w",
       createdAt: DateTime.now(),
       sendBy: '2',
       status: MessageStatus.read,
-      messageType: MessageType.voice,
+      // messageType: MessageType.voice,
     ),
   ];
 }
diff --git a/example/lib/main.dart b/example/lib/main.dart
@@ -2,6 +2,7 @@ import 'package:chatview/chatview.dart';
 import 'package:example/data.dart';
 import 'package:example/models/theme.dart';
 import 'package:flutter/material.dart';
+import 'package:intl/intl.dart';
 
 void main() {
   runApp(const Example());
@@ -78,12 +79,11 @@ class _ChatScreenState extends State<ChatScreen> {
         currentUser: currentUser,
         chatController: _chatController,
         onSendTap: _onSendTap,
-        featureActiveConfig: FeatureActiveConfig(
+        featureActiveConfig: const FeatureActiveConfig(
           lastSeenAgoBuilderVisibility: false,
           receiptsBuilderVisibility: true,
           enablePagination: true,
-          showMessageTimeIn: ShowMessageTimeIn.outsideChatBubble,
-          enableSwipeToSeeTime: true,
+          showMessageTimeIn: ShowMessageCreateTime.onRightSwipe,
         ),
         chatViewState: ChatViewState.hasMessages,
         chatViewStateConfig: ChatViewStateConfiguration(
@@ -247,6 +247,9 @@ class _ChatScreenState extends State<ChatScreen> {
               defaultIconColor: theme.shareIconColor,
             ),
           ),
+          messageDateTimeBuilder: (date) => Text(
+            DateFormat('hh:mm a').format(date),
+          ),
         ),
         profileCircleConfig: const ProfileCircleConfiguration(
           profileImageUrl: Data.profileImage,

diff --git a/example/pubspec.yaml b/example/pubspec.yaml
@@ -14,6 +14,7 @@ dependencies:
   cupertino_icons: ^1.0.5
   chatview:
     path: ../
+  intl:
 
 dev_dependencies:
   flutter_test:

diff --git a/lib/src/models/feature_active_config.dart b/lib/src/models/feature_active_config.dart
@@ -5,7 +5,6 @@ class FeatureActiveConfig {
     this.enableSwipeToReply = true,
     this.enableReactionPopup = true,
     this.enableTextField = true,
-    this.enableSwipeToSeeTime = true,
     this.enableCurrentUserProfileAvatar = false,
     this.enableOtherUserProfileAvatar = true,
     this.enableReplySnackBar = true,
@@ -14,7 +13,7 @@ class FeatureActiveConfig {
     this.enableDoubleTapToLike = true,
     this.lastSeenAgoBuilderVisibility = true,
     this.receiptsBuilderVisibility = true,
-    this.showMessageTimeIn = ShowMessageTimeIn.none,
+    this.showMessageTimeIn = ShowMessageCreateTime.onRightSwipe,
   }) ;
   /// Used for enable/disable swipe to reply.
   final bool enableSwipeToReply;
@@ -25,8 +24,8 @@ class FeatureActiveConfig {
   /// Used for enable/disable text field.
   final bool enableTextField;
 
-  /// Used for enable/disable swipe whole chat to see message created time.
-  final bool enableSwipeToSeeTime;
+  // /// Used for enable/disable swipe whole chat to see message created time.
+  // final bool enableSwipeToSeeTime;
 
   /// Used for enable/disable current user profile circle.
   final bool enableCurrentUserProfileAvatar;
@@ -52,5 +51,5 @@ class FeatureActiveConfig {
   /// Controls the visibility of the message [receiptsBuilder]
   final bool receiptsBuilderVisibility;
 
-  final ShowMessageTimeIn showMessageTimeIn;
+  final ShowMessageCreateTime showMessageTimeIn;
 }
diff --git a/lib/src/models/message_configuration.dart b/lib/src/models/message_configuration.dart
@@ -23,6 +23,8 @@ import 'package:chatview/src/models/models.dart';
 import 'package:chatview/src/models/voice_message_configuration.dart';
 import 'package:flutter/material.dart';
 
+import '../../chatview.dart';
+
 class MessageConfiguration {
   /// Provides configuration of image message appearance.
   final ImageMessageConfiguration? imageMessageConfig;
@@ -39,11 +41,14 @@ class MessageConfiguration {
   /// Configurations for voice message bubble
   final VoiceMessageConfiguration? voiceMessageConfig;
 
+  final MessageDateTimeBuilder? messageDateTimeBuilder;
+
   const MessageConfiguration({
     this.imageMessageConfig,
     this.messageReactionConfig,
     this.emojiMessageConfig,
     this.customMessageBuilder,
     this.voiceMessageConfig,
+    this.messageDateTimeBuilder,
   });
 }
diff --git a/lib/src/values/enumaration.dart b/lib/src/values/enumaration.dart
@@ -53,14 +53,17 @@ extension ChatViewStateExtension on ChatViewState {
   bool get noMessages => this == ChatViewState.noData;
 }
 
-enum ShowMessageTimeIn {
+enum ShowMessageCreateTime {
   insideChatBubble,
   outsideChatBubble,
-  none;
+  onRightSwipe,
+  disable;
 
   bool get isInsideChatBubble => this == insideChatBubble;
 
   bool get isOutSideChatBubble => this == outsideChatBubble;
 
-  bool get isNone => this == none;
+  bool get isOnRightSwipe => this == onRightSwipe;
+
+  bool get isDisable => this == disable;
 }
diff --git a/lib/src/values/typedefs.dart b/lib/src/values/typedefs.dart
@@ -35,3 +35,4 @@ typedef VoidCallBackWithFuture = Future<void> Function();
 typedef StringsCallBack = void Function(String emoji, String messageId);
 typedef StringWithReturnWidget = Widget Function(String separator);
 typedef DragUpdateDetailsCallback = void Function(DragUpdateDetails);
+typedef MessageDateTimeBuilder = Widget Function(DateTime date);
diff --git a/lib/src/widgets/chat_bubble_widget.dart b/lib/src/widgets/chat_bubble_widget.dart
@@ -47,7 +47,6 @@ class ChatBubbleWidget extends StatefulWidget {
     this.messageConfig,
     this.onReplyTap,
     this.shouldHighlight = false,
-    this.showMessageTimeIn = ShowMessageTimeIn.none,
   }) : super(key: key);
 
   /// Represent current instance of message.
@@ -93,8 +92,6 @@ class ChatBubbleWidget extends StatefulWidget {
   /// Flag for when user tap on replied message and highlight actual message.
   final bool shouldHighlight;
 
-  final ShowMessageTimeIn showMessageTimeIn;
-
   @override
   State<ChatBubbleWidget> createState() => _ChatBubbleWidgetState();
 }
@@ -130,13 +127,15 @@ class _ChatBubbleWidgetState extends State<ChatBubbleWidget> {
     final messagedUser = chatController?.getUserFromId(widget.message.sendBy);
     return Stack(
       children: [
-        if (featureActiveConfig?.enableSwipeToSeeTime ?? true) ...[
+        if (featureActiveConfig?.showMessageTimeIn.isOnRightSwipe ?? true) ...[
           Visibility(
             visible: widget.slideAnimation?.value.dx == 0.0 ? false : true,
             child: Positioned.fill(
               child: Align(
                 alignment: Alignment.centerRight,
                 child: MessageTimeWidget(
+                  messageDateTimeBuilder:
+                      widget.messageConfig?.messageDateTimeBuilder,
                   messageTime: widget.message.createdAt,
                   isCurrentUser: isMessageBySender,
                   messageTimeIconColor: widget.messageTimeIconColor,
@@ -355,7 +354,6 @@ class _ChatBubbleWidgetState extends State<ChatBubbleWidget> {
                   ?.repliedMsgAutoScrollConfig.highlightScale ??
               1.1,
           onMaxDuration: _onMaxDuration,
-          showMessageTimeIn: widget.showMessageTimeIn,
         ),
       ],
     );

diff --git a/lib/src/widgets/chat_groupedlist_widget.dart b/lib/src/widgets/chat_groupedlist_widget.dart
@@ -47,7 +47,6 @@ class ChatGroupedListWidget extends StatefulWidget {
     this.swipeToReplyConfig,
     this.repliedMessageConfig,
     this.typeIndicatorConfig,
-    this.showMessageTimeIn = ShowMessageTimeIn.none,
   }) : super(key: key);
 
   /// Allow user to swipe to see time while reaction pop is not open.
@@ -93,8 +92,6 @@ class ChatGroupedListWidget extends StatefulWidget {
   /// swipe whole chat.
   final bool isEnableSwipeToSeeTime;
 
-  final ShowMessageTimeIn showMessageTimeIn;
-
   @override
   State<ChatGroupedListWidget> createState() => _ChatGroupedListWidgetState();
 }
@@ -332,7 +329,6 @@ class _ChatGroupedListWidgetState extends State<ChatGroupedListWidget>
                                 false
                             ? (replyId) => _onReplyTap(replyId, snapshot.data)
                             : null,
-                        showMessageTimeIn: widget.showMessageTimeIn,
                       );
                     },
                   );

diff --git a/lib/src/widgets/chat_list_widget.dart b/lib/src/widgets/chat_list_widget.dart
@@ -51,7 +51,6 @@ class ChatListWidget extends StatefulWidget {
     this.loadMoreData,
     this.isLastPage,
     this.onChatListTap,
-    this.showMessageTimeIn = ShowMessageTimeIn.none,
   }) : super(key: key);
 
   /// Provides controller for accessing few function for running chat.
@@ -109,8 +108,6 @@ class ChatListWidget extends StatefulWidget {
   /// Provides callback when user tap anywhere on whole chat.
   final VoidCallBack? onChatListTap;
 
-  final ShowMessageTimeIn showMessageTimeIn;
-
   @override
   State<ChatListWidget> createState() => _ChatListWidgetState();
 }
@@ -195,7 +192,7 @@ class _ChatListWidgetState extends State<ChatListWidget>
                     showTypingIndicator: showTypingIndicator,
                     scrollController: scrollController,
                     isEnableSwipeToSeeTime:
-                        featureActiveConfig?.enableSwipeToSeeTime ?? true,
+                        featureActiveConfig?.showMessageTimeIn.isOnRightSwipe ?? true,
                     chatBackgroundConfig: widget.chatBackgroundConfig,
                     assignReplyMessage: widget.assignReplyMessage,
                     replyMessage: widget.replyMessage,
@@ -224,7 +221,6 @@ class _ChatListWidgetState extends State<ChatListWidget>
                       }
                     },
                     onChatListTap: _onChatListTap,
-                    showMessageTimeIn: widget.showMessageTimeIn,
                   ),
                   if (featureActiveConfig?.enableReactionPopup ?? false)
                     ReactionPopup(

diff --git a/lib/src/widgets/chat_view.dart b/lib/src/widgets/chat_view.dart
@@ -250,8 +250,6 @@ class _ChatViewState extends State<ChatView>
                           assignReplyMessage: (message) => _sendMessageKey
                               .currentState
                               ?.assignReplyMessage(message),
-                          showMessageTimeIn:
-                              widget.featureActiveConfig.showMessageTimeIn,
                         );
                       },
                     ),

diff --git a/lib/src/widgets/chatui_textfield.dart b/lib/src/widgets/chatui_textfield.dart
@@ -106,9 +106,7 @@ class _ChatUITextFieldState extends State<ChatUITextField> {
 
     if (defaultTargetPlatform == TargetPlatform.iOS ||
         defaultTargetPlatform == TargetPlatform.android) {
-      controller = RecorderController(
-
-      );
+      controller = RecorderController();
     }
   }
 

diff --git a/lib/src/widgets/image_message_view.dart b/lib/src/widgets/image_message_view.dart
@@ -25,8 +25,10 @@ import 'dart:io';
 import 'package:chatview/chatview.dart';
 import 'package:chatview/src/extensions/extensions.dart';
 import 'package:chatview/src/models/models.dart';
+import 'package:chatview/src/widgets/message_time_widget.dart';
 import 'package:flutter/material.dart';
 
+import 'chat_view_inherited_widget.dart';
 import 'reaction_widget.dart';
 import 'share_icon.dart';
 
@@ -39,7 +41,7 @@ class ImageMessageView extends StatelessWidget {
     this.messageReactionConfig,
     this.highlightImage = false,
     this.highlightScale = 1.2,
-    this.showMessageTimeIn = ShowMessageTimeIn.none,
+    this.messageDateTimeBuilder,
   }) : super(key: key);
 
   /// Provides message instance of chat.
@@ -60,7 +62,7 @@ class ImageMessageView extends StatelessWidget {
   /// Provides scale of highlighted image when user taps on replied image.
   final double highlightScale;
 
-  final ShowMessageTimeIn showMessageTimeIn;
+  final MessageDateTimeBuilder? messageDateTimeBuilder;
 
   String get imageUrl => message.message;
 
@@ -71,6 +73,9 @@ class ImageMessageView extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final showMessageTimeIn = ChatViewInheritedWidget.of(context)!
+        .featureActiveConfig
+        .showMessageTimeIn;
     return Row(
       mainAxisSize: MainAxisSize.min,
       mainAxisAlignment:
@@ -143,18 +148,17 @@ class ImageMessageView extends StatelessWidget {
                 reaction: message.reaction,
                 messageReactionConfig: messageReactionConfig,
               ),
-            if(!showMessageTimeIn.isNone)
-            Positioned(
-              right: message.reaction.reactions.isNotEmpty ? 16 : 18,
-              bottom: 20,
-              child: Text(
-                message.createdAt.getTimeFromDateTime,
-                style: TextStyle(
-                  fontSize: 10,
-                  color: Colors.white.withOpacity(0.5),
-                ),
+            if (!showMessageTimeIn.isOnRightSwipe &&
+                !showMessageTimeIn.isDisable)
+              Positioned(
+                right: message.reaction.reactions.isNotEmpty ? 16 : 18,
+                bottom: 20,
+                child: messageDateTimeBuilder?.call(message.createdAt) ??
+                    MessageTimeWidget(
+                      isCurrentUser: isMessageBySender,
+                      messageTime: message.createdAt,
+                    ),
               ),
-            ),
           ],
         ),
         if (!isMessageBySender) iconButton,

diff --git a/lib/src/widgets/message_time_widget.dart b/lib/src/widgets/message_time_widget.dart
@@ -19,18 +19,20 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
-import 'package:chatview/chatview.dart';
 import 'package:chatview/src/extensions/extensions.dart';
+import 'package:chatview/src/values/typedefs.dart';
 import 'package:flutter/material.dart';
 
+import 'chat_view_inherited_widget.dart';
+
 class MessageTimeWidget extends StatelessWidget {
   const MessageTimeWidget({
     Key? key,
     required this.messageTime,
     required this.isCurrentUser,
     this.messageTimeTextStyle,
     this.messageTimeIconColor,
-    this.showMessageTimeIn = ShowMessageTimeIn.none,
+    this.messageDateTimeBuilder,
   }) : super(key: key);
 
   /// Provides message crated date time.
@@ -46,17 +48,20 @@ class MessageTimeWidget extends StatelessWidget {
   /// seeing message sending time
   final Color? messageTimeIconColor;
 
-  final ShowMessageTimeIn showMessageTimeIn;
+  final MessageDateTimeBuilder? messageDateTimeBuilder;
 
   @override
   Widget build(BuildContext context) {
-    return !showMessageTimeIn.isNone
+    final showMessageTimeIn = ChatViewInheritedWidget.of(context)!
+        .featureActiveConfig
+        .showMessageTimeIn;
+    return !showMessageTimeIn.isOnRightSwipe
         ? Text(
             messageTime.getTimeFromDateTime,
             style: messageTimeTextStyle ??
                 TextStyle(
                   fontSize: 10,
-                  color: Colors.black.withOpacity(0.5),
+                  color: Colors.black.withOpacity(0.6),
                 ),
           )
         : Align(
@@ -81,11 +86,12 @@ class MessageTimeWidget extends StatelessWidget {
                     ),
                   ),
                   const SizedBox(width: 4),
-                  Text(
-                    messageTime.getTimeFromDateTime,
-                    style:
-                        messageTimeTextStyle ?? const TextStyle(fontSize: 12),
-                  ),
+                  messageDateTimeBuilder?.call(messageTime) ??
+                      Text(
+                        messageTime.getTimeFromDateTime,
+                        style: messageTimeTextStyle ??
+                            const TextStyle(fontSize: 12),
+                      ),
                 ],
               ),
             ),