settings: Refactor settings_display.js code.

This commit refactors the code in settings_display.js
by modifying the functions to receive the container
element and settings object as parameter such that
we can use the same functions for realm-level
settings by passing appropriate container element
and settings object.

This change is needed as settings_display will be
used as a common module for user settings and realm
level settings.

We also rename the default_language_name variable in
settings_display to user_default_language_name as we
would add a separate variable for realm-level setting
in future.
This commit is contained in:
Sahil Batra 2021-08-18 15:17:07 +05:30 committed by Tim Abbott
parent e127cde3c1
commit 6bae097bf1
4 changed files with 21 additions and 18 deletions

View File

@ -568,6 +568,8 @@ export function dispatch_normal_event(event) {
"translate_emoticons",
"starred_message_counts",
];
const container_elem = $("#user-display-settings");
if (user_display_settings.includes(event.property)) {
user_settings[event.property] = event.value;
}
@ -632,7 +634,7 @@ export function dispatch_normal_event(event) {
// reload.
}
if (event.property === "emojiset") {
settings_display.report_emojiset_change();
settings_display.report_emojiset_change(container_elem, user_settings);
// Rerender the whole message list UI
message_lists.home.rerender();
@ -648,7 +650,7 @@ export function dispatch_normal_event(event) {
compose.toggle_enter_sends_ui();
break;
}
settings_display.update_page();
settings_display.update_page(container_elem, user_settings);
break;
}

View File

@ -111,7 +111,7 @@ export function build_page() {
user_can_change_name: settings_data.user_can_change_name(),
user_can_change_avatar: settings_data.user_can_change_avatar(),
user_role_text: people.get_user_type(page_params.user_id),
default_language_name: settings_display.default_language_name,
default_language_name: settings_display.user_default_language_name,
language_list_dbl_col: get_language_list_columns(user_settings.default_language),
settings_object: user_settings,
});

View File

@ -14,10 +14,10 @@ const meta = {
loaded: false,
};
export let default_language_name;
export let user_default_language_name;
export function set_default_language_name(name) {
default_language_name = name;
user_default_language_name = name;
}
function change_display_setting(data, container, url, status_element, success_msg_html, sticky) {
@ -38,12 +38,10 @@ function change_display_setting(data, container, url, status_element, success_ms
settings_ui.do_settings_change(channel.patch, url, data, $status_el, opts);
}
export function set_up() {
export function set_up(container, settings_object) {
meta.loaded = true;
const container = $("#user-display-settings");
const language_modal_elem = "#user_default_language_modal";
const patch_url = "/json/settings";
const settings_object = user_settings;
container.find(".display-settings-status").hide();
@ -181,18 +179,16 @@ export function set_up() {
});
}
export async function report_emojiset_change() {
export async function report_emojiset_change(container, settings_object) {
// TODO: Clean up how this works so we can use
// change_display_setting. The challenge is that we don't want to
// report success before the server_events request returns that
// causes the actual sprite sheet to change. The current
// implementation is wrong, though, in that it displays the UI
// update in all active browser windows.
const settings_object = user_settings;
await emojisets.select(settings_object.emojiset);
const spinner = $("#user-display-settings").find(".emoji-settings-status");
const spinner = container.find(".emoji-settings-status");
if (spinner.length) {
loading.destroy_indicator(spinner);
ui_report.success(
@ -204,9 +200,9 @@ export async function report_emojiset_change() {
}
}
export function update_page() {
const container = $("#user-display-settings");
const settings_object = user_settings;
export function update_page(container, settings_object) {
const default_language_name = user_default_language_name;
container.find(".left_side_userlist").prop("checked", settings_object.left_side_userlist);
container.find(".default_language_name").text(default_language_name);
container.find(".translate_emoticons").prop("checked", settings_object.translate_emoticons);
@ -221,6 +217,6 @@ export function update_page() {
}
export function initialize() {
const language_name = get_language_name(user_settings.default_language);
set_default_language_name(language_name);
const user_language_name = get_language_name(user_settings.default_language);
set_default_language_name(user_language_name);
}

View File

@ -1,3 +1,5 @@
import $ from "jquery";
import * as alert_words_ui from "./alert_words_ui";
import * as attachments_ui from "./attachments_ui";
import * as blueslip from "./blueslip";
@ -17,6 +19,7 @@ import * as settings_profile_fields from "./settings_profile_fields";
import * as settings_streams from "./settings_streams";
import * as settings_user_groups from "./settings_user_groups";
import * as settings_users from "./settings_users";
import {user_settings} from "./user_settings";
const load_func_dict = new Map(); // group -> function
const loaded_groups = new Set();
@ -50,7 +53,9 @@ export function get_group(section) {
export function initialize() {
// personal
load_func_dict.set("your-account", settings_account.set_up);
load_func_dict.set("display-settings", settings_display.set_up);
load_func_dict.set("display-settings", () => {
settings_display.set_up($("#user-display-settings"), user_settings);
});
load_func_dict.set("notifications", settings_notifications.set_up);
load_func_dict.set("your-bots", settings_bots.set_up);
load_func_dict.set("alert-words", alert_words_ui.set_up_alert_words);