diff --git a/tools/test-js-with-node b/tools/test-js-with-node index 83b76af276..0ddf3a82df 100755 --- a/tools/test-js-with-node +++ b/tools/test-js-with-node @@ -249,6 +249,7 @@ EXEMPT_FILES = make_set( "web/src/user_sort.js", "web/src/user_status.js", "web/src/user_status_ui.js", + "web/src/user_topic_popover.js", "web/src/user_topics.ts", "web/src/user_topics_ui.js", "web/src/views_util.js", diff --git a/web/src/popover_menus.js b/web/src/popover_menus.js index c54b3c3178..59502e0a5a 100644 --- a/web/src/popover_menus.js +++ b/web/src/popover_menus.js @@ -6,7 +6,6 @@ import $ from "jquery"; import tippy, {delegate} from "tippy.js"; import render_all_messages_sidebar_actions from "../templates/all_messages_sidebar_actions.hbs"; -import render_change_visibility_policy_popover from "../templates/change_visibility_policy_popover.hbs"; import render_compose_control_buttons_popover from "../templates/compose_control_buttons_popover.hbs"; import render_compose_select_enter_behaviour_popover from "../templates/compose_select_enter_behaviour_popover.hbs"; import render_drafts_sidebar_actions from "../templates/drafts_sidebar_action.hbs"; @@ -21,7 +20,6 @@ import * as drafts from "./drafts"; import * as giphy from "./giphy"; import * as narrow_state from "./narrow_state"; import * as overlays from "./overlays"; -import * as popover_menus_data from "./popover_menus_data"; import * as popovers from "./popovers"; import * as rows from "./rows"; import * as starred_messages from "./starred_messages"; @@ -29,7 +27,6 @@ import * as starred_messages_ui from "./starred_messages_ui"; import {parse_html} from "./ui_util"; import * as unread_ops from "./unread_ops"; import {user_settings} from "./user_settings"; -import * as user_topics from "./user_topics"; // On mobile web, opening the keyboard can trigger a resize event // (which in turn can trigger a scroll event). This will have the @@ -395,65 +392,6 @@ export function initialize() { }, }); - register_popover_menu(".change_visibility_policy", { - placement: "bottom", - popperOptions: { - modifiers: [ - { - // The placement is set to bottom, but if that placement does not fit, - // the opposite top placement will be used. - name: "flip", - options: { - fallbackPlacements: ["top", "left"], - }, - }, - ], - }, - onShow(instance) { - popover_instances.change_visibility_policy = instance; - on_show_prep(instance); - const elt = $(instance.reference).closest(".change_visibility_policy").expectOne()[0]; - const stream_id = $(elt).attr("data-stream-id"); - const topic_name = $(elt).attr("data-topic-name"); - - instance.context = - popover_menus_data.get_change_visibility_policy_popover_content_context( - Number.parseInt(stream_id, 10), - topic_name, - ); - instance.setContent( - parse_html(render_change_visibility_policy_popover(instance.context)), - ); - }, - onMount(instance) { - const $popper = $(instance.popper); - const {stream_id, topic_name} = instance.context; - - if (!stream_id) { - instance.hide(); - return; - } - - // TODO: Figure out a good way to offer feedback if this request fails. - $popper.on("click", ".visibility_policy_option", (e) => { - $(".visibility_policy_option").removeClass("selected_visibility_policy"); - $(e.currentTarget).addClass("selected_visibility_policy"); - - const visibility_policy = $(e.currentTarget).attr("data-visibility-policy"); - user_topics.set_user_topic_visibility_policy( - stream_id, - topic_name, - visibility_policy, - ); - instance.hide(); - }); - }, - onHidden(instance) { - instance.destroy(); - popover_instances.change_visibility_policy = undefined; - }, - }); - // Starred messages popover register_popover_menu(".starred-messages-sidebar-menu-icon", { ...left_sidebar_tippy_options, diff --git a/web/src/ui_init.js b/web/src/ui_init.js index 1c367807e2..f567e6f00f 100644 --- a/web/src/ui_init.js +++ b/web/src/ui_init.js @@ -132,6 +132,7 @@ import * as user_profile from "./user_profile"; import {initialize_user_settings, user_settings} from "./user_settings"; import * as user_status from "./user_status"; import * as user_status_ui from "./user_status_ui"; +import * as user_topic_popover from "./user_topic_popover"; import * as user_topics from "./user_topics"; // This is where most of our initialization takes place. @@ -528,6 +529,7 @@ export function initialize_everything() { // This populates data for scheduled messages. scheduled_messages.initialize(scheduled_messages_params); popover_menus.initialize(); + user_topic_popover.initialize(); topic_popover.initialize(); message_actions_popover.initialize(); scheduled_messages_popover.initialize(); diff --git a/web/src/user_topic_popover.js b/web/src/user_topic_popover.js new file mode 100644 index 0000000000..0f4ab3c094 --- /dev/null +++ b/web/src/user_topic_popover.js @@ -0,0 +1,69 @@ +import $ from "jquery"; + +import render_change_visibility_policy_popover from "../templates/change_visibility_policy_popover.hbs"; + +import * as popover_menus from "./popover_menus"; +import * as popover_menus_data from "./popover_menus_data"; +import {parse_html} from "./ui_util"; +import * as user_topics from "./user_topics"; + +export function initialize() { + popover_menus.register_popover_menu(".change_visibility_policy", { + placement: "bottom", + popperOptions: { + modifiers: [ + { + // The placement is set to bottom, but if that placement does not fit, + // the opposite top placement will be used. + name: "flip", + options: { + fallbackPlacements: ["top", "left"], + }, + }, + ], + }, + onShow(instance) { + popover_menus.popover_instances.change_visibility_policy = instance; + popover_menus.on_show_prep(instance); + const elt = $(instance.reference).closest(".change_visibility_policy").expectOne()[0]; + const stream_id = $(elt).attr("data-stream-id"); + const topic_name = $(elt).attr("data-topic-name"); + + instance.context = + popover_menus_data.get_change_visibility_policy_popover_content_context( + Number.parseInt(stream_id, 10), + topic_name, + ); + instance.setContent( + parse_html(render_change_visibility_policy_popover(instance.context)), + ); + }, + onMount(instance) { + const $popper = $(instance.popper); + const {stream_id, topic_name} = instance.context; + + if (!stream_id) { + instance.hide(); + return; + } + + // TODO: Figure out a good way to offer feedback if this request fails. + $popper.on("click", ".visibility_policy_option", (e) => { + $(".visibility_policy_option").removeClass("selected_visibility_policy"); + $(e.currentTarget).addClass("selected_visibility_policy"); + + const visibility_policy = $(e.currentTarget).attr("data-visibility-policy"); + user_topics.set_user_topic_visibility_policy( + stream_id, + topic_name, + visibility_policy, + ); + instance.hide(); + }); + }, + onHidden(instance) { + instance.destroy(); + popover_menus.popover_instances.change_visibility_policy = undefined; + }, + }); +}