From e05033cce31db365ace0560a4a71f9755f972093 Mon Sep 17 00:00:00 2001 From: Deven Joshi Date: Thu, 7 Jan 2021 14:33:35 +0530 Subject: [PATCH 1/3] Only 4 mentions allowed at a time --- lib/src/message_input.dart | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/lib/src/message_input.dart b/lib/src/message_input.dart index 52d91d45..cabbafec 100644 --- a/lib/src/message_input.dart +++ b/lib/src/message_input.dart @@ -1153,7 +1153,7 @@ class MessageInputState extends State { ), clipBehavior: Clip.antiAlias, child: Container( - constraints: BoxConstraints.loose(Size.fromHeight(400)), + constraints: BoxConstraints.loose(Size.fromHeight(240)), decoration: BoxDecoration( color: StreamChatTheme.of(context).colorTheme.white, ), @@ -1164,6 +1164,7 @@ class MessageInputState extends State { return ListView( padding: const EdgeInsets.all(0), shrinkWrap: true, + itemExtent: 58.0, children: snapshot.data .map((m) => ListTile( leading: UserAvatar( @@ -1177,10 +1178,16 @@ class MessageInputState extends State { ), title: Text( '${m.user.name}', + maxLines: 1, + overflow: TextOverflow.ellipsis, style: TextStyle( fontWeight: FontWeight.bold), ), - subtitle: Text('@${m.userId}'), + subtitle: Text( + '@${m.userId}', + maxLines: 1, + overflow: TextOverflow.ellipsis, + ), trailing: StreamSvgIcon.mentions( color: StreamChatTheme.of(context) .colorTheme From 3b19fe6c36c46895578ba5b1463782e1e31adfd6 Mon Sep 17 00:00:00 2001 From: Deven Joshi Date: Thu, 7 Jan 2021 20:57:53 +0530 Subject: [PATCH 2/3] feat: Redid UI For mentions --- lib/src/message_input.dart | 199 ++++++++++++++++++++++++------------- 1 file changed, 132 insertions(+), 67 deletions(-) diff --git a/lib/src/message_input.dart b/lib/src/message_input.dart index cabbafec..e7a5b24d 100644 --- a/lib/src/message_input.dart +++ b/lib/src/message_input.dart @@ -1132,12 +1132,13 @@ class MessageInputState extends State { RenderBox renderBox = context.findRenderObject(); final size = renderBox.size; - return OverlayEntry(builder: (context) { - return Positioned( - bottom: size.height + MediaQuery.of(context).viewInsets.bottom, - left: 0, - right: 0, - child: TweenAnimationBuilder( + return OverlayEntry( + builder: (context) { + return Positioned( + bottom: size.height + MediaQuery.of(context).viewInsets.bottom, + left: 0, + right: 0, + child: TweenAnimationBuilder( tween: Tween(begin: 0.0, end: 1.0), duration: Duration(milliseconds: 300), curve: Curves.easeInOutExpo, @@ -1158,72 +1159,136 @@ class MessageInputState extends State { color: StreamChatTheme.of(context).colorTheme.white, ), child: FutureBuilder>( - future: queryMembers ?? Future.value(members), - initialData: members, - builder: (context, snapshot) { - return ListView( - padding: const EdgeInsets.all(0), - shrinkWrap: true, - itemExtent: 58.0, - children: snapshot.data - .map((m) => ListTile( - leading: UserAvatar( - constraints: BoxConstraints.tight( - Size( - 40, - 40, - ), + future: queryMembers ?? Future.value(members), + initialData: members, + builder: (context, snapshot) { + return ListView( + padding: const EdgeInsets.all(0), + shrinkWrap: true, + children: [ + SizedBox( + height: 8.0, + ), + ...snapshot.data.map( + (m) { + return Material( + color: StreamChatTheme.of(context) + .colorTheme + .white, + child: InkWell( + onTap: () { + _mentionedUsers.add(m.user); + + splits[splits.length - 1] = m.user.name; + final rejoin = splits.join('@'); + + textEditingController.value = + TextEditingValue( + text: rejoin + + textEditingController.text + .substring(textEditingController + .selection.start), + selection: TextSelection.collapsed( + offset: rejoin.length, ), - user: m.user, - ), - title: Text( - '${m.user.name}', - maxLines: 1, - overflow: TextOverflow.ellipsis, - style: TextStyle( - fontWeight: FontWeight.bold), - ), - subtitle: Text( - '@${m.userId}', - maxLines: 1, - overflow: TextOverflow.ellipsis, - ), - trailing: StreamSvgIcon.mentions( - color: StreamChatTheme.of(context) - .colorTheme - .accentBlue, - ), - onTap: () { - _mentionedUsers.add(m.user); - - splits[splits.length - 1] = m.user.name; - final rejoin = splits.join('@'); - - textEditingController.value = - TextEditingValue( - text: rejoin + - textEditingController.text - .substring( - textEditingController - .selection.start), - selection: TextSelection.collapsed( - offset: rejoin.length, + ); + _debounce.cancel(); + _mentionsOverlay?.remove(); + _mentionsOverlay = null; + }, + child: Container( + height: 56.0, + child: Row( + crossAxisAlignment: + CrossAxisAlignment.center, + children: [ + SizedBox( + width: 16.0, ), - ); - _debounce.cancel(); - _mentionsOverlay?.remove(); - _mentionsOverlay = null; - }, - )) - .toList(), - ); - }), + UserAvatar( + constraints: BoxConstraints.tight( + Size( + 40, + 40, + ), + ), + user: m.user, + ), + SizedBox( + width: 8.0, + ), + Expanded( + child: Align( + alignment: Alignment.centerLeft, + child: Column( + mainAxisAlignment: + MainAxisAlignment.center, + crossAxisAlignment: + CrossAxisAlignment.start, + children: [ + Text( + '${m.user.name}', + maxLines: 1, + overflow: + TextOverflow.ellipsis, + style: StreamChatTheme.of( + context) + .textTheme + .bodyBold, + ), + SizedBox( + height: 2.0, + ), + Text( + '@${m.userId}', + maxLines: 1, + overflow: + TextOverflow.ellipsis, + style: StreamChatTheme.of( + context) + .textTheme + .footnoteBold + .copyWith( + color: StreamChatTheme + .of(context) + .colorTheme + .grey), + ), + ], + ), + ), + ), + Padding( + padding: const EdgeInsets.only( + right: 18.0, left: 8.0), + child: StreamSvgIcon.mentions( + color: StreamChatTheme.of(context) + .colorTheme + .accentBlue, + ), + ), + ], + ), + ), + ), + ); + }, + ).toList(), + SizedBox( + height: 8.0, + ), + ], + ); + }, + ), ), ), ); - }), - ); - }); + }, + ), + ); + }, + ); } OverlayEntry _buildEmojiOverlay() { From b0e76a5408db0a92e8a72cd4917cb34bb573f691 Mon Sep 17 00:00:00 2001 From: Deven Joshi Date: Thu, 7 Jan 2021 21:01:20 +0530 Subject: [PATCH 3/3] fix: fixed test --- test/src/channel_preview_test.dart | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/test/src/channel_preview_test.dart b/test/src/channel_preview_test.dart index 578d4b28..34b9bf92 100644 --- a/test/src/channel_preview_test.dart +++ b/test/src/channel_preview_test.dart @@ -42,10 +42,18 @@ void main() { user: User(id: 'user-id'), ), ]); - when(channelState.lastMessage).thenReturn(Message( - text: 'hello', - user: User(id: 'other-user'), - )); + when(channelState.messages).thenReturn([ + Message( + text: 'hello', + user: User(id: 'other-user'), + ) + ]); + when(channelState.messagesStream).thenAnswer((i) => Stream.value([ + Message( + text: 'hello', + user: User(id: 'other-user'), + ) + ])); await tester.pumpWidget(MaterialApp( home: StreamChat(