feat(workspace): add option for moving the tab close button to the left

assets/settings/default.json

@@ -128,9 +128,12 @@
   // 4. Save when idle for a certain amount of time:
   //     "autosave": { "after_delay": {"milliseconds": 500} },
   "autosave": "off",
-  // Color tab titles based on the git status of the buffer.
+  // Settings related to the editor's tabs
   "tabs": {
-    "git_status": false
+    // Show git status colors in the editor tabs.
+    "git_status": false,
+    // Position of the close button on the editor tabs.
+    "close_position": "right"
   },
   // Whether or not to remove any trailing whitespace from lines of a buffer
   // before saving it.

crates/theme/src/theme.rs

@@ -723,12 +723,12 @@ pub struct Scrollbar {
     pub thumb: ContainerStyle,
     pub width: f32,
     pub min_height_factor: f32,
-    pub git: FileGitDiffColors,
+    pub git: BufferGitDiffColors,
     pub selections: Color,
 }
 
 #[derive(Clone, Deserialize, Default, JsonSchema)]
-pub struct FileGitDiffColors {
+pub struct BufferGitDiffColors {
     pub inserted: Color,
     pub modified: Color,
     pub deleted: Color,

crates/workspace/src/item.rs

@@ -33,11 +33,30 @@ use theme::Theme;
 #[derive(Deserialize)]
 pub struct ItemSettings {
     pub git_status: bool,
+    pub close_position: ClosePosition,
+}
+
+#[derive(Clone, Default, Serialize, Deserialize, JsonSchema)]
+#[serde(rename_all = "lowercase")]
+pub enum ClosePosition {
+    Left,
+    #[default]
+    Right,
+}
+
+impl ClosePosition {
+    pub fn right(&self) -> bool {
+        match self {
+            ClosePosition::Left => false,
+            ClosePosition::Right => true,
+        }
+    }
 }
 
 #[derive(Clone, Default, Serialize, Deserialize, JsonSchema)]
 pub struct ItemSettingsContent {
     git_status: Option<bool>,
+    close_position: Option<ClosePosition>,
 }
 
 impl Setting for ItemSettings {

crates/workspace/src/pane.rs

@@ -1370,8 +1370,7 @@ impl Pane {
             container.border.left = false;
         }
 
-        Flex::row()
+        let buffer_jewel_element = {
-            .with_child({
             let diameter = 7.0;
             let icon_color = if item.has_conflict(cx) {
                 Some(tab_style.icon_conflict)
@@ -1396,17 +1395,18 @@ impl Pane {
             .with_width(diameter)
             .with_height(diameter)
             .aligned()
-            })
+        };
-            .with_child(title.aligned().contained().with_style(ContainerStyle {
+
+        let title_element = title.aligned().contained().with_style(ContainerStyle {
             margin: Margin {
                 left: tab_style.spacing,
                 right: tab_style.spacing,
                 ..Default::default()
             },
             ..Default::default()
-            }))
+        });
-            .with_child(
+
-                if hovered {
+        let close_element = if hovered {
             let item_id = item.id();
             enum TabCloseButton {}
             let icon = Svg::new("icons/x_mark_8.svg");
@@ -1438,8 +1438,21 @@ impl Pane {
             Empty::new().constrained()
         }
         .with_width(tab_style.close_icon_width)
-                .aligned(),
+        .aligned();
-            )
+
+        let close_right = settings::get::<ItemSettings>(cx).close_position.right();
+
+        if close_right {
+            Flex::row()
+                .with_child(buffer_jewel_element)
+                .with_child(title_element)
+                .with_child(close_element)
+        } else {
+            Flex::row()
+                .with_child(close_element)
+                .with_child(title_element)
+                .with_child(buffer_jewel_element)
+        }
         .contained()
         .with_style(container)
         .constrained()