recent-dms: Distinguish muted users in recent DMs page

Author: sm-sayedi

lib/widgets/recent_dm_conversations.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 
+import '../generated/l10n/zulip_localizations.dart';
 import '../model/narrow.dart';
 import '../model/recent_dm_conversations.dart';
 import '../model/unreads.dart';
@@ -79,6 +80,7 @@ class RecentDmConversationsItem extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final store = PerAccountStoreWidget.of(context);
+    final localizations = ZulipLocalizations.of(context);
     final designVariables = DesignVariables.of(context);
 
     final String title;
@@ -88,16 +90,26 @@ class RecentDmConversationsItem extends StatelessWidget {
         title = store.selfUser.fullName;
         avatar = AvatarImage(userId: store.selfUserId, size: _avatarSize);
       case [var otherUserId]:
-        // TODO(#296) actually don't show this row if the user is muted?
-        //   (should we offer a "spam folder" style summary screen of recent
-        //   1:1 DM conversations from muted users?)
-        title = store.userDisplayName(otherUserId);
-        avatar = AvatarImage(userId: otherUserId, size: _avatarSize);
+        // Although we currently don't display a DM conversation with a muted
+        // user; in the future we will have the "Search by location" feature
+        // similar to Web where a DM conversation with a muted user is displayed
+        // if searched for explicitly; for example using: "dm:Chris Bobbe".
+        //   https://zulip.com/help/search-for-messages#search-by-location
+        final isUserMuted = store.isUserMuted(otherUserId);
+        title = isUserMuted
+          ? localizations.mutedUser
+          : store.userDisplayName(otherUserId);
+        avatar = isUserMuted
+          ? AvatarPlaceholder(size: _avatarSize)
+          : AvatarImage(userId: otherUserId, size: _avatarSize);
       default:
         // TODO(i18n): List formatting, like you can do in JavaScript:
         //   new Intl.ListFormat('ja').format(['Chris', 'Greg', 'Alya'])
         //   // 'Chris、Greg、Alya'
-        title = narrow.otherRecipientIds.map(store.userDisplayName)
+        title = narrow.otherRecipientIds.map((id) =>
+          store.isUserMuted(id)
+            ? localizations.mutedUser
+            : store.userDisplayName(id))
           .join(', ');
         avatar = ColoredBox(color: designVariables.groupDmConversationIconBg,
           child: Center(

test/widgets/recent_dm_conversations_test.dart

@@ -19,12 +19,14 @@ import '../model/test_store.dart';
 import '../test_navigation.dart';
 import 'content_checks.dart';
 import 'message_list_checks.dart';
+import 'message_list_test.dart';
 import 'page_checks.dart';
 import 'test_app.dart';
 
 Future<void> setupPage(WidgetTester tester, {
   required List<DmMessage> dmMessages,
   required List<User> users,
+  List<int>? mutedUserIds,
   NavigatorObserver? navigatorObserver,
   String? newNameForSelfUser,
 }) async {
@@ -37,6 +39,7 @@ Future<void> setupPage(WidgetTester tester, {
   for (final user in users) {
     await store.addUser(user);
   }
+  await store.muteUsers(mutedUserIds ?? []);
 
   await store.addMessages(dmMessages);
 
@@ -110,7 +113,7 @@ void main() {
 
   group('RecentDmConversationsItem', () {
     group('content/appearance', () {
-      void checkAvatar(WidgetTester tester, DmNarrow narrow) {
+      void checkAvatar(WidgetTester tester, DmNarrow narrow, {bool isMuted = false}) {
         final shape = tester.widget<AvatarShape>(
           find.descendant(
             of: find.byType(RecentDmConversationsItem),
@@ -124,7 +127,9 @@ void main() {
           case []:                // self-1:1
             check(shape).child.isA<AvatarImage>().userId.equals(eg.selfUser.userId);
           case [var otherUserId]: // 1:1
-            check(shape).child.isA<AvatarImage>().userId.equals(otherUserId);
+            isMuted
+              ? check(shape).child.isA<AvatarPlaceholder>()
+              : check(shape).child.isA<AvatarImage>().userId.equals(otherUserId);
           default:                // group
             // TODO(#232): syntax like `check(find(…), findsOneWidget)`
             tester.widget(find.descendant(
@@ -204,13 +209,23 @@ void main() {
       });
 
       group('1:1', () {
-        testWidgets('has right title/avatar', (tester) async {
-          final user = eg.user(userId: 1);
-          final message = eg.dmMessage(from: eg.selfUser, to: [user]);
-          await setupPage(tester, users: [user], dmMessages: [message]);
-
-          checkAvatar(tester, DmNarrow.ofMessage(message, selfUserId: eg.selfUser.userId));
-          checkTitle(tester, user.fullName);
+        group('has right title/avatar', () {
+          for (final isUserMuted in [false, true]) {
+            testWidgets(isUserMuted ? 'muted user' : 'normal user', (tester) async {
+              final user = eg.user(userId: 1);
+              final message = eg.dmMessage(from: eg.selfUser, to: [user]);
+              await setupPage(tester,
+                users: [user],
+                mutedUserIds: isUserMuted ? [user.userId] : [],
+                dmMessages: [message],
+              );
+
+              checkAvatar(tester,
+                DmNarrow.ofMessage(message, selfUserId: eg.selfUser.userId),
+                isMuted: isUserMuted);
+              checkTitle(tester, isUserMuted ? localizations.mutedUser : user.fullName);
+            });
+          }
         });
 
         testWidgets('no error when user somehow missing from user store', (tester) async {
@@ -258,15 +273,26 @@ void main() {
           return result;
         }
 
-        testWidgets('has right title/avatar', (tester) async {
-          final users = usersList(2);
-          final user0 = users[0];
-          final user1 = users[1];
-          final message = eg.dmMessage(from: eg.selfUser, to: [user0, user1]);
-          await setupPage(tester, users: users, dmMessages: [message]);
-
-          checkAvatar(tester, DmNarrow.ofMessage(message, selfUserId: eg.selfUser.userId));
-          checkTitle(tester, '${user0.fullName}, ${user1.fullName}');
+        group('has right title/avatar', () {
+          for (final areUsersMuted in [false, true]) {
+            testWidgets(areUsersMuted ? 'muted users' : 'normal users', (tester) async {
+              final users = usersList(2);
+              final user0 = users[0];
+              final user1 = users[1];
+              final message = eg.dmMessage(from: eg.selfUser, to: [user0, user1]);
+              await setupPage(
+                tester,
+                users: users,
+                mutedUserIds: areUsersMuted ? [user0.userId, user1.userId] : [],
+                dmMessages: [message],
+              );
+
+              checkAvatar(tester, DmNarrow.ofMessage(message, selfUserId: eg.selfUser.userId));
+              checkTitle(tester, areUsersMuted
+                ? '${localizations.mutedUser}, ${localizations.mutedUser}'
+                : '${user0.fullName}, ${user1.fullName}');
+            });
+          }
         });
 
         testWidgets('no error when one user somehow missing from user store', (tester) async {