zed-industries/zed
1
1
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-09-18 18:08:07 +03:00
Code Issues Packages Projects Releases Wiki Activity

Improved message hovering in chat panel (#8977)

Browse Source 
Highlights messages on hover and fixed a more concise position for the
popover menu button.

Before:


https://github.com/zed-industries/zed/assets/146845123/39cab30f-659f-4164-a4ac-1dfee796e016

<img width="368" alt="Screenshot 2024-03-07 at 01 08 24"
src="https://github.com/zed-industries/zed/assets/146845123/74f41243-2dc2-4839-a733-9db3109e4665">

<img width="313" alt="Screenshot 2024-03-07 at 01 04 39"
src="https://github.com/zed-industries/zed/assets/146845123/f66c764d-488a-4303-b66e-f75835df6949">

After:


https://github.com/zed-industries/zed/assets/146845123/ac059c0d-7b16-4fd5-bbd7-ca96e1a6dfe1


<img width="368" alt="Screenshot 2024-03-07 at 01 09 42"
src="https://github.com/zed-industries/zed/assets/146845123/fa8940f6-52b4-489d-b0d3-d0e9443e2de2">

<img width="313" alt="Screenshot 2024-03-07 at 01 04 31"
src="https://github.com/zed-industries/zed/assets/146845123/850226f3-2c70-4a90-bb35-4a4cb0b7a219">


Thank you for the help @ConradIrwin and @RemcoSmitsDev !


Release Notes:
- Improved message hovering in chat panel
This commit is contained in:
Evren Sen 2024-03-07 04:47:19 +01:00 committed by GitHub
parent 9481b346e2
commit 4d2156e2ad
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 52 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
crates/collab_ui/src/chat_panel.rs
View File

@ -430,7 +430,6 @@ impl ChatPanel {
ChannelMessageId::Saved(id) => ("saved-message", id).into(),
ChannelMessageId::Pending(id) => ("pending-message", id).into(),
};
let this = cx.view().clone();
let mentioning_you = message
.mentions
@ -467,11 +466,15 @@ impl ChatPanel {
.relative()
.child(
div()
.group("")
.bg(background)
.rounded_md()
.overflow_hidden()
.px_1()
.py_0p5()
.when(!self.has_open_menu(message_id), |this| {
this.hover(|style| style.bg(cx.theme().colors().element_hover))
})
.when(!is_continuation_from_previous, |this| {
this.mt_2().child(
h_flex()
@ -494,9 +497,19 @@ impl ChatPanel {
))
.size(LabelSize::Small)
.color(Color::Muted),
),
)
.map(|el| {
el.child(self.render_popover_button(
&cx,
message_id,
can_delete_message,
))
}),
)
})
.when(is_continuation_from_previous, |el| {
el.child(self.render_popover_button(&cx, message_id, can_delete_message))
})
.when(
message.reply_to_message_id.is_some() && reply_to_message.is_none(),
|this| {
@ -545,37 +558,11 @@ impl ChatPanel {
.w_full()
.text_ui_sm()
.id(element_id)
.group("")
.child(text.element("body".into(), cx))
.child(
div()
.absolute()
.z_index(1)
.right_0()
.w_6()
.bg(background)
.when(!self.has_open_menu(message_id), |el| {
el.visible_on_hover("")
})
.when_some(message_id, |el, message_id| {
el.child(
popover_menu(("menu", message_id))
.trigger(IconButton::new(
("trigger", message_id),
IconName::Ellipsis,
))
.menu(move |cx| {
Some(Self::render_message_menu(
&this,
message_id,
can_delete_message,
cx,
))
}),
)
}),
),
.child(text.element("body".into(), cx)),
)
.when(self.has_open_menu(message_id), |el| {
el.bg(cx.theme().colors().element_selected)
})
}),
)
.when(
@ -609,6 +596,39 @@ impl ChatPanel {
}
}
fn render_popover_button(
&self,
cx: &ViewContext<Self>,
message_id: Option<u64>,
can_delete_message: bool,
) -> Div {
div()
.absolute()
.z_index(1)
.right_0()
.w_6()
.bg(cx.theme().colors().element_hover)
.when(!self.has_open_menu(message_id), |el| {
el.visible_on_hover("")
})
.when_some(message_id, |el, message_id| {
let chat_panel_view = cx.view().clone();
el.child(
popover_menu(("menu", message_id))
.trigger(IconButton::new(("trigger", message_id), IconName::Ellipsis))
.menu(move |cx| {
Some(Self::render_message_menu(
&chat_panel_view,
message_id,
can_delete_message,
cx,
))
}),
)
})
}
fn render_message_menu(
this: &View<Self>,
message_id: u64,