notification: Fix display issues caused by the taffy upgrade (#1084)

crates/story/examples/dock.rs

@@ -11,9 +11,9 @@ use serde::Deserialize;
 use std::{sync::Arc, time::Duration};
 use story::{
     AccordionStory, AppState, AppTitleBar, Assets, ButtonStory, CalendarStory, DropdownStory,
-    FormStory, IconStory, ImageStory, InputStory, LabelStory, ListStory, ModalStory, Open,
-    PopoverStory, ProgressStory, ResizableStory, ScrollableStory, SidebarStory, StoryContainer,
-    SwitchStory, TableStory, TooltipStory, WebViewStory,
+    FormStory, IconStory, ImageStory, InputStory, LabelStory, ListStory, ModalStory,
+    NotificationStory, Open, PopoverStory, ProgressStory, ResizableStory, ScrollableStory,
+    SidebarStory, StoryContainer, SwitchStory, TableStory, TooltipStory, WebViewStory,
 };
 
 #[derive(Action, Clone, PartialEq, Eq, Deserialize)]
@@ -361,6 +361,7 @@ impl StoryWorkspace {
                     Arc::new(StoryContainer::panel::<AccordionStory>(window, cx)),
                     Arc::new(StoryContainer::panel::<SidebarStory>(window, cx)),
                     Arc::new(StoryContainer::panel::<FormStory>(window, cx)),
+                    Arc::new(StoryContainer::panel::<NotificationStory>(window, cx)),
                 ],
                 None,
                 &dock_area,
@@ -522,7 +523,7 @@ impl Render for StoryWorkspace {
             .child(self.dock_area.clone())
             .children(drawer_layer)
             .children(modal_layer)
-            .child(div().absolute().top_8().children(notification_layer))
+            .children(notification_layer)
     }
 }
 

crates/story/examples/tiles.rs

@@ -412,7 +412,7 @@ impl Render for StoryTiles {
             .child(self.dock_area.clone())
             .children(drawer_layer)
             .children(modal_layer)
-            .child(div().absolute().top_8().children(notification_layer))
+            .children(notification_layer)
     }
 }
 

crates/story/src/lib.rs

@@ -245,7 +245,7 @@ impl Render for StoryRoot {
             )
             .children(drawer_layer)
             .children(modal_layer)
-            .child(div().absolute().top_8().children(notification_layer))
+            .children(notification_layer)
     }
 }
 

crates/ui/src/notification.rs

@@ -398,7 +398,7 @@ impl NotificationList {
                 if let Err(err) =
                     notification.update_in(cx, |note, window, cx| note.dismiss(window, cx))
                 {
-                    println!("failed to auto hide notification: {:?}", err);
+                    tracing::error!("failed to auto hide notification: {:?}", err);
                 }
             })
             .detach();
@@ -438,26 +438,16 @@ impl Render for NotificationList {
         let size = window.viewport_size();
         let items = self.notifications.iter().rev().take(10).rev().cloned();
 
-        div()
-            .absolute()
-            .flex()
-            .top_4()
-            .bottom_4()
-            .right_4()
-            .justify_end()
-            .child(
-                v_flex()
-                    .id("notification-list")
-                    .absolute()
-                    .relative()
-                    .right_0()
-                    .h(size.height - px(8.))
-                    .on_hover(cx.listener(|view, hovered, _, cx| {
-                        view.expanded = *hovered;
-                        cx.notify()
-                    }))
-                    .gap_3()
-                    .children(items),
-            )
+        div().absolute().top_4().right_4().child(
+            v_flex()
+                .id("notification-list")
+                .h(size.height - px(8.))
+                .on_hover(cx.listener(|view, hovered, _, cx| {
+                    view.expanded = *hovered;
+                    cx.notify()
+                }))
+                .gap_3()
+                .children(items),
+        )
     }
 }

crates/ui/src/root.rs

@@ -277,6 +277,9 @@ impl Root {
 
         Some(
             div()
+                .absolute()
+                .top_0()
+                .right_0()
                 .when_some(mt, |this, offset| this.mt(offset))
                 .when_some(mr, |this, offset| this.mr(offset))
                 .child(root.read(cx).notification.clone()),