Yehowshua/ZIm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix the component preview page scroll (#32797)

Browse source 
Plus some other tiny visual adjustments. I've been using the Component
Preview a lot this past week and vertical scroll wasn't working, which
was a big bummer!

Release Notes:

- N/A
This commit is contained in:
Danilo Leal 2025-06-16 10:18:03 -03:00 • committed by GitHub
parent c72cdfd843
commit d29e94b11c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 38 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

72
crates/zed/src/zed/component_preview.rs
View file

@ -776,9 +776,9 @@ impl Render for ComponentPreview {
.bg(cx.theme().colors().editor_background)
.child(
v_flex()
.h_full()
.border_r_1()
.border_color(cx.theme().colors().border)
.h_full()
.child(
gpui::uniform_list(
"component-nav",
@ -800,23 +800,27 @@ impl Render for ComponentPreview {
}),
)
.track_scroll(self.nav_scroll_handle.clone())
.pt_4()
.px_4()
.p_2p5()
.w(px(240.))
.h_full()
.flex_1(),
)
.child(
div().w_full().pb_4().child(
Button::new("toast-test", "Launch Toast")
.on_click(cx.listener({
move |this, _, _window, cx| {
this.test_status_toast(cx);
cx.notify();
}
}))
.full_width(),
),
div()
.w_full()
.p_2p5()
.border_t_1()
.border_color(cx.theme().colors().border)
.child(
Button::new("toast-test", "Launch Toast")
.full_width()
.on_click(cx.listener({
move |this, _, _window, cx| {
this.test_status_toast(cx);
cx.notify();
}
})),
),
),
)
.child(
@ -824,7 +828,7 @@ impl Render for ComponentPreview {
.id("content-area")
.flex_1()
.size_full()
.overflow_hidden()
.overflow_y_scroll()
.child(
div()
.p_2()
@ -1104,9 +1108,8 @@ impl ComponentPreviewPage {
fn render_header(&self, _: &Window, cx: &App) -> impl IntoElement {
v_flex()
.px_12()
.pt_16()
.pb_12()
.py_12()
.px_16()
.gap_6()
.bg(cx.theme().colors().surface_background)
.border_b_1()
@ -1121,7 +1124,6 @@ impl ComponentPreviewPage {
)
.child(
h_flex()
.items_center()
.gap_2()
.child(
Headline::new(self.component.scopeless_name())
@ -1149,34 +1151,36 @@ impl ComponentPreviewPage {
None
};
let content = if let Some(ag_preview) = maybe_agent_preview {
// Use agent preview if available
ag_preview
} else if let Some(preview) = self.component.preview() {
// Fall back to component preview
preview(window, cx).unwrap_or_else(|| {
div()
.child("Failed to load preview. This path should be unreachable")
.into_any_element()
})
} else {
div().child("No preview available").into_any_element()
};
v_flex()
.size_full()
.flex_1()
.px_12()
.py_6()
.bg(cx.theme().colors().editor_background)
.child(if let Some(element) = maybe_agent_preview {
// Use agent preview if available
element
} else if let Some(preview) = self.component.preview() {
// Fall back to component preview
preview(window, cx).unwrap_or_else(|| {
div()
.child("Failed to load preview. This path should be unreachable")
.into_any_element()
})
} else {
div().child("No preview available").into_any_element()
})
.child(content)
}
}
impl RenderOnce for ComponentPreviewPage {
fn render(self, window: &mut Window, cx: &mut App) -> impl IntoElement {
v_flex()
.id("component-preview-page")
.overflow_y_scroll()
.size_full()
.flex_1()
.overflow_x_hidden()
.w_full()
.child(self.render_header(window, cx))
.child(self.render_preview(window, cx))
}