msglist: Add translations for DM recipient header labels

Author: sirpengi

assets/l10n/app_en.arb

@@ -194,6 +194,21 @@
       "filename": {"type": "String", "example": "file.txt"}
     }
   },
+  "unknownUserName": "(unknown user)",
+  "@unknownUserName": {
+    "description": "Name placeholder to use for a user when we don't know their name."
+  },
+  "messageListGroupYouAndOthers": "You and {others}",
+  "@messageListGroupYouAndOthers": {
+    "description": "Message list recipient header for a DM group with others.",
+    "placeholders": {
+      "others": {"type": "String", "example": "Alice, Bob"}
+    }
+  },
+  "messageListGroupYouWithYourself": "You with yourself",
+  "@messageListGroupYouWithYourself": {
+    "description": "Message list recipient header for a DM group that only includes yourself."
+  },
   "contentValidationErrorTooLong": "Message length shouldn't be greater than 10000 characters.",
   "@contentValidationErrorTooLong": {
     "description": "Content validation error message when the message is too long."

lib/widgets/message_list.dart

@@ -652,17 +652,18 @@ class DmRecipientHeader extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final zulipLocalizations = ZulipLocalizations.of(context);
     final store = PerAccountStoreWidget.of(context);
     final String title;
     if (message.allRecipientIds.length > 1) {
-      final otherNames = message.allRecipientIds
+      title = zulipLocalizations.messageListGroupYouAndOthers(message.allRecipientIds
         .where((id) => id != store.account.userId)
-        .map((id) => store.users[id]?.fullName ?? '(unknown user)')
+        .map((id) => store.users[id]?.fullName ?? zulipLocalizations.unknownUserName)
         .sorted()
-        .join(", ");
-      title = 'You and $otherNames';
+        .join(", "));
     } else {
-      title = 'You with yourself'; // TODO pick string; web has glitchy "You and $yourname"
+      // TODO pick string; web has glitchy "You and $yourname"
+      title = zulipLocalizations.messageListGroupYouWithYourself;
     }
 
     return GestureDetector(

test/widgets/message_list_test.dart

@@ -333,6 +333,7 @@ void main() {
     });
 
     testWidgets('show names on DMs', (tester) async {
+      final zulipLocalizations = GlobalLocalizations.zulipLocalizations;
       await setupMessageListPage(tester, messages: [
         eg.dmMessage(from: eg.selfUser, to: []),
         eg.dmMessage(from: eg.otherUser, to: [eg.selfUser]),
@@ -341,20 +342,25 @@ void main() {
       store.addUser(eg.otherUser);
       store.addUser(eg.thirdUser);
       await tester.pump();
-      tester.widget(find.text("You with yourself"));
-      tester.widget(find.text("You and ${eg.otherUser.fullName}"));
-      tester.widget(find.text("You and ${eg.otherUser.fullName}, ${eg.thirdUser.fullName}"));
+      tester.widget(find.text(zulipLocalizations.messageListGroupYouWithYourself));
+      tester.widget(find.text(zulipLocalizations.messageListGroupYouAndOthers(
+        eg.otherUser.fullName)));
+      tester.widget(find.text(zulipLocalizations.messageListGroupYouAndOthers(
+        "${eg.otherUser.fullName}, ${eg.thirdUser.fullName}")));
     });
 
     testWidgets('show names on DMs: smoothly handle unknown users', (tester) async {
+      final zulipLocalizations = GlobalLocalizations.zulipLocalizations;
       await setupMessageListPage(tester, messages: [
         eg.dmMessage(from: eg.otherUser, to: [eg.selfUser]),
         eg.dmMessage(from: eg.thirdUser, to: [eg.selfUser, eg.otherUser]),
       ]);
       store.addUser(eg.thirdUser);
       await tester.pump();
-      tester.widget(find.text("You and (unknown user)"));
-      tester.widget(find.text("You and (unknown user), ${eg.thirdUser.fullName}"));
+      tester.widget(find.text(zulipLocalizations.messageListGroupYouAndOthers(
+        zulipLocalizations.unknownUserName)));
+      tester.widget(find.text(zulipLocalizations.messageListGroupYouAndOthers(
+        "${zulipLocalizations.unknownUserName}, ${eg.thirdUser.fullName}")));
     });
 
     testWidgets('show dates', (tester) async {