drafts_table: Show realm_empty_topic_display_name for topic="".

This commit adds support to display `realm_empty_topic_display_name`
value in the drafts table for topics having the actual value of
empty string.

web/src/drafts.ts

@@ -564,7 +564,8 @@ export type FormattedDraft =
           stream_name?: string | undefined;
           recipient_bar_color: string;
           stream_privacy_icon_color: string;
-          topic: string;
+          topic_display_name: string;
+          is_empty_string_topic: boolean;
           raw_content: string;
           stream_id: number | undefined;
           time_stamp: string;
@@ -621,7 +622,7 @@ export function format_draft(draft: LocalStorageDraftWithId): FormattedDraft | u
             invite_only = sub.invite_only;
             is_web_public = sub.is_web_public;
         }
-        const draft_topic = draft.topic || compose_state.empty_topic_placeholder();
+        const draft_topic_display_name = util.get_final_topic_display_name(draft.topic);
         const draft_stream_color = stream_data.get_color(draft.stream_id);
 
         return {
@@ -631,7 +632,8 @@ export function format_draft(draft: LocalStorageDraftWithId): FormattedDraft | u
             recipient_bar_color: stream_color.get_recipient_bar_color(draft_stream_color),
             stream_privacy_icon_color:
                 stream_color.get_stream_privacy_icon_color(draft_stream_color),
-            topic: draft_topic,
+            topic_display_name: draft_topic_display_name,
+            is_empty_string_topic: draft.topic === "",
             raw_content: draft.content,
             stream_id: draft.stream_id,
             time_stamp,

web/templates/draft.hbs

@@ -16,7 +16,7 @@
                 <span class="stream_topic_separator"><i class="zulip-icon zulip-icon-chevron-right"></i></span>
                 <span class="stream_topic">
                     <div class="message_label_clickable narrows_by_topic">
-                        <span class="stream-topic-inner">{{topic}}</span>
+                        <span class="stream-topic-inner {{#if is_empty_string_topic}}empty-topic-display{{/if}}">{{topic_display_name}}</span>
                     </div>
                 </span>
                 <span class="recipient_bar_controls"></span>

web/tests/drafts.test.cjs

@@ -17,9 +17,13 @@ const compose_recipient = zrequire("compose_recipient");
 const sub_store = zrequire("sub_store");
 const stream_data = zrequire("stream_data");
 const {initialize_user_settings} = zrequire("user_settings");
+const {set_realm} = zrequire("state_data");
 
 initialize_user_settings({user_settings: {}});
 
+const REALM_EMPTY_TOPIC_DISPLAY_NAME = "test general chat";
+set_realm({realm_empty_topic_display_name: REALM_EMPTY_TOPIC_DISPLAY_NAME});
+
 const aaron = {
     email: "aaron@zulip.com",
     user_id: 6,
@@ -482,6 +486,15 @@ test("format_drafts", ({override, override_rewire, mock_template}) => {
         is_sending_saving: false,
         drafts_version: 1,
     };
+    const draft_6 = {
+        topic: "",
+        type: "stream",
+        stream_id: 40,
+        content: "Test stream message 3",
+        updatedAt: date(-11),
+        is_sending_saving: false,
+        drafts_version: 1,
+    };
 
     const expected = [
         {
@@ -491,7 +504,8 @@ test("format_drafts", ({override, override_rewire, mock_template}) => {
             stream_id: 30,
             recipient_bar_color: "#ebebeb",
             stream_privacy_icon_color: "#9a9a9a",
-            topic: "topic",
+            topic_display_name: "topic",
+            is_empty_string_topic: false,
             raw_content: "Test stream message",
             time_stamp: "7:55 AM",
             invite_only: undefined,
@@ -525,19 +539,41 @@ test("format_drafts", ({override, override_rewire, mock_template}) => {
             stream_id: 40,
             recipient_bar_color: "#ebebeb",
             stream_privacy_icon_color: "#9a9a9a",
-            topic: "topic",
+            topic_display_name: "topic",
+            is_empty_string_topic: false,
             raw_content: "Test stream message 2",
             time_stamp: "Jan 21",
             invite_only: false,
             is_web_public: false,
         },
+        {
+            draft_id: "id6",
+            is_stream: true,
+            stream_name: "stream 2",
+            stream_id: 40,
+            recipient_bar_color: "#ebebeb",
+            stream_privacy_icon_color: "#9a9a9a",
+            topic_display_name: REALM_EMPTY_TOPIC_DISPLAY_NAME,
+            is_empty_string_topic: true,
+            raw_content: "Test stream message 3",
+            time_stamp: "Jan 20",
+            invite_only: false,
+            is_web_public: false,
+        },
     ];
 
     $("#drafts_table").append = noop;
 
     const draft_model = drafts.draft_model;
     const ls = localstorage();
-    const data = {id1: draft_1, id2: draft_2, id3: draft_3, id4: draft_4, id5: draft_5};
+    const data = {
+        id1: draft_1,
+        id2: draft_2,
+        id3: draft_3,
+        id4: draft_4,
+        id5: draft_5,
+        id6: draft_6,
+    };
     ls.set("drafts", data);
     assert.deepEqual(draft_model.get(), data);
 
@@ -682,7 +718,8 @@ test("filter_drafts", ({override, override_rewire, mock_template}) => {
             stream_id: 30,
             recipient_bar_color: "#ebebeb",
             stream_privacy_icon_color: "#9a9a9a",
-            topic: "topic",
+            topic_display_name: "topic",
+            is_empty_string_topic: false,
             raw_content: "Test stream message",
             time_stamp: "7:55 AM",
             invite_only: false,
@@ -695,7 +732,8 @@ test("filter_drafts", ({override, override_rewire, mock_template}) => {
             stream_id: 40,
             recipient_bar_color: "#ebebeb",
             stream_privacy_icon_color: "#9a9a9a",
-            topic: "topic",
+            topic_display_name: "topic",
+            is_empty_string_topic: false,
             raw_content: "Test stream message 2",
             time_stamp: "Jan 21",
             invite_only: false,