update

crates/ui/src/dock/mod.rs

@@ -24,7 +24,7 @@ use crate::menu::DropdownMenu as _;
 use crate::resizable::{resize_handle, resize_handle_appearance};
 use crate::tab::Tab;
 use crate::tab::tab_bar::TabBar;
-use crate::title_bar::{title_bar_drag_handlers, window_controls};
+use crate::title_bar::{TRAFFIC_LIGHT_PADDING, title_bar_drag_handlers, window_controls};
 use crate::{IconName, Selectable, Sizable, StyledExt, h_flex, v_flex};
 
 mod panel;
@@ -429,6 +429,42 @@ impl TabGroupSkin {
             == Some(group.node())
     }
 
+    /// Whether this group is the left dock's root with a single panel.
+    ///
+    /// Such a group draws no tab bar, so its panel owns the window's top-left
+    /// corner — including the space the macOS traffic lights overlay.
+    fn is_plain_left_group(&self, group: &TabGroupContext, cx: &App) -> bool {
+        let Some(area) = self.shared.area() else {
+            return false;
+        };
+        let area = area.read(cx);
+
+        area.layout(DockPlacement::Left)
+            .map(|tree| tree.root().id())
+            == Some(group.node())
+            && group.panels().len() == 1
+    }
+
+    /// Whether this group is the topmost-left group on screen, which sits under
+    /// the native macOS traffic lights. The left dock's group is leftmost while
+    /// it is open and holds a panel; the center's is leftmost otherwise.
+    fn is_leftmost_top_group(&self, group: &TabGroupContext, cx: &App) -> bool {
+        let Some(area) = self.shared.area() else {
+            return false;
+        };
+        let area = area.read(cx);
+
+        let left_open =
+            area.is_dock_open(DockPlacement::Left) && !area.is_empty(DockPlacement::Left, cx);
+        let tree = if left_open {
+            area.layout(DockPlacement::Left)
+        } else {
+            area.layout(DockPlacement::Center)
+        };
+
+        tree.and_then(|tree| left_top_group(tree.root())) == Some(group.node())
+    }
+
     fn render_toolbar(
         &self,
         group: &TabGroupContext,
@@ -509,6 +545,8 @@ impl TabGroupSkin {
         let has_leading = left_button.is_some() || bottom_button.is_some();
         let drag = tab_drag(group, ix, cx);
         let is_title_bar = self.is_title_bar_group(group, cx);
+        let needs_traffic_light_padding =
+            cfg!(target_os = "macos") && self.is_leftmost_top_group(group, cx);
         let trailing_chrome = is_title_bar
             .then(|| self.shared.chrome.trailing(window, cx))
             .flatten();
@@ -532,6 +570,9 @@ impl TabGroupSkin {
                         .children(bottom_button),
                 )
             })
+            .when(needs_traffic_light_padding, |this| {
+                this.pl(px(TRAFFIC_LIGHT_PADDING))
+            })
             .child(
                 div()
                     .id("tab")
@@ -612,6 +653,8 @@ impl TabGroupSkin {
                 .position(|panel| panel.panel_id(cx) == displayed)
         });
         let is_title_bar = self.is_title_bar_group(group, cx);
+        let needs_traffic_light_padding =
+            cfg!(target_os = "macos") && self.is_leftmost_top_group(group, cx);
         let trailing_chrome = is_title_bar
             .then(|| self.shared.chrome.trailing(window, cx))
             .flatten();
@@ -640,6 +683,9 @@ impl TabGroupSkin {
             .track_scroll(&self.scroll_handle)
             .h(TABBAR_HEIGHT)
             .bg(cx.theme().panel_background)
+            .when(needs_traffic_light_padding, |this| {
+                this.pl(px(TRAFFIC_LIGHT_PADDING))
+            })
             .when(is_title_bar || has_leading, |this| {
                 this.prefix(
                     h_flex()
@@ -834,6 +880,12 @@ impl TabGroupRenderer for TabGroupSkin {
         window: &mut Window,
         cx: &mut App,
     ) -> AnyElement {
+        // The left dock's only panel draws bare, so its content can own the
+        // window's top-left corner instead of a tab bar doing so.
+        if self.is_plain_left_group(group, cx) {
+            return Empty.into_any_element();
+        }
+
         let visible: Vec<usize> = group
             .panels()
             .iter()