From 39d6d3ed27325269235b1145b6d184c1d76f462a Mon Sep 17 00:00:00 2001 From: Sayam Samal Date: Thu, 18 Jul 2024 14:15:29 +0530 Subject: [PATCH] compose_closed_ui: Make UI in DMs view consistent with non DMs view. This adds the "New direct message" button back in the closed compose UI for DMs view, to make the closed compose UI consistent across the app. Since the closed compose UI is always visible, and one that is likely to be used frequently, it makes sense to have the same UI across all the views to avoid the mental overhead of figuring out how to compose a message in different views. --- web/src/compose_closed_ui.ts | 48 ++++-------------------------------- web/src/compose_tooltips.ts | 7 +----- web/tests/compose.test.js | 27 -------------------- 3 files changed, 6 insertions(+), 76 deletions(-) diff --git a/web/src/compose_closed_ui.ts b/web/src/compose_closed_ui.ts index cf1067c427..7eb2342ebf 100644 --- a/web/src/compose_closed_ui.ts +++ b/web/src/compose_closed_ui.ts @@ -82,53 +82,17 @@ function update_reply_button_state(disable = false): void { } } -function update_new_conversation_button( - btn_text: string, - is_direct_message_narrow?: boolean, -): void { - const $new_conversation_button = $("#new_conversation_button"); - $new_conversation_button.text(btn_text); - // In a direct-message narrow, the new conversation button should act - // like a new direct message button - if (is_direct_message_narrow) { - $new_conversation_button.addClass("compose_new_direct_message_button"); - $new_conversation_button.removeClass("compose_new_conversation_button"); - } else { - // Restore the usual new conversation button class, if it was - // changed after a previous direct-message narrow visit - $new_conversation_button.addClass("compose_new_conversation_button"); - $new_conversation_button.removeClass("compose_new_direct_message_button"); - } -} - function update_new_direct_message_button(btn_text: string): void { $("#new_direct_message_button").text(btn_text); } -function toggle_direct_message_button_visibility(is_direct_message_narrow?: boolean): void { - const $new_direct_message_button_container = $(".new_direct_message_button_container"); - if (is_direct_message_narrow) { - $new_direct_message_button_container.hide(); - } else { - $new_direct_message_button_container.show(); - } -} - -function update_buttons( - text_stream: string, - is_direct_message_narrow?: boolean, - disable_reply?: boolean, -): void { +function update_buttons(disable_reply?: boolean): void { const text_conversation = $t({defaultMessage: "New direct message"}); - update_new_conversation_button(text_stream, is_direct_message_narrow); update_new_direct_message_button(text_conversation); update_reply_button_state(disable_reply); - toggle_direct_message_button_visibility(is_direct_message_narrow); } export function update_buttons_for_private(): void { - const text_stream = $t({defaultMessage: "Start new conversation"}); - const is_direct_message_narrow = true; const pm_ids_string = narrow_state.pm_ids_string(); let disable_reply; @@ -140,21 +104,19 @@ export function update_buttons_for_private(): void { // if the user cannot dm the current recipient disable_reply = true; } - $("#new_conversation_button").attr("data-conversation-type", "direct"); - update_buttons(text_stream, is_direct_message_narrow, disable_reply); + $("#new_conversation_button").attr("data-conversation-type", "direct"); + update_buttons(disable_reply); } export function update_buttons_for_stream_views(): void { - const text_stream = $t({defaultMessage: "Start new conversation"}); $("#new_conversation_button").attr("data-conversation-type", "stream"); - update_buttons(text_stream); + update_buttons(); } export function update_buttons_for_non_specific_views(): void { - const text_stream = $t({defaultMessage: "Start new conversation"}); $("#new_conversation_button").attr("data-conversation-type", "non-specific"); - update_buttons(text_stream); + update_buttons(); } function set_reply_button_label(label: string): void { diff --git a/web/src/compose_tooltips.ts b/web/src/compose_tooltips.ts index deecda7891..c3d3756cd3 100644 --- a/web/src/compose_tooltips.ts +++ b/web/src/compose_tooltips.ts @@ -89,12 +89,7 @@ export function initialize(): void { onShow(instance) { const $elem = $(instance.reference); const conversation_type = $elem.attr("data-conversation-type"); - if (conversation_type === "direct") { - instance.setContent( - parse_html($("#new_direct_message_button_tooltip_template").html()), - ); - return undefined; - } else if (conversation_type === "stream") { + if (conversation_type === "stream") { instance.setContent( parse_html($("#new_topic_message_button_tooltip_template").html()), ); diff --git a/web/tests/compose.test.js b/web/tests/compose.test.js index 5159e37e73..4871c1a1d6 100644 --- a/web/tests/compose.test.js +++ b/web/tests/compose.test.js @@ -5,7 +5,6 @@ const {strict: assert} = require("assert"); const MockDate = require("mockdate"); const {mock_banners} = require("./lib/compose_banner"); -const {$t} = require("./lib/i18n"); const {mock_esm, set_global, zrequire} = require("./lib/namespace"); const {run_test, noop} = require("./lib/test"); const $ = require("./lib/zjquery"); @@ -858,32 +857,6 @@ test_ui("DM policy disabled", ({override, override_rewire}) => { assert.ok(reply_disabled); }); -test_ui("narrow_button_titles", ({override}) => { - override(narrow_state, "pm_ids_string", () => "31"); - override(narrow_state, "is_message_feed_visible", () => true); - override(realm, "realm_direct_message_permission_group", everyone.id); - override(realm, "realm_direct_message_initiator_group", everyone.id); - compose_closed_ui.update_buttons_for_private(); - assert.equal( - $("#new_conversation_button").text(), - $t({defaultMessage: "Start new conversation"}), - ); - assert.equal( - $("#new_direct_message_button").text(), - $t({defaultMessage: "New direct message"}), - ); - - compose_closed_ui.update_buttons_for_stream_views(); - assert.equal( - $("#new_conversation_button").text(), - $t({defaultMessage: "Start new conversation"}), - ); - assert.equal( - $("#new_direct_message_button").text(), - $t({defaultMessage: "New direct message"}), - ); -}); - run_test("reset MockDate", () => { MockDate.reset(); });