rules library: Improve empty state & fix quirks on Windows (#41064)

Danilo Leal created

Just got a new Windows machine and realized that the rules library empty
state was completly busted. Ended up also adding some little UI tweaks
to make it better for both Windows and Linux.

Release Notes:

- N/A

Change summary

assets/keymaps/default-linux.json         |   2 
assets/keymaps/default-macos.json         |   2 
assets/keymaps/default-windows.json       |   2 
crates/rules_library/src/rules_library.rs | 111 +++++++++++-------------
4 files changed, 54 insertions(+), 63 deletions(-)

Detailed changes

assets/keymaps/default-linux.json 🔗

@@ -366,7 +366,7 @@
     }
   },
   {
-    "context": "PromptLibrary",
+    "context": "RulesLibrary",
     "bindings": {
       "new": "rules_library::NewRule",
       "ctrl-n": "rules_library::NewRule",

assets/keymaps/default-macos.json 🔗

@@ -423,7 +423,7 @@
     }
   },
   {
-    "context": "PromptLibrary",
+    "context": "RulesLibrary",
     "use_key_equivalents": true,
     "bindings": {
       "cmd-n": "rules_library::NewRule",

assets/keymaps/default-windows.json 🔗

@@ -375,7 +375,7 @@
     }
   },
   {
-    "context": "PromptLibrary",
+    "context": "RulesLibrary",
     "use_key_equivalents": true,
     "bindings": {
       "ctrl-n": "rules_library::NewRule",

crates/rules_library/src/rules_library.rs 🔗

@@ -1102,23 +1102,42 @@ impl RulesLibrary {
             .w_64()
             .overflow_x_hidden()
             .bg(cx.theme().colors().panel_background)
-            .child(
-                h_flex()
-                    .p(DynamicSpacing::Base04.rems(cx))
-                    .h_9()
-                    .w_full()
-                    .flex_none()
-                    .justify_end()
-                    .child(
-                        IconButton::new("new-rule", IconName::Plus)
-                            .tooltip(move |_window, cx| {
-                                Tooltip::for_action("New Rule", &NewRule, cx)
-                            })
-                            .on_click(|_, window, cx| {
-                                window.dispatch_action(Box::new(NewRule), cx);
-                            }),
-                    ),
-            )
+            .map(|this| {
+                if cfg!(target_os = "macos") {
+                    this.child(
+                        h_flex()
+                            .p(DynamicSpacing::Base04.rems(cx))
+                            .h_9()
+                            .w_full()
+                            .flex_none()
+                            .justify_end()
+                            .child(
+                                IconButton::new("new-rule", IconName::Plus)
+                                    .tooltip(move |_window, cx| {
+                                        Tooltip::for_action("New Rule", &NewRule, cx)
+                                    })
+                                    .on_click(|_, window, cx| {
+                                        window.dispatch_action(Box::new(NewRule), cx);
+                                    }),
+                            ),
+                    )
+                } else {
+                    this.child(
+                        h_flex().p_1().w_full().child(
+                            Button::new("new-rule", "New Rule")
+                                .full_width()
+                                .style(ButtonStyle::Outlined)
+                                .icon(IconName::Plus)
+                                .icon_size(IconSize::Small)
+                                .icon_position(IconPosition::Start)
+                                .icon_color(Color::Muted)
+                                .on_click(|_, window, cx| {
+                                    window.dispatch_action(Box::new(NewRule), cx);
+                                }),
+                        ),
+                    )
+                }
+            })
             .child(div().flex_grow().child(self.picker.clone()))
     }
 
@@ -1348,9 +1367,8 @@ impl Render for RulesLibrary {
 
         client_side_decorations(
             v_flex()
-                .bg(theme.colors().background)
                 .id("rules-library")
-                .key_context("PromptLibrary")
+                .key_context("RulesLibrary")
                 .on_action(cx.listener(|this, &NewRule, window, cx| this.new_rule(window, cx)))
                 .on_action(
                     cx.listener(|this, &DeleteRule, window, cx| {
@@ -1368,60 +1386,33 @@ impl Render for RulesLibrary {
                 .font(ui_font)
                 .text_color(theme.colors().text)
                 .children(self.title_bar.clone())
+                .bg(theme.colors().background)
                 .child(
                     h_flex()
                         .flex_1()
+                        .when(!cfg!(target_os = "macos"), |this| {
+                            this.border_t_1().border_color(cx.theme().colors().border)
+                        })
                         .child(self.render_rule_list(cx))
                         .map(|el| {
                             if self.store.read(cx).prompt_count() == 0 {
                                 el.child(
                                     v_flex()
-                                        .w_2_3()
                                         .h_full()
+                                        .flex_1()
                                         .items_center()
                                         .justify_center()
-                                        .gap_4()
+                                        .border_l_1()
+                                        .border_color(cx.theme().colors().border)
                                         .bg(cx.theme().colors().editor_background)
                                         .child(
-                                            h_flex()
-                                                .gap_2()
-                                                .child(
-                                                    Icon::new(IconName::Book)
-                                                        .size(IconSize::Medium)
-                                                        .color(Color::Muted),
-                                                )
-                                                .child(
-                                                    Label::new("No rules yet")
-                                                        .size(LabelSize::Large)
-                                                        .color(Color::Muted),
-                                                ),
-                                        )
-                                        .child(
-                                            h_flex()
-                                                .child(h_flex())
-                                                .child(
-                                                    v_flex()
-                                                        .gap_1()
-                                                        .child(Label::new(
-                                                            "Create your first rule:",
-                                                        ))
-                                                        .child(
-                                                            Button::new("create-rule", "New Rule")
-                                                                .full_width()
-                                                                .key_binding(
-                                                                    KeyBinding::for_action(
-                                                                        &NewRule, cx,
-                                                                    ),
-                                                                )
-                                                                .on_click(|_, window, cx| {
-                                                                    window.dispatch_action(
-                                                                        NewRule.boxed_clone(),
-                                                                        cx,
-                                                                    )
-                                                                }),
-                                                        ),
-                                                )
-                                                .child(h_flex()),
+                                            Button::new("create-rule", "New Rule")
+                                                .style(ButtonStyle::Outlined)
+                                                .key_binding(KeyBinding::for_action(&NewRule, cx))
+                                                .on_click(|_, window, cx| {
+                                                    window
+                                                        .dispatch_action(NewRule.boxed_clone(), cx)
+                                                }),
                                         ),
                                 )
                             } else {