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

@@ -589,7 +589,14 @@ class _StreamContentInputState extends State<_StreamContentInput> {
       destination: TopicNarrow(widget.narrow.streamId, topic),
       controller: widget.controller,
       hint: Text(zulipLocalizations.composeBoxChannelContentHint(
-        '#$streamName > ${topic.displayName}')));
+        // ignore: dead_null_aware_expression // null topic names soon to be enabled
+        '#$streamName > ${topic.displayName ?? store.realmEmptyTopicDisplayName}'),
+        style: TextStyle(
+          // 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.
+          // ignore: unnecessary_null_comparison // null topic names soon to be enabled
+          fontStyle: topic.displayName == null ? FontStyle.italic : null)));
   }
 }
 
@@ -608,6 +615,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,
@@ -625,8 +635,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))))));
   }
 }
@@ -648,7 +661,14 @@ class _FixedDestinationContentInput extends StatelessWidget {
         final streamName = store.streams[streamId]?.name
           ?? zulipLocalizations.unknownChannelName;
         return Text(zulipLocalizations.composeBoxChannelContentHint(
-          '#$streamName > ${topic.displayName}'));
+          // ignore: dead_null_aware_expression // null topic names soon to be enabled
+          '#$streamName > ${topic.displayName ?? store.realmEmptyTopicDisplayName}'),
+          style: TextStyle(
+            // 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.
+            // ignore: unnecessary_null_comparison // null topic names soon to be enabled
+            fontStyle: topic.displayName == null ? FontStyle.italic : null));
 
       case DmNarrow(otherRecipientIds: []): // The self-1:1 thread.
         return Text(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,
     ));
 
@@ -326,11 +329,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, {
@@ -347,48 +354,79 @@ void main() {
         of: contentInputFinder, matching: find.text(contentHintText))).findsOne();
     }
 
-    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');
     });