Checkpoin: Iterating on design and writing

Co-Authored-By: Agus Zubiaga <hi@aguz.me>
This commit is contained in:
Danilo Leal 2025-01-22 17:27:16 -03:00
parent d71f1fa832
commit 2ea1a4c5be
4 changed files with 88 additions and 45 deletions

2
Cargo.lock generated
View file

@ -16512,6 +16512,8 @@ dependencies = [
"client",
"gpui",
"menu",
"settings",
"theme",
"ui",
"workspace",
]

View file

@ -211,7 +211,6 @@ impl Render for TitleBar {
.child(
h_flex()
.h_full()
.px_1()
.items_center()
.gap_1p5()
.child(
@ -228,7 +227,7 @@ impl Render for TitleBar {
)
.child(
Label::new(
"Zed AI's Edit Predictions",
"Zed AI's Edit Prediction",
)
.size(LabelSize::Small),
),
@ -251,8 +250,15 @@ impl Render for TitleBar {
}),
)
.child(
IconButton::new("close", IconName::Close)
.icon_size(IconSize::Indicator),
div()
.border_l_1()
.border_color(
cx.theme().colors().editor_foreground.opacity(0.1),
)
.child(
IconButton::new("close", IconName::Close)
.icon_size(IconSize::Indicator),
),
),
),
)

View file

@ -18,6 +18,8 @@ test-support = []
[dependencies]
client.workspace = true
gpui.workspace = true
menu.workspace = true
settings.workspace = true
theme.workspace = true
ui.workspace = true
workspace.workspace = true
menu.workspace = true

View file

@ -2,9 +2,10 @@
use client::UserStore;
use gpui::{
AppContext, ClickEvent, DismissEvent, EventEmitter, FocusHandle, FocusableView, Model,
svg, AppContext, ClickEvent, DismissEvent, EventEmitter, FocusHandle, FocusableView, Model,
MouseDownEvent, Render, View,
};
use settings::Settings;
use ui::{prelude::*, TintColor};
use workspace::{ModalView, Workspace};
@ -83,70 +84,102 @@ impl ModalView for ZedPredictTos {}
impl Render for ZedPredictTos {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
let description = if self.viewed {
"After accepting the ToS, Zed will be set as your inline completions provider."
} else {
"To start using Edit Predictions, please read and accept our Terms of Service."
};
v_flex()
.w_96()
.p_4()
.relative()
.items_center()
.gap_2()
.overflow_hidden()
.elevation_3(cx)
.id("zed predict tos")
.track_focus(&self.focus_handle(cx))
.on_action(cx.listener(Self::cancel))
.key_context("ZedPredictTos")
.elevation_3(cx)
.w_96()
.items_center()
.p_4()
.gap_2()
.on_action(cx.listener(|_, _: &menu::Cancel, cx| {
cx.emit(DismissEvent);
}))
.on_any_mouse_down(cx.listener(|this, _: &MouseDownEvent, cx| {
cx.focus(&this.focus_handle);
}))
.child(
h_flex()
.max_h_32()
.p_1()
.overflow_hidden()
.flex_wrap()
.gap_1()
.absolute()
.top_0()
.left_0()
.right_0()
.children((0..254).enumerate().map(|(index, _)| {
let opacity = 0.24 - (index as f32 * 0.0016);
svg()
.path("icons/zed_predict.svg")
.text_color(cx.theme().colors().icon_disabled)
.w(px(14.))
.h(px(14.))
.opacity(opacity.max(0.001))
})),
)
.child({
let tab = |_n: u8| {
h_flex()
.px_10()
.bg(cx.theme().colors().text_accent.opacity(0.15))
.px_4()
.py_0p5()
.bg(cx.theme().colors().editor_background)
.border_1()
.border_color(cx.theme().colors().text_accent.opacity(0.8))
.border_color(cx.theme().colors().text_accent.opacity(0.4))
.rounded_md()
.child(
Label::new("tab")
.color(Color::Muted),
)
.font(theme::ThemeSettings::get_global(cx).buffer_font.clone())
.text_size(TextSize::XSmall.rems(cx))
.text_color(cx.theme().colors().text)
.child("tab")
};
v_flex().items_center().gap_3().w_full().child(tab(0).ml_neg_32()).child(tab(1)).child(tab(2).ml_32())
})
.child(
h_flex()
v_flex()
.items_center()
.gap_2()
.w_full()
.justify_between()
.child(
v_flex()
.gap_0p5()
.child(
Label::new("Zed AI")
.size(LabelSize::Small)
.color(Color::Muted),
)
.child(Headline::new("Edit Prediction")),
)
.child(Icon::new(IconName::ZedPredict).size(IconSize::XLarge)),
)
.child(
Label::new(
"To use Zed AI's Edit Prediction feature, please read and accept our Terms of Service.",
)
.color(Color::Muted),
)
.child(tab(0).ml_neg_20())
.child(tab(1))
.child(tab(2).ml_20())
})
.child(
v_flex()
.mt_2()
.gap_0p5()
.items_center()
.child(
h_flex().child(
Label::new("Zed AI")
.size(LabelSize::Small)
.color(Color::Muted),
),
)
.child(h_flex().child(Headline::new("Edit Prediction")))
.child(Label::new(description).color(Color::Muted)),
)
.child(
v_flex()
.mt_2()
.gap_1()
.w_full()
.child(if self.viewed {
Button::new("accept-tos", "I've Read and Accept the Terms of Service")
.style(ButtonStyle::Tinted(TintColor::Accent))
.full_width()
.on_click(cx.listener(Self::accept_terms))
Button::new(
"accept-tos",
"Accept the Terms of Service and Start Using It",
)
.style(ButtonStyle::Tinted(TintColor::Accent))
.full_width()
.on_click(cx.listener(Self::accept_terms))
} else {
Button::new("view-tos", "Read Terms of Service")
.style(ButtonStyle::Tinted(TintColor::Accent))