From 2396c918f2477e45af8649aee86eecb23b1a83d6 Mon Sep 17 00:00:00 2001
From: Jason Lee <huacnlee@gmail.com>
Date: Thu, 25 Jul 2024 15:53:57 +0800
Subject: [PATCH] Hide scrollbar when scroll are is small than container. (#71)

---
 crates/story/src/scrollable_story.rs | 12 +++++++++++-
 crates/ui/src/scroll/scrollbar.rs    | 10 +++++++++-
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/crates/story/src/scrollable_story.rs b/crates/story/src/scrollable_story.rs
index a44eeb7c..baf26946 100644
--- a/crates/story/src/scrollable_story.rs
+++ b/crates/story/src/scrollable_story.rs
@@ -43,9 +43,12 @@ impl ScrollableStory {
         } else if n == 1 {
             self.items = (0..100).map(|i| format!("Item {}", i)).collect::<Vec<_>>();
             self.test_width = px(10000.);
-        } else {
+        } else if n == 2 {
             self.items = (0..500).map(|i| format!("Item {}", i)).collect::<Vec<_>>();
             self.test_width = px(10000.);
+        } else {
+            self.items = (0..5).map(|i| format!("Item {}", i)).collect::<Vec<_>>();
+            self.test_width = px(10000.);
         }
         self.scroll_state.set(ScrollbarState::default());
         cx.notify();
@@ -87,6 +90,13 @@ impl Render for ScrollableStory {
                                 view.change_test_cases(2, cx);
                             })),
                     )
+                    .child(
+                        Button::new("test-3", cx)
+                            .label("Size 3")
+                            .on_click(cx.listener(|view, _, cx| {
+                                view.change_test_cases(3, cx);
+                            })),
+                    )
                     .child(Divider::vertical().px_2())
                     .child(
                         Button::new("test-axis-both", cx)
diff --git a/crates/ui/src/scroll/scrollbar.rs b/crates/ui/src/scroll/scrollbar.rs
index 59db0b89..78e36a5d 100644
--- a/crates/ui/src/scroll/scrollbar.rs
+++ b/crates/ui/src/scroll/scrollbar.rs
@@ -131,6 +131,8 @@ impl ScrollbarAxis {
         match self {
             Self::Vertical => vec![Self::Vertical],
             Self::Horizontal => vec![Self::Horizontal],
+            // This should keep vertical first, vertical is the primary axis
+            // if vertical not need display, then horizontal will not keep right margin.
             Self::Both => vec![Self::Vertical, Self::Horizontal],
         }
     }
@@ -293,7 +295,7 @@ impl Element for Scrollbar {
         cx: &mut gpui::WindowContext,
     ) {
         let hitbox_bounds = hitbox.bounds;
-        let has_both = self.axis.is_both();
+        let mut has_both = self.axis.is_both();
 
         cx.with_content_mask(
             Some(ContentMask {
@@ -323,6 +325,12 @@ impl Element for Scrollbar {
                         px(0.)
                     };
 
+                    // Hide scrollbar, if the scroll area is smaller than the container.
+                    if scroll_area_size <= container_size {
+                        has_both = false;
+                        continue;
+                    }
+
                     let thumb_length = (container_size / scroll_area_size * container_size)
                         .max(px(MIN_THUMB_SIZE));
                     let thumb_start = -(scroll_position / (scroll_area_size - container_size)