settings_streams: Convert module to TypeScript.

This commit is contained in:
Varun Singh 2024-05-28 19:55:40 +05:30 committed by Tim Abbott
parent 40953f7ada
commit a177d8fa49
2 changed files with 38 additions and 29 deletions

View File

@ -218,7 +218,7 @@ EXEMPT_FILES = make_set(
"web/src/settings_realm_domains.ts", "web/src/settings_realm_domains.ts",
"web/src/settings_realm_user_settings_defaults.js", "web/src/settings_realm_user_settings_defaults.js",
"web/src/settings_sections.js", "web/src/settings_sections.js",
"web/src/settings_streams.js", "web/src/settings_streams.ts",
"web/src/settings_toggle.js", "web/src/settings_toggle.js",
"web/src/settings_ui.ts", "web/src/settings_ui.ts",
"web/src/settings_user_topics.ts", "web/src/settings_user_topics.ts",

View File

@ -1,4 +1,5 @@
import $ from "jquery"; import $ from "jquery";
import type * as tippy from "tippy.js";
import render_add_default_streams from "../templates/settings/add_default_streams.hbs"; import render_add_default_streams from "../templates/settings/add_default_streams.hbs";
import render_admin_default_streams_list from "../templates/settings/admin_default_streams_list.hbs"; import render_admin_default_streams_list from "../templates/settings/admin_default_streams_list.hbs";
@ -18,14 +19,14 @@ import * as stream_data from "./stream_data";
import * as sub_store from "./sub_store"; import * as sub_store from "./sub_store";
import * as ui_report from "./ui_report"; import * as ui_report from "./ui_report";
function add_choice_row($widget) { function add_choice_row($widget: JQuery): void {
if ($widget.closest(".choice-row").next().hasClass("choice-row")) { if ($widget.closest(".choice-row").next().hasClass("choice-row")) {
return; return;
} }
create_choice_row(); create_choice_row();
} }
function get_chosen_default_streams() { function get_chosen_default_streams(): Set<number> {
// Return the set of stream id's of streams chosen in the default stream modal. // Return the set of stream id's of streams chosen in the default stream modal.
return new Set( return new Set(
// Note: We selectively map through the dropdown elements that contain the // Note: We selectively map through the dropdown elements that contain the
@ -37,7 +38,7 @@ function get_chosen_default_streams() {
); );
} }
function create_choice_row() { function create_choice_row(): void {
const $container = $("#default-stream-choices"); const $container = $("#default-stream-choices");
const value = settings_profile_fields.get_value_for_new_option($container); const value = settings_profile_fields.get_value_for_new_option($container);
const stream_dropdown_widget_name = `select_default_stream_${value}`; const stream_dropdown_widget_name = `select_default_stream_${value}`;
@ -45,7 +46,7 @@ function create_choice_row() {
$container.append($(row_html)); $container.append($(row_html));
// List of non-default streams that are not yet selected. // List of non-default streams that are not yet selected.
function get_options() { function get_options(): {name: string; unique_id: number}[] {
const chosen_default_streams = get_chosen_default_streams(); const chosen_default_streams = get_chosen_default_streams();
return stream_data return stream_data
@ -53,10 +54,10 @@ function create_choice_row() {
.filter((e) => !chosen_default_streams.has(e.unique_id)); .filter((e) => !chosen_default_streams.has(e.unique_id));
} }
function item_click_callback(event, dropdown) { function item_click_callback(event: JQuery.ClickEvent, dropdown: tippy.Instance): void {
const $selected_stream = $(event.currentTarget); const $selected_stream = $(event.currentTarget);
const selected_stream_name = $selected_stream.attr("data-name"); const selected_stream_name = $selected_stream.attr("data-name")!;
const selected_stream_id = Number.parseInt($selected_stream.data("unique-id"), 10); const selected_stream_id = Number.parseInt($selected_stream.attr("data-unique-id")!, 10);
const $stream_dropdown_widget = $(`#${CSS.escape(stream_dropdown_widget_name)}_widget`); const $stream_dropdown_widget = $(`#${CSS.escape(stream_dropdown_widget_name)}_widget`);
const $stream_name = $stream_dropdown_widget.find(".dropdown_widget_value"); const $stream_name = $stream_dropdown_widget.find(".dropdown_widget_value");
@ -85,11 +86,11 @@ const meta = {
loaded: false, loaded: false,
}; };
export function reset() { export function reset(): void {
meta.loaded = false; meta.loaded = false;
} }
export function maybe_disable_widgets() { export function maybe_disable_widgets(): void {
if (current_user.is_admin) { if (current_user.is_admin) {
return; return;
} }
@ -99,11 +100,11 @@ export function maybe_disable_widgets() {
.prop("disabled", true); .prop("disabled", true);
} }
export function build_default_stream_table() { export function build_default_stream_table(): void {
const $table = $("#admin_default_streams_table").expectOne(); const $table = $("#admin_default_streams_table").expectOne();
const stream_ids = stream_data.get_default_stream_ids(); const stream_ids = stream_data.get_default_stream_ids();
const subs = stream_ids.map((stream_id) => sub_store.get(stream_id)); const subs = stream_ids.map((stream_id) => sub_store.get(stream_id)!);
ListWidget.create($table, subs, { ListWidget.create($table, subs, {
name: "default_streams_list", name: "default_streams_list",
@ -115,7 +116,7 @@ export function build_default_stream_table() {
}); });
}, },
filter: { filter: {
$element: $table.closest(".settings-section").find(".search"), $element: $table.closest(".settings-section").find<HTMLInputElement>("input.search"),
predicate(item, query) { predicate(item, query) {
return item.name.toLowerCase().includes(query.toLowerCase()); return item.name.toLowerCase().includes(query.toLowerCase());
}, },
@ -134,15 +135,19 @@ export function build_default_stream_table() {
loading.destroy_indicator($("#admin_page_default_streams_loading_indicator")); loading.destroy_indicator($("#admin_page_default_streams_loading_indicator"));
} }
export function update_default_streams_table() { export function update_default_streams_table(): void {
if (["organization", "settings"].includes(hash_parser.get_current_hash_category())) { if (["organization", "settings"].includes(hash_parser.get_current_hash_category())) {
$("#admin_default_streams_table").expectOne().find("tr.default_stream_row").remove(); $("#admin_default_streams_table").expectOne().find("tr.default_stream_row").remove();
build_default_stream_table(); build_default_stream_table();
} }
} }
export function delete_default_stream(stream_id, $default_stream_row, $alert_element) { export function delete_default_stream(
channel.del({ stream_id: number,
$default_stream_row: JQuery,
$alert_element: JQuery,
): void {
void channel.del({
url: "/json/default_streams?" + $.param({stream_id}), url: "/json/default_streams?" + $.param({stream_id}),
error(xhr) { error(xhr) {
ui_report.generic_row_button_error(xhr, $alert_element); ui_report.generic_row_button_error(xhr, $alert_element);
@ -153,7 +158,7 @@ export function delete_default_stream(stream_id, $default_stream_row, $alert_ele
}); });
} }
function delete_choice_row(e) { function delete_choice_row(e: JQuery.ClickEvent): void {
const $row = $(e.currentTarget).parent(); const $row = $(e.currentTarget).parent();
$row.remove(); $row.remove();
@ -164,10 +169,10 @@ function delete_choice_row(e) {
); );
} }
function show_add_default_streams_modal() { function show_add_default_streams_modal(): void {
const html_body = render_add_default_streams(); const html_body = render_add_default_streams();
function add_default_streams(e) { function add_default_streams(e: JQuery.ClickEvent): void {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
@ -176,9 +181,9 @@ function show_add_default_streams_modal() {
let successful_requests = 0; let successful_requests = 0;
const chosen_streams = get_chosen_default_streams(); const chosen_streams = get_chosen_default_streams();
function make_default_stream_request(stream_id) { function make_default_stream_request(stream_id: number): void {
const data = {stream_id}; const data = {stream_id};
channel.post({ void channel.post({
url: "/json/default_streams", url: "/json/default_streams",
data, data,
success() { success() {
@ -204,7 +209,7 @@ function show_add_default_streams_modal() {
} }
} }
function default_stream_post_render() { function default_stream_post_render(): void {
$("#add-default-stream-modal .dialog_submit_button").prop("disabled", true); $("#add-default-stream-modal .dialog_submit_button").prop("disabled", true);
create_choice_row(); create_choice_row();
@ -223,12 +228,12 @@ function show_add_default_streams_modal() {
}); });
} }
export function set_up() { export function set_up(): void {
build_page(); build_page();
maybe_disable_widgets(); maybe_disable_widgets();
} }
export function build_page() { export function build_page(): void {
meta.loaded = true; meta.loaded = true;
update_default_streams_table(); update_default_streams_table();
@ -240,9 +245,13 @@ export function build_page() {
show_add_default_streams_modal(); show_add_default_streams_modal();
}); });
$("body").on("click", ".default_stream_row .remove-default-stream", function (e) { $("body").on(
const $row = $(this).closest(".default_stream_row"); "click",
const stream_id = Number.parseInt($row.attr("data-stream-id"), 10); ".default_stream_row .remove-default-stream",
delete_default_stream(stream_id, $row, $(e.target)); function (this: HTMLElement) {
}); const $row = $(this).closest(".default_stream_row");
const stream_id = Number.parseInt($row.attr("data-stream-id")!, 10);
delete_default_stream(stream_id, $row, $(this));
},
);
} }