paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-12 01:47:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

buddy_list: Redesign top of right sidebar.

Browse Source 
Fixes #31974.
This commit is contained in:
evykassirer
2024-10-15 16:29:36 -07:00
committed by Tim Abbott
parent 68c06c0f47
commit b7b2930760
12 changed files with 64 additions and 200 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
web/src/user_search.ts
View File

@@ -3,7 +3,6 @@ import assert from "minimalistic-assert";
import * as buddy_data from "./buddy_data";
import * as popovers from "./popovers";
import * as resize from "./resize";
import * as sidebar_ui from "./sidebar_ui";
export class UserSearch {
@@ -11,7 +10,7 @@ export class UserSearch {
// above the buddy list. We rely on other code to manage the
// details of populating the list when we change.
$widget = $("#user_search_section").expectOne();
$widget = $("#userlist-header-search").expectOne();
$input = $<HTMLInputElement>("input.user-list-filter").expectOne();
_reset_items: () => void;
_update_list: () => void;
@@ -25,12 +24,11 @@ export class UserSearch {
$("#clear_search_people_button").on("click", () => {
this.clear_search();
});
$("#userlist-header-search").on("click", () => {
this.toggle_filter_displayed();
});
this.$input.on("input", () => {
buddy_data.set_is_searching_users(this.$input.val() !== "");
const input_is_empty = this.$input.val() === "";
buddy_data.set_is_searching_users(!input_is_empty);
$("#clear_search_people_button").toggleClass("hidden", input_is_empty);
opts.update_list();
});
this.$input.on("focus", (e) => {
@@ -52,54 +50,17 @@ export class UserSearch {
return this.$input.is(":focus");
}
empty(): boolean {
return this.text() === "";
}
// This clears search input but doesn't close
// the search widget unless it was already empty.
clear_search(): void {
buddy_data.set_is_searching_users(false);
if (this.empty()) {
this.close_widget();
return;
}
$("#clear_search_people_button").toggleClass("hidden", true);
this.$input.val("");
this.$input.trigger("blur");
this._reset_items();
}
// This always clears and closes search.
clear_and_hide_search(): void {
this.clear_search();
this._update_list();
this.close_widget();
}
hide_widget(): void {
this.$widget.addClass("notdisplayed");
resize.resize_sidebars();
}
show_widget(): void {
// Hide all the popovers.
popovers.hide_all();
this.$widget.removeClass("notdisplayed");
resize.resize_sidebars();
}
widget_shown(): boolean {
return this.$widget.hasClass("notdisplayed");
}
close_widget(): void {
this.$input.trigger("blur");
this.hide_widget();
this._reset_items();
}
expand_column(): void {
const $column = this.$input.closest(".app-main [class^='column-']");
if (!$column.hasClass("expanded")) {
@@ -114,21 +75,12 @@ export class UserSearch {
initiate_search(): void {
this.expand_column();
this.show_widget();
// Needs to be called when input is visible after fix_invite_user_button_flicker.
setTimeout(() => {
this.$input.trigger("focus");
}, 0);
}
toggle_filter_displayed(): void {
if (this.widget_shown()) {
this.initiate_search();
} else {
this.clear_and_hide_search();
}
}
on_focus(e: JQuery.FocusEvent): void {
this._on_focus();
e.stopPropagation();