paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-14 02:48:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

compose: Show banner to explain interleaved view messages fading.

Browse Source 
In an interleaved view when composing a message we fade messages
which the user is not replying to, to reduce the chance they send
a message to a recipient they didn't intend to.
Also, it reduces the visual/cognitive processing required
to figure out where their message is going to go.

But, it's not necessarily clear to users that what the
fading means, so this commit adds a one-time compose banner
to explain what's going on the first time this comes up.

Fixes part of #29076.
This commit is contained in:
Prakhar Pratyush
2024-04-23 12:34:05 +05:30
committed by Tim Abbott
parent 35380b095f
commit df7ed437c2
9 changed files with 86 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
web/src/compose_setup.js
View File

@@ -331,6 +331,17 @@ export function initialize() {
},
);
const interleaved_view_messages_fading_banner_selector = `.${CSS.escape(compose_banner.CLASSNAMES.interleaved_view_messages_fading)}`;
$("body").on(
"click",
`${interleaved_view_messages_fading_banner_selector} .main-view-banner-action-button`,
(event) => {
event.preventDefault();
$(event.target).parents(`${interleaved_view_messages_fading_banner_selector}`).remove();
onboarding_steps.post_onboarding_step_as_read("interleaved_view_messages_fading");
},
);
for (const classname of Object.values(compose_banner.CLASSNAMES)) {
const classname_selector = `.${CSS.escape(classname)}`;
$("body").on("click", `${classname_selector} .main-view-banner-close-button`, (event) => {
@@ -492,7 +503,11 @@ export function initialize() {
$("textarea#compose-textarea").on("focus", () => {
compose_recipient.update_placeholder_text();
compose_notifications.maybe_show_one_time_non_interleaved_view_messages_fading_banner();
if (narrow_state.narrowed_by_reply()) {
compose_notifications.maybe_show_one_time_non_interleaved_view_messages_fading_banner();
} else {
compose_notifications.maybe_show_one_time_interleaved_view_messages_fading_banner();
}
});
$("#compose_recipient_box").on("click", "#recipient_box_clear_topic_button", () => {