topic_list: Move topic filter out of topics list ul.

Instead of topic filter box being a part of the list when keeps
updating, we move it out and fix its position.

This should reduce rendering time of topics list and provide
a smoother experience to users when waiting for topics list to
load.
This commit is contained in:
Aman Agrawal
2022-11-02 16:38:38 +00:00
committed by Tim Abbott
parent d717b38704
commit ef067eafad
5 changed files with 47 additions and 81 deletions

View File

@@ -1,6 +1,7 @@
import $ from "jquery";
import _ from "lodash";
import render_filter_topics from "../templates/filter_topics.hbs";
import render_stream_privacy from "../templates/stream_privacy.hbs";
import render_stream_sidebar_row from "../templates/stream_sidebar_row.hbs";
import render_stream_subheader from "../templates/streams_subheader.hbs";
@@ -265,6 +266,10 @@ export function zoom_in_topics(options) {
if (stream_id_for_elt($elt) === stream_id) {
$elt.show();
// Add search box for topics list.
$elt.children("div.bottom_left_row").append(render_filter_topics());
$("#filter-topic-input").trigger("focus");
$("#clear_search_topic_button").hide();
} else {
$elt.hide();
}
@@ -289,6 +294,8 @@ export function zoom_out_topics() {
$("#streams_list").expectOne().removeClass("zoom-in").addClass("zoom-out");
$("#stream_filters li.narrow-filter").show();
// Remove search box for topics list from DOM.
$(".filter-topics").remove();
}
export function set_in_home_view(stream_id, in_home) {