Move from dunst to ags for notifications

home.nix

@@ -6,11 +6,11 @@
   home.homeDirectory = "/home/pan";
 
   imports = [
+    # ./programs/dunst
     # ./programs/eww
     ./programs/ags
     ./programs/alacritty
     ./programs/discord
-    ./programs/dunst
     ./programs/fish
     ./programs/git
     ./programs/hypr

programs/ags/config/config.js

@@ -1,7 +1,9 @@
-import { Switch } from "./modules/workspace-switch.js";
+// import { Switch } from "./modules/workspace-switch.js";
+import { notificationPopup } from "./modules/notifications/notificationPopup.ts"
 
 export default {
+    style: App.configDir + '/modules/notifications/style.css',
     windows: [
-        Switch(1)
+        notificationPopup()
     ]
 }

programs/ags/config/modules/notifications/notificationPopup.ts

@@ -0,0 +1,71 @@
+const notifications = await Service.import('notifications');
+const popups = notifications.bind('popups');
+
+export const notificationPopup = (monitor = 0) => {
+    return Widget.Window({
+        name: 'notifications',
+        anchor: ['bottom', 'right'],
+        child: Widget.Box({
+            class_name: 'notifications',
+            vertical: true,
+            children: popups.as(popups => popups.map(Notification)),
+        }),
+    });
+};
+
+/** @param {import('resource:///com/github/Aylur/ags/service/notifications.js').Notification} n */
+const Notification = n => {
+    const title = Widget.Label({
+        class_name: 'title',
+        xalign: 0,
+        justification: 'left',
+        hexpand: true,
+        max_width_chars: 24,
+        truncate: 'end',
+        wrap: true,
+        label: n.summary,
+        use_markup: true,
+    });
+
+    const body = Widget.Label({
+        class_name: 'body',
+        hexpand: true,
+        use_markup: true,
+        xalign: 0,
+        justification: 'left',
+        label: n.body,
+        wrap: true,
+    });
+
+    const actions = Widget.Box({
+        class_name: 'actions',
+        children: n.actions.map(({ id, label }) => Widget.Button({
+            class_name: 'action-button',
+            on_clicked: () => n.invoke(id),
+            hexpand: true,
+            child: Widget.Label(label),
+        })),
+    });
+
+    return Widget.EventBox({
+        on_primary_click: () => n.dismiss(),
+        child: Widget.Box({
+            class_name: `notification ${n.urgency}`,
+            vertical: true,
+            children: [
+                Widget.Box({
+                    children: [
+                        Widget.Box({
+                            vertical: true,
+                            children: [
+                                title,
+                                body,
+                            ],
+                        }),
+                    ],
+                }),
+                actions,
+            ],
+        }),
+    });
+};

programs/ags/config/modules/notifications/style.css

@@ -0,0 +1,61 @@
+window#notifications {
+    all: unset;
+}
+
+window#notifications box.notifications {
+    padding: .5em;
+}
+
+.icon {
+    min-width: 68px;
+    min-height: 68px;
+    margin-right: 1em;
+}
+
+.icon image {
+    font-size: 58px;
+    /* to center the icon */
+    margin: 5px;
+    color: @theme_fg_color;
+}
+
+.icon box {
+    min-width: 68px;
+    min-height: 68px;
+    border-radius: 7px;
+}
+
+.notification {
+    min-width: 350px;
+    border-radius: 11px;
+    padding: 1em;
+    margin: .5em;
+    border: 1px solid @wm_borders_edge;
+    background-color: @theme_bg_color;
+}
+
+.notification.critical {
+    border: 1px solid lightcoral;
+}
+
+.title {
+    color: @theme_fg_color;
+    font-size: 1.4em;
+}
+
+.body {
+    color: @theme_unfocused_fg_color;
+}
+
+.actions .action-button {
+    margin: 0 .4em;
+    margin-top: .8em;
+}
+
+.actions .action-button:first-child {
+    margin-left: 0;
+}
+
+.actions .action-button:last-child {
+    margin-right: 0;
+}

programs/ags/default.nix

@@ -3,13 +3,17 @@
   # add the home manager module
   imports = [ inputs.ags.homeManagerModules.default ];
 
+  home.packages = with pkgs; [
+    libnotify # Notifications through ags
+  ];
+
   programs.ags = {
     enable = true;
 
     # null or path, leave as null if you don't want hm to manage the config
     configDir = ./config;
 
-    # additional packages to add to gjs's runtime
+    # additional packages to add to ags's runtime
     extraPackages = with pkgs; [
       gtksourceview
       webkitgtk

programs/dunst/default.nix

@@ -1,6 +1,9 @@
 { config, pkgs, ... }:
 
 {
+  home.packages = with pkgs; [
+    libnotify
+  ];
   services.dunst.enable = true;
   services.dunst.settings = {
     global = {