compose: Show special hint text for inputs if empty topic

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

Author: PIG208

lib/widgets/compose_box.dart

@@ -429,6 +429,17 @@ class _ContentInputState extends State<_ContentInput> with WidgetsBindingObserve
   @override
   Widget build(BuildContext context) {
     final designVariables = DesignVariables.of(context);
+    TextStyle hintStyle = TextStyle(
+      color: designVariables.textInput.withFadedAlpha(0.5));
+
+    if (widget.destination.destination
+        // ignore: constant_pattern_never_matches_value_type // null topic names soon to be enabled
+        case StreamDestination(topic: TopicName(displayName: null))) {
+      // TODO(#1285): This applies to the entire hint text; ideally we'd only
+      //   want to italize the "general chat" text, but this requires
+      //   special l10n support for the hint text string.
+      hintStyle = hintStyle.copyWith(fontStyle: FontStyle.italic);
+    }
 
     return ComposeAutocomplete(
       narrow: widget.narrow,
@@ -470,8 +481,7 @@ class _ContentInputState extends State<_ContentInput> with WidgetsBindingObserve
                 // this and offering two lines of touchable area.
                 contentPadding: const EdgeInsets.symmetric(vertical: _verticalPadding),
                 hintText: widget.hintText,
-                hintStyle: TextStyle(
-                  color: designVariables.textInput.withFadedAlpha(0.5))))))));
+                hintStyle: hintStyle))))));
   }
 }
 
@@ -529,7 +539,8 @@ class _StreamContentInputState extends State<_StreamContentInput> {
       destination: TopicNarrow(widget.narrow.streamId, topic),
       controller: widget.controller,
       hintText: zulipLocalizations.composeBoxChannelContentHint(
-        streamName, topic.displayName));
+        // ignore: dead_null_aware_expression // null topic names soon to be enabled
+        streamName, topic.displayName ?? store.realmEmptyTopicDisplayName));
   }
 }
 
@@ -548,6 +559,9 @@ class _TopicInput extends StatelessWidget {
       height: 22 / 20,
       color: designVariables.textInput.withFadedAlpha(0.9),
     ).merge(weightVariableTextStyle(context, wght: 600));
+    final store = PerAccountStoreWidget.of(context);
+    final allowsEmptyTopics =
+      store.connection.zulipFeatureLevel! >= 334 && !store.realmMandatoryTopics;
 
     return TopicAutocomplete(
       streamId: streamId,
@@ -565,8 +579,11 @@ class _TopicInput extends StatelessWidget {
           textInputAction: TextInputAction.next,
           style: topicTextStyle,
           decoration: InputDecoration(
-            hintText: zulipLocalizations.composeBoxTopicHintText,
+            hintText: (allowsEmptyTopics)
+              ? store.realmEmptyTopicDisplayName
+              : zulipLocalizations.composeBoxTopicHintText,
             hintStyle: topicTextStyle.copyWith(
+              fontStyle: (allowsEmptyTopics) ? FontStyle.italic : null,
               color: designVariables.textInput.withFadedAlpha(0.5))))));
   }
 }
@@ -588,7 +605,8 @@ class _FixedDestinationContentInput extends StatelessWidget {
         final streamName = store.streams[streamId]?.name
           ?? zulipLocalizations.composeBoxUnknownChannelName;
         return zulipLocalizations.composeBoxChannelContentHint(
-          streamName, topic.displayName);
+          // ignore: dead_null_aware_expression // null topic names soon to be enabled
+          streamName, topic.displayName ?? store.realmEmptyTopicDisplayName);
 
       case DmNarrow(otherRecipientIds: []): // The self-1:1 thread.
         return zulipLocalizations.composeBoxSelfDmContentHint;

test/widgets/compose_box_test.dart

@@ -47,15 +47,18 @@ void main() {
     List<User> otherUsers = const [],
     List<ZulipStream> streams = const [],
     bool? mandatoryTopics,
+    int? zulipFeatureLevel,
   }) async {
     if (narrow case ChannelNarrow(:var streamId) || TopicNarrow(: var streamId)) {
       assert(streams.any((stream) => stream.streamId == streamId),
         'Add a channel with "streamId" the same as of $narrow.streamId to the store.');
     }
     addTearDown(testBinding.reset);
     selfUser ??= eg.selfUser;
-    final selfAccount = eg.account(user: selfUser);
+    zulipFeatureLevel ??= eg.futureZulipFeatureLevel;
+    final selfAccount = eg.account(user: selfUser, zulipFeatureLevel: zulipFeatureLevel);
     await testBinding.globalStore.add(selfAccount, eg.initialSnapshot(
+      zulipFeatureLevel: zulipFeatureLevel,
       realmMandatoryTopics: mandatoryTopics,
     ));
 
@@ -317,11 +320,15 @@ void main() {
 
     Future<void> prepare(WidgetTester tester, {
       required Narrow narrow,
+      bool? mandatoryTopics,
+      int? zulipFeatureLevel,
     }) async {
       await prepareComposeBox(tester,
         narrow: narrow,
         otherUsers: [eg.otherUser, eg.thirdUser],
-        streams: [channel]);
+        streams: [channel],
+        mandatoryTopics: mandatoryTopics,
+        zulipFeatureLevel: zulipFeatureLevel);
     }
 
     void checkComposeBoxHintTexts(WidgetTester tester, {
@@ -338,48 +345,79 @@ void main() {
         .decoration.isNotNull().hintText.equals(contentHintText);
     }
 
-    testWidgets('to ChannelNarrow without topic', (tester) async {
-      await prepare(tester, narrow: ChannelNarrow(channel.streamId));
+    testWidgets('to ChannelNarrow with empty topic', (tester) async {
+      await prepare(tester, narrow: ChannelNarrow(channel.streamId),
+        mandatoryTopics: false);
+      checkComposeBoxHintTexts(tester,
+        topicHintText: eg.defaultRealmEmptyTopicDisplayName,
+        contentHintText: 'Message #${channel.name} > ${eg.defaultRealmEmptyTopicDisplayName}');
+    }, skip: true); // null topic names soon to be enabled
+
+    testWidgets('to ChannelNarrow with empty topic (mandatory topics)', (tester) async {
+      await prepare(tester, narrow: ChannelNarrow(channel.streamId),
+        mandatoryTopics: true);
+      checkComposeBoxHintTexts(tester,
+        topicHintText: 'Topic',
+        contentHintText: 'Message #${channel.name} > ${eg.defaultRealmEmptyTopicDisplayName}');
+    }, skip: true); // null topic names soon to be enabled
+
+    testWidgets('legacy: to ChannelNarrow with empty topic', (tester) async {
+      await prepare(tester, narrow: ChannelNarrow(channel.streamId),
+        mandatoryTopics: false,
+        zulipFeatureLevel: 333);
       checkComposeBoxHintTexts(tester,
         topicHintText: 'Topic',
         contentHintText: 'Message #${channel.name} > (no topic)');
     });
 
-    testWidgets('to ChannelNarrow with topic', (tester) async {
+    testWidgets('to ChannelNarrow with non-empty topic', (tester) async {
       final narrow = ChannelNarrow(channel.streamId);
-      await prepare(tester, narrow: narrow);
+      await prepare(tester, narrow: narrow,
+        mandatoryTopics: false);
       await enterTopic(tester, narrow: narrow, topic: 'new topic');
       await tester.pump();
       checkComposeBoxHintTexts(tester,
-        topicHintText: 'Topic',
+        topicHintText: eg.defaultRealmEmptyTopicDisplayName,
         contentHintText: 'Message #${channel.name} > new topic');
     });
 
-    testWidgets('to TopicNarrow', (tester) async {
+    testWidgets('to TopicNarrow with non-empty topic', (tester) async {
       await prepare(tester,
-        narrow: TopicNarrow(channel.streamId, TopicName('topic')));
+        narrow: TopicNarrow(channel.streamId, TopicName('topic')),
+        mandatoryTopics: false);
       checkComposeBoxHintTexts(tester,
         contentHintText: 'Message #${channel.name} > topic');
     });
 
+    testWidgets('to TopicNarrow with empty topic', (tester) async {
+      await prepare(tester,
+        narrow: TopicNarrow(channel.streamId, TopicName('')),
+        mandatoryTopics: false);
+      checkComposeBoxHintTexts(tester, contentHintText:
+        'Message #${channel.name} > ${eg.defaultRealmEmptyTopicDisplayName}');
+    }, skip: true); // null topic names soon to be enabled
+
     testWidgets('to DmNarrow with self', (tester) async {
       await prepare(tester, narrow: DmNarrow.withUser(
-        eg.selfUser.userId, selfUserId: eg.selfUser.userId));
+        eg.selfUser.userId, selfUserId: eg.selfUser.userId),
+        mandatoryTopics: false);
       checkComposeBoxHintTexts(tester,
         contentHintText: 'Jot down something');
     });
 
     testWidgets('to 1:1 DmNarrow', (tester) async {
       await prepare(tester, narrow: DmNarrow.withUser(
-        eg.otherUser.userId, selfUserId: eg.selfUser.userId));
+        eg.otherUser.userId, selfUserId: eg.selfUser.userId),
+        mandatoryTopics: false);
       checkComposeBoxHintTexts(tester,
         contentHintText: 'Message @${eg.otherUser.fullName}');
     });
 
     testWidgets('to group DmNarrow', (tester) async {
       await prepare(tester, narrow: DmNarrow.withOtherUsers(
         [eg.otherUser.userId, eg.thirdUser.userId],
-        selfUserId: eg.selfUser.userId));
+        selfUserId: eg.selfUser.userId),
+        mandatoryTopics: false);
       checkComposeBoxHintTexts(tester,
         contentHintText: 'Message group');
     });