Fix storybook (#3379)

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

Release Notes:

- N/A

Cargo.lock

@@ -841,6 +841,17 @@ dependencies = [
  "rustc-demangle",
 ]
 
+[[package]]
+name = "backtrace-on-stack-overflow"
+version = "0.3.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "7fd2d70527f3737a1ad17355e260706c1badebabd1fa06a7a053407380df841b"
+dependencies = [
+ "backtrace",
+ "libc",
+ "nix 0.23.2",
+]
+
 [[package]]
 name = "base64"
 version = "0.13.1"
@@ -5559,6 +5570,19 @@ dependencies = [
  "winapi 0.3.9",
 ]
 
+[[package]]
+name = "nix"
+version = "0.23.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "8f3790c00a0150112de0f4cd161e3d7fc4b2d8a5542ffc35f099a2562aecb35c"
+dependencies = [
+ "bitflags 1.3.2",
+ "cc",
+ "cfg-if 1.0.0",
+ "libc",
+ "memoffset 0.6.5",
+]
+
 [[package]]
 name = "nix"
 version = "0.24.3"
@@ -8866,6 +8890,35 @@ dependencies = [
  "gpui2",
 ]
 
+[[package]]
+name = "storybook2"
+version = "0.1.0"
+dependencies = [
+ "anyhow",
+ "backtrace-on-stack-overflow",
+ "chrono",
+ "clap 4.4.4",
+ "editor2",
+ "fuzzy2",
+ "gpui2",
+ "itertools 0.11.0",
+ "language2",
+ "log",
+ "menu2",
+ "picker2",
+ "rust-embed",
+ "serde",
+ "settings2",
+ "simplelog",
+ "smallvec",
+ "story",
+ "strum",
+ "theme",
+ "theme2",
+ "ui2",
+ "util",
+]
+
 [[package]]
 name = "stringprep"
 version = "0.1.4"

Cargo.toml

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

crates/storybook2/src/stories.rs

@@ -1,4 +1,3 @@
-mod colors;
 mod focus;
 mod kitchen_sink;
 mod picker;
@@ -6,7 +5,6 @@ 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(
+            .on_key_down(cx.listener(|_, event, _| println!("Key down on parent {:?}", event)))
-                cx.listener(|_, event, phase, _| println!("Key down on parent {:?}", event)),
+            .on_key_up(cx.listener(|_, event, _| println!("Key up on parent {:?}", event)))
-            )
-            .on_key_up(cx.listener(|_, event, phase, _| 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::title("Kitchen Sink"))
-            .child(Story::label(cx, "Components"))
+            .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 {
+impl Render for PickerStory {
-    type Element = Div<Self>;
+    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 {
+impl Render for ScrollStory {
-    type Element = Stateful<Self, Div<Self>>;
+    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 {
+impl Render for ZIndexStory {
-    type Element = Div<Self>;
+    type Element = Div;
 
     fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
-        Story::container(cx)
+        Story::container().child(Story::title("z-index")).child(
-            .child(Story::title(cx, "z-index"))
+            div()
-            .child(
+                .flex()
-                div()
+                .child(
-                    .flex()
+                    div()
-                    .child(
+                        .w(px(250.))
-                        div()
+                        .child(Story::label("z-index: auto"))
-                            .w(px(250.))
+                        .child(ZIndexExample::new(0)),
-                            .child(Story::label(cx, "z-index: auto"))
+                )
-                            .child(ZIndexExample::new(0)),
+                .child(
-                    )
+                    div()
-                    .child(
+                        .w(px(250.))
-                        div()
+                        .child(Story::label("z-index: 1"))
-                            .w(px(250.))
+                        .child(ZIndexExample::new(1)),
-                            .child(Story::label(cx, "z-index: 1"))
+                )
-                            .child(ZIndexExample::new(1)),
+                .child(
-                    )
+                    div()
-                    .child(
+                        .w(px(250.))
-                        div()
+                        .child(Story::label("z-index: 3"))
-                            .w(px(250.))
+                        .child(ZIndexExample::new(3)),
-                            .child(Story::label(cx, "z-index: 3"))
+                )
-                            .child(ZIndexExample::new(3)),
+                .child(
-                    )
+                    div()
-                    .child(
+                        .w(px(250.))
-                        div()
+                        .child(Story::label("z-index: 5"))
-                            .w(px(250.))
+                        .child(ZIndexExample::new(5)),
-                            .child(Story::label(cx, "z-index: 5"))
+                )
-                            .child(ZIndexExample::new(5)),
+                .child(
-                    )
+                    div()
-                    .child(
+                        .w(px(250.))
-                        div()
+                        .child(Story::label("z-index: 7"))
-                            .w(px(250.))
+                        .child(ZIndexExample::new(7)),
-                            .child(Story::label(cx, "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 {
+impl Component for ZIndexExample {
-    type Rendered = Div<V>;
+    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.rs

@@ -1 +0,0 @@
-pub use ui::Story;

crates/storybook2/src/story_selector.rs

@@ -8,49 +8,22 @@ 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,
 }
@@ -58,44 +31,17 @@ pub enum ComponentStory {
 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(),
         }

crates/storybook2/src/storybook2.rs

@@ -2,7 +2,6 @@
 
 mod assets;
 mod stories;
-mod story;
 mod story_selector;
 
 use std::sync::Arc;
@@ -15,7 +14,6 @@ use gpui::{
 use log::LevelFilter;
 use settings2::{default_settings, Settings, SettingsStore};
 use simplelog::SimpleLogger;
-use story_selector::ComponentStory;
 use theme2::{ThemeRegistry, ThemeSettings};
 use ui::prelude::*;
 
@@ -62,15 +60,13 @@ fn main() {
 
         theme2::init(theme2::LoadThemes::All, cx);
 
-        let selector =
+        let selector = story_selector.unwrap_or(StorySelector::KitchenSink);
-            story_selector.unwrap_or(StorySelector::Component(ComponentStory::Workspace));
 
         let theme_registry = cx.global::<ThemeRegistry>();
         let mut theme_settings = ThemeSettings::get_global(cx).clone();
         theme_settings.active_theme = theme_registry.get(&theme_name).unwrap();
         ThemeSettings::override_global(theme_settings, cx);
 
-        ui::settings::init(cx);
         language::init(cx);
         editor::init(cx);
 
@@ -105,8 +101,8 @@ impl StoryWrapper {
     }
 }
 
-impl Render<Self> for StoryWrapper {
+impl Render for StoryWrapper {
-    type Element = Div<Self>;
+    type Element = Div;
 
     fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
         div()

crates/storybook3/Cargo.toml

@@ -1,17 +0,0 @@
-[package]
-name = "storybook3"
-version = "0.1.0"
-edition = "2021"
-publish = false
-
-[[bin]]
-name = "storybook"
-path = "src/storybook3.rs"
-
-[dependencies]
-anyhow.workspace = true
-
-gpui = { package = "gpui2", path = "../gpui2" }
-ui = { package = "ui2", path = "../ui2", features = ["stories"] }
-theme = { package = "theme2", path = "../theme2", features = ["stories"] }
-settings = { package = "settings2", path = "../settings2"}

crates/storybook3/src/storybook3.rs

@@ -1,87 +0,0 @@
-use anyhow::Result;
-use gpui::{
-    div, px, size, AnyView, Bounds, Div, Render, ViewContext, VisualContext, WindowBounds,
-    WindowOptions,
-};
-use gpui::{white, AssetSource};
-use settings::{default_settings, Settings, SettingsStore};
-use std::borrow::Cow;
-use std::sync::Arc;
-use theme::ThemeSettings;
-use ui::{prelude::*, ContextMenuStory};
-
-struct Assets;
-
-impl AssetSource for Assets {
-    fn load(&self, _path: &str) -> Result<Cow<[u8]>> {
-        todo!();
-    }
-
-    fn list(&self, _path: &str) -> Result<Vec<SharedString>> {
-        Ok(vec![])
-    }
-}
-
-fn main() {
-    let asset_source = Arc::new(Assets);
-    gpui::App::production(asset_source).run(move |cx| {
-        let mut store = SettingsStore::default();
-        store
-            .set_default_settings(default_settings().as_ref(), cx)
-            .unwrap();
-        cx.set_global(store);
-        ui::settings::init(cx);
-        theme::init(theme::LoadThemes::JustBase, cx);
-
-        cx.open_window(
-            WindowOptions {
-                bounds: WindowBounds::Fixed(Bounds {
-                    origin: Default::default(),
-                    size: size(px(1500.), px(780.)).into(),
-                }),
-                ..Default::default()
-            },
-            move |cx| {
-                let ui_font_size = ThemeSettings::get_global(cx).ui_font_size;
-                cx.set_rem_size(ui_font_size);
-
-                cx.build_view(|cx| TestView {
-                    story: cx.build_view(|_| ContextMenuStory).into(),
-                })
-            },
-        );
-
-        cx.activate(true);
-    })
-}
-
-struct TestView {
-    #[allow(unused)]
-    story: AnyView,
-}
-
-impl Render<Self> for TestView {
-    type Element = Div<Self>;
-
-    fn render(&mut self, _cx: &mut ViewContext<Self>) -> Self::Element {
-        div()
-            .flex()
-            .bg(gpui::blue())
-            .flex_col()
-            .size_full()
-            .font("Helvetica")
-            .child(div().h_5())
-            .child(
-                div()
-                    .flex()
-                    .w_96()
-                    .bg(white())
-                    .relative()
-                    .child(div().child(concat!(
-            "The quick brown fox jumps over the lazy dog. ",
-            "Meanwhile, the lazy dog decided it was time for a change. ",
-            "He started daily workout routines, ate healthier and became the fastest dog in town.",
-        ))),
-            )
-    }
-}

crates/ui2/src/components/stories.rs

@@ -6,3 +6,12 @@ mod icon;
 mod input;
 mod keybinding;
 mod label;
+
+pub use avatar::*;
+pub use button::*;
+pub use checkbox::*;
+pub use context_menu::*;
+pub use icon::*;
+pub use input::*;
+pub use keybinding::*;
+pub use label::*;

script/deploy-docs

@@ -123,7 +123,6 @@ CARGO_TARGET_DIR="$TARGET_DIR" cargo doc --workspace --no-deps --open \
 --exclude snippet \
 --exclude sqlez \
 --exclude sqlez_macros \
---exclude storybook3 \
 --exclude sum_tree \
 --exclude terminal \
 --exclude terminal_view \