Fix storybook (#3379)

This PR fixes storybook and gets it back into a compiling and running
state.

Release Notes:

- N/A

Cargo.toml

@@ -97,8 +97,7 @@ members = [
     "crates/sqlez",
     "crates/sqlez_macros",
     "crates/rich_text",
-    # "crates/storybook2",
-    # "crates/storybook3",
+    "crates/storybook2",
     "crates/sum_tree",
     "crates/terminal",
     "crates/terminal2",

crates/storybook2/src/stories.rs

@@ -1,12 +1,10 @@
-mod colors;
 mod focus;
 mod kitchen_sink;
 mod picker;
 mod scroll;
 mod text;
 mod z_index;
 
-pub use colors::*;
 pub use focus::*;
 pub use kitchen_sink::*;
 pub use picker::*;

crates/storybook2/src/stories/focus.rs

@@ -26,7 +26,7 @@ impl FocusStory {
     }
 }
 
-impl Render<Self> for FocusStory {
+impl Render for FocusStory {
     type Element = Focusable<Stateful<Div>>;
 
     fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> Self::Element {
@@ -52,10 +52,8 @@ impl Render<Self> for FocusStory {
             .on_blur(cx.listener(|_, _, _| println!("Parent blurred")))
             .on_focus_in(cx.listener(|_, _, _| println!("Parent focus_in")))
             .on_focus_out(cx.listener(|_, _, _| println!("Parent focus_out")))
-            .on_key_down(
-                cx.listener(|_, event, phase, _| println!("Key down on parent {:?}", event)),
-            )
-            .on_key_up(cx.listener(|_, event, phase, _| println!("Key up on parent {:?}", event)))
+            .on_key_down(cx.listener(|_, event, _| println!("Key down on parent {:?}", event)))
+            .on_key_up(cx.listener(|_, event, _| println!("Key up on parent {:?}", event)))
             .size_full()
             .bg(color_1)
             .focus(|style| style.bg(color_2))

crates/storybook2/src/stories/kitchen_sink.rs

@@ -1,8 +1,10 @@
-use crate::{story::Story, story_selector::ComponentStory};
 use gpui::{prelude::*, Div, Render, Stateful, View};
+use story::Story;
 use strum::IntoEnumIterator;
 use ui::prelude::*;
 
+use crate::story_selector::ComponentStory;
+
 pub struct KitchenSinkStory;
 
 impl KitchenSinkStory {
@@ -19,11 +21,11 @@ impl Render for KitchenSinkStory {
             .map(|selector| selector.story(cx))
             .collect::<Vec<_>>();
 
-        Story::container(cx)
+        Story::container()
             .id("kitchen-sink")
             .overflow_y_scroll()
-            .child(Story::title(cx, "Kitchen Sink"))
-            .child(Story::label(cx, "Components"))
+            .child(Story::title("Kitchen Sink"))
+            .child(Story::label("Components"))
             .child(div().flex().flex_col().children(component_stories))
             // Add a bit of space at the bottom of the kitchen sink so elements
             // don't end up squished right up against the bottom of the screen.

crates/storybook2/src/stories/picker.rs

@@ -36,7 +36,7 @@ impl Delegate {
 }
 
 impl PickerDelegate for Delegate {
-    type ListItem = Div<Picker<Self>>;
+    type ListItem = Div;
 
     fn match_count(&self) -> usize {
         self.candidates.len()
@@ -205,8 +205,8 @@ impl PickerStory {
     }
 }
 
-impl Render<Self> for PickerStory {
-    type Element = Div<Self>;
+impl Render for PickerStory {
+    type Element = Div;
 
     fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> Self::Element {
         div()

crates/storybook2/src/stories/scroll.rs

@@ -10,8 +10,8 @@ impl ScrollStory {
     }
 }
 
-impl Render<Self> for ScrollStory {
-    type Element = Stateful<Self, Div<Self>>;
+impl Render for ScrollStory {
+    type Element = Stateful<Div>;
 
     fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> Self::Element {
         let theme = cx.theme();
@@ -38,7 +38,7 @@ impl Render<Self> for ScrollStory {
                         };
                         div()
                             .id(id)
-                            .tooltip(move |_, cx| Tooltip::text(format!("{}, {}", row, column), cx))
+                            .tooltip(move |cx| Tooltip::text(format!("{}, {}", row, column), cx))
                             .bg(bg)
                             .size(px(100. as f32))
                             .when(row >= 5 && column >= 5, |d| {

crates/storybook2/src/stories/z_index.rs

@@ -1,52 +1,49 @@
 use gpui::{px, rgb, Div, Hsla, Render, RenderOnce};
+use story::Story;
 use ui::prelude::*;
 
-use crate::story::Story;
-
 /// A reimplementation of the MDN `z-index` example, found here:
 /// [https://developer.mozilla.org/en-US/docs/Web/CSS/z-index](https://developer.mozilla.org/en-US/docs/Web/CSS/z-index).
 pub struct ZIndexStory;
 
-impl Render<Self> for ZIndexStory {
-    type Element = Div<Self>;
+impl Render for ZIndexStory {
+    type Element = Div;
 
     fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
-        Story::container(cx)
-            .child(Story::title(cx, "z-index"))
-            .child(
-                div()
-                    .flex()
-                    .child(
-                        div()
-                            .w(px(250.))
-                            .child(Story::label(cx, "z-index: auto"))
-                            .child(ZIndexExample::new(0)),
-                    )
-                    .child(
-                        div()
-                            .w(px(250.))
-                            .child(Story::label(cx, "z-index: 1"))
-                            .child(ZIndexExample::new(1)),
-                    )
-                    .child(
-                        div()
-                            .w(px(250.))
-                            .child(Story::label(cx, "z-index: 3"))
-                            .child(ZIndexExample::new(3)),
-                    )
-                    .child(
-                        div()
-                            .w(px(250.))
-                            .child(Story::label(cx, "z-index: 5"))
-                            .child(ZIndexExample::new(5)),
-                    )
-                    .child(
-                        div()
-                            .w(px(250.))
-                            .child(Story::label(cx, "z-index: 7"))
-                            .child(ZIndexExample::new(7)),
-                    ),
-            )
+        Story::container().child(Story::title("z-index")).child(
+            div()
+                .flex()
+                .child(
+                    div()
+                        .w(px(250.))
+                        .child(Story::label("z-index: auto"))
+                        .child(ZIndexExample::new(0)),
+                )
+                .child(
+                    div()
+                        .w(px(250.))
+                        .child(Story::label("z-index: 1"))
+                        .child(ZIndexExample::new(1)),
+                )
+                .child(
+                    div()
+                        .w(px(250.))
+                        .child(Story::label("z-index: 3"))
+                        .child(ZIndexExample::new(3)),
+                )
+                .child(
+                    div()
+                        .w(px(250.))
+                        .child(Story::label("z-index: 5"))
+                        .child(ZIndexExample::new(5)),
+                )
+                .child(
+                    div()
+                        .w(px(250.))
+                        .child(Story::label("z-index: 7"))
+                        .child(ZIndexExample::new(7)),
+                ),
+        )
     }
 }
 
@@ -77,17 +74,17 @@ trait Styles: Styled + Sized {
     }
 }
 
-impl<V: 'static> Styles for Div<V> {}
+impl Styles for Div {}
 
 #[derive(RenderOnce)]
 struct ZIndexExample {
     z_index: u32,
 }
 
-impl<V: 'static> Component<V> for ZIndexExample {
-    type Rendered = Div<V>;
+impl Component for ZIndexExample {
+    type Rendered = Div;
 
-    fn render(self, view: &mut V, cx: &mut ViewContext<V>) -> Self::Rendered {
+    fn render(self, cx: &mut WindowContext) -> Self::Rendered {
         div()
             .relative()
             .size_full()

crates/storybook2/src/story_selector.rs

@@ -8,94 +8,40 @@ use clap::ValueEnum;
 use gpui::{AnyView, VisualContext};
 use strum::{EnumIter, EnumString, IntoEnumIterator};
 use ui::prelude::*;
-use ui::{AvatarStory, ButtonStory, DetailsStory, IconStory, InputStory, LabelStory};
+use ui::{AvatarStory, ButtonStory, IconStory, InputStory, LabelStory};
 
 #[derive(Debug, PartialEq, Eq, Clone, Copy, strum::Display, EnumString, EnumIter)]
 #[strum(serialize_all = "snake_case")]
 pub enum ComponentStory {
-    AssistantPanel,
     Avatar,
-    Breadcrumb,
-    Buffer,
     Button,
-    ChatPanel,
     Checkbox,
-    CollabPanel,
-    Colors,
-    CommandPalette,
     ContextMenu,
-    Copilot,
-    Details,
-    Facepile,
     Focus,
     Icon,
     Input,
     Keybinding,
     Label,
-    LanguageSelector,
-    MultiBuffer,
-    NotificationsPanel,
-    Palette,
-    Panel,
-    ProjectPanel,
-    Players,
-    RecentProjects,
     Scroll,
-    Tab,
-    TabBar,
-    Terminal,
     Text,
-    ThemeSelector,
-    TitleBar,
-    Toast,
-    Toolbar,
-    TrafficLights,
-    Workspace,
     ZIndex,
     Picker,
 }
 
 impl ComponentStory {
     pub fn story(&self, cx: &mut WindowContext) -> AnyView {
         match self {
-            Self::AssistantPanel => cx.build_view(|_| ui::AssistantPanelStory).into(),
             Self::Avatar => cx.build_view(|_| AvatarStory).into(),
-            Self::Breadcrumb => cx.build_view(|_| ui::BreadcrumbStory).into(),
-            Self::Buffer => cx.build_view(|_| ui::BufferStory).into(),
             Self::Button => cx.build_view(|_| ButtonStory).into(),
-            Self::ChatPanel => cx.build_view(|_| ui::ChatPanelStory).into(),
             Self::Checkbox => cx.build_view(|_| ui::CheckboxStory).into(),
-            Self::CollabPanel => cx.build_view(|_| ui::CollabPanelStory).into(),
-            Self::Colors => cx.build_view(|_| ColorsStory).into(),
-            Self::CommandPalette => cx.build_view(|_| ui::CommandPaletteStory).into(),
             Self::ContextMenu => cx.build_view(|_| ui::ContextMenuStory).into(),
-            Self::Copilot => cx.build_view(|_| ui::CopilotModalStory).into(),
-            Self::Details => cx.build_view(|_| DetailsStory).into(),
-            Self::Facepile => cx.build_view(|_| ui::FacepileStory).into(),
             Self::Focus => FocusStory::view(cx).into(),
             Self::Icon => cx.build_view(|_| IconStory).into(),
             Self::Input => cx.build_view(|_| InputStory).into(),
             Self::Keybinding => cx.build_view(|_| ui::KeybindingStory).into(),
             Self::Label => cx.build_view(|_| LabelStory).into(),
-            Self::LanguageSelector => cx.build_view(|_| ui::LanguageSelectorStory).into(),
-            Self::MultiBuffer => cx.build_view(|_| ui::MultiBufferStory).into(),
-            Self::NotificationsPanel => cx.build_view(|cx| ui::NotificationsPanelStory).into(),
-            Self::Palette => cx.build_view(|cx| ui::PaletteStory).into(),
-            Self::Players => cx.build_view(|_| theme2::PlayerStory).into(),
-            Self::Panel => cx.build_view(|cx| ui::PanelStory).into(),
-            Self::ProjectPanel => cx.build_view(|_| ui::ProjectPanelStory).into(),
-            Self::RecentProjects => cx.build_view(|_| ui::RecentProjectsStory).into(),
             Self::Scroll => ScrollStory::view(cx).into(),
-            Self::Tab => cx.build_view(|_| ui::TabStory).into(),
-            Self::TabBar => cx.build_view(|_| ui::TabBarStory).into(),
-            Self::Terminal => cx.build_view(|_| ui::TerminalStory).into(),
             Self::Text => TextStory::view(cx).into(),
-            Self::ThemeSelector => cx.build_view(|_| ui::ThemeSelectorStory).into(),
-            Self::TitleBar => ui::TitleBarStory::view(cx).into(),
-            Self::Toast => cx.build_view(|_| ui::ToastStory).into(),
-            Self::Toolbar => cx.build_view(|_| ui::ToolbarStory).into(),
-            Self::TrafficLights => cx.build_view(|_| ui::TrafficLightsStory).into(),
-            Self::Workspace => ui::WorkspaceStory::view(cx).into(),
             Self::ZIndex => cx.build_view(|_| ZIndexStory).into(),
             Self::Picker => PickerStory::new(cx).into(),
         }