From 3b76219f686ad327af4ebc886b60b5aa24a2280d Mon Sep 17 00:00:00 2001 From: krille-chan Date: Sun, 26 May 2024 08:27:43 +0200 Subject: [PATCH] chore: Follow up listen on streams --- lib/pages/chat/typing_indicators.dart | 150 ++++++++++++++------------ 1 file changed, 80 insertions(+), 70 deletions(-) diff --git a/lib/pages/chat/typing_indicators.dart b/lib/pages/chat/typing_indicators.dart index e816f465d..fe630ecd8 100644 --- a/lib/pages/chat/typing_indicators.dart +++ b/lib/pages/chat/typing_indicators.dart @@ -14,80 +14,90 @@ class TypingIndicators extends StatelessWidget { @override Widget build(BuildContext context) { - final typingUsers = controller.room.typingUsers - ..removeWhere((u) => u.stateKey == Matrix.of(context).client.userID); - const topPadding = 20.0; - const bottomPadding = 4.0; - - return Container( - width: double.infinity, - alignment: Alignment.center, - child: AnimatedContainer( - constraints: - const BoxConstraints(maxWidth: FluffyThemes.columnWidth * 2.5), - height: typingUsers.isEmpty ? 0 : Avatar.defaultSize + bottomPadding, - duration: FluffyThemes.animationDuration, - curve: FluffyThemes.animationCurve, - alignment: controller.timeline!.events.isNotEmpty && - controller.timeline!.events.first.senderId == - Matrix.of(context).client.userID - ? Alignment.topRight - : Alignment.topLeft, - clipBehavior: Clip.hardEdge, - decoration: const BoxDecoration(), - padding: const EdgeInsets.only( - left: 8.0, - bottom: bottomPadding, - ), - child: Row( - children: [ - SizedBox( - height: Avatar.defaultSize, - width: typingUsers.length < 2 - ? Avatar.defaultSize - : Avatar.defaultSize + 16, - child: Stack( - children: [ - if (typingUsers.isNotEmpty) - Avatar( - mxContent: typingUsers.first.avatarUrl, - name: typingUsers.first.calcDisplayname(), - ), - if (typingUsers.length == 2) - Padding( - padding: const EdgeInsets.only(left: 16), - child: Avatar( - mxContent: typingUsers.length == 2 - ? typingUsers.last.avatarUrl - : null, - name: typingUsers.length == 2 - ? typingUsers.last.calcDisplayname() - : '+${typingUsers.length - 1}', - ), - ), - ], - ), + return StreamBuilder( + stream: controller.room.client.onSync.stream.where( + (syncUpdate) => + syncUpdate.rooms?.join?[controller.room.id]?.ephemeral + ?.any((ephemeral) => ephemeral.type == 'm.typing') ?? + false, + ), + builder: (context, _) { + final typingUsers = controller.room.typingUsers + ..removeWhere((u) => u.stateKey == Matrix.of(context).client.userID); + const topPadding = 20.0; + const bottomPadding = 4.0; + return Container( + width: double.infinity, + alignment: Alignment.center, + child: AnimatedContainer( + constraints: + const BoxConstraints(maxWidth: FluffyThemes.columnWidth * 2.5), + height: + typingUsers.isEmpty ? 0 : Avatar.defaultSize + bottomPadding, + duration: FluffyThemes.animationDuration, + curve: FluffyThemes.animationCurve, + alignment: controller.timeline!.events.isNotEmpty && + controller.timeline!.events.first.senderId == + Matrix.of(context).client.userID + ? Alignment.topRight + : Alignment.topLeft, + clipBehavior: Clip.hardEdge, + decoration: const BoxDecoration(), + padding: const EdgeInsets.only( + left: 8.0, + bottom: bottomPadding, ), - const SizedBox(width: 8), - Padding( - padding: const EdgeInsets.only(top: topPadding), - child: Material( - color: Theme.of(context).colorScheme.surfaceVariant, - borderRadius: const BorderRadius.only( - topLeft: Radius.circular(2), - topRight: Radius.circular(AppConfig.borderRadius), - bottomLeft: Radius.circular(AppConfig.borderRadius), - bottomRight: Radius.circular(AppConfig.borderRadius), + child: Row( + children: [ + SizedBox( + height: Avatar.defaultSize, + width: typingUsers.length < 2 + ? Avatar.defaultSize + : Avatar.defaultSize + 16, + child: Stack( + children: [ + if (typingUsers.isNotEmpty) + Avatar( + mxContent: typingUsers.first.avatarUrl, + name: typingUsers.first.calcDisplayname(), + ), + if (typingUsers.length == 2) + Padding( + padding: const EdgeInsets.only(left: 16), + child: Avatar( + mxContent: typingUsers.length == 2 + ? typingUsers.last.avatarUrl + : null, + name: typingUsers.length == 2 + ? typingUsers.last.calcDisplayname() + : '+${typingUsers.length - 1}', + ), + ), + ], + ), ), - child: Padding( - padding: const EdgeInsets.symmetric(horizontal: 8), - child: typingUsers.isEmpty ? null : const _TypingDots(), + const SizedBox(width: 8), + Padding( + padding: const EdgeInsets.only(top: topPadding), + child: Material( + color: Theme.of(context).colorScheme.surfaceVariant, + borderRadius: const BorderRadius.only( + topLeft: Radius.circular(2), + topRight: Radius.circular(AppConfig.borderRadius), + bottomLeft: Radius.circular(AppConfig.borderRadius), + bottomRight: Radius.circular(AppConfig.borderRadius), + ), + child: Padding( + padding: const EdgeInsets.symmetric(horizontal: 8), + child: typingUsers.isEmpty ? null : const _TypingDots(), + ), + ), ), - ), + ], ), - ], - ), - ), + ), + ); + }, ); } }