js: Convert static/js/ui.js to ES6 module.

Signed-off-by: Anders Kaseorg <anders@zulip.com>

.eslintrc.json

@@ -145,7 +145,6 @@
                 "realm_night_logo": false,
                 "settings_profile_fields": false,
                 "StripeCheckout": false,
-                "ui": false,
                 "ui_init": false,
                 "zxcvbn": false
             }

frontend_tests/node_tests/activity.js

@@ -28,6 +28,7 @@ const _document = {
 const channel = {__esModule: true};
 
 const _ui = {
+    __esModule: true,
     get_content_element: (element) => element,
 };
 
@@ -81,7 +82,7 @@ rewiremock("../../static/js/popovers").with(_popovers);
 rewiremock("../../static/js/resize").with(_resize);
 rewiremock("../../static/js/scroll_util").with(_scroll_util);
 rewiremock("../../static/js/stream_popover").with(_stream_popover);
-set_global("ui", _ui);
+rewiremock("../../static/js/ui").with(_ui);
 rewiremock("../../static/js/server_events").with({
     check_for_unsuspend() {},
 });

frontend_tests/node_tests/buddy_list.js

@@ -21,7 +21,6 @@ rewiremock.enable();
 
 const people = zrequire("people");
 const {buddy_list} = zrequire("buddy_list");
-zrequire("ui");
 
 function init_simulated_scrolling() {
     const elem = {

frontend_tests/node_tests/dispatch.js

@@ -92,7 +92,8 @@ const submessage = {__esModule: true};
 rewiremock("../../static/js/submessage").with(submessage);
 const typing_events = {__esModule: true};
 rewiremock("../../static/js/typing_events").with(typing_events);
-const ui = set_global("ui", {});
+const ui = {__esModule: true};
+rewiremock("../../static/js/ui").with(ui);
 const unread_ops = {__esModule: true};
 rewiremock("../../static/js/unread_ops").with(unread_ops);
 const user_events = {__esModule: true};

frontend_tests/node_tests/echo.js

@@ -20,7 +20,7 @@ MockDate.set(new Date(fake_now * 1000));
 let disparities = [];
 let messages_to_rerender = [];
 
-set_global("ui", {
+rewiremock("../../static/js/ui").with({
     show_failed_message_success: () => {},
 });
 

frontend_tests/node_tests/list_widget.js

@@ -2,6 +2,8 @@
 
 const {strict: assert} = require("assert");
 
+const rewiremock = require("rewiremock/node");
+
 const {set_global, zrequire} = require("../zjsunit/namespace");
 const {run_test} = require("../zjsunit/test");
 
@@ -14,7 +16,9 @@ function Element() {
     return {};
 }
 set_global("Element", Element);
-const ui = set_global("ui", {});
+const ui = {__esModule: true};
+
+rewiremock("../../static/js/ui").with(ui);
 
 // We only need very simple jQuery wrappers for when the
 // "real" code wraps html or sets up click handlers.
@@ -32,6 +36,8 @@ set_global("$", (arg) => {
     };
 });
 
+rewiremock.enable();
+
 const ListWidget = zrequire("list_widget");
 
 // We build objects here that simulate jQuery containers.
@@ -774,3 +780,4 @@ run_test("render item", () => {
     widget_3.render_item(item);
     blueslip.reset();
 });
+rewiremock.disable();

frontend_tests/node_tests/message_flags.js

@@ -16,7 +16,8 @@ rewiremock.enable();
 
 const message_flags = zrequire("message_flags");
 
-const ui = set_global("ui", {});
+const ui = {__esModule: true};
+rewiremock("../../static/js/ui").with(ui);
 const channel = {__esModule: true};
 
 rewiremock("../../static/js/channel").with(channel);

frontend_tests/node_tests/pm_list.js

@@ -4,13 +4,13 @@ const {strict: assert} = require("assert");
 
 const rewiremock = require("rewiremock/node");
 
-const {set_global, with_field, zrequire} = require("../zjsunit/namespace");
+const {with_field, zrequire} = require("../zjsunit/namespace");
 const {run_test} = require("../zjsunit/test");
 const $ = require("../zjsunit/zjquery");
 
 const narrow_state = {__esModule: true};
 rewiremock("../../static/js/narrow_state").with(narrow_state);
-set_global("ui", {
+rewiremock("../../static/js/ui").with({
     get_content_element: (element) => element,
 });
 rewiremock("../../static/js/stream_popover").with({

frontend_tests/node_tests/scroll_util.js

@@ -2,13 +2,17 @@
 
 const {strict: assert} = require("assert");
 
-const {set_global, zrequire} = require("../zjsunit/namespace");
+const rewiremock = require("rewiremock/node");
+
+const {zrequire} = require("../zjsunit/namespace");
 const {run_test} = require("../zjsunit/test");
 
-set_global("ui", {
+rewiremock("../../static/js/ui").with({
     get_scroll_element: (element) => element,
 });
 
+rewiremock.enable();
+
 const scroll_util = zrequire("scroll_util");
 
 run_test("scroll_delta", () => {
@@ -121,3 +125,4 @@ run_test("scroll_element_into_container", () => {
     scroll_util.scroll_element_into_container(elem2, container);
     assert.equal(container.scrollTop(), 250 - 100 + 3 + 15);
 });
+rewiremock.disable();

frontend_tests/node_tests/stream_edit.js

@@ -29,9 +29,12 @@ rewiremock("../../static/js/stream_color").with({
 });
 const typeahead_helper = {__esModule: true};
 rewiremock("../../static/js/typeahead_helper").with(typeahead_helper);
-const ui = set_global("ui", {
+const ui = {
+    __esModule: true,
     get_scroll_element: noop,
-});
+};
+
+rewiremock("../../static/js/ui").with(ui);
 
 rewiremock.enable();
 

frontend_tests/node_tests/stream_list.js

@@ -34,7 +34,7 @@ const unread = zrequire("unread");
 const stream_data = zrequire("stream_data");
 const scroll_util = zrequire("scroll_util");
 const stream_list = zrequire("stream_list");
-set_global("ui", {get_scroll_element: (element) => element});
+rewiremock("../../static/js/ui").with({get_scroll_element: (element) => element});
 
 stream_color.initialize();
 

frontend_tests/node_tests/subs.js

@@ -9,10 +9,12 @@ const {set_global, zrequire} = require("../zjsunit/namespace");
 const {run_test} = require("../zjsunit/test");
 const $ = require("../zjsunit/zjquery");
 
-const ui = set_global("ui", {
+const ui = {
+    __esModule: true,
     get_content_element: (element) => element,
     get_scroll_element: (element) => element,
-});
+};
+rewiremock("../../static/js/ui").with(ui);
 set_global("page_params", {});
 
 const denmark_stream_id = 101;

frontend_tests/node_tests/ui_init.js

@@ -96,7 +96,11 @@ rewiremock("../../static/js/settings_panel_menu").with({initialize() {}});
 rewiremock("../../static/js/settings_toggle").with({initialize() {}});
 rewiremock("../../static/js/subs").with({initialize() {}});
 rewiremock("../../static/js/timerender").with({initialize() {}});
-const ui = set_global("ui", {initialize() {}});
+const ui = {
+    __esModule: true,
+    initialize() {},
+};
+rewiremock("../../static/js/ui").with(ui);
 rewiremock("../../static/js/unread_ui").with({initialize() {}});
 
 server_events.home_view_loaded = () => true;

static/js/attachments_ui.js

@@ -5,6 +5,7 @@ import * as channel from "./channel";
 import * as ListWidget from "./list_widget";
 import * as loading from "./loading";
 import * as timerender from "./timerender";
+import * as ui from "./ui";
 import * as ui_report from "./ui_report";
 
 let attachments;

static/js/buddy_list.js

@@ -4,6 +4,7 @@ import render_user_presence_rows from "../templates/user_presence_rows.hbs";
 import * as buddy_data from "./buddy_data";
 import * as message_viewport from "./message_viewport";
 import * as padded_widget from "./padded_widget";
+import * as ui from "./ui";
 
 class BuddyListConf {
     container_sel = "#user_presences";

static/js/bundles/app.js

@@ -18,7 +18,6 @@ import "../fold_dict";
 import "../setup";
 import "../message_list";
 import "../reload";
-import "../ui";
 import "../composebox_typeahead";
 import "../hotkey";
 import "../notifications";

static/js/echo.js

@@ -15,6 +15,7 @@ import * as sent_messages from "./sent_messages";
 import * as stream_list from "./stream_list";
 import * as stream_topic_history from "./stream_topic_history";
 import * as transmit from "./transmit";
+import * as ui from "./ui";
 import * as util from "./util";
 
 // Docs: https://zulip.readthedocs.io/en/latest/subsystems/sending-messages.html

static/js/emoji_picker.js

@@ -11,6 +11,7 @@ import * as message_store from "./message_store";
 import * as popovers from "./popovers";
 import * as reactions from "./reactions";
 import * as rows from "./rows";
+import * as ui from "./ui";
 
 // Emoji picker is of fixed width and height. Update these
 // whenever these values are changed in `reactions.css`.

static/js/global.d.ts

@@ -15,7 +15,6 @@ declare let message_events: any;
 declare let page_params: any;
 declare let pointer: any;
 declare let settings_profile_fields: any;
-declare let ui: any;
 declare let zulip_test: any;
 
 interface JQuery {

static/js/hotkey.js

@@ -30,6 +30,7 @@ import * as stream_list from "./stream_list";
 import * as stream_popover from "./stream_popover";
 import * as subs from "./subs";
 import * as topic_zoom from "./topic_zoom";
+import * as ui from "./ui";
 
 function do_narrow_action(action) {
     action(current_msg_list.selected_id(), {trigger: "hotkey"});

static/js/info_overlay.js

@@ -4,6 +4,7 @@ import * as hashchange from "./hashchange";
 import * as keydown_util from "./keydown_util";
 import * as overlays from "./overlays";
 import * as popovers from "./popovers";
+import * as ui from "./ui";
 
 // Make it explicit that our toggler is undefined until
 // set_up_toggler is called.

static/js/invite.js

@@ -11,6 +11,7 @@ import * as common from "./common";
 import * as hashchange from "./hashchange";
 import * as overlays from "./overlays";
 import * as stream_data from "./stream_data";
+import * as ui from "./ui";
 import * as ui_report from "./ui_report";
 
 function reset_error_messages() {

static/js/list_widget.js

@@ -1,3 +1,5 @@
+import * as ui from "./ui";
+
 const DEFAULTS = {
     INITIAL_RENDER_COUNT: 80,
     LOAD_COUNT: 20,

static/js/message_flags.js

@@ -3,6 +3,7 @@ import _ from "lodash";
 import * as channel from "./channel";
 import * as message_store from "./message_store";
 import * as starred_messages from "./starred_messages";
+import * as ui from "./ui";
 import * as unread_ops from "./unread_ops";
 
 function send_flag_update(message, flag, op) {

static/js/muting_ui.js

@@ -11,6 +11,7 @@ import * as settings_muting from "./settings_muting";
 import * as stream_data from "./stream_data";
 import * as stream_list from "./stream_list";
 import * as stream_popover from "./stream_popover";
+import * as ui from "./ui";
 import * as unread_ui from "./unread_ui";
 
 function timestamp_ms() {

static/js/notifications.js

@@ -16,6 +16,7 @@ import * as settings_config from "./settings_config";
 import * as spoilers from "./spoilers";
 import * as stream_data from "./stream_data";
 import * as stream_ui_updates from "./stream_ui_updates";
+import * as ui from "./ui";
 import * as unread from "./unread";
 import * as unread_ops from "./unread_ops";
 

static/js/pm_list.js

@@ -5,6 +5,7 @@ import * as people from "./people";
 import * as pm_conversations from "./pm_conversations";
 import * as pm_list_dom from "./pm_list_dom";
 import * as stream_popover from "./stream_popover";
+import * as ui from "./ui";
 import * as unread from "./unread";
 import * as unread_ui from "./unread_ui";
 import * as vdom from "./vdom";

static/js/resize.js

@@ -5,6 +5,7 @@ import * as message_viewport from "./message_viewport";
 import * as navigate from "./navigate";
 import * as panels from "./panels";
 import * as popovers from "./popovers";
+import * as ui from "./ui";
 import * as util from "./util";
 
 let narrow_window = false;

static/js/scroll_util.js

@@ -1,3 +1,5 @@
+import * as ui from "./ui";
+
 export function scroll_delta(opts) {
     const elem_top = opts.elem_top;
     const container_height = opts.container_height;

static/js/settings_emoji.js

@@ -6,6 +6,7 @@ import * as channel from "./channel";
 import * as ListWidget from "./list_widget";
 import * as loading from "./loading";
 import * as people from "./people";
+import * as ui from "./ui";
 import * as ui_report from "./ui_report";
 import * as upload_widget from "./upload_widget";
 

static/js/settings_exports.js

@@ -5,6 +5,7 @@ import * as ListWidget from "./list_widget";
 import * as loading from "./loading";
 import * as people from "./people";
 import * as timerender from "./timerender";
+import * as ui from "./ui";
 import * as ui_report from "./ui_report";
 
 const meta = {

static/js/settings_linkifiers.js

@@ -3,6 +3,7 @@ import render_admin_filter_list from "../templates/admin_filter_list.hbs";
 import * as channel from "./channel";
 import * as ListWidget from "./list_widget";
 import * as loading from "./loading";
+import * as ui from "./ui";
 import * as ui_report from "./ui_report";
 
 const meta = {

static/js/settings_panel_menu.js

@@ -3,6 +3,7 @@ import * as keydown_util from "./keydown_util";
 import * as popovers from "./popovers";
 import * as settings from "./settings";
 import * as settings_sections from "./settings_sections";
+import * as ui from "./ui";
 
 export let normal_settings;
 export let org_settings;

static/js/settings_streams.js

@@ -5,6 +5,7 @@ import * as ListWidget from "./list_widget";
 import * as loading from "./loading";
 import * as stream_data from "./stream_data";
 import * as typeahead_helper from "./typeahead_helper";
+import * as ui from "./ui";
 import * as ui_report from "./ui_report";
 
 const meta = {

static/js/settings_users.js

@@ -16,6 +16,7 @@ import * as settings_data from "./settings_data";
 import * as settings_panel_menu from "./settings_panel_menu";
 import * as settings_ui from "./settings_ui";
 import * as timerender from "./timerender";
+import * as ui from "./ui";
 import * as ui_report from "./ui_report";
 import * as user_pill from "./user_pill";
 

static/js/stream_edit.js

@@ -22,6 +22,7 @@ import * as stream_data from "./stream_data";
 import * as stream_pill from "./stream_pill";
 import * as stream_ui_updates from "./stream_ui_updates";
 import * as subs from "./subs";
+import * as ui from "./ui";
 import * as ui_report from "./ui_report";
 import * as user_pill from "./user_pill";
 import * as util from "./util";

static/js/stream_list.js

@@ -17,6 +17,7 @@ import * as stream_popover from "./stream_popover";
 import * as stream_sort from "./stream_sort";
 import * as topic_list from "./topic_list";
 import * as topic_zoom from "./topic_zoom";
+import * as ui from "./ui";
 import * as unread from "./unread";
 
 export let stream_cursor;

static/js/subs.js

@@ -24,6 +24,7 @@ import * as stream_list from "./stream_list";
 import * as stream_muting from "./stream_muting";
 import * as stream_ui_updates from "./stream_ui_updates";
 import * as typeahead_helper from "./typeahead_helper";
+import * as ui from "./ui";
 import * as ui_report from "./ui_report";
 import * as util from "./util";
 

static/js/topic_list.js

@@ -9,6 +9,7 @@ import * as stream_data from "./stream_data";
 import * as stream_popover from "./stream_popover";
 import * as stream_topic_history from "./stream_topic_history";
 import * as topic_list_data from "./topic_list_data";
+import * as ui from "./ui";
 import * as vdom from "./vdom";
 
 /*

static/js/ui.js

@@ -1,32 +1,30 @@
-"use strict";
+import SimpleBar from "simplebar/dist/simplebar";
 
-const SimpleBar = require("simplebar/dist/simplebar");
-
-const common = require("./common");
-const {localstorage} = require("./localstorage");
-const message_list = require("./message_list");
+import * as common from "./common";
+import {localstorage} from "./localstorage";
+import * as message_list from "./message_list";
 
 // What, if anything, obscures the home tab?
 
-exports.replace_emoji_with_text = function (element) {
+export function replace_emoji_with_text(element) {
     element.find(".emoji").replaceWith(function () {
         if ($(this).is("img")) {
             return $(this).attr("alt");
         }
         return $(this).text();
     });
-};
+}
 
-exports.get_content_element = function (element_selector) {
+export function get_content_element(element_selector) {
     const element = element_selector.expectOne()[0];
     const sb = SimpleBar.instances.get(element);
     if (sb) {
         return $(sb.getContentElement());
     }
     return element_selector;
-};
+}
 
-exports.get_scroll_element = function (element_selector) {
+export function get_scroll_element(element_selector) {
     const element = element_selector.expectOne()[0];
     const sb = SimpleBar.instances.get(element);
     if (sb) {
@@ -37,9 +35,9 @@ exports.get_scroll_element = function (element_selector) {
         return $(new SimpleBar(element).getScrollElement());
     }
     return element_selector;
-};
+}
 
-exports.reset_scrollbar = function (element_selector) {
+export function reset_scrollbar(element_selector) {
     const element = element_selector.expectOne()[0];
     const sb = SimpleBar.instances.get(element);
     if (sb) {
@@ -47,7 +45,7 @@ exports.reset_scrollbar = function (element_selector) {
     } else {
         element.scrollTop = 0;
     }
-};
+}
 
 function update_message_in_all_views(message_id, callback) {
     for (const list of [message_list.all, home_msg_list, message_list.narrowed]) {
@@ -64,7 +62,7 @@ function update_message_in_all_views(message_id, callback) {
     }
 }
 
-exports.update_starred_view = function (message_id, new_value) {
+export function update_starred_view(message_id, new_value) {
     const starred = new_value;
 
     // Avoid a full re-render, but update the star in each message
@@ -85,40 +83,41 @@ exports.update_starred_view = function (message_id, new_value) {
             i18n.t("__starred_status__ this message (Ctrl + s)", {starred_status: title_state}),
         );
     });
-};
+}
 
-exports.show_message_failed = function (message_id, failed_msg) {
+export function show_message_failed(message_id, failed_msg) {
     // Failed to send message, so display inline retry/cancel
     update_message_in_all_views(message_id, (row) => {
         const failed_div = row.find(".message_failed");
         failed_div.toggleClass("notvisible", false);
         failed_div.find(".failed_text").attr("title", failed_msg);
     });
-};
+}
 
-exports.show_failed_message_success = function (message_id) {
+export function show_failed_message_success(message_id) {
     // Previously failed message succeeded
     update_message_in_all_views(message_id, (row) => {
         row.find(".message_failed").toggleClass("notvisible", true);
     });
-};
+}
 
-exports.get_hotkey_deprecation_notice = function (originalHotkey, replacementHotkey) {
+export function get_hotkey_deprecation_notice(originalHotkey, replacementHotkey) {
     return i18n.t(
         'We\'ve replaced the "__originalHotkey__" hotkey with "__replacementHotkey__" ' +
             "to make this common shortcut easier to trigger.",
         {originalHotkey, replacementHotkey},
     );
-};
+}
 
 let shown_deprecation_notices = [];
-exports.maybe_show_deprecation_notice = function (key) {
+
+export function maybe_show_deprecation_notice(key) {
     let message;
     const isCmdOrCtrl = common.has_mac_keyboard() ? "Cmd" : "Ctrl";
     if (key === "C") {
-        message = exports.get_hotkey_deprecation_notice("C", "x");
+        message = get_hotkey_deprecation_notice("C", "x");
     } else if (key === "*") {
-        message = exports.get_hotkey_deprecation_notice("*", isCmdOrCtrl + " + s");
+        message = get_hotkey_deprecation_notice("*", isCmdOrCtrl + " + s");
     } else {
         blueslip.error("Unexpected deprecation notice for hotkey:", key);
         return;
@@ -147,13 +146,13 @@ exports.maybe_show_deprecation_notice = function (key) {
             );
         }
     }
-};
+}
 
 // Save the compose content cursor position and restore when we
 // shift-tab back in (see hotkey.js).
 let saved_compose_cursor = 0;
 
-exports.set_compose_textarea_handlers = function () {
+export function set_compose_textarea_handlers() {
     $("#compose-textarea").on("blur", function () {
         saved_compose_cursor = $(this).caret();
     });
@@ -163,14 +162,12 @@ exports.set_compose_textarea_handlers = function () {
     $("body").on(animationEnd, ".fade-in-message", function () {
         $(this).removeClass("fade-in-message");
     });
-};
+}
 
-exports.restore_compose_cursor = function () {
+export function restore_compose_cursor() {
     $("#compose-textarea").trigger("focus").caret(saved_compose_cursor);
-};
+}
 
-exports.initialize = function () {
-    exports.set_compose_textarea_handlers();
-};
-
-window.ui = exports;
+export function initialize() {
+    set_compose_textarea_handlers();
+}

static/js/ui_init.js

@@ -63,6 +63,7 @@ import * as topic_list from "./topic_list";
 import * as topic_zoom from "./topic_zoom";
 import * as tutorial from "./tutorial";
 import * as typing from "./typing";
+import * as ui from "./ui";
 import * as ui_util from "./ui_util";
 import * as unread from "./unread";
 import * as unread_ui from "./unread_ui";