refactor(agsV2): separate some widgets from popup-window for binto prep

nixosModules/ags-v2/config/configurations/wim.ts

@@ -7,11 +7,11 @@ export default async() => {
     const AppLauncher = (await import('../widgets/applauncher/main')).default;
     const Bar = (await import('../widgets/bar/wim')).default;
     const BgFade = (await import('../widgets/bg-fade/main')).default;
-    const Calendar = (await import('../widgets/date/main')).default;
+    const Calendar = (await import('../widgets/date/wim')).default;
     const Clipboard = (await import('../widgets/clipboard/main')).default;
     const Corners = (await import('../widgets/corners/main')).default;
     const IconBrowser = (await import('../widgets/icon-browser/main')).default;
-    const { NotifPopups, NotifCenter } = await import('../widgets/notifs/main');
+    const { NotifPopups, NotifCenter } = await import('../widgets/notifs/wim');
     const OSD = (await import('../widgets/osd/main')).default;
     const PowerMenu = (await import('../widgets/powermenu/main')).default;
     const Screenshot = (await import('../widgets/screenshot/main')).default;

nixosModules/ags-v2/config/services/brightness.ts

@@ -11,11 +11,10 @@ const SCREEN_ICONS: Record<number, string> = {
 
 const INTERVAL = 500;
 
-
 @register()
 class Brightness extends GObject.Object {
-    declare private _kbd: string;
-    declare private _caps: string;
+    declare private _kbd: string | undefined;
+    declare private _caps: string | undefined;
 
     declare private _screen: number;
 
@@ -51,15 +50,28 @@ class Brightness extends GObject.Object {
         return this._screenIcon;
     }
 
-    declare private _kbdMax: number;
-    declare private _kbdLevel: number;
+    public hasKbd = false;
+    declare private _kbdMax: number | undefined;
+    declare private _kbdLevel: number | undefined;
 
     @property(Number)
     get kbdLevel() {
+        if (!this._kbdMax) {
+            console.error('[get kbdLevel] No Keyboard brightness');
+
+            return -1;
+        }
+
         return this._kbdLevel;
     }
 
     set kbdLevel(value) {
+        if (!this._kbdMax || !value) {
+            console.error('[set kbdLevel] No Keyboard brightness');
+
+            return;
+        }
+
         if (value < 0 || value > this._kbdMax) {
             return;
         }
@@ -94,19 +106,22 @@ class Brightness extends GObject.Object {
      * @param o.kbd  name of kbd in brightnessctl
      * @param o.caps name of caps_lock in brightnessctl
      */
-    public async initService({ kbd = '', caps = '' }) {
-        this._kbd = kbd;
-        this._caps = caps;
+    public async initService({ kbd, caps }: { kbd?: string, caps?: string }) {
         try {
+            if (kbd) {
+                this.hasKbd = true;
+                this._kbd = kbd;
                 this._monitorKbdState();
                 this._kbdMax = Number(await execAsync(`brightnessctl -d ${this._kbd} m`));
+            }
 
+            this._caps = caps;
             this._screen = Number(await execAsync('brightnessctl g')) /
                 Number(await execAsync('brightnessctl m'));
             this.notify('screen');
         }
         catch (_e) {
-            console.error('missing dependancy: brightnessctl');
+            console.error('missing dependency: brightnessctl');
         }
     }
 
@@ -124,14 +139,16 @@ class Brightness extends GObject.Object {
 
     private _monitorKbdState() {
         const timer = interval(INTERVAL, () => {
-            execAsync(`brightnessctl -d ${this._kbd} g`).then(
+            execAsync(`brightnessctl -d ${this._kbd} g`)
+                .then(
                     (out) => {
                         if (parseInt(out) !== this._kbdLevel) {
                             this._kbdLevel = parseInt(out);
                             this.notify('kbd-level');
                         }
                     },
-            ).catch(() => {
+                )
+                .catch(() => {
                     timer?.cancel();
                 });
         });

nixosModules/ags-v2/config/services/gpu-screen-recorder.ts

@@ -0,0 +1,158 @@
+import { execAsync, subprocess } from 'astal';
+import GObject, { register } from 'astal/gobject';
+
+/* Types */
+interface NotifyAction {
+    id: string
+    label: string
+    callback: () => void
+}
+interface NotifySendProps {
+    actions?: NotifyAction[]
+    appName?: string
+    body?: string
+    category?: string
+    hint?: string
+    iconName: string
+    replaceId?: number
+    title: string
+    urgency?: 'low' | 'normal' | 'critical'
+}
+
+
+const APP_NAME = 'gpu-screen-recorder';
+const ICON_NAME = 'nvidia';
+
+const escapeShellArg = (arg: string): string => `'${arg.replace(/'/g, '\'\\\'\'')}'`;
+
+const notifySend = ({
+    actions = [],
+    appName,
+    body,
+    category,
+    hint,
+    iconName,
+    replaceId,
+    title,
+    urgency = 'normal',
+}: NotifySendProps) => new Promise<number>((resolve) => {
+    let printedId = false;
+
+    const cmd = [
+        'notify-send',
+        '--print-id',
+        `--icon=${escapeShellArg(iconName)}`,
+        escapeShellArg(title),
+        escapeShellArg(body ?? ''),
+        // Optional params
+        appName ? `--app-name=${escapeShellArg(appName)}` : '',
+        category ? `--category=${escapeShellArg(category)}` : '',
+        hint ? `--hint=${escapeShellArg(hint)}` : '',
+        replaceId ? `--replace-id=${replaceId.toString()}` : '',
+        `--urgency=${urgency}`,
+    ].concat(
+        actions.map(({ id, label }) => `--action=${escapeShellArg(id)}=${escapeShellArg(label)}`),
+    ).join(' ');
+
+    subprocess(
+        cmd,
+        (out) => {
+            if (!printedId) {
+                resolve(parseInt(out));
+                printedId = true;
+            }
+            else {
+                actions.find((action) => action.id === out)?.callback();
+            }
+        },
+        (err) => {
+            console.error(`[Notify] ${err}`);
+        },
+    );
+});
+
+@register()
+class GSR extends GObject.Object {
+    private _lastNotifID: number | undefined;
+
+    constructor() {
+        super();
+
+        subprocess(
+            ['gsr-start'],
+            (path) => {
+                if (!this._lastNotifID) {
+                    console.error('[GSR] ID of warning notif not found');
+
+                    setTimeout(() => {
+                        this._onSaved(path);
+                    }, 1000);
+                }
+                else {
+                    this._onSaved(path);
+                }
+            },
+            () => { /**/ },
+        );
+    }
+
+    public saveReplay() {
+        execAsync(['gpu-save-replay'])
+            .then(async() => {
+                this._lastNotifID = await notifySend({
+                    appName: APP_NAME,
+                    iconName: ICON_NAME,
+                    title: 'Saving Replay',
+                    body: 'Last 20 minutes',
+                });
+            })
+            .catch((err) => {
+                console.error(`[GSR save-replay] ${err}`);
+            });
+    }
+
+    private _onSaved(path: string) {
+        notifySend({
+            appName: APP_NAME,
+            iconName: ICON_NAME,
+            replaceId: this._lastNotifID,
+
+            title: 'Replay Saved',
+            body: `Saved to ${path}`,
+
+            actions: [
+                {
+                    id: 'folder',
+                    label: 'Open Folder',
+
+                    callback: () => execAsync([
+                        'xdg-open',
+                        path.substring(0, path.lastIndexOf('/')),
+                    ]).catch(print),
+                },
+
+                {
+                    id: 'video',
+                    label: 'Open Video',
+
+                    callback: () => execAsync(['xdg-open', path]).catch(print),
+                },
+
+                {
+                    id: 'kdenlive',
+                    label: 'Edit in kdenlive',
+
+                    callback: () => execAsync([
+                        'bash',
+                        '-c',
+                        `kdenlive -i ${path}`,
+                    ]).catch(print),
+                },
+            ],
+        });
+    }
+}
+
+const gsrService = new GSR();
+
+export default gsrService;

nixosModules/ags-v2/config/widgets/date/main.tsx

@@ -1,10 +1,8 @@
 import { bind, Variable } from 'astal';
-import { Astal, Gtk } from 'astal/gtk3';
+import { Gtk } from 'astal/gtk3';
 
 import GLib from 'gi://GLib';
 
-import PopupWindow from '../misc/popup-window';
-
 
 const Divider = () => (
     <box
@@ -65,7 +63,7 @@ const Time = () => {
     );
 };
 
-const DateWidget = () => {
+export default () => {
     const cal = new Gtk.Calendar({
         show_day_names: true,
         show_heading: true,
@@ -86,12 +84,3 @@ const DateWidget = () => {
         </box>
     );
 };
-
-export default () => (
-    <PopupWindow
-        name="calendar"
-        anchor={Astal.WindowAnchor.TOP}
-    >
-        <DateWidget />
-    </PopupWindow>
-);

nixosModules/ags-v2/config/widgets/date/wim.tsx

@@ -0,0 +1,15 @@
+import { Astal } from 'astal/gtk3';
+
+import PopupWindow from '../misc/popup-window';
+
+import DateWidget from './main';
+
+
+export default () => (
+    <PopupWindow
+        name="calendar"
+        anchor={Astal.WindowAnchor.TOP}
+    >
+        <DateWidget />
+    </PopupWindow>
+);

nixosModules/ags-v2/config/widgets/misc/popup-window.tsx

@@ -2,9 +2,10 @@ import { App, Astal, Gtk, Widget } from 'astal/gtk3';
 import { property, register } from 'astal/gobject';
 import { Binding, idle } from 'astal';
 
-import { get_hyprland_monitor, hyprMessage } from '../../lib';
+import { hyprMessage } from '../../lib';
 
 /* Types */
+import AstalHyprland from 'gi://AstalHyprland';
 type CloseType = 'none' | 'stay' | 'released' | 'clicked';
 type HyprTransition = 'slide' | 'slide top' | 'slide bottom' | 'slide left' |
     'slide right' | 'popin' | 'fade';
@@ -80,15 +81,22 @@ export class PopupWindow extends Widget.Window {
         });
     };
 
-    set_x_pos(
+    async set_x_pos(
         alloc: Gtk.Allocation,
         side = 'right' as 'left' | 'right',
     ) {
         const monitor = this.gdkmonitor ??
             this.get_display().get_monitor_at_point(alloc.x, alloc.y);
 
-        // @ts-expect-error this should exist
-        const transform = get_hyprland_monitor(monitor)?.transform;
+        // FIXME: switch back to this when it's fixed upstream
+        // const transform = get_hyprland_monitor(monitor)?.transform;
+        const manufacturer = monitor.manufacturer?.replace(',', '');
+        const model = monitor.model?.replace(',', '');
+        const start = `${manufacturer} ${model}`;
+
+        const transform = (JSON.parse(await hyprMessage('j/monitors')) as AstalHyprland.Monitor[])
+            // @ts-expect-error this will be fixed soon
+            .find((m) => m.description?.startsWith(start))?.transform;
 
         let width: number;
 

nixosModules/ags-v2/config/widgets/notifs/notification.tsx

@@ -24,7 +24,7 @@ const setTime = (time: number): string => GLib.DateTime
 const NotifIcon = ({ notifObj }: {
     notifObj: AstalNotifd.Notification
 }) => {
-    let icon: string;
+    let icon: string | undefined;
 
     if (notifObj.get_image() && notifObj.get_image() !== '') {
         icon = notifObj.get_image();
@@ -36,7 +36,7 @@ const NotifIcon = ({ notifObj }: {
     else {
         icon = Applications.fuzzy_query(
             notifObj.get_app_name(),
-        )[0].get_icon_name();
+        )[0]?.get_icon_name();
     }
 
     return (
@@ -48,6 +48,7 @@ const NotifIcon = ({ notifObj }: {
                 min-height: 78px;
             `}
         >
+            {icon && (
                 <icon
                     icon={icon}
                     css="font-size: 58px;"
@@ -56,6 +57,7 @@ const NotifIcon = ({ notifObj }: {
                     valign={Gtk.Align.CENTER}
                     vexpand
                 />
+            )}
         </box>
     );
 };

nixosModules/ags-v2/config/widgets/osd/main.tsx

@@ -138,6 +138,8 @@ export default () => {
                     </box>
                 </box>
 
+                {
+                    Brightness.hasKbd && (
                         <box
                             name="keyboard"
                             css="margin-bottom: 80px;"
@@ -152,12 +154,14 @@ export default () => {
                                 <icon icon="keyboard-brightness-symbolic" />
 
                                 <ProgressBar
-                            fraction={bind(Brightness, 'kbdLevel').as((v) => v / 2)}
+                                    fraction={bind(Brightness, 'kbdLevel').as((v) => (v ?? 0) / 2)}
                                     sensitive={bind(Brightness, 'kbdLevel').as((v) => v !== 0)}
                                     valign={Gtk.Align.CENTER}
                                 />
                             </box>
                         </box>
+                    )
+                }
 
                 <box
                     name="caps"