Add close menu to Panel. (#196)

crates/app/src/story_workspace.rs

@@ -39,7 +39,6 @@ pub fn init(_app_state: Arc<AppState>, cx: &mut AppContext) {
 
 pub struct StoryWorkspace {
     locale_selector: View<LocaleSelector>,
-    // stack_panel: View<StackPanel>,
     dock_area: View<DockArea>,
 }
 

crates/ui/locales/ui.yml

@@ -91,6 +91,10 @@ Dock:
     en: Unnamed
     zh-CN: 未命名
     zh-HK: 未命名
+  Close:
+    en: Close
+    zh-CN: 关闭
+    zh-HK: 關閉
   Zoom In:
     en: Zoom In
     zh-CN: 放大

crates/ui/src/dock/mod.rs

@@ -3,21 +3,19 @@ mod stack_panel;
 mod tab_panel;
 
 use gpui::{
-    actions, div, prelude::FluentBuilder, AnyView, InteractiveElement as _, IntoElement,
+    actions, div, prelude::FluentBuilder, AnyWeakView, InteractiveElement as _, IntoElement,
     ParentElement as _, Render, Styled, View, ViewContext,
 };
 pub use panel::*;
 pub use stack_panel::*;
 pub use tab_panel::*;
 
-use crate::theme::ActiveTheme;
+actions!(dock, [ToggleZoom, ClosePanel]);
-
-actions!(dock, [ToggleZoom]);
 
 /// The main area of the dock.
 pub struct DockArea {
     root: View<StackPanel>,
-    zoom_view: Option<AnyView>,
+    zoom_view: Option<AnyWeakView>,
 }
 
 impl DockArea {
@@ -33,28 +31,24 @@ impl DockArea {
         if self.zoom_view.is_some() {
             self.zoom_view = None;
         } else {
-            self.zoom_view = Some(panel.into());
+            self.zoom_view = Some(panel.downgrade().into());
         }
         cx.notify();
     }
 }
 
 impl Render for DockArea {
-    fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
+    fn render(&mut self, _: &mut ViewContext<Self>) -> impl IntoElement {
         div()
             .id("dock-area")
             .size_full()
             .overflow_hidden()
-            .map(|this| match self.zoom_view.clone() {
+            .map(|this| {
-                Some(view) => this.bg(cx.theme().tab_bar).p_3().child(
+                if let Some(zoom_view) = self.zoom_view.as_ref().and_then(|view| view.upgrade()) {
-                    div()
+                    this.child(zoom_view)
-                        .size_full()
+                } else {
-                        .border_1()
+                    this.child(self.root.clone())
-                        .border_color(cx.theme().border)
+                }
-                        .shadow_lg()
-                        .child(view),
-                ),
-                None => this.child(self.root.clone()),
             })
     }
 }

crates/ui/src/dock/tab_panel.rs

@@ -18,7 +18,7 @@ use crate::{
     v_flex, AxisExt, IconName, Placement, Selectable, Sizable, StyledExt,
 };
 
-use super::{DockArea, Panel, PanelView, StackPanel, ToggleZoom};
+use super::{ClosePanel, DockArea, Panel, PanelView, StackPanel, ToggleZoom};
 
 pub enum PanelEvent {
     ZoomIn,
@@ -195,6 +195,8 @@ impl TabPanel {
                             },
                             Box::new(ToggleZoom),
                         )
+                        .separator()
+                        .menu(t!("Dock.Close"), Box::new(ClosePanel))
                     })
                     .anchor(AnchorCorner::TopRight),
             )
@@ -488,6 +490,12 @@ impl TabPanel {
             cx.emit(PanelEvent::ZoomOut)
         }
     }
+
+    fn on_action_close_panel(&mut self, _: &ClosePanel, cx: &mut ViewContext<Self>) {
+        if let Some(panel) = self.active_panel() {
+            self.remove_panel(panel, cx);
+        }
+    }
 }
 
 impl Panel for TabPanel {}
@@ -505,6 +513,7 @@ impl Render for TabPanel {
             .id("tab-panel")
             .track_focus(&self.focus_handle)
             .on_action(cx.listener(Self::on_action_toggle_zoom))
+            .on_action(cx.listener(Self::on_action_close_panel))
             .size_full()
             .overflow_hidden()
             .bg(cx.theme().background)