dom: Rename div to #manage_streams_container.

The old name was confusing, since the contents
of the div aren't just a table, and we have
smaller elements that actually do list a bunch
of subscriptions in tabular format.
This commit is contained in:
Steve Howell 2021-12-21 18:41:13 +00:00 committed by Tim Abbott
parent 0574d951e4
commit 7ff89e4cae
9 changed files with 40 additions and 34 deletions

View File

@ -131,7 +131,7 @@ test_ui("subscriber_pills", ({override, mock_template}) => {
override(people, "sort_but_pin_current_user_on_top", noop);
const subscriptions_table_selector = "#subscriptions_table";
const subscriptions_table_selector = "#manage_streams_container";
const input_field_stub = $.create(".input");
input_field_stub.before = () => {};

View File

@ -100,7 +100,7 @@ run_test("redraw_left_panel", ({mock_template}) => {
$(sub_row).detach = () => sub_row;
}
$.create("#subscriptions_table .stream-row", {children: sub_stubs});
$.create("#manage_streams_container .stream-row", {children: sub_stubs});
let ui_called = false;
ui.reset_scrollbar = (elem) => {

View File

@ -53,7 +53,7 @@ async function navigate_to_subscriptions(page: Page): Promise<void> {
await page.click(manage_streams_selector);
await page.waitForSelector("#subscription_overlay", {visible: true});
await page.waitForSelector("#subscriptions_table", {visible: true});
await page.waitForSelector("#manage_streams_container", {visible: true});
await page.click("#subscription_overlay .exit");
// Wait until the overlay is completely closed.

View File

@ -468,7 +468,7 @@ export function initialize() {
stream_settings_ui.sub_or_unsub(sub);
});
$("#subscriptions_table").on("click", ".change-stream-privacy", (e) => {
$("#manage_streams_container").on("click", ".change-stream-privacy", (e) => {
const stream_id = get_stream_id(e.target);
const stream = sub_store.get(stream_id);
@ -518,7 +518,7 @@ export function initialize() {
e.stopPropagation();
});
$("#subscriptions_table").on("click", "#open_stream_info_modal", (e) => {
$("#manage_streams_container").on("click", "#open_stream_info_modal", (e) => {
e.preventDefault();
e.stopPropagation();
const stream_id = get_stream_id(e.target);
@ -544,7 +544,7 @@ export function initialize() {
});
});
$("#subscriptions_table").on("keypress", "#change_stream_description", (e) => {
$("#manage_streams_container").on("keypress", "#change_stream_description", (e) => {
// Stream descriptions can not be multiline, so disable enter key
// to prevent new line
if (e.key === "Enter") {
@ -578,7 +578,7 @@ export function initialize() {
settings_ui.do_settings_change(channel.patch, url, data, status_element);
}
$("#subscriptions_table").on(
$("#manage_streams_container").on(
"click",
".close-modal-btn, .close-change-stream-info-modal",
(e) => {
@ -588,13 +588,13 @@ export function initialize() {
},
);
$("#subscriptions_table").on(
$("#manage_streams_container").on(
"change",
"#sub_is_muted_setting .sub_setting_control",
stream_is_muted_changed,
);
$("#subscriptions_table").on(
$("#manage_streams_container").on(
"change",
".sub_setting_checkbox .sub_setting_control",
stream_setting_changed,
@ -602,11 +602,13 @@ export function initialize() {
// This handler isn't part of the normal edit interface; it's the convenient
// checkmark in the subscriber list.
$("#subscriptions_table").on("click", ".sub_unsub_button", (e) => {
$("#manage_streams_container").on("click", ".sub_unsub_button", (e) => {
const sub = get_sub_for_target(e.target);
// Makes sure we take the correct stream_row.
const stream_row = $(
`#subscriptions_table div.stream-row[data-stream-id='${CSS.escape(sub.stream_id)}']`,
`#manage_streams_container div.stream-row[data-stream-id='${CSS.escape(
sub.stream_id,
)}']`,
);
stream_settings_ui.sub_or_unsub(sub, stream_row);
@ -619,7 +621,7 @@ export function initialize() {
e.stopPropagation();
});
$("#subscriptions_table").on("click", ".deactivate", (e) => {
$("#manage_streams_container").on("click", ".deactivate", (e) => {
e.preventDefault();
e.stopPropagation();
@ -663,7 +665,7 @@ export function initialize() {
$(".dialog_submit_button").attr("data-stream-id", stream_id);
});
$("#subscriptions_table").on("click", ".stream-row", function (e) {
$("#manage_streams_container").on("click", ".stream-row", function (e) {
if ($(e.target).closest(".check, .subscription_settings").length === 0) {
open_edit_panel_for_row(this);
}

View File

@ -408,7 +408,7 @@ export function render_left_panel_superset() {
return render_browse_streams_list(template_data);
});
ui.get_content_element($("#subscriptions_table .streams-list")).html(html);
ui.get_content_element($("#manage_streams_container .streams-list")).html(html);
}
// LeftPanelParams { input: String, subscribed_only: Boolean, sort_order: String }
@ -425,7 +425,7 @@ export function redraw_left_panel(left_panel_params = get_left_panel_params()) {
const stream_ids = [];
for (const row of $("#subscriptions_table .stream-row")) {
for (const row of $("#manage_streams_container .stream-row")) {
const stream_id = stream_id_for_row(row);
stream_ids.push(stream_id);
}
@ -440,7 +440,7 @@ export function redraw_left_panel(left_panel_params = get_left_panel_params()) {
hidden_ids.add(stream_id);
}
for (const row of $("#subscriptions_table .stream-row")) {
for (const row of $("#manage_streams_container .stream-row")) {
const stream_id = stream_id_for_row(row);
// Below code goes away if we don't do sort-DOM-in-place.
@ -458,7 +458,7 @@ export function redraw_left_panel(left_panel_params = get_left_panel_params()) {
const all_stream_ids = [...buckets.name, ...buckets.desc, ...buckets.other];
for (const stream_id of all_stream_ids) {
ui.get_content_element($("#subscriptions_table .streams-list")).append(
ui.get_content_element($("#manage_streams_container .streams-list")).append(
widgets.get(stream_id),
);
}
@ -565,7 +565,7 @@ export function setup_page(callback) {
switch_stream_sort(key);
},
});
$("#subscriptions_table .search-container").prepend(sort_toggler.get());
$("#manage_streams_container .search-container").prepend(sort_toggler.get());
// place subs tooltips at bottom
tippy(".tippy-bottom", {
@ -588,7 +588,7 @@ export function setup_page(callback) {
if (should_list_all_streams()) {
const toggler_elem = toggler.get();
$("#subscriptions_table .search-container").prepend(toggler_elem);
$("#manage_streams_container .search-container").prepend(toggler_elem);
}
if (page_params.is_guest) {
toggler.disable_tab("all-streams");
@ -599,7 +599,7 @@ export function setup_page(callback) {
}
function populate_and_fill() {
$("#subscriptions_table").empty();
$("#manage_streams_container").empty();
// TODO: Ideally we'd indicate in some way what stream types
// the user can create, by showing other options as disabled.
@ -626,7 +626,7 @@ export function setup_page(callback) {
};
const rendered = render_stream_settings_overlay(template_data);
$("#subscriptions_table").append(rendered);
$("#manage_streams_container").append(rendered);
render_left_panel_superset();
initialize_components();
@ -958,7 +958,7 @@ export function unsubscribe_from_private_stream(sub) {
let stream_row;
if (overlays.streams_open()) {
stream_row = $(
"#subscriptions_table div.stream-row[data-stream-id='" + sub.stream_id + "']",
"#manage_streams_container div.stream-row[data-stream-id='" + sub.stream_id + "']",
);
}
@ -1081,7 +1081,7 @@ export function update_stream_privacy_choices(policy) {
}
export function initialize() {
$("#subscriptions_table").on("click", ".create_stream_button", (e) => {
$("#manage_streams_container").on("click", ".create_stream_button", (e) => {
e.preventDefault();
open_create_stream();
});
@ -1096,13 +1096,17 @@ export function initialize() {
}
});
$("#subscriptions_table").on("click", ".email-address", function () {
$("#manage_streams_container").on("click", ".email-address", function () {
selectText(this);
});
$("#subscriptions_table").on("click", ".stream-row, .create_stream_button", show_right_section);
$("#manage_streams_container").on(
"click",
".stream-row, .create_stream_button",
show_right_section,
);
$("#subscriptions_table").on("click", ".fa-chevron-left", () => {
$("#manage_streams_container").on("click", ".fa-chevron-left", () => {
$(".right").removeClass("show");
$(".subscriptions-header").removeClass("slide-left");
});
@ -1110,7 +1114,7 @@ export function initialize() {
{
const sel = ".search-container, .streams-list, .subscriptions-header";
$("#subscriptions_table").on("click", sel, (e) => {
$("#manage_streams_container").on("click", sel, (e) => {
if ($(e.target).is(sel)) {
stream_edit.open_edit_panel_empty();
}

View File

@ -364,7 +364,7 @@ function update_subscribers_list_widget(subscriber_ids) {
}
export function initialize() {
$("#subscriptions_table").on(
$("#manage_streams_container").on(
"keyup",
".edit_subscribers_for_stream .subscriber_list_add form",
(e) => {
@ -375,7 +375,7 @@ export function initialize() {
},
);
$("#subscriptions_table").on(
$("#manage_streams_container").on(
"submit",
".edit_subscribers_for_stream .subscriber_list_add form",
(e) => {
@ -384,7 +384,7 @@ export function initialize() {
},
);
$("#subscriptions_table").on(
$("#manage_streams_container").on(
"submit",
".edit_subscribers_for_stream .subscriber_list_remove form",
(e) => {

View File

@ -124,7 +124,7 @@ export function update_change_stream_privacy_settings(sub) {
export function update_notification_setting_checkbox(notification_name) {
// This is in the right panel (Personal settings).
const stream_row = $("#subscriptions_table .stream-row.active");
const stream_row = $("#manage_streams_container .stream-row.active");
if (!stream_row.length) {
return;
}

View File

@ -316,11 +316,11 @@ export function initialize_kitchen_sink_stuff() {
$(this).removeClass("fa fa-play");
});
$("#subscriptions_table").on("mouseover", ".subscription_header", function () {
$("#manage_streams_container").on("mouseover", ".subscription_header", function () {
$(this).addClass("active");
});
$("#subscriptions_table").on("mouseout", ".subscription_header", function () {
$("#manage_streams_container").on("mouseout", ".subscription_header", function () {
$(this).removeClass("active");
});

View File

@ -76,7 +76,7 @@
</div>
<div class="subscriptions">
<div id="subscriptions_table">
<div id="manage_streams_container">
</div>
</div>
<div id="drafts_table"></div>