zeta: Add adjustments to the review modal UI (#21920)

Most notably, adding a current iteration of a possible logo to feel it
out! :) Also, I'm hiding the input and instructions container after the
review has been sent. In the future, if we allow changing an already
sent review, we can change this behavior.

<img width="800" alt="Screenshot 2024-12-12 at 10 42 44"
src="https://github.com/user-attachments/assets/37e63d0d-d847-445e-bdf8-bf5c97d0fe4c"
/>

Release Notes:

- N/A
This commit is contained in:
Danilo Leal 2024-12-12 11:17:08 -03:00 committed by GitHub
parent 8e0ae441f3
commit c204b0d01a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 57 additions and 46 deletions

View file

@ -8,7 +8,7 @@ use language::{language_settings, OffsetRangeExt};
use settings::Settings;
use std::time::Duration;
use theme::ThemeSettings;
use ui::{prelude::*, KeyBinding, List, ListItem, ListItemSpacing, TintColor, Tooltip};
use ui::{prelude::*, KeyBinding, List, ListItem, ListItemSpacing, Tooltip};
use workspace::{ModalView, Workspace};
actions!(
@ -369,34 +369,39 @@ impl RateCompletionModal {
.overflow_scroll()
.child(StyledText::new(diff).with_highlights(&text_style, diff_highlights)),
)
.child(
h_flex()
.p_2()
.gap_2()
.border_y_1()
.border_color(border_color)
.child(
Icon::new(IconName::Info)
.size(IconSize::XSmall)
.color(Color::Muted)
)
.child(
Label::new("Ensure you explain why this completion is negative or positive. In case it's negative, report what you expected instead.")
.size(LabelSize::Small)
.color(Color::Muted)
)
)
.child(
div()
.h_40()
.pt_1()
.bg(bg_color)
.child(active_completion.feedback_editor.clone()),
)
.when_some((!rated).then(|| ()), |this, _| {
this.child(
h_flex()
.p_2()
.gap_2()
.border_y_1()
.border_color(border_color)
.child(
Icon::new(IconName::Info)
.size(IconSize::XSmall)
.color(Color::Muted)
)
.child(
Label::new("Ensure you explain why this completion is negative or positive. In case it's negative, report what you expected instead.")
.size(LabelSize::Small)
.color(Color::Muted)
)
)
})
.when_some((!rated).then(|| ()), |this, _| {
this.child(
div()
.h_40()
.pt_1()
.bg(bg_color)
.child(active_completion.feedback_editor.clone())
)
})
.child(
h_flex()
.p_1()
.h_8()
.max_h_8()
.border_t_1()
.border_color(border_color)
.max_w_full()
@ -409,7 +414,7 @@ impl RateCompletionModal {
.size(IconSize::Small)
.color(Color::Success),
)
.child(Label::new("Rated completion").color(Color::Muted)),
.child(Label::new("Rated completion.").color(Color::Muted)),
)
} else if active_completion.completion.edits.is_empty() {
Some(
@ -419,7 +424,7 @@ impl RateCompletionModal {
.size(IconSize::Small)
.color(Color::Warning),
)
.child(Label::new("No edits produced").color(Color::Muted)),
.child(Label::new("No edits produced.").color(Color::Muted)),
)
} else {
Some(label_container())
@ -434,11 +439,10 @@ impl RateCompletionModal {
&self.focus_handle(cx),
cx,
))
.style(ButtonStyle::Tinted(TintColor::Negative))
.style(ButtonStyle::Filled)
.icon(IconName::ThumbsDown)
.icon_size(IconSize::Small)
.icon_position(IconPosition::Start)
.icon_color(Color::Error)
.disabled(rated || feedback_empty)
.when(feedback_empty, |this| {
this.tooltip(|cx| {
@ -459,11 +463,10 @@ impl RateCompletionModal {
&self.focus_handle(cx),
cx,
))
.style(ButtonStyle::Tinted(TintColor::Positive))
.style(ButtonStyle::Filled)
.icon(IconName::ThumbsUp)
.icon_size(IconSize::Small)
.icon_position(IconPosition::Start)
.icon_color(Color::Success)
.disabled(rated)
.on_click(cx.listener(move |this, _, cx| {
this.thumbs_up_active(&ThumbsUpActiveCompletion, cx);
@ -537,7 +540,7 @@ impl Render for RateCompletionModal {
.focused(index == self.selected_index)
.selected(selected)
.start_slot(if rated {
Icon::new(IconName::Check).color(Color::Success)
Icon::new(IconName::Check).color(Color::Success).size(IconSize::Small)
} else if completion.edits.is_empty() {
Icon::new(IconName::File).color(Color::Muted).size(IconSize::Small)
} else {
@ -546,13 +549,9 @@ impl Render for RateCompletionModal {
.child(
v_flex()
.child(Label::new(completion.path.to_string_lossy().to_string()).size(LabelSize::Small))
.child(div()
.overflow_hidden()
.text_ellipsis()
.child(Label::new(format!("{} ago, {:.2?}", format_time_ago(completion.response_received_at.elapsed()), completion.latency()))
.color(Color::Muted)
.size(LabelSize::XSmall)
)
.child(Label::new(format!("{} ago, {:.2?}", format_time_ago(completion.response_received_at.elapsed()), completion.latency()))
.color(Color::Muted)
.size(LabelSize::XSmall)
)
)
.on_click(cx.listener(move |this, _, cx| {