user_groups: Use group picker for can_mention_group.

This commit is contained in:
Shubham Padia 2024-10-16 04:59:07 +00:00 committed by Tim Abbott
parent 05a6d7f870
commit 8055617900
8 changed files with 35 additions and 115 deletions

View File

@ -489,8 +489,6 @@ function get_field_data_input_value($input_elem: JQuery): string | undefined {
return JSON.stringify(proposed_value);
}
export let new_group_can_mention_group_widget: DropdownWidget | null = null;
const dropdown_widget_map = new Map<string, DropdownWidget | null>([
["realm_new_stream_announcements_stream_id", null],
["realm_signup_announcements_stream_id", null],
@ -499,7 +497,6 @@ const dropdown_widget_map = new Map<string, DropdownWidget | null>([
["realm_create_multiuse_invite_group", null],
["can_remove_subscribers_group", null],
["realm_can_access_all_users_group", null],
["can_mention_group", null],
["realm_can_add_custom_emoji_group", null],
["realm_can_create_groups", null],
["realm_can_create_public_channel_group", null],
@ -534,10 +531,6 @@ export function set_dropdown_setting_widget(property_name: string, widget: Dropd
dropdown_widget_map.set(property_name, widget);
}
export function set_new_group_can_mention_group_widget(widget: DropdownWidget): void {
new_group_can_mention_group_widget = widget;
}
export function set_dropdown_list_widget_setting_value(
property_name: string,
value: number | string,
@ -940,15 +933,13 @@ export function check_group_property_changed(elem: HTMLElement, group: UserGroup
case "can_add_members_group":
case "can_join_group":
case "can_leave_group":
case "can_manage_group": {
case "can_manage_group":
case "can_mention_group": {
const pill_widget = get_group_setting_widget(property_name);
assert(pill_widget !== null);
proposed_val = get_group_setting_widget_value(pill_widget);
break;
}
case "can_mention_group":
proposed_val = get_dropdown_list_widget_setting_value($elem);
break;
default:
if (current_val !== undefined) {
proposed_val = get_input_element_value(elem, typeof current_val);
@ -1431,6 +1422,7 @@ export const group_setting_widget_map = new Map<string, GroupSettingPillContaine
["can_join_group", null],
["can_leave_group", null],
["can_manage_group", null],
["can_mention_group", null],
]);
export function get_group_setting_widget(setting_name: string): GroupSettingPillContainer | null {
@ -1475,7 +1467,8 @@ type group_setting_name =
| "can_add_members_group"
| "can_join_group"
| "can_leave_group"
| "can_manage_group";
| "can_manage_group"
| "can_mention_group";
export function create_group_setting_widget({
$pill_container,

View File

@ -673,10 +673,7 @@ export function discard_group_property_element_changes(elem: HTMLElement, group:
);
const group_widget_settings = [...settings_components.group_setting_widget_map.keys()];
if (property_name === "can_mention_group") {
assert(typeof property_value === "number" || typeof property_value === "string");
settings_components.set_dropdown_list_widget_setting_value(property_name, property_value);
} else if (group_widget_settings.includes(property_name)) {
if (group_widget_settings.includes(property_name)) {
const pill_widget = settings_components.get_group_setting_widget(property_name);
assert(pill_widget !== null);
settings_components.set_group_setting_widget_value(

View File

@ -149,7 +149,7 @@ export const raw_user_group_schema = z.object({
can_join_group: group_setting_value_schema,
can_leave_group: group_setting_value_schema,
can_manage_group: group_setting_value_schema,
can_mention_group: z.number(),
can_mention_group: group_setting_value_schema,
deactivated: z.boolean(),
});

View File

@ -1,70 +1,10 @@
import $ from "jquery";
import assert from "minimalistic-assert";
import * as dropdown_widget from "./dropdown_widget";
import * as group_permission_settings from "./group_permission_settings";
import {$t_html} from "./i18n";
import * as settings_components from "./settings_components";
import * as user_groups from "./user_groups";
import type {UserGroup} from "./user_groups";
export let active_group_id: number | undefined;
type group_setting = "can_mention_group";
export function setup_permissions_dropdown(
setting_name: group_setting,
group: UserGroup | undefined,
for_group_creation: boolean,
): void {
let widget_name: string;
let default_id: number;
if (for_group_creation) {
widget_name = "new_group_" + setting_name;
const group_setting_config = group_permission_settings.get_group_permission_setting_config(
setting_name,
"group",
)!;
const default_group_name = group_setting_config.default_group_name;
default_id = user_groups.get_user_group_from_name(default_group_name)!.id;
} else {
assert(group !== undefined);
widget_name = setting_name;
default_id = group[setting_name];
}
const group_setting_widget = new dropdown_widget.DropdownWidget({
widget_name,
get_options: () =>
user_groups.get_realm_user_groups_for_dropdown_list_widget(setting_name, "group"),
item_click_callback(event, dropdown) {
dropdown.hide();
event.preventDefault();
event.stopPropagation();
group_setting_widget.render();
if (!for_group_creation) {
assert(group !== undefined);
settings_components.save_discard_group_widget_status_handler(
$("#group_permission_settings"),
group,
);
}
},
$events_container: $("#groups_overlay .group-permissions"),
default_id,
unique_id_type: dropdown_widget.DataTypes.NUMBER,
on_mount_callback(dropdown) {
$(dropdown.popper).css("min-width", "300px");
$(dropdown.popper).find(".simplebar-content").css("width", "max-content");
},
});
if (for_group_creation) {
settings_components.set_new_group_can_mention_group_widget(group_setting_widget);
} else {
settings_components.set_dropdown_setting_widget(setting_name, group_setting_widget);
}
group_setting_widget.setup();
}
export function set_active_group_id(group_id: number): void {
active_group_id = group_id;
}

View File

@ -31,6 +31,7 @@ let can_add_members_group_widget: GroupSettingPillContainer | undefined;
let can_join_group_widget: GroupSettingPillContainer | undefined;
let can_leave_group_widget: GroupSettingPillContainer | undefined;
let can_manage_group_widget: GroupSettingPillContainer | undefined;
let can_mention_group_widget: GroupSettingPillContainer | undefined;
class UserGroupMembershipError {
report_no_members_to_user_group(): void {
@ -168,13 +169,9 @@ function create_user_group(): void {
const can_leave_group =
settings_components.get_group_setting_widget_value(can_leave_group_widget);
assert(settings_components.new_group_can_mention_group_widget !== null);
const can_mention_group_value = settings_components.new_group_can_mention_group_widget.value();
assert(can_mention_group_value !== undefined);
assert(can_mention_group_widget !== undefined);
const can_mention_group =
typeof can_mention_group_value === "number"
? can_mention_group_value
: Number.parseInt(can_mention_group_value, 10);
settings_components.get_group_setting_widget_value(can_mention_group_widget);
const data = {
name: group_name,
@ -183,7 +180,7 @@ function create_user_group(): void {
can_add_members_group: JSON.stringify(can_add_members_group),
can_join_group: JSON.stringify(can_join_group),
can_leave_group: JSON.stringify(can_leave_group),
can_mention_group,
can_mention_group: JSON.stringify(can_mention_group),
can_manage_group: JSON.stringify(can_manage_group),
};
loading.make_indicator($("#user_group_creating_indicator"), {
@ -281,5 +278,9 @@ export function set_up_handlers(): void {
setting_type: "group",
});
user_group_components.setup_permissions_dropdown("can_mention_group", undefined, true);
can_mention_group_widget = settings_components.create_group_setting_widget({
$pill_container: $container.find(".can-mention-group-container .pill-container"),
setting_name: "can_mention_group",
setting_type: "group",
});
}

View File

@ -112,39 +112,19 @@ function update_group_permission_settings_elements(group) {
// We are concerend with the General tab for changing group permissions.
const $group_permission_settings = $("#group_permission_settings");
// Otherwise, we adjust whether the widgets are disabled based on
// whether this user is authorized to change the group settings.
const $permission_dropdown_elements =
$group_permission_settings.find(".dropdown-widget-button");
const $permission_pill_container_elements = $group_permission_settings.find(".pill-container");
if (settings_data.can_manage_user_group(group.id)) {
$permission_dropdown_elements.prop("disabled", false);
$permission_pill_container_elements.find(".input").prop("contenteditable", true);
$permission_pill_container_elements.removeClass("group_setting_disabled");
$permission_dropdown_elements.each(function () {
const $dropdown_wrapper = $(this).closest(".dropdown_widget_with_label_wrapper");
$dropdown_wrapper[0]._tippy?.destroy();
});
$permission_pill_container_elements.each(function () {
$(this)[0]._tippy?.destroy();
});
} else {
$permission_dropdown_elements.prop("disabled", true);
$permission_pill_container_elements.find(".input").prop("contenteditable", false);
$permission_pill_container_elements.addClass("group_setting_disabled");
$permission_dropdown_elements.each(function () {
const $dropdown_wrapper = $(this).closest(".dropdown_widget_with_label_wrapper");
settings_components.initialize_disable_btn_hint_popover(
$dropdown_wrapper,
$t({defaultMessage: "You do not have permission to edit this setting."}),
);
});
$permission_pill_container_elements.each(function () {
settings_components.initialize_disable_btn_hint_popover(
$(this),
@ -167,7 +147,6 @@ function show_membership_settings(group) {
}
function show_general_settings(group) {
user_group_components.setup_permissions_dropdown("can_mention_group", group, false);
const $edit_container = get_edit_container(group);
settings_components.create_group_setting_widget({
$pill_container: $edit_container.find(".can-add-members-group-container .pill-container"),
@ -196,6 +175,13 @@ function show_general_settings(group) {
setting_type: "group",
group,
});
settings_components.create_group_setting_widget({
$pill_container: $edit_container.find(".can-mention-group-container .pill-container"),
setting_name: "can_mention_group",
setting_type: "group",
group,
});
update_general_panel_ui(group);
}
@ -659,6 +645,7 @@ export function update_group(event) {
}
if (event.data.can_mention_group !== undefined) {
sync_group_permission_setting("can_mention_group", group);
update_group_management_ui();
}
if (event.data.can_add_members_group !== undefined) {
sync_group_permission_setting("can_add_members_group", group);

View File

@ -162,7 +162,7 @@ export function get_user_groups_allowed_to_mention(): UserGroup[] {
const user_groups = get_realm_user_groups();
return user_groups.filter((group) => {
const can_mention_group_id = group.can_mention_group;
return is_user_in_group(can_mention_group_id, current_user.user_id);
return is_user_in_setting_group(can_mention_group_id, current_user.user_id);
});
}
@ -442,10 +442,7 @@ export function get_realm_user_groups_for_setting(
return user_group;
});
if (
(setting_name !== "can_mention_group" && !page_params.development_environment) ||
group_setting_config.require_system_group
) {
if (!page_params.development_environment || group_setting_config.require_system_group) {
return system_user_groups;
}

View File

@ -8,10 +8,15 @@
</div>
</div>
{{> ../dropdown_widget_with_label
widget_name=can_mention_group_widget_name
label=(t 'Who can mention this group')
value_type="number"}}
<div class="input-group can-mention-group-container">
<label>{{t "Who can mention this group" }}</label>
<div class="pill-container person_picker prop-element" id="id_{{can_mention_group_widget_name}}" data-setting-widget-type="group-setting-type">
<div class="input" contenteditable="true"
data-placeholder="{{t 'Add roles, groups or users' }}">
{{~! Squash whitespace so that placeholder is displayed when empty. ~}}
</div>
</div>
</div>
<div class="input-group can-add-members-group-container">
<label>{{t "Who can add members to this group" }}</label>