Spike native shells and define local-first integrations

2026-08-31 15:42:26 -07:00
parent a703b5a5ee
commit aaa1cb1fa9
28 changed files with 14809 additions and 14 deletions
@@ -0,0 +1,192 @@
+use gpui::{
+    App, Application, Bounds, Context, Window, WindowBounds, WindowOptions, div, prelude::*, px,
+    rgb, size,
+};
+use lumbridge_spike_model::{
+    FOOTER_CENTER, FOOTER_LEFT, FOOTER_RIGHT, PANES, PaneFixture, WORKSPACES,
+};
+
+const BG: u32 = 0x0c0e13;
+const PANEL: u32 = 0x121722;
+const PANEL_ALT: u32 = 0x171d29;
+const BORDER: u32 = 0x293244;
+const TEXT: u32 = 0xd9e2f2;
+const MUTED: u32 = 0x7f8ba3;
+const ACCENT: u32 = 0x77bdfb;
+
+struct LumbridgeShell;
+
+fn pane_card(pane: &PaneFixture) -> impl IntoElement {
+    div()
+        .flex()
+        .flex_col()
+        .min_w_0()
+        .min_h_0()
+        .overflow_hidden()
+        .bg(rgb(PANEL))
+        .border_1()
+        .border_color(rgb(BORDER))
+        .rounded_md()
+        .child(
+            div()
+                .flex()
+                .items_center()
+                .justify_between()
+                .px_3()
+                .h(px(34.0))
+                .bg(rgb(PANEL_ALT))
+                .border_b_1()
+                .border_color(rgb(BORDER))
+                .text_sm()
+                .text_color(rgb(TEXT))
+                .child(pane.title)
+                .child(div().text_xs().text_color(rgb(ACCENT)).child(pane.badge)),
+        )
+        .child(
+            div()
+                .px_3()
+                .py_2()
+                .text_xs()
+                .text_color(rgb(MUTED))
+                .child(pane.target),
+        )
+        .child(
+            div()
+                .flex()
+                .flex_col()
+                .gap_1()
+                .px_3()
+                .pb_3()
+                .text_sm()
+                .text_color(rgb(TEXT))
+                .children(pane.lines.into_iter()),
+        )
+}
+
+impl Render for LumbridgeShell {
+    fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
+        let sidebar = div()
+            .flex()
+            .flex_col()
+            .w(px(220.0))
+            .flex_none()
+            .bg(rgb(PANEL))
+            .border_r_1()
+            .border_color(rgb(BORDER))
+            .child(
+                div()
+                    .px_4()
+                    .py_3()
+                    .text_sm()
+                    .text_color(rgb(MUTED))
+                    .child("WORKSPACES"),
+            )
+            .children(WORKSPACES.into_iter().enumerate().map(|(index, name)| {
+                div()
+                    .mx_2()
+                    .mb_1()
+                    .px_3()
+                    .py_2()
+                    .rounded_md()
+                    .when(index == 0, |view| {
+                        view.bg(rgb(PANEL_ALT)).text_color(rgb(TEXT))
+                    })
+                    .when(index != 0, |view| view.text_color(rgb(MUTED)))
+                    .child(name)
+            }))
+            .child(
+                div()
+                    .mt_4()
+                    .px_4()
+                    .text_xs()
+                    .text_color(rgb(MUTED))
+                    .child("HOSTS")
+                    .child(
+                        div()
+                            .mt_2()
+                            .text_color(rgb(ACCENT))
+                            .child("● metal · connected"),
+                    )
+                    .child(div().mt_2().child("● amd-server · connected"))
+                    .child(div().mt_2().child("○ spark-1 · sleeping")),
+            );
+
+        let grid = div()
+            .grid()
+            .grid_cols(3)
+            .grid_rows(2)
+            .gap_2()
+            .p_2()
+            .size_full()
+            .children(PANES.iter().map(pane_card));
+
+        div()
+            .flex()
+            .flex_col()
+            .size_full()
+            .bg(rgb(BG))
+            .text_color(rgb(TEXT))
+            .child(
+                div()
+                    .flex()
+                    .items_center()
+                    .justify_between()
+                    .h(px(46.0))
+                    .flex_none()
+                    .px_4()
+                    .bg(rgb(PANEL_ALT))
+                    .border_b_1()
+                    .border_color(rgb(BORDER))
+                    .child(div().text_lg().child("Lumbridge"))
+                    .child(
+                        div()
+                            .text_sm()
+                            .text_color(rgb(MUTED))
+                            .child("UI spike · GPUI"),
+                    )
+                    .child(
+                        div()
+                            .text_sm()
+                            .text_color(rgb(ACCENT))
+                            .child("⌘K  Command Palette"),
+                    ),
+            )
+            .child(div().flex().flex_1().min_h_0().child(sidebar).child(grid))
+            .child(
+                div()
+                    .flex()
+                    .items_center()
+                    .justify_between()
+                    .h(px(30.0))
+                    .flex_none()
+                    .px_3()
+                    .bg(rgb(PANEL_ALT))
+                    .border_t_1()
+                    .border_color(rgb(BORDER))
+                    .text_xs()
+                    .text_color(rgb(MUTED))
+                    .child(FOOTER_LEFT)
+                    .child(FOOTER_CENTER)
+                    .child(FOOTER_RIGHT),
+            )
+    }
+}
+
+fn main() {
+    Application::new().run(|cx: &mut App| {
+        let bounds = Bounds::centered(None, size(px(1280.0), px(800.0)), cx);
+        cx.open_window(
+            WindowOptions {
+                window_bounds: Some(WindowBounds::Windowed(bounds)),
+                titlebar: Some(gpui::TitlebarOptions {
+                    title: Some("Lumbridge · GPUI spike".into()),
+                    ..Default::default()
+                }),
+                ..Default::default()
+            },
+            |_, cx| cx.new(|_| LumbridgeShell),
+        )
+        .expect("GPUI spike window should open");
+        cx.activate(true);
+    });
+}