msglist: Add stream icon to recipient headers

Fixes: zulip#220
sirpengi · Nov 29, 2023 · 32ce11a · 32ce11a
1 parent 1a4f0da
commit 32ce11a
Show file tree

Hide file tree

Showing 2 changed files with 62 additions and 2 deletions.
diff --git a/lib/widgets/message_list.dart b/lib/widgets/message_list.dart
@@ -556,16 +556,19 @@ class StreamMessageRecipientHeader extends StatelessWidget {
     final subscription = store.subscriptions[message.streamId];
     final Color backgroundColor;
     final Color contrastingColor;
+    final Color iconColor;
     if (subscription != null) {
       final swatch = subscription.colorSwatch();
       backgroundColor = swatch.barBackground;
       contrastingColor =
         (ThemeData.estimateBrightnessForColor(swatch.barBackground) == Brightness.dark)
           ? Colors.white
           : Colors.black;
+      iconColor = swatch.iconOnBarBackground;
     } else {
       backgroundColor = _kFallbackStreamColor;
       contrastingColor = Colors.black;
+      iconColor = Colors.black;
     }
     final textStyle = TextStyle(
       color: contrastingColor,
@@ -589,8 +592,16 @@ class StreamMessageRecipientHeader extends StatelessWidget {
         child: Row(
           crossAxisAlignment: CrossAxisAlignment.center,
           children: [
-            const SizedBox(width: 16),
-            // TODO globe/lock icons for web-public and private streams
+            Padding(
+              // Figma specifies 5px horizontal spacing around an icon that's
+              // 18x18 and includes 1px padding.  The icon SVG is flush with
+              // the edges, so make it 16x16 with 6px horizontal padding.
+              // Bottom padding added here to shift icon up to
+              // match alignment with text visually.
+              padding: const EdgeInsets.only(left: 6, right: 6, bottom: 3),
+              child: Icon(size: 16, color: iconColor,
+                // A null [Icon.icon] makes a blank space.
+                (stream != null) ? iconDataForStream(stream) : null)),
             Padding(
               padding: const EdgeInsets.symmetric(vertical: 11),
               child: Text(streamName,

diff --git a/test/widgets/message_list_test.dart b/test/widgets/message_list_test.dart
@@ -14,6 +14,7 @@ import 'package:zulip/model/localizations.dart';
 import 'package:zulip/model/narrow.dart';
 import 'package:zulip/model/store.dart';
 import 'package:zulip/widgets/content.dart';
+import 'package:zulip/widgets/icons.dart';
 import 'package:zulip/widgets/message_list.dart';
 import 'package:zulip/widgets/sticky_header.dart';
 import 'package:zulip/widgets/store.dart';
@@ -249,6 +250,54 @@ void main() {
             matching: find.byType(ColoredBox),
         ))).color.equals(swatch.barBackground);
       });
+
+      testWidgets('color of stream icon', (tester) async {
+        final stream = eg.stream(isWebPublic: true);
+        final subscription = eg.subscription(stream, color: Colors.red.value);
+        final swatch = subscription.colorSwatch();
+        await setupMessageListPage(tester,
+          messages: [eg.streamMessage(stream: subscription)],
+          subscriptions: [subscription]);
+        await tester.pump();
+        check(tester.widget<Icon>(find.byIcon(ZulipIcons.globe)))
+          .color.equals(swatch.iconOnBarBackground);
+      });
+
+      testWidgets('normal streams show hash icon', (tester) async {
+        final stream = eg.stream(isWebPublic: false, inviteOnly: false);
+        await setupMessageListPage(tester,
+          messages: [eg.streamMessage(stream: stream)],
+          streams: [stream]);
+        await tester.pump();
+        check(find.descendant(
+          of: find.byType(StreamMessageRecipientHeader),
+          matching: find.byIcon(ZulipIcons.hash_sign),
+        ).evaluate()).length.equals(1);
+      });
+
+      testWidgets('public streams show globe icon', (tester) async {
+        final stream = eg.stream(isWebPublic: true);
+        await setupMessageListPage(tester,
+          messages: [eg.streamMessage(stream: stream)],
+          streams: [stream]);
+        await tester.pump();
+        check(find.descendant(
+          of: find.byType(StreamMessageRecipientHeader),
+          matching: find.byIcon(ZulipIcons.globe),
+        ).evaluate()).length.equals(1);
+      });
+
+      testWidgets('private streams show lock icon', (tester) async {
+        final stream = eg.stream(inviteOnly: true);
+        await setupMessageListPage(tester,
+          messages: [eg.streamMessage(stream: stream)],
+          streams: [stream]);
+        await tester.pump();
+        check(find.descendant(
+          of: find.byType(StreamMessageRecipientHeader),
+          matching: find.byIcon(ZulipIcons.lock),
+        ).evaluate()).length.equals(1);
+      });
     });
 
     testWidgets('show stream name from message when stream unknown', (tester) async {