msglist: Show channel name and topic name on two rows

This will eventually be superseded by #1039, so we should keep the
implementation as simple as possible for now.

The two-line app bar idea comes from the legacy mobile app.  This gives
us a place to show the topic visibility policy on the app bar.

References:
  https://github.com/zulip/zulip-mobile/blob/a115df1f71c9dc31e9b41060a8d57b51c017d786/src/title/TitleStream.js#L113-L141
  https://github.com/zulip/zulip-mobile/blob/a115df1f71c9dc31e9b41060a8d57b51c017d786/src/styles/navStyles.js#L5-L18

Signed-off-by: Zixuan James Li <[email protected]>

Author: PIG208

lib/widgets/message_list.dart

@@ -262,6 +262,8 @@ class _MessageListPageState extends State<MessageListPage> implements MessageLis
 
     List<Widget>? actions;
     if (narrow case TopicNarrow(:final streamId)) {
+      // The helper [_getEffectiveCenterTitle] relies on the fact that we
+      // have at most one action here.
       (actions ??= []).add(IconButton(
         icon: const Icon(ZulipIcons.message_feed),
         tooltip: zulipLocalizations.channelFeedButtonTooltip,
@@ -314,7 +316,6 @@ class MessageListAppBarTitle extends StatelessWidget {
 
   Widget _buildStreamRow(BuildContext context, {
     ZulipStream? stream,
-    required String text,
   }) {
     // A null [Icon.icon] makes a blank space.
     final icon = (stream != null) ? iconDataForStream(stream) : null;
@@ -327,10 +328,42 @@ class MessageListAppBarTitle extends StatelessWidget {
       children: [
         Icon(size: 16, icon),
         const SizedBox(width: 4),
-        Flexible(child: Text(text)),
+        Flexible(child: Text(stream?.name ?? '(unknown stream)')),
       ]);
   }
 
+  Widget _buildTopicRow(BuildContext context, {
+    required ZulipStream? stream,
+    required String topic,
+  }) {
+    return Text(topic, style: const TextStyle(
+      fontSize: 13,
+    ).merge(weightVariableTextStyle(context)));
+  }
+
+  // TODO(upstream): provide an API for this
+  // Adapted from [AppBar._getEffectiveCenterTitle].
+  bool _getEffectiveCenterTitle(ThemeData theme) {
+    bool platformCenter() {
+      switch (theme.platform) {
+        case TargetPlatform.android:
+        case TargetPlatform.fuchsia:
+        case TargetPlatform.linux:
+        case TargetPlatform.windows:
+          return false;
+        case TargetPlatform.iOS:
+        case TargetPlatform.macOS:
+        // We rely on the fact that there is at most one action
+        // on the message list app bar, so that the expression returned
+        // in the original helper, `actions == null || actions!.length < 2`,
+        // always evaluates to `true`:
+          return true;
+      }
+    }
+
+    return theme.appBarTheme.centerTitle ?? platformCenter();
+  }
+
   @override
   Widget build(BuildContext context) {
     final zulipLocalizations = ZulipLocalizations.of(context);
@@ -348,14 +381,20 @@ class MessageListAppBarTitle extends StatelessWidget {
       case ChannelNarrow(:var streamId):
         final store = PerAccountStoreWidget.of(context);
         final stream = store.streams[streamId];
-        final streamName = stream?.name ?? '(unknown channel)';
-        return _buildStreamRow(context, stream: stream, text: streamName);
+        return _buildStreamRow(context, stream: stream);
 
       case TopicNarrow(:var streamId, :var topic):
+        final theme = Theme.of(context);
         final store = PerAccountStoreWidget.of(context);
         final stream = store.streams[streamId];
-        final streamName = stream?.name ?? '(unknown channel)';
-        return _buildStreamRow(context, stream: stream, text: "$streamName > $topic");
+        final centerTitle = _getEffectiveCenterTitle(theme);
+        return Column(
+          crossAxisAlignment: centerTitle ? CrossAxisAlignment.center
+                                          : CrossAxisAlignment.start,
+          children: [
+            _buildStreamRow(context, stream: stream),
+            _buildTopicRow(context, stream: stream, topic: topic),
+          ]);
 
       case DmNarrow(:var otherRecipientIds):
         final store = PerAccountStoreWidget.of(context);

test/widgets/message_list_test.dart

@@ -725,7 +725,7 @@ void main() {
       ).length.equals(1);
       check(find.descendant(
         of: find.byType(MessageListAppBarTitle),
-        matching: find.text('${channel.name} > new topic')).evaluate()
+        matching: find.text('new topic')).evaluate()
       ).length.equals(1);
     });
   });