diff --git a/tools/test-js-with-node b/tools/test-js-with-node
index 9c5246b6fd..2e8f7c5f31 100755
--- a/tools/test-js-with-node
+++ b/tools/test-js-with-node
@@ -267,7 +267,7 @@ EXEMPT_FILES = make_set(
         "web/src/user_card_popover.js",
         "web/src/user_deactivation_ui.ts",
         "web/src/user_events.js",
-        "web/src/user_group_components.js",
+        "web/src/user_group_components.ts",
         "web/src/user_group_create.js",
         "web/src/user_group_create_members.js",
         "web/src/user_group_create_members_data.ts",
diff --git a/web/src/user_group_components.js b/web/src/user_group_components.ts
similarity index 89%
rename from web/src/user_group_components.js
rename to web/src/user_group_components.ts
index 4dac631a6a..4f5f55e9ed 100644
--- a/web/src/user_group_components.js
+++ b/web/src/user_group_components.ts
@@ -3,13 +3,14 @@ import $ from "jquery";
 import * as dropdown_widget from "./dropdown_widget";
 import * as settings_components from "./settings_components";
 import * as user_groups from "./user_groups";
+import type {UserGroup} from "./user_groups";
 
-export function setup_permissions_dropdown(group, for_group_creation) {
-    let widget_name;
-    let default_id;
+export function setup_permissions_dropdown(group: UserGroup, for_group_creation: boolean): void {
+    let widget_name: string;
+    let default_id: number;
     if (for_group_creation) {
         widget_name = "new_group_can_mention_group";
-        default_id = user_groups.get_user_group_from_name("role:everyone").id;
+        default_id = user_groups.get_user_group_from_name("role:everyone")!.id;
     } else {
         widget_name = "can_mention_group";
         default_id = group.can_mention_group;