paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-10-25 00:53:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

message_header: Update topic visibility button to use icon button.

Browse Source 
This commit is part of a series of commits aimed at updating the message
header buttons to use the new icon button component which has consistent
styling across the Web UI and offers a larger clickable area for the
users.

Due to deviation from the structure at
"web/templates/components/icon_button.hbs", this commit applies the
icon button classes directly on the template rather than using the
component partial directly in code.

Fixes #34477.
This commit is contained in:
Sayam Samal
2025-05-31 17:26:17 +05:30
committed by Tim Abbott
parent feedb6ea2d
commit e091e19031
5 changed files with 76 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
web/src/tippyjs.ts
View File

@@ -87,21 +87,27 @@ export const topic_visibility_policy_tooltip_props = {
delay: LONG_HOVER_DELAY,
appendTo: () => document.body,
onShow(instance: tippy.Instance) {
const $elem = $(instance.reference);
let should_render_privacy_icon;
let current_visibility_policy_str;
if ($elem.hasClass("zulip-icon-inherit")) {
should_render_privacy_icon = true;
} else {
should_render_privacy_icon = false;
current_visibility_policy_str = $elem.attr("data-tippy-content");
}
let current_stream_obj;
if (should_render_privacy_icon) {
const $elem = $(instance.reference);
if ($elem.hasClass("recipient-bar-control-icon")) {
// The topic visibility policy button located in the recipient bar
// uses the icon button component, and extracts the stream id from
// the message header instead of the button itself. This results in
// the need for a different logic to extract the required data.
should_render_privacy_icon = $elem
.children(".zulip-icon")
.hasClass("zulip-icon-inherit");
current_stream_obj = stream_data.get_sub_by_id(
Number($elem.closest(".message_header").attr("data-stream-id")),
);
} else {
should_render_privacy_icon = $elem.hasClass("zulip-icon-inherit");
current_stream_obj = stream_data.get_sub_by_id(
Number($elem.parent().attr("data-stream-id")),
);
}
const current_visibility_policy_str = $elem.attr("data-tippy-content");
const tooltip_context = {
...current_stream_obj,
current_visibility_policy_str,