refactor(ui): use BetterStreamBuilder in ChannelAvatar and ChannelName

Signed-off-by: xsahil03x <[email protected]>
This commit is contained in:
Sahil Kumar
2021-08-20 17:04:32 +05:30
committed by xsahil03x
parent 54b162749d
commit 8627865b44
2 changed files with 62 additions and 57 deletions
@@ -90,56 +90,54 @@ class ChannelAvatar extends StatelessWidget {
final colorTheme = chatThemeData.colorTheme; final colorTheme = chatThemeData.colorTheme;
final previewTheme = chatThemeData.channelPreviewTheme.avatarTheme; final previewTheme = chatThemeData.channelPreviewTheme.avatarTheme;
return StreamBuilder<String?>( return BetterStreamBuilder<String>(
stream: channel.imageStream, stream: channel.imageStream,
initialData: channel.image, initialData: channel.image,
builder: (context, snapshot) { builder: (context, channelImage) {
final channelImage = snapshot.data; Widget child = ClipRRect(
if (channelImage != null) { borderRadius: borderRadius ?? previewTheme?.borderRadius,
Widget child = ClipRRect( child: Container(
borderRadius: borderRadius ?? previewTheme?.borderRadius, constraints: constraints ?? previewTheme?.constraints,
child: Container( decoration: BoxDecoration(color: colorTheme.accentPrimary),
constraints: constraints ?? previewTheme?.constraints, child: InkWell(
decoration: BoxDecoration(color: colorTheme.accentPrimary), onTap: onTap,
child: InkWell( child: CachedNetworkImage(
onTap: onTap, imageUrl: channelImage,
child: CachedNetworkImage( errorWidget: (_, __, ___) => Center(
imageUrl: channelImage, child: Text(
errorWidget: (_, __, ___) => Center( channel.name?[0] ?? '',
child: Text( style: TextStyle(
channel.name?[0] ?? '', color: colorTheme.barsBg,
style: TextStyle( fontWeight: FontWeight.bold,
color: colorTheme.barsBg,
fontWeight: FontWeight.bold,
),
), ),
), ),
fit: BoxFit.cover,
), ),
fit: BoxFit.cover,
),
),
),
);
if (selected) {
child = ClipRRect(
key: const Key('selectedImage'),
borderRadius: BorderRadius.circular(selectionThickness) +
(borderRadius ??
previewTheme?.borderRadius ??
BorderRadius.zero),
child: Container(
constraints: constraints ?? previewTheme?.constraints,
color: selectionColor ?? colorTheme.accentPrimary,
child: Padding(
padding: EdgeInsets.all(selectionThickness),
child: child,
), ),
), ),
); );
if (selected) {
child = ClipRRect(
key: const Key('selectedImage'),
borderRadius: BorderRadius.circular(selectionThickness) +
(borderRadius ??
previewTheme?.borderRadius ??
BorderRadius.zero),
child: Container(
constraints: constraints ?? previewTheme?.constraints,
color: selectionColor ?? colorTheme.accentPrimary,
child: Padding(
padding: EdgeInsets.all(selectionThickness),
child: child,
),
),
);
}
return child;
} }
return child;
},
noDataBuilder: (context) {
final currentUser = streamChat.currentUser!; final currentUser = streamChat.currentUser!;
final otherMembers = channel.state!.members final otherMembers = channel.state!.members
.where((it) => it.userId != currentUser.id) .where((it) => it.userId != currentUser.id)
@@ -29,33 +29,39 @@ class ChannelName extends StatelessWidget {
assert(channel.state != null, 'Channel ${channel.id} is not initialized'); assert(channel.state != null, 'Channel ${channel.id} is not initialized');
return StreamBuilder<String?>( return BetterStreamBuilder<String>(
stream: channel.nameStream, stream: channel.nameStream,
initialData: channel.name, initialData: channel.name,
builder: (context, snapshot) => _buildName( builder: (context, channelName) => Text(
snapshot.data, channelName,
style: textStyle,
overflow: textOverflow,
),
noDataBuilder: (context) => _generateName(
client.currentUser!,
channel.state!.members, channel.state!.members,
client,
), ),
); );
} }
Widget _buildName( Widget _generateName(
String? name, User currentUser,
List<Member> members, List<Member> members,
StreamChatState client,
) => ) =>
LayoutBuilder( LayoutBuilder(
builder: (context, constraints) { builder: (context, constraints) {
var title = name; var channelName = context.translations.noTitleText;
if (title == null && members.isNotEmpty) { final otherMembers = members.where(
final otherMembers = members (member) => member.userId != currentUser.id,
.where((member) => member.userId != client.currentUser!.id); );
if (otherMembers.isNotEmpty) {
if (otherMembers.length == 1) { if (otherMembers.length == 1) {
if (otherMembers.first.user != null) { final user = otherMembers.first.user;
title = otherMembers.first.user!.name; if (user != null) {
channelName = user.name;
} }
} else if (otherMembers.isNotEmpty == true) { } else {
final maxWidth = constraints.maxWidth; final maxWidth = constraints.maxWidth;
final maxChars = maxWidth / (textStyle?.fontSize ?? 1); final maxChars = maxWidth / (textStyle?.fontSize ?? 1);
var currentChars = 0; var currentChars = 0;
@@ -71,13 +77,14 @@ class ChannelName extends StatelessWidget {
final exceedingMembers = final exceedingMembers =
otherMembers.length - currentMembers.length; otherMembers.length - currentMembers.length;
title = '${currentMembers.map((e) => e.user?.name).join(', ')} ' channelName =
'${currentMembers.map((e) => e.user?.name).join(', ')} '
'${exceedingMembers > 0 ? '+ $exceedingMembers' : ''}'; '${exceedingMembers > 0 ? '+ $exceedingMembers' : ''}';
} }
} }
return Text( return Text(
title ?? context.translations.noTitleText, channelName,
style: textStyle, style: textStyle,
overflow: textOverflow, overflow: textOverflow,
); );