stream settings: Include section for right panel in the URL.

Fixes #21017.
This commit is contained in:
evykassirer
2023-11-09 11:28:32 -08:00
committed by Tim Abbott
parent 87e824d43e
commit aa9d69c728
9 changed files with 72 additions and 26 deletions

View File

@@ -15,6 +15,18 @@ export function get_hash_section(hash?: string): string {
return parts[1] || "";
}
export function get_current_nth_hash_section(n: number): string {
const hash = window.location.hash;
// given "#settings/profile" and n=2, returns "profile"
// given '#streams/5/social" and n=3, returns "social"
const parts = hash.replace(/\/$/, "").split(/\//);
if (parts.length < n) {
return "";
}
return parts[n - 1] || "";
}
export function get_current_hash_category(): string {
return get_hash_category(window.location.hash);
}

View File

@@ -140,9 +140,10 @@ export function by_conversation_and_time_url(message: Message): string {
return absolute_url + people.pm_perma_link(message) + suffix;
}
export function stream_edit_url(sub: StreamSubscription): string {
const hash = `#streams/${sub.stream_id}/${internal_url.encodeHashComponent(sub.name)}`;
return hash;
export function stream_edit_url(sub: StreamSubscription, right_side_tab: string): string {
return `#streams/${sub.stream_id}/${internal_url.encodeHashComponent(
sub.name,
)}/${right_side_tab}`;
}
export function group_edit_url(group: UserGroup): string {

View File

@@ -247,7 +247,9 @@ function do_hashchange_overlay(old_hash) {
// the new overlay.
if (coming_from_overlay && base === old_base) {
if (base === "streams") {
stream_settings_ui.change_state(section);
// e.g. #streams/29/social/subscribers
const right_side_tab = hash_parser.get_current_nth_hash_section(4);
stream_settings_ui.change_state(section, right_side_tab);
return;
}
@@ -312,7 +314,9 @@ function do_hashchange_overlay(old_hash) {
}
if (base === "streams") {
stream_settings_ui.launch(section);
// e.g. #streams/29/social/subscribers
const right_side_tab = hash_parser.get_current_nth_hash_section(4);
stream_settings_ui.launch(section, right_side_tab);
return;
}

View File

@@ -15,7 +15,6 @@ import * as confirm_dialog from "./confirm_dialog";
import {show_copied_confirmation} from "./copied_tooltip";
import * as dialog_widget from "./dialog_widget";
import * as dropdown_widget from "./dropdown_widget";
import * as hash_util from "./hash_util";
import {$t, $t_html} from "./i18n";
import * as keydown_util from "./keydown_util";
import * as narrow_state from "./narrow_state";
@@ -39,11 +38,6 @@ import * as user_groups from "./user_groups";
import {user_settings} from "./user_settings";
import * as util from "./util";
function setup_subscriptions_stream_hash(sub) {
const hash = hash_util.stream_edit_url(sub);
browser_history.update(hash);
}
export function setup_subscriptions_tab_hash(tab_key_value) {
if ($("#subscription_overlay .right").hasClass("show")) {
return;
@@ -90,13 +84,13 @@ function get_sub_for_target(target) {
return sub;
}
export function open_edit_panel_for_row(stream_row) {
export function open_edit_panel_for_row(stream_row, right_side_tab) {
const sub = get_sub_for_target(stream_row);
$(".stream-row.active").removeClass("active");
stream_settings_components.show_subs_pane.settings(sub);
$(stream_row).addClass("active");
setup_subscriptions_stream_hash(sub);
stream_edit_toggler.setup_subscriptions_stream_hash(sub, right_side_tab);
setup_stream_settings(stream_row);
}
@@ -570,7 +564,7 @@ export function initialize() {
stream_settings_components.sub_or_unsub(sub, $stream_row);
if (!sub.subscribed) {
open_edit_panel_for_row($stream_row);
open_edit_panel_for_row($stream_row, stream_edit_toggler.select_tab);
}
stream_ui_updates.update_regular_sub_settings(sub);
@@ -638,7 +632,7 @@ export function initialize() {
$("#streams_overlay_container").on("click", ".stream-row", function (e) {
if ($(e.target).closest(".check, .subscription_settings").length === 0) {
open_edit_panel_for_row(this);
open_edit_panel_for_row(this, stream_edit_toggler.select_tab);
}
});

View File

@@ -1,11 +1,23 @@
import $ from "jquery";
import * as browser_history from "./browser_history";
import * as components from "./components";
import * as hash_util from "./hash_util";
import {$t} from "./i18n";
import * as sub_store from "./sub_store";
import type {StreamSubscription} from "./sub_store";
export let toggler: components.Toggle;
export let select_tab = "personal";
export function setup_subscriptions_stream_hash(
sub: StreamSubscription,
right_side_tab: string,
): void {
const hash = hash_util.stream_edit_url(sub, right_side_tab);
browser_history.update(hash);
}
export function setup_toggler(): void {
toggler = components.toggle({
child_wants_focus: true,
@@ -18,6 +30,12 @@ export function setup_toggler(): void {
$(".stream_section").hide();
$(`[data-stream-section="${CSS.escape(key)}"]`).show();
select_tab = key;
const $stream_header = $("#streams_overlay_container .stream_settings_header");
const stream_id = Number.parseInt($stream_header.attr("data-stream-id") ?? "", 10);
const sub = sub_store.get(stream_id);
if (sub) {
setup_subscriptions_stream_hash(sub, select_tab);
}
},
});
}

View File

@@ -120,7 +120,7 @@ function build_stream_popover(opts) {
const sub = stream_popover_sub(e);
hide_stream_popover();
const stream_edit_hash = hash_util.stream_edit_url(sub);
const stream_edit_hash = hash_util.stream_edit_url(sub, "general");
browser_history.go_to_location(stream_edit_hash);
});

View File

@@ -29,6 +29,7 @@ import * as stream_create from "./stream_create";
import * as stream_data from "./stream_data";
import * as stream_edit from "./stream_edit";
import * as stream_edit_subscribers from "./stream_edit_subscribers";
import * as stream_edit_toggler from "./stream_edit_toggler";
import * as stream_list from "./stream_list";
import * as stream_settings_api from "./stream_settings_api";
import * as stream_settings_components from "./stream_settings_components";
@@ -679,7 +680,7 @@ export function setup_page(callback) {
}
}
export function switch_to_stream_row(stream_id) {
export function switch_to_stream_row(stream_id, right_side_tab) {
const $stream_row = stream_ui_updates.row_for_stream_id(stream_id);
const $container = $(".streams-list");
@@ -688,7 +689,8 @@ export function switch_to_stream_row(stream_id) {
scroll_util.scroll_element_into_container($stream_row, $container);
stream_edit.open_edit_panel_for_row($stream_row);
stream_edit.open_edit_panel_for_row($stream_row, right_side_tab);
stream_edit_toggler.toggler.goto(right_side_tab);
}
function show_right_section() {
@@ -697,7 +699,7 @@ function show_right_section() {
resize.resize_stream_subscribers_list();
}
export function change_state(section) {
export function change_state(section, right_side_tab) {
// if in #streams/new form.
if (section === "new") {
if (!page_params.is_guest) {
@@ -735,7 +737,7 @@ export function change_state(section) {
toggler.goto("subscribed");
} else {
show_right_section();
switch_to_stream_row(stream_id);
switch_to_stream_row(stream_id, right_side_tab);
}
return;
}
@@ -744,7 +746,7 @@ export function change_state(section) {
toggler.goto("subscribed");
}
export function launch(section) {
export function launch(section, right_side_tab) {
setup_page(() => {
overlays.open_overlay({
name: "subscriptions",
@@ -754,7 +756,7 @@ export function launch(section) {
$(".colorpicker").spectrum("destroy");
},
});
change_state(section);
change_state(section, right_side_tab);
});
if (!stream_settings_components.get_active_data().id) {
if (section === "new") {
@@ -792,7 +794,7 @@ export function switch_rows(event) {
const row_data = get_row_data($switch_row);
if (row_data) {
const stream_id = row_data.id;
switch_to_stream_row(stream_id);
switch_to_stream_row(stream_id, "general");
} else if (event === "up_arrow" && !row_data) {
$("#search_stream_name").trigger("focus");
}

View File

@@ -183,7 +183,7 @@ function format_user_stream_list_item_html(stream, user) {
show_unsubscribe_button,
show_private_stream_unsub_tooltip,
show_last_user_in_private_stream_unsub_tooltip,
stream_edit_url: hash_util.stream_edit_url(stream),
stream_edit_url: hash_util.stream_edit_url(stream, "general"),
});
}
@@ -882,7 +882,7 @@ export function initialize() {
(people.is_my_user_id(target_user_id) ||
peer_data.get_subscriber_count(stream_id) === 1)
) {
const new_hash = hash_util.stream_edit_url(sub);
const new_hash = hash_util.stream_edit_url(sub, "general");
hide_user_profile();
browser_history.go_to_location(new_hash);
return;

View File

@@ -75,6 +75,18 @@ run_test("test_get_hash_section", () => {
assert.deepEqual(hash_parser.get_current_hash_section(), "profile");
});
run_test("get_current_nth_hash_section", () => {
window.location.hash = "#settings/profile";
assert.equal(hash_parser.get_current_nth_hash_section(1), "#settings");
assert.equal(hash_parser.get_current_nth_hash_section(2), "profile");
window.location.hash = "#settings/10/general";
assert.equal(hash_parser.get_current_nth_hash_section(1), "#settings");
assert.equal(hash_parser.get_current_nth_hash_section(2), "10");
assert.equal(hash_parser.get_current_nth_hash_section(3), "general");
assert.equal(hash_parser.get_current_nth_hash_section(4), "");
});
run_test("build_reload_url", () => {
window.location.hash = "#settings/profile";
assert.equal(hash_util.build_reload_url(), "+oldhash=settings%2Fprofile");
@@ -136,7 +148,10 @@ run_test("test_stream_edit_url", () => {
name: "research & development",
stream_id: 42,
};
assert.equal(hash_util.stream_edit_url(sub), "#streams/42/research.20.26.20development");
assert.equal(
hash_util.stream_edit_url(sub, "general"),
"#streams/42/research.20.26.20development/general",
);
});
run_test("test_by_conversation_and_time_url", () => {