From 7a97ceab865b9217ec1549349ff51774aa6e5a4d Mon Sep 17 00:00:00 2001 From: Tim Abbott Date: Sun, 1 Oct 2023 12:25:13 -0700 Subject: [PATCH] popovers: Extract add_stream_options_popover.js. --- tools/test-js-with-node | 1 + web/src/add_stream_options_popover.js | 66 +++++++++++++++++++++++++++ web/src/popover_menus.js | 63 +------------------------ 3 files changed, 69 insertions(+), 61 deletions(-) create mode 100644 web/src/add_stream_options_popover.js diff --git a/tools/test-js-with-node b/tools/test-js-with-node index 2da28e4b7f..c860f8d327 100755 --- a/tools/test-js-with-node +++ b/tools/test-js-with-node @@ -46,6 +46,7 @@ EXEMPT_FILES = make_set( [ "web/shared/src/poll_data.ts", "web/src/about_zulip.js", + "web/src/add_stream_options_popover.js", "web/src/add_subscribers_pill.js", "web/src/admin.js", "web/src/alert_popup.ts", diff --git a/web/src/add_stream_options_popover.js b/web/src/add_stream_options_popover.js new file mode 100644 index 0000000000..c4c0870e64 --- /dev/null +++ b/web/src/add_stream_options_popover.js @@ -0,0 +1,66 @@ +import $ from "jquery"; + +import render_left_sidebar_stream_setting_popover from "../templates/left_sidebar_stream_setting_popover.hbs"; + +import * as popover_menus from "./popover_menus"; +import * as settings_data from "./settings_data"; +import {parse_html} from "./ui_util"; + +export function initialize() { + popover_menus.register_popover_menu("#streams_inline_icon", { + onShow(instance) { + const can_create_streams = + settings_data.user_can_create_private_streams() || + settings_data.user_can_create_public_streams() || + settings_data.user_can_create_web_public_streams(); + + if (!can_create_streams) { + // If the user can't create streams, we directly + // navigate them to the Manage streams subscribe UI. + window.location.assign("#streams/all"); + // Returning false from an onShow handler cancels the show. + return false; + } + + // Assuming that the instance can be shown, track and + // prep the instance for showing + popover_menus.popover_instances.stream_settings = instance; + instance.setContent(parse_html(render_left_sidebar_stream_setting_popover())); + popover_menus.on_show_prep(instance); + + // When showing the popover menu, we want the + // "Add streams" and the "Filter streams" tooltip + // to appear below the "Add streams" icon. + const add_streams_tooltip = $("#add_streams_tooltip").get(0); + add_streams_tooltip._tippy?.setProps({ + placement: "bottom", + }); + const filter_streams_tooltip = $("#filter_streams_tooltip").get(0); + // If `filter_streams_tooltip` is not triggered yet, this will set its initial placement. + filter_streams_tooltip.dataset.tippyPlacement = "bottom"; + filter_streams_tooltip._tippy?.setProps({ + placement: "bottom", + }); + + // The linter complains about unbalanced returns + return true; + }, + onHidden(instance) { + instance.destroy(); + popover_menus.popover_instances.stream_settings = undefined; + // After the popover menu is closed, we want the + // "Add streams" and the "Filter streams" tooltip + // to appear at it's original position that is + // above the "Add streams" icon. + const add_streams_tooltip = $("#add_streams_tooltip").get(0); + add_streams_tooltip._tippy?.setProps({ + placement: "top", + }); + const filter_streams_tooltip = $("#filter_streams_tooltip").get(0); + filter_streams_tooltip.dataset.tippyPlacement = "top"; + filter_streams_tooltip._tippy?.setProps({ + placement: "top", + }); + }, + }); +} diff --git a/web/src/popover_menus.js b/web/src/popover_menus.js index ff85a52948..964063bd94 100644 --- a/web/src/popover_menus.js +++ b/web/src/popover_menus.js @@ -13,7 +13,6 @@ import render_compose_control_buttons_popover from "../templates/compose_control import render_compose_select_enter_behaviour_popover from "../templates/compose_select_enter_behaviour_popover.hbs"; import render_delete_topic_modal from "../templates/confirm_dialog/confirm_delete_topic.hbs"; import render_drafts_sidebar_actions from "../templates/drafts_sidebar_action.hbs"; -import render_left_sidebar_stream_setting_popover from "../templates/left_sidebar_stream_setting_popover.hbs"; import render_mobile_message_buttons_popover_content from "../templates/mobile_message_buttons_popover_content.hbs"; import render_send_later_modal from "../templates/send_later_modal.hbs"; import render_send_later_popover from "../templates/send_later_popover.hbs"; @@ -45,7 +44,6 @@ import * as popovers from "./popovers"; import * as read_receipts from "./read_receipts"; import * as rows from "./rows"; import * as scheduled_messages from "./scheduled_messages"; -import * as settings_data from "./settings_data"; import * as starred_messages from "./starred_messages"; import * as starred_messages_ui from "./starred_messages_ui"; import * as stream_popover from "./stream_popover"; @@ -69,7 +67,7 @@ export function set_suppress_scroll_hide() { suppress_scroll_hide = true; } -const popover_instances = { +export const popover_instances = { compose_control_buttons: null, starred_messages: null, drafts: null, @@ -226,7 +224,7 @@ export const left_sidebar_tippy_options = { }, }; -function on_show_prep(instance) { +export function on_show_prep(instance) { $(instance.popper).on("click", (e) => { // Popover is not hidden on click inside it unless the click handler for the // element explicitly hides the popover when handling the event. @@ -456,63 +454,6 @@ export function do_schedule_message(send_at_time) { } export function initialize() { - register_popover_menu("#streams_inline_icon", { - onShow(instance) { - const can_create_streams = - settings_data.user_can_create_private_streams() || - settings_data.user_can_create_public_streams() || - settings_data.user_can_create_web_public_streams(); - - if (!can_create_streams) { - // If the user can't create streams, we directly - // navigate them to the Manage streams subscribe UI. - window.location.assign("#streams/all"); - // Returning false from an onShow handler cancels the show. - return false; - } - - // Assuming that the instance can be shown, track and - // prep the instance for showing - popover_instances.stream_settings = instance; - instance.setContent(parse_html(render_left_sidebar_stream_setting_popover())); - on_show_prep(instance); - - // When showing the popover menu, we want the - // "Add streams" and the "Filter streams" tooltip - // to appear below the "Add streams" icon. - const add_streams_tooltip = $("#add_streams_tooltip").get(0); - add_streams_tooltip._tippy?.setProps({ - placement: "bottom", - }); - const filter_streams_tooltip = $("#filter_streams_tooltip").get(0); - // If `filter_streams_tooltip` is not triggered yet, this will set its initial placement. - filter_streams_tooltip.dataset.tippyPlacement = "bottom"; - filter_streams_tooltip._tippy?.setProps({ - placement: "bottom", - }); - - // The linter complains about unbalanced returns - return true; - }, - onHidden(instance) { - instance.destroy(); - popover_instances.stream_settings = undefined; - // After the popover menu is closed, we want the - // "Add streams" and the "Filter streams" tooltip - // to appear at it's original position that is - // above the "Add streams" icon. - const add_streams_tooltip = $("#add_streams_tooltip").get(0); - add_streams_tooltip._tippy?.setProps({ - placement: "top", - }); - const filter_streams_tooltip = $("#filter_streams_tooltip").get(0); - filter_streams_tooltip.dataset.tippyPlacement = "top"; - filter_streams_tooltip._tippy?.setProps({ - placement: "top", - }); - }, - }); - // compose box buttons popover shown on mobile widths. // We want this click event to propagate and hide other popovers // that could possibly obstruct user from using this popover.