stream settings: Clean up functions to redraw left panel.

We have long had this annoying two-pass way of building the
DOM that I am trying to eliminate.

The function names that I introduce here describe the current
situation more accurately.

In passing I make it so that we only throttle redraws when
users are actually typing.  Using a throttled redraw when
you click on the sort icons is at best unnecessary, and it
may actually aggravate double clicks.
This commit is contained in:
Steve Howell 2021-02-15 17:18:51 +00:00 committed by Tim Abbott
parent 20a8077cbd
commit 9862156158
2 changed files with 13 additions and 11 deletions

View File

@ -105,7 +105,7 @@ run_test("filter_table", () => {
populated_subs = data.subscriptions;
});
subs.populate_stream_settings_left_panel();
subs.render_left_panel_superset();
const sub_stubs = [];

View File

@ -407,7 +407,10 @@ function get_stream_id_buckets(stream_ids, query) {
return buckets;
}
exports.populate_stream_settings_left_panel = function () {
exports.render_left_panel_superset = function () {
// For annoying legacy reasons we render all the subs we are
// allowed to know about and put them in the DOM, then we do
// a second pass where we filter/sort them.
const html = blueslip.measure_time("render left panel", () => {
const sub_rows = stream_data.get_updated_unsorted_subs();
@ -502,13 +505,11 @@ exports.maybe_reset_right_panel = function () {
}
};
exports.actually_filter_streams = function () {
exports.redraw_left_panel = function () {
const search_params = exports.get_search_params();
exports.filter_table(search_params);
};
const filter_streams = _.throttle(exports.actually_filter_streams, 50);
// Make it explicit that our toggler is not created right away.
exports.toggler = undefined;
@ -525,7 +526,7 @@ exports.switch_stream_tab = function (tab_name) {
subscribed_only = true;
}
exports.actually_filter_streams();
exports.redraw_left_panel();
stream_edit.setup_subscriptions_tab_hash(tab_name);
};
@ -539,7 +540,7 @@ exports.switch_stream_sort = function (tab_name) {
} else {
sort_order = "by-stream-name";
}
exports.actually_filter_streams();
exports.redraw_left_panel();
};
exports.setup_page = function (callback) {
@ -634,19 +635,20 @@ exports.setup_page = function (callback) {
const rendered = render_subscription_table_body(template_data);
$("#subscriptions_table").append(rendered);
exports.populate_stream_settings_left_panel();
exports.render_left_panel_superset();
initialize_components();
exports.actually_filter_streams();
exports.redraw_left_panel();
stream_create.set_up_handlers();
const throttled_redraw_left_panel = _.throttle(exports.redraw_left_panel, 50);
$("#stream_filter input[type='text']").on("input", () => {
// Debounce filtering in case a user is typing quickly
filter_streams();
throttled_redraw_left_panel();
});
$("#clear_search_stream_name").on("click", () => {
$("#stream_filter input[type='text']").val("");
filter_streams();
exports.redraw_left_panel();
});
if (callback) {