✨ ags: add center-window and logout-menu windows and more

ags/window/FloatingNotifications.ts

@@ -1,26 +1,29 @@
 import { Astal, Gtk, Widget } from "astal/gtk3";
-import { getNotifd, notifications, removeNotification } from "../scripts/notification-handler";
 import AstalNotifd from "gi://AstalNotifd";
 import { bind } from "astal";
+import { Notifications } from "../scripts/notification-handler";
 
 export const FloatingNotifications: Widget.Window = new Widget.Window({
-    className: "floating-notifications",
     namespace: "floating-notifications",
     canFocus: false,
     anchor: Astal.WindowAnchor.RIGHT,
     monitor: 0,
     layer: Astal.Layer.OVERLAY,
     visible: false,
+    width_request: 350,
     exclusivity: Astal.Exclusivity.NORMAL,
     child: new Widget.Box({
-        className: "notifications",
+        className: "floating-notifications-container",
         orientation: Gtk.Orientation.VERTICAL,
         homogeneous: false,
-        children: bind(getNotifd(), "notifications").as(() => {
-            notifications.length > 0 ? notifications.map((notification: AstalNotifd.Notification) =>
+        children: bind(Notifications, "notifications").as((notifications: Array<AstalNotifd.Notification>) => {
+            console.log("something changed!");
+            return notifications.map((notification: AstalNotifd.Notification) =>
                 new Widget.Box({
                     className: "notification",
                     homogeneous: false,
+                    expand: false,
+                    orientation: Gtk.Orientation.VERTICAL,
                     children: [
                         new Widget.Box({
                             className: "top",
@@ -35,13 +38,40 @@ export const FloatingNotifications: Widget.Window = new Widget.Window({
                                 } as Widget.LabelProps),
                                 new Widget.Button({
                                     className: "close-button",
-                                    onClick: () => removeNotification(notification.id)
+                                    onClick: () => Notifications.removeNotification(notification.id)
                                 } as Widget.ButtonProps)
                             ]
+                        } as Widget.BoxProps),
+                        new Widget.Box({
+                            className: "content",
+                            orientation: Gtk.Orientation.HORIZONTAL,
+                            children: [
+                                new Widget.Box({
+                                    className: "image",
+                                    visible: notification.image !== "",
+                                    css: `.image { background-image: url('${notification.image}'); }`
+                                } as Widget.BoxProps),
+                                new Widget.Box({
+                                    className: "text",
+                                    orientation: Gtk.Orientation.VERTICAL,
+                                    children: [
+                                        new Widget.Label({
+                                            className: "summary",
+                                            useMarkup: true,
+                                            label: notification.summary
+                                        }),
+                                        new Widget.Label({
+                                            className: "body",
+                                            useMarkup: true,
+                                            label: notification.body
+                                        } as Widget.LabelProps)
+                                    ]
+                                } as Widget.BoxProps)
+                            ]
                         } as Widget.BoxProps)
                     ]
                 } as Widget.BoxProps)
-            ) : new Widget.Box({})
+            )
         })
     } as Widget.BoxProps)
 } as Widget.WindowProps);