version bump

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 0.2.0-alpha+11
+
+- Fix message builder and add messageList to it
+
 ## 0.2.0-alpha+10
 
 - Add date divider builder

example/lib/main.dart

@@ -91,7 +91,7 @@ class MyApp extends StatelessWidget {
     return MaterialApp(
       theme: ThemeData.light(),
       darkTheme: ThemeData.dark(),
-      themeMode: ThemeMode.dark,
+      themeMode: ThemeMode.system,
       home: Container(
         child: StreamChat(
           client: client,

lib/src/message_list_view.dart

@@ -10,7 +10,8 @@ import 'date_divider.dart';
 import 'message_widget.dart';
 import 'stream_channel.dart';
 
-typedef MessageBuilder = Widget Function(BuildContext, Message, int index);
+typedef MessageBuilder = Widget Function(
+    BuildContext, Message, List<Message>, int index);
 typedef ParentMessageBuilder = Widget Function(BuildContext, Message);
 typedef ThreadBuilder = Widget Function(BuildContext context, Message parent);
 typedef ThreadTapCallback = void Function(Message, Widget);
@@ -72,7 +73,6 @@ class MessageListView extends StatefulWidget {
     this.attachmentBuilders,
     this.dateDividerBuilder,
     this.showAvatar = true,
-    this.customClipperBuilder,
   }) : super(key: key);
 
   /// Function used to build a custom message widget
@@ -115,10 +115,6 @@ class MessageListView extends StatefulWidget {
   /// if true shows the user avatar
   final bool showAvatar;
 
-  /// Custom clipper applied to the message bubble
-  final CustomClipper Function(BuildContext, Message, int index)
-      customClipperBuilder;
-
   @override
   _MessageListViewState createState() => _MessageListViewState();
 }
@@ -181,13 +177,6 @@ class _MessageListViewState extends State<MessageListView> {
                         onMessageActions: widget.onMessageActions,
                         attachmentBuilders: widget.attachmentBuilders,
                         showAvatar: widget.showAvatar,
-                        customClipperBuilder: (message) {
-                          return widget.customClipperBuilder(
-                            context,
-                            message,
-                            i,
-                          );
-                        },
                       ),
                       Padding(
                         padding: const EdgeInsets.symmetric(horizontal: 32),
@@ -237,7 +226,8 @@ class _MessageListViewState extends State<MessageListView> {
               if (widget.messageBuilder != null) {
                 messageWidget = Builder(
                   key: ValueKey<String>('MESSAGE-${message.id}'),
-                  builder: (_) => widget.messageBuilder(context, message, i),
+                  builder: (_) =>
+                      widget.messageBuilder(context, message, _messages, i),
                 );
               } else {
                 messageWidget = MessageWidget(
@@ -253,11 +243,6 @@ class _MessageListViewState extends State<MessageListView> {
                   onMessageActions: widget.onMessageActions,
                   attachmentBuilders: widget.attachmentBuilders,
                   showAvatar: widget.showAvatar,
-                  customClipperBuilder: (message) {
-                    if (widget.customClipperBuilder != null) {
-                      return widget.customClipperBuilder(context, message, i);
-                    }
-                  },
                 );
               }
             }
@@ -331,8 +316,12 @@ class _MessageListViewState extends State<MessageListView> {
     if (widget.messageBuilder != null) {
       messageWidget = Builder(
         key: ValueKey<String>('MESSAGE-${message.id}'),
-        builder: (_) =>
+        builder: (_) => widget.messageBuilder(
-            widget.messageBuilder(context, message, _messages.length - 1),
+          context,
+          message,
+          _messages,
+          _messages.length - 1,
+        ),
       );
     } else {
       messageWidget = MessageWidget(
@@ -348,10 +337,6 @@ class _MessageListViewState extends State<MessageListView> {
         onMessageActions: widget.onMessageActions,
         attachmentBuilders: widget.attachmentBuilders,
         showAvatar: widget.showAvatar,
-        customClipperBuilder: (message) {
-          return widget.customClipperBuilder(
-              context, message, _messages.length - 1);
-        },
       );
     }
 
@@ -378,7 +363,7 @@ class _MessageListViewState extends State<MessageListView> {
     if (widget.messageBuilder != null) {
       messageWidget = Builder(
         key: ValueKey<String>('MESSAGE-${message.id}'),
-        builder: (_) => widget.messageBuilder(context, message, 0),
+        builder: (_) => widget.messageBuilder(context, message, _messages, 0),
       );
     } else {
       messageWidget = MessageWidget(
@@ -394,9 +379,6 @@ class _MessageListViewState extends State<MessageListView> {
         onMessageActions: widget.onMessageActions,
         attachmentBuilders: widget.attachmentBuilders,
         showAvatar: widget.showAvatar,
-        customClipperBuilder: (message) {
-          return widget.customClipperBuilder(context, message, 0);
-        },
       );
     }
 

lib/src/message_widget.dart

@@ -1,3 +1,5 @@
+import 'dart:math';
+
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/widgets.dart';
@@ -49,7 +51,6 @@ class MessageWidget extends StatefulWidget {
     this.showVideoFullScreen = true,
     this.attachmentBuilders,
     this.showAvatar = true,
-    this.customClipperBuilder,
   }) : super(key: key);
 
   /// Function called on mention tap
@@ -88,9 +89,6 @@ class MessageWidget extends StatefulWidget {
   /// if true shows the user avatar
   final bool showAvatar;
 
-  /// Custom clipper applied to the message bubble
-  final CustomClipper Function(Message) customClipperBuilder;
-
   @override
   _MessageWidgetState createState() => _MessageWidgetState();
 }
@@ -486,57 +484,46 @@ class _MessageWidgetState extends State<MessageWidget>
         right: _isMyMessage ? 0.0 : 8.0,
         left: _isMyMessage ? 8.0 : 0.0,
       ),
-      child: ClipPath(
+      child: Container(
-        clipper: widget.customClipperBuilder != null
+        decoration:
-            ? widget.customClipperBuilder(widget.message)
+            _buildBoxDecoration(_isLastUser || nOfAttachmentWidgets > 0),
-            : null,
+        padding: EdgeInsets.all(10),
-        clipBehavior: Clip.hardEdge,
+        constraints: BoxConstraints.loose(
-        child: Container(
+          Size.fromWidth(MediaQuery.of(context).size.width * 0.7),
-          decoration:
+        ),
-              _buildBoxDecoration(_isLastUser || nOfAttachmentWidgets > 0)
+        child: _buildSendingError(
-                  .copyWith(
+          MarkdownBody(
-                      borderRadius: widget.customClipperBuilder != null
+            data: text,
-                          ? BorderRadius.circular(0)
+            onTapLink: (link) {
-                          : null),
+              if (link.startsWith('@')) {
-          padding: EdgeInsets.all(10),
+                final mentionedUser = widget.message.mentionedUsers.firstWhere(
-          constraints: BoxConstraints.loose(
+                  (u) => '@${u.name.replaceAll(' ', '')}' == link,
-            Size.fromWidth(MediaQuery.of(context).size.width * 0.7),
+                  orElse: () => null,
-          ),
+                );
-          child: _buildSendingError(
-            MarkdownBody(
-              data: text,
-              onTapLink: (link) {
-                if (link.startsWith('@')) {
-                  final mentionedUser =
-                      widget.message.mentionedUsers.firstWhere(
-                    (u) => '@${u.name.replaceAll(' ', '')}' == link,
-                    orElse: () => null,
-                  );
 
-                  if (widget.onMentionTap != null) {
+                if (widget.onMentionTap != null) {
-                    widget.onMentionTap(mentionedUser);
+                  widget.onMentionTap(mentionedUser);
-                  } else {
-                    print('tap on ${mentionedUser.name}');
-                  }
                 } else {
-                  launchURL(context, link);
+                  print('tap on ${mentionedUser.name}');
                 }
-              },
+              } else {
-              styleSheet: MarkdownStyleSheet.fromTheme(
+                launchURL(context, link);
-                Theme.of(context).copyWith(
+              }
-                  textTheme: Theme.of(context).textTheme.apply(
+            },
-                        bodyColor: _messageTheme.messageText.color,
+            styleSheet: MarkdownStyleSheet.fromTheme(
-                        decoration: _messageTheme.messageText.decoration,
+              Theme.of(context).copyWith(
-                        decorationColor:
+                textTheme: Theme.of(context).textTheme.apply(
-                            _messageTheme.messageText.decorationColor,
+                      bodyColor: _messageTheme.messageText.color,
-                        decorationStyle:
+                      decoration: _messageTheme.messageText.decoration,
-                            _messageTheme.messageText.decorationStyle,
+                      decorationColor:
-                        fontFamily: _messageTheme.messageText.fontFamily,
+                          _messageTheme.messageText.decorationColor,
-                      ),
+                      decorationStyle:
-                ),
+                          _messageTheme.messageText.decorationStyle,
-              ).copyWith(
+                      fontFamily: _messageTheme.messageText.fontFamily,
-                p: _messageTheme.messageText,
+                    ),
               ),
+            ).copyWith(
+              p: _messageTheme.messageText,
             ),
           ),
         ),
@@ -555,14 +542,19 @@ class _MessageWidgetState extends State<MessageWidget>
   Widget _buildReactionPaint() {
     return widget.message.reactionCounts?.isNotEmpty == true
         ? Positioned(
-            left: _isMyMessage ? 8 : null,
+            left: _isMyMessage ? 4 : null,
-            right: !_isMyMessage ? 8 : null,
+            right: !_isMyMessage ? 4 : null,
             top: -6,
-            child: CustomPaint(
+            child: Transform(
-              painter: _ReactionBubblePainter(
+              transform:
-                Theme.of(context).brightness == Brightness.dark
+                  !_isMyMessage ? Matrix4.rotationY(pi) : Matrix4.identity(),
-                    ? Colors.white
+              alignment: Alignment.center,
-                    : Colors.black,
+              child: CustomPaint(
+                painter: _ReactionBubblePainter(
+                  Theme.of(context).brightness == Brightness.dark
+                      ? Colors.white
+                      : Colors.black,
+                ),
               ),
             ),
           )
@@ -895,9 +887,10 @@ class _ReactionBubblePainter extends CustomPainter {
   void paint(Canvas canvas, Size size) {
     final paint = Paint()..color = color;
     final path = Path();
-    path.arcToPoint(Offset(-6, -6));
+    path.lineTo(-2, -6);
-    path.arcToPoint(Offset(0, 10));
+    path.lineTo(0, 10);
-    path.arcToPoint(Offset(6, -6));
+    path.lineTo(10, -6);
+    path.lineTo(-2, -6);
     canvas.drawPath(path, paint);
   }
 

lib/src/thread_header.dart

@@ -130,9 +130,6 @@ class ThreadHeader extends StatelessWidget implements PreferredSizeWidget {
           child: Icon(
             Icons.close,
             size: 15,
-            color: Theme.of(context).brightness == Brightness.dark
-                ? Colors.white
-                : Colors.black,
           ),
         ),
       ),

lib/stream_chat_flutter.dart

@@ -7,12 +7,20 @@ export 'src/channel_name.dart';
 export 'src/channel_preview.dart';
 export 'src/channels_bloc.dart';
 export 'src/date_divider.dart';
+export 'src/deleted_message.dart';
+export 'src/file_attachment.dart';
+export 'src/giphy_attachment.dart';
+export 'src/image_attachment.dart';
 export 'src/message_input.dart';
 export 'src/message_list_view.dart';
 export 'src/message_widget.dart';
 export 'src/reaction_picker.dart';
+export 'src/reply_indicator.dart';
+export 'src/sending_indicator.dart';
 export 'src/stream_channel.dart';
 export 'src/stream_chat.dart';
 export 'src/stream_chat_theme.dart';
 export 'src/thread_header.dart';
 export 'src/typing_indicator.dart';
+export 'src/user_avatar.dart';
+export 'src/video_attachment.dart';

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.0-alpha+10
+version: 0.2.0-alpha+11
 
 environment:
   sdk: ">=2.3.0 <3.0.0"