update customize_channel_preview example

example/lib/customize_channel_preview.dart

@@ -32,19 +32,21 @@ class ChannelListPage extends StatelessWidget {
         channelPreviewBuilder: (context, channelClient) {
           final channelState = channelClient.state.channelState;
           return ListTile(
-            leading: CircleAvatar(
-              backgroundImage:
-                  channelState.channel.extraData.containsKey('image')
-                      ? NetworkImage(channelState.channel.extraData['image'])
-                      : null,
+            leading: ChannelAvatar(
+              channel: channelState.channel,
+            ),
+            title: ChannelName(
+              channel: channelState.channel,
             ),
-            title: Text(channelState.channel.extraData['name'] ?? ''),
             trailing: channelClient.state.unreadCount > 0
                 ? CircleAvatar(
                     radius: 10,
                     child: Text(channelClient.state.unreadCount.toString()),
                   )
-                : Container(),
+                : SizedBox(
+                    height: 0,
+                    width: 0,
+                  ),
           );
         },
         sort: [SortOption('last_message_at')],

lib/src/channel_avatar.dart

@@ -0,0 +1,29 @@
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:flutter/material.dart';
+import 'package:stream_chat/stream_chat.dart';
+
+class ChannelAvatar extends StatelessWidget {
+  const ChannelAvatar({
+    Key key,
+    @required this.channel,
+    this.radius = 20,
+  }) : super(key: key);
+
+  final Channel channel;
+  final double radius;
+
+  @override
+  Widget build(BuildContext context) {
+    return CircleAvatar(
+      radius: radius,
+      backgroundImage: channel.extraData.containsKey('image')
+          ? CachedNetworkImageProvider(channel.extraData['image'])
+          : null,
+      child: channel.extraData.containsKey('image')
+          ? null
+          : Text(channel.extraData.containsKey('name')
+              ? channel.extraData['name'][0]
+              : ''),
+    );
+  }
+}

lib/src/channel_name.dart

@@ -1,10 +1,10 @@
 import 'package:flutter/material.dart';
 import 'package:stream_chat/stream_chat.dart';
 
-class ChannelNameText extends StatelessWidget {
-  const ChannelNameText({
+class ChannelName extends StatelessWidget {
+  const ChannelName({
     Key key,
-    this.channel,
+    @required this.channel,
   }) : super(key: key);
 
   final Channel channel;
@@ -12,7 +12,7 @@ class ChannelNameText extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Text(
-      channel.extraData['name'] as String ?? channel.config.name,
+      channel.extraData['name'] as String ?? channel.cid,
       style: Theme.of(context).textTheme.body2,
     );
   }

lib/src/channel_preview.dart

@@ -4,7 +4,7 @@ import 'package:flutter/widgets.dart';
 import 'package:stream_chat/stream_chat.dart';
 
 import 'channel_image.dart';
-import 'channel_name_text.dart';
+import 'channel_name.dart';
 
 class ChannelPreview extends StatelessWidget {
   final void Function(ChannelClient) onTap;
@@ -27,7 +27,7 @@ class ChannelPreview extends StatelessWidget {
       leading: ChannelImage(
         channel: channelState.channel,
       ),
-      title: ChannelNameText(
+      title: ChannelName(
         channel: channelState.channel,
       ),
       subtitle: _buildSubtitle(),

lib/src/message_widget.dart

@@ -5,12 +5,12 @@ import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_markdown/flutter_markdown.dart';
 import 'package:stream_chat/stream_chat.dart';
+import 'package:stream_chat_flutter/src/user_avatar.dart';
 import 'package:url_launcher/url_launcher.dart';
 import 'package:video_player/video_player.dart';
 
 import 'message_list_view.dart';
 import 'stream_chat.dart';
-import 'user_avatar.dart';
 
 class MessageWidget extends StatefulWidget {
   const MessageWidget({

lib/stream_chat_flutter.dart

@@ -1,10 +1,11 @@
 export 'package:stream_chat/stream_chat.dart';
 
+export 'src/channel_avatar.dart';
 export 'src/channel_list_view.dart';
+export 'src/channel_name.dart';
 export 'src/channel_preview.dart';
 export 'src/message_input.dart';
 export 'src/message_list_view.dart';
 export 'src/message_widget.dart';
 export 'src/stream_channel.dart';
 export 'src/stream_chat.dart';
-export 'src/user_avatar.dart';