msglist: Show date in recipient headers

Fixes: zulip#172

Author: gnprice

lib/widgets/message_list.dart

@@ -448,6 +448,7 @@ class StreamTopicRecipientHeader extends StatelessWidget {
                 style: const TextStyle(fontWeight: FontWeight.w600)))),
           // TODO topic links?
           // Then web also has edit/resolve/mute buttons. Skip those for mobile.
+          RecipientHeaderDate(message: message),
         ])));
   }
 }
@@ -486,17 +487,40 @@ class DmRecipientHeader extends StatelessWidget {
         decoration: BoxDecoration(
           color: Colors.white,
           border: Border.all(color: _kDmRecipientHeaderColor)),
-        child: Align(
-          alignment: Alignment.centerLeft,
-          child: RecipientHeaderChevronContainer(
+        child: Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
+          RecipientHeaderChevronContainer(
             color: _kDmRecipientHeaderColor,
             child: Text(style: const TextStyle(color: Colors.white),
-              title)))));
+              title)),
+          RecipientHeaderDate(message: message),
+        ])));
   }
 }
 
-final _kDmRecipientHeaderColor =
-    const HSLColor.fromAHSL(1, 0, 0, 0.27).toColor();
+final _kDmRecipientHeaderColor = const HSLColor.fromAHSL(1, 0, 0, 0.27).toColor();
+
+class RecipientHeaderDate extends StatelessWidget {
+  const RecipientHeaderDate({super.key, required this.message});
+
+  final Message message;
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.fromLTRB(10, 0, 10, 0),
+      child: Text(
+        style: _kRecipientHeaderDateStyle,
+        _kRecipientHeaderDateFormat.format(
+          DateTime.fromMillisecondsSinceEpoch(message.timestamp * 1000))));
+  }
+}
+
+final _kRecipientHeaderDateStyle = TextStyle(
+  fontWeight: FontWeight.w600,
+  color: const HSLColor.fromAHSL(0.75, 0, 0, 0.15).toColor(),
+);
+
+final _kRecipientHeaderDateFormat = DateFormat('y-MM-dd', 'en_US'); // TODO(i18n)
 
 /// A widget with the distinctive chevron-tailed shape in Zulip recipient headers.
 class RecipientHeaderChevronContainer extends StatelessWidget {

test/widgets/message_list_test.dart

@@ -201,6 +201,24 @@ void main() {
       tester.widget(find.text("You and (unknown user)"));
       tester.widget(find.text("You and (unknown user), ${eg.thirdUser.fullName}"));
     });
+
+    testWidgets('show dates', (tester) async {
+      await setupMessageListPage(tester, messages: [
+        eg.streamMessage(timestamp: 1671409088),
+        eg.dmMessage(timestamp: 1692755322, from: eg.selfUser, to: []),
+      ]);
+      // We show the dates in the user's timezone.  Dart's standard library
+      // doesn't give us a way to control which timezone is used — only to
+      // choose between UTC and the user's timezone, whatever that may be.
+      // So we do the latter, and that means these dates come out differently
+      // depending on the timezone in the environment running the tests.
+      // Related upstream issues:
+      //   https://github.com/dart-lang/sdk/issues/28985 (about DateTime.now, not timezone)
+      //   https://github.com/dart-lang/sdk/issues/44928 (about the Dart implementation's own internal tests)
+      // For this test, just accept outputs corresponding to any possible timezone.
+      tester.widget(find.textContaining(RegExp("2022-12-1[89]")));
+      tester.widget(find.textContaining(RegExp("2023-08-2[23]")));
+    });
   });
 
   group('MessageWithSender', () {