feat: update system

home/desktops/hyprland/ags/js/dashboard/Dashboard.js

@@ -7,19 +7,15 @@ import options from "../options.js";
 export default () =>
   PopupWindow({
     name: "dashboard",
-    connections: [
-      [
-        options.bar.position,
-        (self) => {
-          self.anchor = [options.bar.position.value];
-          if (options.bar.position.value === "top")
-            self.transition = "slide_down";
+    setup: (self) =>
+      self.hook(options.bar.position, () => {
+        self.anchor = [options.bar.position.value];
+        if (options.bar.position.value === "top")
+          self.transition = "slide_down";
 
-          if (options.bar.position.value === "bottom")
-            self.transition = "slide_up";
-        },
-      ],
-    ],
+        if (options.bar.position.value === "bottom")
+          self.transition = "slide_up";
+      }),
     child: Widget.Box({
       children: [
         NotificationColumn(),

home/desktops/hyprland/ags/js/dashboard/DateColumn.js

@@ -13,23 +13,16 @@ const SysProgress = (type, title, unit) =>
   Widget.Box({
     class_name: `circular-progress-box ${type}`,
     hexpand: true,
-    binds: [
-      [
-        "tooltipText",
-        vars[type],
-        "value",
-        (v) => `${title}: ${Math.floor(v * 100)}${unit}`,
-      ],
-    ],
+    tooltip_text: vars[type]
+      .bind("value")
+      .transform((v) => `${title}: ${Math.floor(v * 100)}${unit}`),
     child: Widget.CircularProgress({
       hexpand: true,
       class_name: `circular-progress ${type}`,
       child: Widget.Icon(icons.system[type]),
       start_at: 0.75,
-      binds: [
-        ["value", vars[type]],
-        ["rounded", options.radii, "value", (v) => v > 0],
-      ],
+      value: vars[type].bind(),
+      rounded: options.radii.bind("value").transform((v) => v > 0),
     }),
   });
 
@@ -45,7 +38,7 @@ export default () =>
           Clock({ format: "%H:%M" }),
           Widget.Label({
             class_name: "uptime",
-            binds: [["label", vars.uptime, "value", (t) => `uptime: ${t}`]],
+            label: vars.uptime.bind("value").transform((t) => `uptime: ${t}`),
           }),
         ],
       }),

home/desktops/hyprland/ags/js/dashboard/NotificationColumn.js

@@ -11,19 +11,16 @@ const ClearButton = () =>
       for (let i = 0; i < list.length; i++)
         timeout(50 * i, () => list[i]?.close());
     },
-    binds: [["sensitive", Notifications, "notifications", (n) => n.length > 0]],
+    sensitive: Notifications.bind("notifications").transform(
+      (n) => n.length > 0,
+    ),
     child: Widget.Box({
       children: [
         Widget.Label("Clear "),
         Widget.Icon({
-          binds: [
-            [
-              "icon",
-              Notifications,
-              "notifications",
-              (n) => (n.length > 0 ? icons.trash.full : icons.trash.empty),
-            ],
-          ],
+          icon: Notifications.bind("notifications").transform(
+            (n) => icons.trash[n.length > 0 ? "full" : "empty"],
+          ),
         }),
       ],
     }),
@@ -42,18 +39,10 @@ const NotificationList = () =>
   Widget.Box({
     vertical: true,
     vexpand: true,
-    connections: [
-      [
-        Notifications,
-        (box) => {
-          box.children = Notifications.notifications
-            .reverse()
-            .map(Notification);
-
-          box.visible = Notifications.notifications.length > 0;
-        },
-      ],
-    ],
+    children: Notifications.bind("notifications").transform((n) =>
+      n.reverse().map(Notification),
+    ),
+    visible: Notifications.bind("notifications").transform((n) => n.length > 0),
   });
 
 const Placeholder = () =>
@@ -64,11 +53,13 @@ const Placeholder = () =>
     hpack: "center",
     vexpand: true,
     hexpand: true,
+    visible: Notifications.bind("notifications").transform(
+      (n) => n.length === 0,
+    ),
     children: [
       Widget.Icon(icons.notifications.silent),
       Widget.Label("Your inbox is empty"),
     ],
-    binds: [["visible", Notifications, "notifications", (n) => n.length === 0]],
   });
 
 export default () =>