mirror of
https://github.com/zulip/zulip.git
synced 2025-11-04 22:13:26 +00:00
topic_list: Rewrite typeahead using an item type.
This makes it a lot easier to control the matching and display separately.
This commit is contained in:
@@ -26,17 +26,28 @@ import type {TopicInfo} from "./topic_list_data.ts";
|
|||||||
import * as typeahead_helper from "./typeahead_helper.ts";
|
import * as typeahead_helper from "./typeahead_helper.ts";
|
||||||
import * as vdom from "./vdom.ts";
|
import * as vdom from "./vdom.ts";
|
||||||
|
|
||||||
/*
|
type TopicFilterPill = {
|
||||||
Track all active widgets with a Map by stream_id.
|
label: string;
|
||||||
|
syntax: string;
|
||||||
|
};
|
||||||
|
|
||||||
(We have at max one for now, but we may
|
const filter_options: TopicFilterPill[] = [
|
||||||
eventually allow multiple streams to be
|
{
|
||||||
expanded.)
|
label: $t({defaultMessage: "Unresolved topics"}),
|
||||||
*/
|
syntax: "-is:resolved",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: $t({defaultMessage: "Resolved topics"}),
|
||||||
|
syntax: "is:resolved",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
/* Track all active widgets with a Map by stream_id. We have at max
|
||||||
|
one for now, but we may eventually allow multiple streams to be
|
||||||
|
expanded. */
|
||||||
const active_widgets = new Map<number, LeftSidebarTopicListWidget>();
|
const active_widgets = new Map<number, LeftSidebarTopicListWidget>();
|
||||||
export let search_pill_widget: SearchPillWidget | null = null;
|
export let search_pill_widget: SearchPillWidget | null = null;
|
||||||
export let topic_state_typeahead: Typeahead<string> | undefined;
|
export let topic_state_typeahead: Typeahead<TopicFilterPill> | undefined;
|
||||||
|
|
||||||
// We know whether we're zoomed or not.
|
// We know whether we're zoomed or not.
|
||||||
let zoomed = false;
|
let zoomed = false;
|
||||||
@@ -500,12 +511,6 @@ function set_search_bar_text(text: string): void {
|
|||||||
$input.trigger("input");
|
$input.trigger("input");
|
||||||
}
|
}
|
||||||
|
|
||||||
const filter_options = new Map<string, string>([
|
|
||||||
[$t({defaultMessage: "Unresolved topics"}), "-is:resolved"],
|
|
||||||
[$t({defaultMessage: "Resolved topics"}), "is:resolved"],
|
|
||||||
[$t({defaultMessage: "All topics"}), ""],
|
|
||||||
]);
|
|
||||||
|
|
||||||
export function setup_topic_search_typeahead(): void {
|
export function setup_topic_search_typeahead(): void {
|
||||||
const $input = $("#topic_filter_query");
|
const $input = $("#topic_filter_query");
|
||||||
const $pill_container = $("#left-sidebar-filter-topic-input");
|
const $pill_container = $("#left-sidebar-filter-topic-input");
|
||||||
@@ -522,7 +527,6 @@ export function setup_topic_search_typeahead(): void {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const options = {
|
const options = {
|
||||||
items: filter_options.size,
|
|
||||||
source() {
|
source() {
|
||||||
const stream_id = active_stream_id();
|
const stream_id = active_stream_id();
|
||||||
assert(stream_id !== undefined);
|
assert(stream_id !== undefined);
|
||||||
@@ -534,27 +538,27 @@ export function setup_topic_search_typeahead(): void {
|
|||||||
if ($pills.length > 0) {
|
if ($pills.length > 0) {
|
||||||
return [];
|
return [];
|
||||||
}
|
}
|
||||||
return [...filter_options.keys()];
|
return [...filter_options];
|
||||||
},
|
},
|
||||||
item_html(item: string) {
|
item_html(item: TopicFilterPill) {
|
||||||
return typeahead_helper.render_topic_state(item);
|
return typeahead_helper.render_topic_state(item.label);
|
||||||
},
|
},
|
||||||
matcher(item: string, query: string) {
|
matcher(item: TopicFilterPill, query: string) {
|
||||||
return item.toLowerCase().startsWith(query.toLowerCase());
|
return item.syntax.toLowerCase().startsWith(query.toLowerCase());
|
||||||
},
|
},
|
||||||
sorter(items: string[]) {
|
sorter(items: TopicFilterPill[]) {
|
||||||
return items;
|
return items;
|
||||||
},
|
},
|
||||||
updater(item: string) {
|
updater(item: TopicFilterPill) {
|
||||||
const value = filter_options.get(item)!;
|
|
||||||
assert(search_pill_widget !== null);
|
assert(search_pill_widget !== null);
|
||||||
search_pill_widget.clear(true);
|
search_pill_widget.clear(true);
|
||||||
search_pill_widget.appendValue(value);
|
search_pill_widget.appendValue(item.syntax);
|
||||||
set_search_bar_text("");
|
set_search_bar_text("");
|
||||||
$input.trigger("focus");
|
$input.trigger("focus");
|
||||||
return get_left_sidebar_topic_search_term();
|
return get_left_sidebar_topic_search_term();
|
||||||
},
|
},
|
||||||
// Prevents key events from propagating to other handlers or triggering default browser actions.
|
// Prevents key events from propagating to other handlers or
|
||||||
|
// triggering default browser actions.
|
||||||
stopAdvance: true,
|
stopAdvance: true,
|
||||||
// Use dropup, to match compose typeahead.
|
// Use dropup, to match compose typeahead.
|
||||||
dropup: true,
|
dropup: true,
|
||||||
|
|||||||
Reference in New Issue
Block a user