add online indicator to useravatar

lib/src/channel_image.dart

@@ -49,6 +49,7 @@ class ChannelImage extends StatelessWidget {
     this.channel,
     this.constraints,
     this.onTap,
+    this.showOnlineStatus = true,
   }) : super(key: key);
 
   /// The channel to show the image of
@@ -60,9 +61,11 @@ class ChannelImage extends StatelessWidget {
   /// The function called when the image is tapped
   final VoidCallback onTap;
 
+  final bool showOnlineStatus;
+
   @override
   Widget build(BuildContext context) {
-    final client = StreamChat.of(context);
+    final streamChat = StreamChat.of(context);
     final channel = this.channel ?? StreamChannel.of(context).channel;
     return StreamBuilder<Map<String, dynamic>>(
         stream: channel.extraDataStream,
@@ -73,8 +76,26 @@ class ChannelImage extends StatelessWidget {
             image = snapshot.data['image'];
           } else if (channel.state.members.length == 2) {
             final otherMember = channel.state.members
-                .firstWhere((member) => member.user.id != client.user.id);
+                .firstWhere((member) => member.user.id != streamChat.user.id);
-            image = otherMember.user.extraData['image'];
+            return StreamBuilder<User>(
+                stream: streamChat.client.state.usersStream
+                    .map((users) => users[otherMember.userId]),
+                initialData: otherMember.user,
+                builder: (context, snapshot) {
+                  return UserAvatar(
+                    user: snapshot.data ?? otherMember.user,
+                    constraints: constraints ??
+                        StreamChatTheme.of(context)
+                            .channelPreviewTheme
+                            .avatarTheme
+                            .constraints,
+                    onTap: onTap != null
+                        ? (_) {
+                            onTap();
+                          }
+                        : null,
+                  );
+                });
           }
 
           return ClipRRect(

lib/src/message_widget.dart

@@ -426,6 +426,7 @@ class _MessageWidgetState extends State<MessageWidget> {
               child: UserAvatar(
                 user: e.user,
                 constraints: BoxConstraints.loose(Size.fromRadius(16)),
+                showOnlineStatus: false,
               ),
             ),
           ),
@@ -648,6 +649,7 @@ class _MessageWidgetState extends State<MessageWidget> {
               user: widget.message.user,
               onTap: widget.onUserAvatarTap,
               constraints: widget.messageTheme.avatarTheme.constraints,
+              showOnlineStatus: false,
             ),
           ),
         ),

lib/src/user_avatar.dart

@@ -9,22 +9,30 @@ class UserAvatar extends StatelessWidget {
     Key key,
     @required this.user,
     this.constraints,
+    this.onlineIndicatorConstraints,
     this.onTap,
+    this.showOnlineStatus = true,
   }) : super(key: key);
 
   final User user;
   final BoxConstraints constraints;
+  final BoxConstraints onlineIndicatorConstraints;
   final void Function(User) onTap;
+  final bool showOnlineStatus;
 
   @override
   Widget build(BuildContext context) {
     return GestureDetector(
-      onTap: () {
+      onTap: onTap != null
+          ? () {
               if (onTap != null) {
                 onTap(user);
               }
-      },
+            }
-      child: ClipRRect(
+          : null,
+      child: Stack(
+        children: <Widget>[
+          ClipRRect(
             borderRadius: StreamChatTheme.of(context)
                 .ownMessageTheme
                 .avatarTheme
@@ -59,6 +67,31 @@ class UserAvatar extends StatelessWidget {
                   : StreamChatTheme.of(context).defaultUserImage(context, user),
             ),
           ),
+          if (showOnlineStatus && user.online)
+            Positioned(
+              top: 0,
+              right: 0,
+              child: Material(
+                child: Center(
+                  child: Container(
+                    padding: const EdgeInsets.all(2.0),
+                    constraints: onlineIndicatorConstraints ??
+                        BoxConstraints.tightFor(
+                          width: 12,
+                          height: 12,
+                        ),
+                    child: Material(
+                      shape: CircleBorder(),
+                      color: Color(0xff20E070),
+                    ),
+                  ),
+                ),
+                shape: CircleBorder(),
+                color: Colors.white,
+              ),
+            ),
+        ],
+      ),
     );
   }
 }