feat(ags): only show icon of current client on binto

nixosModules/ags/config/widgets/bar/binto.tsx

@@ -2,11 +2,10 @@ import { Astal, Gtk } from 'astal/gtk3';
 
 import Audio from './items/audio';
 import Clock from './items/clock';
-import CurrentClient from './items/current-client';
+import CurrentIcon from './items/current-icon';
 import Network from './items/network';
 import NotifButton from './items/notif-button';
 import SysTray from './items/tray';
-import Workspaces from './items/workspaces';
 
 import BarRevealer from './fullscreen';
 import Separator from '../misc/separator';
@@ -25,11 +24,11 @@ export default () => (
     >
         <centerbox className="bar widget">
             <box hexpand halign={Gtk.Align.START}>
-                <Workspaces />
+                <CurrentIcon />
 
                 <Separator size={8} />
 
-                <CurrentClient />
+                <SysTray />
 
                 <Separator size={8} />
             </box>
@@ -39,10 +38,6 @@ export default () => (
             </box>
 
             <box hexpand halign={Gtk.Align.END}>
-                <SysTray />
-
-                <Separator size={8} />
-
                 <Network />
 
                 <Separator size={8} />

nixosModules/ags/config/widgets/bar/items/current-icon.tsx

@@ -0,0 +1,66 @@
+import { bind, Variable } from 'astal';
+
+import AstalApps from 'gi://AstalApps';
+const Applications = AstalApps.Apps.new();
+
+import AstalHyprland from 'gi://AstalHyprland';
+const Hyprland = AstalHyprland.get_default();
+
+import { hyprMessage } from '../../../lib';
+
+
+export default () => {
+    const visibleIcon = Variable<boolean>(false);
+    const focusedIcon = Variable<string>('');
+
+    let lastFocused: string | undefined;
+
+    const updateVars = (
+        client: AstalHyprland.Client | null = Hyprland.get_focused_client(),
+    ) => {
+        lastFocused = client?.get_address();
+        const app = Applications.fuzzy_query(
+            client?.get_class() ?? '',
+        )[0];
+
+        const icon = app?.iconName;
+
+        if (icon) {
+            visibleIcon.set(true);
+            focusedIcon.set(icon);
+        }
+        else {
+            visibleIcon.set(false);
+        }
+
+        const id = client?.connect('notify::title', (c) => {
+            if (c.get_address() !== lastFocused) {
+                c.disconnect(id);
+            }
+        });
+    };
+
+    updateVars();
+    Hyprland.connect('notify::focused-client', () => updateVars());
+    Hyprland.connect('client-removed', () => updateVars());
+    Hyprland.connect('client-added', async() => {
+        try {
+            updateVars(Hyprland.get_client(JSON.parse(await hyprMessage('j/activewindow')).address));
+        }
+        catch (e) {
+            console.log(e);
+        }
+    });
+
+    return (
+        <box
+            className="bar-item current-window"
+            visible={bind(visibleIcon)}
+        >
+            <icon
+                css="font-size: 32px;"
+                icon={bind(focusedIcon)}
+            />
+        </box>
+    );
+};