Merge pull request #150 from GetStream/feature/messageTap

add message tap callbacks

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 0.2.14
+
+- Add onMessageTap callbacks
+
 ## 0.2.13+2
 
 - Add debounce to on change messageinput listener

lib/src/message_list_view.dart

@@ -103,6 +103,9 @@ class MessageListView extends StatefulWidget {
     this.threadBuilder,
     this.onThreadTap,
     this.dateDividerBuilder,
+    this.onMessageTap,
+    this.onSystemMessageTap,
+    this.onParentMessageTap,
     this.scrollPhysics = const AlwaysScrollableScrollPhysics(),
     this.keyboardDismissBehavior = ScrollViewKeyboardDismissBehavior.manual,
   }) : super(key: key);
@@ -120,6 +123,15 @@ class MessageListView extends StatefulWidget {
   /// By default it calls [Navigator.push] using the widget built using [threadBuilder]
   final ThreadTapCallback onThreadTap;
 
+  /// The function called when tapping on the message when the message is not failed
+  final Function(Message) onMessageTap;
+
+  /// The function called when tapping on a system message
+  final Function(Message) onSystemMessageTap;
+
+  /// The function called when tapping on the parent message when the message is not failed
+  final Function(Message) onParentMessageTap;
+
   /// Parent message in case of a thread
   final Message parentMessage;
 
@@ -412,6 +424,7 @@ class _MessageListViewState extends State<MessageListView> {
         topRight: Radius.circular(16),
         bottomRight: Radius.circular(16),
       ),
+      onMessageTap: widget.onParentMessageTap,
       borderSide: isMyMessage ? BorderSide.none : null,
       showUserAvatar: DisplayWidget.show,
       messageTheme: isMyMessage
@@ -427,6 +440,7 @@ class _MessageListViewState extends State<MessageListView> {
   ) {
     if (message.type == 'system' && message.text?.isNotEmpty == true) {
       return SystemMessage(
+        onMessageTap: widget.onSystemMessageTap,
         message: message,
       );
     }
@@ -464,6 +478,7 @@ class _MessageListViewState extends State<MessageListView> {
               (index == 0 || message.status != MessageSendingStatus.SENT)
           ? DisplayWidget.show
           : DisplayWidget.hide,
+      onMessageTap: widget.onMessageTap,
       showTimestamp: !isNextUser || readList?.isNotEmpty == true,
       showEditMessage: isMyMessage,
       showDeleteMessage: isMyMessage,

lib/src/message_widget.dart

@@ -40,7 +40,14 @@ class MessageWidget extends StatefulWidget {
 
   /// The function called when tapping on replies
   final void Function(Message) onThreadTap;
+
+  /// The function called when tapping on the message when the message is not failed
+  final void Function(Message) onMessageTap;
+
+  /// The builder of MessageInput used while editing this message
   final Widget Function(BuildContext, Message) editMessageInputBuilder;
+
+  /// The builder of the text of the message
   final Widget Function(BuildContext, Message) textBuilder;
 
   /// Function called on long press
@@ -113,6 +120,7 @@ class MessageWidget extends StatefulWidget {
     Key key,
     @required this.message,
     @required this.messageTheme,
+    this.onMessageTap,
     this.reverse = false,
     this.shape,
     this.attachmentShape,
@@ -210,7 +218,13 @@ class _MessageWidgetState extends State<MessageWidget> {
     if (widget.showSendingIndicator == DisplayWidget.gone) {
       leftPadding -= 7;
     }
-    return Portal(
+    return GestureDetector(
+      onTap: () => onMessageTap(context),
+      onLongPress: () => onLongPress(context),
+      behavior: HitTestBehavior.opaque,
+      child: Container(
+        width: double.infinity,
+        child: Portal(
           child: Padding(
             padding: widget.padding ?? EdgeInsets.all(8),
             child: Transform(
@@ -232,12 +246,14 @@ class _MessageWidgetState extends State<MessageWidget> {
                           crossAxisAlignment: CrossAxisAlignment.end,
                           mainAxisSize: MainAxisSize.min,
                           children: <Widget>[
-                        if (widget.showSendingIndicator == DisplayWidget.show)
+                            if (widget.showSendingIndicator ==
+                                DisplayWidget.show)
                               _buildSendingIndicator(),
                             SizedBox(
                               width: 2,
                             ),
-                        if (widget.showSendingIndicator == DisplayWidget.hide)
+                            if (widget.showSendingIndicator ==
+                                DisplayWidget.hide)
                               SizedBox(
                                 width: 8,
                               ),
@@ -248,8 +264,8 @@ class _MessageWidgetState extends State<MessageWidget> {
                             ),
                             if (widget.showUserAvatar == DisplayWidget.hide)
                               SizedBox(
-                            width: widget.messageTheme.avatarTheme.constraints
+                                width: widget.messageTheme.avatarTheme
-                                    .maxWidth +
+                                        .constraints.maxWidth +
                                     8,
                               ),
                             Flexible(
@@ -265,7 +281,8 @@ class _MessageWidgetState extends State<MessageWidget> {
                                   portal: _buildReactionIndicator(context),
                                   child: (widget.message.isDeleted &&
                                           widget.message.status !=
-                                          MessageSendingStatus.FAILED_DELETE)
+                                              MessageSendingStatus
+                                                  .FAILED_DELETE)
                                       ? Transform(
                                           alignment: Alignment.center,
                                           transform: Matrix4.rotationY(
@@ -305,6 +322,8 @@ class _MessageWidgetState extends State<MessageWidget> {
               ),
             ),
           ),
+        ),
+      ),
     );
   }
 
@@ -531,9 +550,6 @@ class _MessageWidgetState extends State<MessageWidget> {
             padding: EdgeInsets.only(
               bottom: 4,
             ),
-            child: GestureDetector(
-              onTap: () => retryMessage(context),
-              onLongPress: () => onLongPress(context),
             child: Material(
               color: _getBackgroundColor(),
               clipBehavior: Clip.hardEdge,
@@ -543,8 +559,7 @@ class _MessageWidgetState extends State<MessageWidget> {
                     side: widget.attachmentBorderSide ??
                         widget.borderSide ??
                         BorderSide(
-                            color:
+                          color: Theme.of(context).brightness == Brightness.dark
-                                Theme.of(context).brightness == Brightness.dark
                               ? Colors.white.withAlpha(24)
                               : Colors.black.withAlpha(24),
                         ),
@@ -575,7 +590,6 @@ class _MessageWidgetState extends State<MessageWidget> {
                 ),
               ),
             ),
-            ),
           );
         })?.toList() ??
         [];
@@ -700,10 +714,7 @@ class _MessageWidgetState extends State<MessageWidget> {
   }
 
   Widget _buildTextBubble(BuildContext context) {
-    return GestureDetector(
+    return Material(
-      onTap: () => retryMessage(context),
-      onLongPress: () => onLongPress(context),
-      child: Material(
       shape: widget.shape ??
           ContinuousRectangleBorder(
             side: widget.borderSide ??
@@ -729,7 +740,6 @@ class _MessageWidgetState extends State<MessageWidget> {
           ),
         ),
       ),
-      ),
     );
   }
 
@@ -741,7 +751,7 @@ class _MessageWidgetState extends State<MessageWidget> {
         : widget.messageTheme.messageBackgroundColor;
   }
 
-  void retryMessage(BuildContext context) {
+  void onMessageTap(BuildContext context) {
     final channel = StreamChannel.of(context).channel;
     if (widget.message.status == MessageSendingStatus.FAILED) {
       channel.sendMessage(widget.message);
@@ -762,6 +772,10 @@ class _MessageWidgetState extends State<MessageWidget> {
           );
       return;
     }
+
+    if (widget.onMessageTap != null) {
+      widget.onMessageTap(widget.message);
+    }
   }
 
   Widget _buildText(BuildContext context) {

lib/src/system_message.dart

@@ -4,11 +4,16 @@ import 'package:stream_chat_flutter/stream_chat_flutter.dart';
 
 /// It shows a date divider depending on the date difference
 class SystemMessage extends StatelessWidget {
+  /// This message
   final Message message;
 
+  /// The function called when tapping on the message when the message is not failed
+  final void Function(Message) onMessageTap;
+
   const SystemMessage({
     Key key,
     @required this.message,
+    this.onMessageTap,
   }) : super(key: key);
 
   @override
@@ -44,7 +49,16 @@ class SystemMessage extends StatelessWidget {
       dayInfo = createdAt.format('dd/MM/yyyy').toUpperCase();
     }
 
-    return Row(
+    return GestureDetector(
+      behavior: HitTestBehavior.opaque,
+      onTap: () {
+        if (onMessageTap != null) {
+          onMessageTap(message);
+        }
+      },
+      child: Container(
+        width: double.infinity,
+        child: Row(
           crossAxisAlignment: CrossAxisAlignment.start,
           children: <Widget>[
             divider,
@@ -95,6 +109,8 @@ class SystemMessage extends StatelessWidget {
             ),
             divider,
           ],
+        ),
+      ),
     );
   }
 }

pubspec.yaml

@@ -1,7 +1,7 @@
 name: stream_chat_flutter
 homepage: https://github.com/GetStream/stream-chat-flutter
 description: Stream Chat official Flutter SDK. Build your own chat experience using Dart and Flutter.
-version: 0.2.13+2
+version: 0.2.14
 repository: https://github.com/GetStream/stream-chat-flutter
 issue_tracker: https://github.com/GetStream/stream-chat-flutter/issues