Add additional notifications and style tweaks

Nate Butler and Marshall Bowers created

Co-Authored-By: Marshall Bowers <1486634+maxdeviant@users.noreply.github.com>

Change summary

crates/ui2/src/components/notifications_panel.rs |  25 +--
crates/ui2/src/elements/indicator.rs             |   1 
crates/ui2/src/static_data.rs                    | 107 ++++++++++++++++-
3 files changed, 111 insertions(+), 22 deletions(-)

Detailed changes

crates/ui2/src/components/notifications_panel.rs 🔗

@@ -1,6 +1,6 @@
 use crate::{
-    h_stack, prelude::*, static_new_notification_items, v_stack, Avatar, Button, Icon, IconButton,
-    IconElement, Label, LabelColor, LineHeightStyle, ListHeaderMeta, ListSeparator,
+    h_stack, prelude::*, static_new_notification_items_2, v_stack, Avatar, Button, Icon,
+    IconButton, IconElement, Label, LabelColor, LineHeightStyle, ListHeaderMeta, ListSeparator,
     UnreadIndicator,
 };
 use crate::{ClickHandler, ListHeader};
@@ -51,17 +51,11 @@ impl NotificationsPanel {
                                     .line_height_style(LineHeightStyle::UILabel),
                             ),
                     )
-                    .children(static_new_notification_items()),
+                    .child(v_stack().px_1().children(static_new_notification_items_2())),
             )
     }
 }
 
-pub enum NotificationItem<V: 'static> {
-    Message(Notification<V>),
-    // WithEdgeHeader(Notification<V>),
-    WithRequiredActions(NotificationWithActions<V>),
-}
-
 pub enum ButtonOrIconButton<V: 'static> {
     Button(Button<V>),
     IconButton(IconButton<V>),
@@ -106,11 +100,6 @@ impl<V: 'static> NotificationAction<V> {
     }
 }
 
-pub struct NotificationWithActions<V: 'static> {
-    notification: Notification<V>,
-    actions: [NotificationAction<V>; 2],
-}
-
 pub enum ActorOrIcon {
     Actor(PublicActor),
     Icon(Icon),
@@ -280,21 +269,29 @@ impl<V> Notification<V> {
         div()
             .relative()
             .id(self.id.clone())
+            .p_1()
+            .flex()
+            .flex_col()
+            .w_full()
             .children(
                 Some(
                     div()
                         .absolute()
                         .left(px(3.0))
                         .top_3()
+                        .z_index(2)
                         .child(UnreadIndicator::new()),
                 )
                 .filter(|_| self.unread),
             )
             .child(
                 v_stack()
+                    .z_index(1)
                     .gap_1()
+                    .w_full()
                     .child(
                         h_stack()
+                            .w_full()
                             .gap_2()
                             .child(self.render_slot(cx))
                             .child(div().flex_1().child(Label::new(self.message.clone()))),

crates/ui2/src/elements/indicator.rs 🔗

@@ -12,6 +12,7 @@ impl UnreadIndicator {
 
     fn render<V: 'static>(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
         div()
+            .rounded_full()
             .border_2()
             .border_color(cx.theme().colors().surface)
             .w(px(9.0))

crates/ui2/src/static_data.rs 🔗

@@ -9,9 +9,8 @@ use theme2::ActiveTheme;
 use crate::{
     Buffer, BufferRow, BufferRows, Button, EditorPane, FileSystemStatus, GitStatus,
     HighlightedLine, Icon, Keybinding, Label, LabelColor, ListEntry, ListEntrySize, ListSubHeader,
-    Livestream, MicStatus, ModifierKeys, Notification, NotificationItem, PaletteItem, Player,
-    PlayerCallStatus, PlayerWithCallStatus, PublicActor, ScreenShareStatus, Symbol, Tab,
-    ToggleState, VideoStatus,
+    Livestream, MicStatus, ModifierKeys, Notification, PaletteItem, Player, PlayerCallStatus,
+    PlayerWithCallStatus, PublicActor, ScreenShareStatus, Symbol, Tab, ToggleState, VideoStatus,
 };
 use crate::{HighlightedText, ListDetailsEntry};
 use crate::{ListItem, NotificationAction};
@@ -328,15 +327,15 @@ pub fn static_players_with_call_status() -> Vec<PlayerWithCallStatus> {
     ]
 }
 
-pub fn static_new_notification_items_2<V: 'static>() -> Vec<NotificationItem<V>> {
+pub fn static_new_notification_items_2<V: 'static>() -> Vec<Notification<V>> {
     vec![
-        NotificationItem::Message(Notification::new_icon_message(
+        Notification::new_icon_message(
             "notif-1",
             "You were mentioned in a note.",
             Icon::AtSign,
             Arc::new(|_, _| {}),
-        )),
-        NotificationItem::Message(Notification::new_actor_with_actions(
+        ),
+        Notification::new_actor_with_actions(
             "notif-2",
             "as-cii sent you a contact request.",
             PublicActor::new("as-cii", "http://github.com/as-cii.png?s=50"),
@@ -352,7 +351,99 @@ pub fn static_new_notification_items_2<V: 'static>() -> Vec<NotificationItem<V>>
                     (Some(Icon::Check), "Accepted"),
                 ),
             ],
-        )),
+        ),
+        Notification::new_icon_message(
+            "notif-3",
+            "You were mentioned #design.",
+            Icon::MessageBubbles,
+            Arc::new(|_, _| {}),
+        ),
+        Notification::new_actor_with_actions(
+            "notif-4",
+            "as-cii sent you a contact request.",
+            PublicActor::new("as-cii", "http://github.com/as-cii.png?s=50"),
+            [
+                NotificationAction::new(
+                    Button::new("Decline"),
+                    "Decline Request",
+                    (Some(Icon::XCircle), "Declined"),
+                ),
+                NotificationAction::new(
+                    Button::new("Accept").variant(crate::ButtonVariant::Filled),
+                    "Accept Request",
+                    (Some(Icon::Check), "Accepted"),
+                ),
+            ],
+        ),
+        Notification::new_icon_message(
+            "notif-5",
+            "You were mentioned in a note.",
+            Icon::AtSign,
+            Arc::new(|_, _| {}),
+        ),
+        Notification::new_actor_with_actions(
+            "notif-6",
+            "as-cii sent you a contact request.",
+            PublicActor::new("as-cii", "http://github.com/as-cii.png?s=50"),
+            [
+                NotificationAction::new(
+                    Button::new("Decline"),
+                    "Decline Request",
+                    (Some(Icon::XCircle), "Declined"),
+                ),
+                NotificationAction::new(
+                    Button::new("Accept").variant(crate::ButtonVariant::Filled),
+                    "Accept Request",
+                    (Some(Icon::Check), "Accepted"),
+                ),
+            ],
+        ),
+        Notification::new_icon_message(
+            "notif-7",
+            "You were mentioned in a note.",
+            Icon::AtSign,
+            Arc::new(|_, _| {}),
+        ),
+        Notification::new_actor_with_actions(
+            "notif-8",
+            "as-cii sent you a contact request.",
+            PublicActor::new("as-cii", "http://github.com/as-cii.png?s=50"),
+            [
+                NotificationAction::new(
+                    Button::new("Decline"),
+                    "Decline Request",
+                    (Some(Icon::XCircle), "Declined"),
+                ),
+                NotificationAction::new(
+                    Button::new("Accept").variant(crate::ButtonVariant::Filled),
+                    "Accept Request",
+                    (Some(Icon::Check), "Accepted"),
+                ),
+            ],
+        ),
+        Notification::new_icon_message(
+            "notif-9",
+            "You were mentioned in a note.",
+            Icon::AtSign,
+            Arc::new(|_, _| {}),
+        ),
+        Notification::new_actor_with_actions(
+            "notif-10",
+            "as-cii sent you a contact request.",
+            PublicActor::new("as-cii", "http://github.com/as-cii.png?s=50"),
+            [
+                NotificationAction::new(
+                    Button::new("Decline"),
+                    "Decline Request",
+                    (Some(Icon::XCircle), "Declined"),
+                ),
+                NotificationAction::new(
+                    Button::new("Accept").variant(crate::ButtonVariant::Filled),
+                    "Accept Request",
+                    (Some(Icon::Check), "Accepted"),
+                ),
+            ],
+        ),
     ]
 }