left sidebar: Scroll to current PM conversation on narrow.

Zulip has long had the behavior that opening a stream or topic via
narrowing automatically scrolled the left sidebar to the conversation,
so that you can see it and adjacent ones readily.

When we moved private messages into the left sidebar, we didn't
implement this similar behavior; this resulted in users having to
manually scroll the sidebar in order to browser private message
conversations.

Fix this by using the standard scroll_util helpers, with some extra
care to expand the heading when going to "all private messages".

Fixes #23609.

Co-authored-by: Tim Abbott <tabbott@zulip.com>
This commit is contained in:
Ilikepizza2
2022-12-21 11:09:20 +05:30
committed by Tim Abbott
parent 4c6f85727c
commit caab470656
2 changed files with 28 additions and 0 deletions

View File

@@ -4,6 +4,7 @@ import _ from "lodash";
import * as pm_list_data from "./pm_list_data";
import * as pm_list_dom from "./pm_list_dom";
import * as resize from "./resize";
import * as scroll_util from "./scroll_util";
import * as topic_zoom from "./topic_zoom";
import * as ui from "./ui";
import * as ui_util from "./ui_util";
@@ -123,6 +124,20 @@ function unhighlight_all_private_messages_view() {
$(".private_messages_container").removeClass("active_private_messages_section");
}
function scroll_pm_into_view($target_li) {
const $container = $("#left_sidebar_scroll_container");
const pm_header_height = $("#private_messages_section_header").outerHeight();
if ($target_li.length > 0) {
scroll_util.scroll_element_into_container($target_li, $container, pm_header_height);
}
}
function scroll_all_private_into_view() {
const $container = $("#left_sidebar_scroll_container");
const $scroll_element = ui.get_scroll_element($container);
$scroll_element.scrollTop(0);
}
export function handle_narrow_activated(filter) {
const active_filter = filter;
const is_all_private_message_view = _.isEqual(active_filter.sorted_term_types(), [
@@ -131,11 +146,21 @@ export function handle_narrow_activated(filter) {
const narrow_to_private_messages_section = active_filter.operands("pm-with").length !== 0;
if (is_all_private_message_view) {
// In theory, this should get expanded when we scroll to the
// top, but empirically that doesn't occur, so we just ensure the
// section is expanded before scrolling.
expand();
highlight_all_private_messages_view();
scroll_all_private_into_view();
} else {
unhighlight_all_private_messages_view();
}
if (narrow_to_private_messages_section) {
const current_user_ids_string = pm_list_data.get_active_user_ids_string();
const $active_filter_li = $(
`li[data-user-ids-string='${CSS.escape(current_user_ids_string)}']`,
);
scroll_pm_into_view($active_filter_li);
update_private_messages();
}
}

View File

@@ -36,6 +36,9 @@ const unread_ops = mock_esm("../src/unread_ops");
mock_esm("../src/recent_topics_util", {
is_visible() {},
});
mock_esm("../src/pm_list", {
handle_narrow_activated() {},
});
//
// We have strange hacks in narrow.activate to sleep 0