feat(agsV2): fix breaking changes and add bg-fade

nixosModules/ags/v2/app.ts

@@ -3,6 +3,7 @@ import { App } from 'astal';
 import style from './style.scss';
 
 import Bar from './widgets/bar/wim';
+import BgFade from './widgets/bg-fade/main';
 
 
 App.start({
@@ -10,5 +11,6 @@ App.start({
 
     main: () => {
         Bar();
+        BgFade();
     },
 });

nixosModules/ags/v2/widgets/bar/fullscreen.tsx

@@ -19,11 +19,14 @@ Hyprland.connect('event', () => {
         m1.size === m2.size &&
         Array.from(m1.keys()).every((key) => m1.get(key) === m2.get(key));
 
+    const newMonitors = JSON.parse(Hyprland.message('j/monitors')) as AstalHyprland.Monitor[];
+
     const fs = FullscreenState.get();
     const fsClients = Hyprland.get_clients().filter((c) => {
-        const mon = c.get_monitor();
+        const mon = newMonitors.find((monitor) => monitor.id === c.get_monitor().id);
 
-        return c.fullscreen && c.workspace.id === mon?.activeWorkspace.id;
+        return c.fullscreenClient !== 0 &&
+          c.workspace.id === mon?.activeWorkspace.id;
     });
 
     const monitors = fsClients.map((c) =>

nixosModules/ags/v2/widgets/bar/items/workspaces.tsx

@@ -26,21 +26,19 @@ const Workspace = ({ id = 0 }) => (
                 setup={(self) => idle(() => {
                     const update = (
                         _: Widget.Box,
-                        addr?: string,
+                        client?: AstalHyprland.Client,
                     ) => {
                         const workspace = Hyprland.get_workspace(id);
                         const occupied = workspace && workspace.get_clients().length > 0;
 
                         self.toggleClassName('occupied', occupied);
 
-                        if (!addr) {
+                        if (!client) {
                             return;
                         }
 
-                        // Deal with urgent windows
-                        const client = Hyprland.get_client(addr);
                         const isThisUrgent = client &&
-                          client.workspace.id === id;
+                          client.get_workspace().get_id() === id;
 
                         if (isThisUrgent) {
                             self.toggleClassName('urgent', true);
@@ -55,7 +53,7 @@ const Workspace = ({ id = 0 }) => (
                     };
 
                     self
-                        .hook(Hyprland, 'event', update)
+                        .hook(Hyprland, 'event', () => update(self))
 
                         // Deal with urgent windows
                         .hook(Hyprland, 'urgent', update)

nixosModules/ags/v2/widgets/bar/wim.tsx

@@ -18,7 +18,6 @@ export default () => (
             Astal.WindowAnchor.RIGHT
         }
     >
-
         <centerbox className="bar widget">
             <box hexpand halign={Gtk.Align.START}>
                 <Workspaces />

nixosModules/ags/v2/widgets/bg-fade/main.tsx

@@ -0,0 +1,24 @@
+import { Astal } from 'astal';
+
+
+export default () => {
+    return (
+        <window
+            name="bg-fade"
+            layer={Astal.Layer.BACKGROUND}
+            exclusivity={Astal.Exclusivity.IGNORE}
+            anchor={
+                Astal.WindowAnchor.TOP |
+                Astal.WindowAnchor.BOTTOM |
+                Astal.WindowAnchor.LEFT |
+                Astal.WindowAnchor.RIGHT
+            }
+            css={`
+                background-image: -gtk-gradient (linear,
+                    left top, left bottom,
+                    from(rgba(0, 0, 0, 0.5)),
+                    to(rgba(0, 0, 0, 0)));
+            `}
+        />
+    );
+};