paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-06 15:03:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

pm_list: Add search to direct message section.

Browse Source 
Fixes #22113.

The search will only be visible when in the `more conversations`
view. Once we click `back to channels` and close the
`more conversations` view, the search will clear and the search
box will disappear.

We've chosen `pm_list_data.get_conversations` as the function
to which we will pass our search term. We could have technically
found the value of the filter element via JQuery in pm_list_data,
but pm_list_data does not handle any JQuery and we should keep
it that way.

`pm_list_data.get_list_info` also accepts the search_string so that
the info it returns in expanded view is accurate.

We've also added some code to `click_handlers` to make sure that
clicking the search input does not bring us into the DM narrow.
This commit is contained in:
Shubham Padia
2024-06-06 08:35:51 +00:00
committed by Tim Abbott
parent 188dd87eec
commit 76e8ec114a
6 changed files with 147 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
web/src/pm_list.ts
View File

@@ -39,8 +39,10 @@ export function close(): void {
}
export function _build_direct_messages_list(): vdom.Tag<PMNode> {
const conversations = pm_list_data.get_conversations();
const pm_list_info = pm_list_data.get_list_info(zoomed);
const $filter = $<HTMLInputElement>(".direct-messages-list-filter").expectOne();
const search_term = $filter.val()!;
const conversations = pm_list_data.get_conversations(search_term);
const pm_list_info = pm_list_data.get_list_info(zoomed, search_term);
const conversations_to_be_shown = pm_list_info.conversations_to_be_shown;
const more_conversations_unread_count = pm_list_info.more_conversations_unread_count;
@@ -55,6 +57,12 @@ export function _build_direct_messages_list(): vdom.Tag<PMNode> {
);
}
const dom_ast = pm_list_dom.pm_ul(pm_list_nodes);
if (search_term === "") {
$("#clear-direct-messages-search-button").hide();
} else {
$("#clear-direct-messages-search-button").show();
}
return dom_ast;
}
@@ -197,16 +205,31 @@ function zoom_in(): void {
$(".direct-messages-container").removeClass("zoom-out").addClass("zoom-in");
$("#streams_list").hide();
$(".left-sidebar .right-sidebar-items").hide();
const $filter = $(".direct-messages-list-filter").expectOne();
$filter.trigger("focus");
}
function zoom_out(): void {
zoomed = false;
update_private_messages();
clear_search(true); // force rerender if the search is empty.
$(".direct-messages-container").removeClass("zoom-in").addClass("zoom-out");
$("#streams_list").show();
$(".left-sidebar .right-sidebar-items").show();
}
export function clear_search(force_rerender = false): void {
const $filter = $(".direct-messages-list-filter").expectOne();
if ($filter.val() !== "") {
$filter.val("");
update_private_messages();
} else if (force_rerender) {
update_private_messages();
}
}
const throttled_update_private_message = _.throttle(update_private_messages, 50);
export function initialize(): void {
$(".direct-messages-container").on("click", "#show-more-direct-messages", (e) => {
e.stopPropagation();
@@ -221,4 +244,18 @@ export function initialize(): void {
zoom_out();
});
$(".direct-messages-container").on("input", ".direct-messages-list-filter", (e) => {
e.stopPropagation();
e.preventDefault();
throttled_update_private_message();
});
$(".direct-messages-container").on("click", "#clear-direct-messages-search-button", (e) => {
e.stopPropagation();
e.preventDefault();
clear_search();
});
}