message_feed: Improve placeholder text for empty unsubscribed stream.

This commit changes the placeholder text along with fixing the style issue of subscribe button in empty unsubscribed streams. Fixes #29692.
zulip · Apr 12, 2024 · b51d854 · b51d854
1 parent 8a80794
commit b51d854
Showing 1 changed file with 12 additions and 6 deletions.
diff --git a/web/src/narrow_banner.ts b/web/src/narrow_banner.ts
@@ -266,19 +266,25 @@ function pick_empty_narrow_banner(): NarrowBannerData {
                 if (can_toggle_narrowed_stream()) {
                     return {
                         title: $t({
-                            defaultMessage:
-                                "You aren't subscribed to this stream and nobody has talked about that yet!",
+                            defaultMessage: "There are no messages here.",
                         }),
                         // TODO: Consider moving the button to be its own option in the template.
                         html: $t_html(
                             {
-                                defaultMessage: "<z-button>Subscribe</z-button>",
+                                defaultMessage:
+                                    "Why not <z-link>start the conversation</z-link>? <z-button>Subscribe</z-button>",
                             },
                             {
-                                "z-button": (content_html) =>
-                                    `<button class="button white rounded stream_sub_unsub_button sea-green" type="button" name="subscription">${content_html.join(
+                                "z-link": (content_html) =>
+                                    `<a href="#" class="empty_feed_compose_stream">${content_html.join(
                                         "",
-                                    )}</button>`,
+                                    )}</a>`,
+                                "z-button": (content_html) =>
+                                    `<div class="sub_button_row new-style">
+                                        <button class="button white rounded stream_sub_unsub_button sea-green" type="button" name="subscription">${content_html.join(
+                                            "",
+                                        )}</button>
+                                    </div>`,
                             },
                         ),
                     };