user-settings: Update icon for deactivating user or bot.

Co-authored-by: Lauryn Menard <lauryn@zulip.com>
This commit is contained in:
ahmedgulabkhan
2025-03-15 20:52:03 +01:00
committed by Tim Abbott
parent 50582b72b6
commit c0b3fb1bbe
9 changed files with 32 additions and 14 deletions

View File

@@ -197,6 +197,11 @@ Files: web/shared/icons/user-plus.svg
Copyright: 2013-2023 Cole Bemis (https://feathericons.com)
License: Expat
Files: web/shared/icons/user-x.svg
Source: https://lucide.dev/icons/user-x
Copyright: 2013-2022 Cole Bemis
License: ISC License
Files: web/shared/icons/clock.svg
Copyright: 2013-2023 Cole Bemis (https://feathericons.com)
License: Expat

View File

@@ -15,8 +15,8 @@ bot, regardless of who owns them.
{settings_tab|your-bots}
1. Click the **deactivate bot** (<i class="fa fa-user-times"></i>) icon on the profile
card for the bot you want to deactivate.
1. Click the **deactivate bot** (<i class="zulip-icon zulip-icon-user-x"></i>)
icon on the profile card for the bot you want to deactivate.
1. Approve by clicking **Deactivate**.
@@ -31,8 +31,8 @@ bot, regardless of who owns them.
{settings_tab|bot-list-admin}
1. In the **Actions** column, click the **deactivate bot** (<i class="fa fa-user-times"></i>)
icon for the bot you want to deactivate.
1. In the **Actions** column, click the **deactivate bot** (<i class="zulip-icon
zulip-icon-user-x"></i>) icon for the bot you want to deactivate.
1. Approve by clicking **Deactivate**.

View File

@@ -56,8 +56,8 @@ When you deactivate a user:
{settings_tab|users}
1. In the **Actions** column, click the **deactivate** (<i class="fa
fa-user-times"></i>) icon for the user you want to deactivate.
1. In the **Actions** column, click the **deactivate user** (<i class="zulip-icon
zulip-icon-user-x"></i>) icon for the user you want to deactivate.
1. *(optional)* Select **Notify this user by email?** if desired, and enter a
custom comment to include in the notification email.

View File

@@ -44,7 +44,7 @@ async function test_reactivation_confirmation_modal(page: Page, fullname: string
async function test_deactivate_user(page: Page): Promise<void> {
const cordelia_user_row = await user_row(page, common.fullname.cordelia);
await page.waitForSelector(cordelia_user_row, {visible: true});
await page.waitForSelector(cordelia_user_row + " .fa-user-times");
await page.waitForSelector(cordelia_user_row + " .zulip-icon-user-x");
await page.click(cordelia_user_row + " .deactivate");
await common.wait_for_micromodal_to_open(page);
@@ -72,7 +72,7 @@ async function test_reactivate_user(page: Page): Promise<void> {
await page.waitForSelector(cordelia_user_row + ":not(.deactivated_user)", {visible: true});
cordelia_user_row = await user_row(page, common.fullname.cordelia);
await page.waitForSelector(cordelia_user_row + " .fa-user-times");
await page.waitForSelector(cordelia_user_row + " .zulip-icon-user-x");
}
async function test_deactivated_users_section(page: Page): Promise<void> {
@@ -131,7 +131,7 @@ async function test_bot_deactivation_and_reactivation(page: Page): Promise<void>
await page.click(default_bot_user_row + " .reactivate");
await test_reactivation_confirmation_modal(page, "Zulip Default Bot");
await page.waitForSelector(default_bot_user_row + ":not(.deactivated_user)", {visible: true});
await page.waitForSelector(default_bot_user_row + " .fa-user-times");
await page.waitForSelector(default_bot_user_row + " .zulip-icon-user-x");
}
async function user_deactivation_test(page: Page): Promise<void> {

View File

@@ -0,0 +1,5 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 1.3335C7.84095 1.3335 9.33333 2.82588 9.33333 4.66683C9.33333 6.50778 7.84095 8.00016 6 8.00016C4.15905 8.00016 2.66667 6.50778 2.66667 4.66683C2.66667 2.82588 4.15905 1.3335 6 1.3335ZM4 4.66683C4 5.7714 4.89543 6.66683 6 6.66683C7.10457 6.66683 8 5.7714 8 4.66683C8 3.56226 7.10457 2.66683 6 2.66683C4.89543 2.66683 4 3.56226 4 4.66683Z" fill="black"/>
<path d="M4 9.3335H8C8.88406 9.3335 9.7319 9.68469 10.357 10.3098C10.9821 10.9349 11.3333 11.7828 11.3333 12.6668V14.0002C11.3333 14.3684 11.0349 14.6668 10.6667 14.6668C10.2985 14.6668 10 14.3684 10 14.0002V12.6668C10 12.1364 9.78929 11.6277 9.41421 11.2526C9.03914 10.8775 8.53043 10.6668 8 10.6668H4C3.46957 10.6668 2.96086 10.8775 2.58579 11.2526C2.21071 11.6277 2 12.1364 2 12.6668V14.0002C2 14.3684 1.70152 14.6668 1.33333 14.6668C0.965144 14.6668 0.666667 14.3684 0.666667 14.0002V12.6668C0.666667 11.7828 1.01786 10.9349 1.64298 10.3098C2.2681 9.68469 3.11594 9.3335 4 9.3335Z" fill="black"/>
<path d="M10.8619 4.86209C11.1223 4.60174 11.5444 4.60174 11.8047 4.86209L13 6.05735L14.1953 4.86209C14.4556 4.60174 14.8777 4.60174 15.1381 4.86209C15.3984 5.12244 15.3984 5.54455 15.1381 5.8049L13.9428 7.00016L15.1381 8.19543C15.3984 8.45577 15.3984 8.87788 15.1381 9.13823C14.8777 9.39858 14.4556 9.39858 14.1953 9.13823L13 7.94297L11.8047 9.13823C11.5444 9.39858 11.1223 9.39858 10.8619 9.13823C10.6016 8.87788 10.6016 8.45577 10.8619 8.19543L12.0572 7.00016L10.8619 5.8049C10.6016 5.54455 10.6016 5.12244 10.8619 4.86209Z" fill="black"/>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@@ -169,7 +169,9 @@ export function update_view_on_reactivate(user_id: number, is_bot: boolean): voi
$button.addClass("deactivate-user-tooltip");
$button.removeClass("reactivate-user-tooltip");
}
$button.empty().append($("<i>").addClass(["fa", "fa-user-times"]).attr("aria-hidden", "true"));
$button
.empty()
.append($("<i>").addClass(["zulip-icon", "zulip-icon-user-x"]).attr("aria-hidden", "true"));
$row.removeClass("deactivated_user");
$row.addClass("active-user");

View File

@@ -1324,12 +1324,18 @@ label.preferences-radio-choice-label {
margin-right: 1px;
}
.deactivate-user-button,
.reactivate-user-button {
display: inline-flex;
align-items: center;
min-height: 35px;
}
.deactivate-bot-button {
display: inline-flex;
align-items: center;
}
.invite-user-link .fa-user-plus {
text-decoration: none;
margin-right: 5px;

View File

@@ -14,8 +14,8 @@
<button type="submit" id="copy_zuliprc" class="bootstrap-btn copy_zuliprc tippy-zulip-delayed-tooltip" data-tippy-content="{{t 'Copy zuliprc' }}">
<i class="zulip-icon zulip-icon-copy" aria-hidden="true"></i>
</button>
<button type="submit" class="bootstrap-btn deactivate_bot danger-red tippy-zulip-delayed-tooltip" data-tippy-content="{{t 'Deactivate bot' }}" data-user-id="{{user_id}}">
<i class="fa fa-user-times" aria-hidden="true"></i>
<button type="submit" class="bootstrap-btn deactivate_bot danger-red tippy-zulip-delayed-tooltip deactivate-bot-button" data-tippy-content="{{t 'Deactivate bot' }}" data-user-id="{{user_id}}">
<i class="zulip-icon zulip-icon-user-x" aria-hidden="true"></i>
</button>
<button type="submit" class="bootstrap-btn open_bots_subscribed_streams tippy-zulip-delayed-tooltip" data-tippy-content="{{t 'Subscribed channels' }}" data-user-id="{{user_id}}">
<i class="fa fa-hashtag purple" aria-hidden="true"></i>

View File

@@ -46,8 +46,8 @@
</span>
{{#if is_active}}
<span {{#if cannot_deactivate}}class="tippy-zulip-tooltip"{{/if}} {{#if (and is_bot cannot_deactivate)}}data-tippy-content="{{t 'This bot cannot be deactivated.'}}"{{else if cannot_deactivate}}data-tippy-content="{{t 'This user cannot be deactivated.'}}"{{/if}}>
<button class="button rounded small button-danger deactivate {{#if is_bot}}deactivate-bot-tooltip{{else}}deactivate-user-tooltip{{/if}}" {{#if cannot_deactivate}}disabled="disabled"{{/if}}>
<i class="fa fa-user-times" aria-hidden="true"></i>
<button class="button rounded small button-danger deactivate deactivate-user-button {{#if is_bot}}deactivate-bot-tooltip{{else}}deactivate-user-tooltip{{/if}}" {{#if cannot_deactivate}}disabled="disabled"{{/if}}>
<i class="zulip-icon zulip-icon-user-x" aria-hidden="true"></i>
</button>
</span>
{{else}}