user_group_create: Convert module to TypeScript.

tools/test-js-with-node

@@ -270,7 +270,7 @@ EXEMPT_FILES = make_set(
         "web/src/user_deactivation_ui.ts",
         "web/src/user_events.js",
         "web/src/user_group_components.ts",
-        "web/src/user_group_create.js",
+        "web/src/user_group_create.ts",
         "web/src/user_group_create_members.ts",
         "web/src/user_group_create_members_data.ts",
         "web/src/user_group_edit.js",

web/src/user_group_create.ts

@@ -1,4 +1,5 @@
 import $ from "jquery";
+import assert from "minimalistic-assert";
 
 import * as channel from "./channel";
 import {$t, $t_html} from "./i18n";
@@ -11,58 +12,58 @@ import * as user_group_create_members from "./user_group_create_members";
 import * as user_group_create_members_data from "./user_group_create_members_data";
 import * as user_groups from "./user_groups";
 
-let created_group_name;
+let created_group_name: string | undefined;
 
-export function reset_name() {
+export function reset_name(): void {
     created_group_name = undefined;
 }
 
-export function set_name(group_name) {
+export function set_name(group_name: string): void {
     created_group_name = group_name;
 }
 
-export function get_name() {
+export function get_name(): string | undefined {
     return created_group_name;
 }
 
 class UserGroupMembershipError {
-    report_no_members_to_user_group() {
+    report_no_members_to_user_group(): void {
         $("#user_group_membership_error").text(
             $t({defaultMessage: "You cannot create a user group with no members."}),
         );
         $("#user_group_membership_error").show();
     }
 
-    clear_errors() {
+    clear_errors(): void {
         $("#user_group_membership_error").hide();
     }
 }
 const user_group_membership_error = new UserGroupMembershipError();
 
 class UserGroupNameError {
-    report_already_exists() {
+    report_already_exists(): void {
         $("#user_group_name_error").text(
             $t({defaultMessage: "A user group with this name already exists."}),
         );
         $("#user_group_name_error").show();
     }
 
-    clear_errors() {
+    clear_errors(): void {
         $("#user_group_name_error").hide();
     }
 
-    report_empty_user_group() {
+    report_empty_user_group(): void {
         $("#user_group_name_error").text(
             $t({defaultMessage: "Choose a name for the new user group."}),
         );
         $("#user_group_name_error").show();
     }
 
-    select() {
+    select(): void {
         $("#create_user_group_name").trigger("focus").trigger("select");
     }
 
-    pre_validate(user_group_name) {
+    pre_validate(user_group_name: string): void {
         if (user_group_name && user_groups.get_user_group_from_name(user_group_name)) {
             this.report_already_exists();
             return;
@@ -71,7 +72,7 @@ class UserGroupNameError {
         this.clear_errors();
     }
 
-    validate_for_submit(user_group_name) {
+    validate_for_submit(user_group_name: string): boolean {
         if (!user_group_name) {
             this.report_empty_user_group();
             this.select();
@@ -93,7 +94,7 @@ $("body").on("click", ".settings-sticky-footer #user_group_go_to_members", (e) =
     e.preventDefault();
     e.stopPropagation();
 
-    const group_name = $("#create_user_group_name").val().trim();
+    const group_name = $<HTMLInputElement>("input#create_user_group_name").val()!.trim();
     const is_user_group_name_valid = user_group_name_error.validate_for_submit(group_name);
 
     if (is_user_group_name_valid) {
@@ -112,13 +113,13 @@ $("body").on("click", ".settings-sticky-footer #user_group_go_to_configure_setti
     );
 });
 
-function clear_error_display() {
+function clear_error_display(): void {
     user_group_name_error.clear_errors();
     $(".user_group_create_info").hide();
     user_group_membership_error.clear_errors();
 }
 
-export function show_new_user_group_modal() {
+export function show_new_user_group_modal(): void {
     $("#user-group-creation").removeClass("hide");
     $(".right .settings").hide();
 
@@ -127,10 +128,9 @@ export function show_new_user_group_modal() {
     clear_error_display();
 }
 
-function create_user_group() {
+function create_user_group(): void {
-    const data = {};
+    const group_name = $<HTMLInputElement>("input#create_user_group_name").val()!.trim();
-    const group_name = $("#create_user_group_name").val().trim();
+    const description = $<HTMLInputElement>("input#create_user_group_description").val()!.trim();
-    const description = $("#create_user_group_description").val().trim();
     set_name(group_name);
 
     // Even though we already check to make sure that while typing the user cannot enter
@@ -143,21 +143,27 @@ function create_user_group() {
         );
         return;
     }
-    data.name = group_name;
-    data.description = description;
-
     const user_ids = user_group_create_members.get_principals();
-    data.members = JSON.stringify(user_ids);
 
-    data.can_mention_group = Number.parseInt(
+    assert(settings_components.new_group_can_mention_group_widget !== null);
-        settings_components.new_group_can_mention_group_widget.value(),
+    const can_mention_group_value = settings_components.new_group_can_mention_group_widget.value();
-        10,
+    assert(can_mention_group_value !== undefined);
-    );
+    const can_mention_group =
+        typeof can_mention_group_value === "number"
+            ? can_mention_group_value
+            : Number.parseInt(can_mention_group_value, 10);
+
+    const data = {
+        name: group_name,
+        description,
+        members: JSON.stringify(user_ids),
+        can_mention_group,
+    };
     loading.make_indicator($("#user_group_creating_indicator"), {
         text: $t({defaultMessage: "Creating group..."}),
     });
 
-    channel.post({
+    void channel.post({
         url: "/json/user_groups/create",
         data,
         success() {
@@ -179,7 +185,7 @@ function create_user_group() {
     });
 }
 
-export function set_up_handlers() {
+export function set_up_handlers(): void {
     const $people_to_add_holder = $("#people_to_add_in_group").expectOne();
     user_group_create_members.create_handlers($people_to_add_holder);
 
@@ -189,7 +195,7 @@ export function set_up_handlers() {
         e.preventDefault();
         clear_error_display();
 
-        const group_name = $("#create_user_group_name").val().trim();
+        const group_name = $<HTMLInputElement>("input#create_user_group_name").val()!.trim();
         const name_ok = user_group_name_error.validate_for_submit(group_name);
 
         if (!name_ok) {
@@ -209,7 +215,7 @@ export function set_up_handlers() {
     });
 
     $container.on("input", "#create_user_group_name", () => {
-        const user_group_name = $("#create_user_group_name").val().trim();
+        const user_group_name = $<HTMLInputElement>("input#create_user_group_name").val()!.trim();
 
         // This is an inexpensive check.
         user_group_name_error.pre_validate(user_group_name);