From aa09fd380ef08eebe48986dd920121e9fb8e856f Mon Sep 17 00:00:00 2001
From: Deven Joshi <deven9852@gmail.com>
Date: Wed, 9 Dec 2020 16:56:26 +0530
Subject: [PATCH] fix: UI fixes

---
 lib/src/chat_info_screen.dart | 95 +++++++++++++++++++++++++++++++----
 1 file changed, 84 insertions(+), 11 deletions(-)

diff --git a/lib/src/chat_info_screen.dart b/lib/src/chat_info_screen.dart
index 9ef80c9e..cbda9d9b 100644
--- a/lib/src/chat_info_screen.dart
+++ b/lib/src/chat_info_screen.dart
@@ -67,7 +67,11 @@ class _ChatInfoScreenState extends State<ChatInfoScreen> {
                 SizedBox(height: 15.0),
                 _OptionListTile(
                   title: '@user',
-                  trailing: Text(widget.user.name),
+                  trailing: Text(
+                    widget.user.name,
+                    style: TextStyle(
+                        color: Colors.black.withOpacity(0.5), fontSize: 16.0),
+                  ),
                   onTap: () {},
                 ),
               ],
@@ -198,7 +202,7 @@ class _ChatInfoScreenState extends State<ChatInfoScreen> {
       title: 'Delete',
       leading: StreamSvgIcon.delete(
         color: Colors.red,
-        size: 20.0,
+        size: 24.0,
       ),
       onTap: () {
         _showDeleteDialog();
@@ -290,15 +294,12 @@ class _ChatInfoScreenState extends State<ChatInfoScreen> {
       if (otherMember.online) {
         alternativeWidget = Text(
           'Online',
-          style: StreamChatTheme.of(context)
-              .channelTheme
-              .channelHeaderTheme
-              .lastMessageAt,
+          style: TextStyle(color: Colors.black.withOpacity(0.5)),
         );
       } else {
         alternativeWidget = Text(
           'Last seen ${Jiffy(otherMember.lastActive).fromNow()}',
-          //style: textStyle,
+          style: TextStyle(color: Colors.black.withOpacity(0.5)),
         );
       }
     }
@@ -428,10 +429,7 @@ class __SharedGroupsScreenState extends State<_SharedGroupsScreen> {
             itemBuilder: (context, position) {
               return StreamChannel(
                 channel: snapshot.data[position],
-                child: ChannelPreview(
-                  channel: snapshot.data[position],
-                  onTap: (val) {},
-                ),
+                child: _buildListTile(snapshot.data[position]),
               );
             },
           );
@@ -439,6 +437,81 @@ class __SharedGroupsScreenState extends State<_SharedGroupsScreen> {
       ),
     );
   }
+
+  Widget _buildListTile(Channel channel) {
+    var extraData = channel.extraData;
+    var members = channel.state.members;
+
+    var textStyle = TextStyle(fontSize: 14.0, fontWeight: FontWeight.bold);
+
+    return Container(
+      height: 64.0,
+      child: LayoutBuilder(builder: (context, constraints) {
+        String title;
+        if (extraData['name'] == null) {
+          final otherMembers = members.where(
+              (member) => member.userId != StreamChat.of(context).user.id);
+          if (otherMembers.isNotEmpty) {
+            final maxWidth = constraints.maxWidth;
+            final maxChars = maxWidth / textStyle.fontSize;
+            var currentChars = 0;
+            final currentMembers = <Member>[];
+            otherMembers.forEach((element) {
+              final newLength = currentChars + element.user.name.length;
+              if (newLength < maxChars) {
+                currentChars = newLength;
+                currentMembers.add(element);
+              }
+            });
+
+            final exceedingMembers =
+                otherMembers.length - currentMembers.length;
+            title =
+                '${currentMembers.map((e) => e.user.name).join(', ')} ${exceedingMembers > 0 ? '+ $exceedingMembers' : ''}';
+          } else {
+            title = 'No title';
+          }
+        } else {
+          title = extraData['name'];
+        }
+
+        return Column(
+          children: [
+            Expanded(
+              child: Row(
+                children: [
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: ChannelImage(
+                      channel: channel,
+                      constraints:
+                          BoxConstraints(maxWidth: 40.0, maxHeight: 40.0),
+                    ),
+                  ),
+                  Expanded(
+                      child: Text(
+                    title,
+                    style: textStyle,
+                  )),
+                  Padding(
+                    padding: const EdgeInsets.all(8.0),
+                    child: Text(
+                      '${channel.memberCount} members',
+                      style: TextStyle(color: Colors.black.withOpacity(0.5)),
+                    ),
+                  )
+                ],
+              ),
+            ),
+            Container(
+              height: 1.0,
+              color: Color(0xffe6e6e6),
+            ),
+          ],
+        );
+      }),
+    );
+  }
 }
 
 class _MediaDisplayScreen extends StatelessWidget {