From eef22e4e049ba6f581fede5f6459cdeeb34e2c6a Mon Sep 17 00:00:00 2001 From: Lauryn Menard Date: Tue, 3 Jan 2023 17:21:08 +0100 Subject: [PATCH] settings-account: Make live update for avatar changes consistent. The `settings-info-icon` with the tooltip for the user avatar section was removed in commit 103db2afaf. This removes the changes to that tooltip in `settings_account.update_avatar_change_display`. Instead of hiding or showing the `image_upload_button` in that same live update function, we now add or remove the `hide` class, which in the previous commit has a specific CSS hover rule for the image upload widget. Also adds test coverage for the `is_admin` case for this setting because administrators can always change their own avatar even if the organization has disabled avatar changes. --- frontend_tests/node_tests/settings_org.js | 11 +++++++---- static/js/settings_account.js | 9 ++++----- 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/frontend_tests/node_tests/settings_org.js b/frontend_tests/node_tests/settings_org.js index 7864774e22..03118eacea 100644 --- a/frontend_tests/node_tests/settings_org.js +++ b/frontend_tests/node_tests/settings_org.js @@ -762,19 +762,19 @@ test("misc", ({override_rewire}) => { page_params.realm_avatar_changes_disabled = false; page_params.server_avatar_changes_disabled = false; settings_account.update_avatar_change_display(); - assert.ok($("#user-avatar-upload-widget .image_upload_button").is(":visible")); + assert.ok(!$("#user-avatar-upload-widget .image_upload_button").hasClass("hide")); page_params.realm_avatar_changes_disabled = true; page_params.server_avatar_changes_disabled = false; settings_account.update_avatar_change_display(); - assert.ok(!$("#user-avatar-upload-widget .image_upload_button").is(":visible")); + assert.ok($("#user-avatar-upload-widget .image_upload_button").hasClass("hide")); page_params.realm_avatar_changes_disabled = false; page_params.server_avatar_changes_disabled = true; settings_account.update_avatar_change_display(); - assert.ok(!$("#user-avatar-upload-widget .image_upload_button").is(":visible")); + assert.ok($("#user-avatar-upload-widget .image_upload_button").hasClass("hide")); page_params.realm_avatar_changes_disabled = true; page_params.server_avatar_changes_disabled = true; settings_account.update_avatar_change_display(); - assert.ok(!$("#user-avatar-upload-widget .image_upload_button").is(":visible")); + assert.ok($("#user-avatar-upload-widget .image_upload_button").hasClass("hide")); // If organization admin, these UI elements are never disabled. page_params.is_admin = true; @@ -785,6 +785,9 @@ test("misc", ({override_rewire}) => { settings_account.update_email_change_display(); assert.ok(!$("#change_email_button").prop("disabled")); + settings_account.update_avatar_change_display(); + assert.ok(!$("#user-avatar-upload-widget .image_upload_button").hasClass("hide")); + override_rewire(stream_settings_data, "get_streams_for_settings_page", () => [ {name: "some_stream", stream_id: 75}, {name: "some_stream", stream_id: 42}, diff --git a/static/js/settings_account.js b/static/js/settings_account.js index ffa90b3653..9f1f46b5fa 100644 --- a/static/js/settings_account.js +++ b/static/js/settings_account.js @@ -71,12 +71,11 @@ export function update_email_change_display() { export function update_avatar_change_display() { if (!settings_data.user_can_change_avatar()) { - // We disable this widget by simply hiding its edit UI. - $("#user-avatar-upload-widget .image_upload_button").hide(); - $(".user-avatar-section .settings-info-icon").show(); + $("#user-avatar-upload-widget .image_upload_button").addClass("hide"); + $("#user-avatar-upload-widget .image-disabled").removeClass("hide"); } else { - $("#user-avatar-upload-widget .image_upload_button").show(); - $(".user-avatar-section .settings-info-icon").hide(); + $("#user-avatar-upload-widget .image_upload_button").removeClass("hide"); + $("#user-avatar-upload-widget .image-disabled").addClass("hide"); } }