✨ chore: migrate runner and plugins to ags v3 and gtk4

ags/runner/plugins/apps.ts

@@ -1,8 +1,7 @@
 import { ResultWidget, ResultWidgetProps } from "../../widget/runner/ResultWidget";
 import AstalApps from "gi://AstalApps";
-import { execApp, getAstalApps, updateApps } from "../../scripts/apps";
+import { execApp, getAstalApps, lookupIcon, updateApps } from "../../scripts/apps";
 import { Runner } from "../Runner";
-import { Astal } from "astal/gtk3";
 
 export const PluginApps = {
     // Do not provide prefix, so it always runs.
@@ -14,7 +13,7 @@ export const PluginApps = {
             new ResultWidget({
                 title: app.get_name(),
                 description: app.get_description(),
-                icon: Astal.Icon.lookup_icon(app.iconName) ? app.iconName : "application-x-executable-symbolic",
+                icon: lookupIcon(app.iconName) ? app.iconName : "application-x-executable-symbolic",
                 onClick: () => execApp(app)
             } as ResultWidgetProps)
         );

ags/runner/plugins/clipboard.ts

@@ -1,33 +0,0 @@
-import { Widget } from "astal/gtk3";
-import { Clipboard } from "../../scripts/clipboard";
-import { ResultWidget, ResultWidgetProps } from "../../widget/runner/ResultWidget";
-import { Runner } from "../Runner";
-import { Gio } from "astal";
-
-
-export const PluginClipboard = {
-    prefix: '>',
-    prioritize: true,
-    handle: (search) => {
-        if(Clipboard.getDefault().history.length < 1) 
-            return new ResultWidget({
-                icon: "edit-paste-symbolic",
-                title: "Clipboard is empty",
-                description: "Copy something and it will be shown right here!"
-            } as ResultWidgetProps);
-        
-        return Clipboard.getDefault().history.filter(item => // not the best way to search, but it works
-                Runner.regExMatch(search, item.id) || Runner.regExMatch(search, item.preview)).map((item) =>
-            new ResultWidget({
-                icon: new Widget.Label({
-                    label: item.id.toString(),
-                    css: "font-size: 16px; margin-right: 8px; font-weight: 600;"
-                } as Widget.LabelProps),
-                title: item.preview,
-                onClick: () => Clipboard.getDefault().selectItem(item).catch((err: Gio.IOErrorEnum) => {
-                    console.error(`Runner(Plugin/Clipboard): An error occurred while selecting clipboard item. Stderr:\n${
-                        err.message ? `${err.message}\n` : ""}Stack: ${err.stack}`);
-                })
-            } as ResultWidgetProps));
-    }
-} as Runner.Plugin;

ags/runner/plugins/clipboard.tsx

@@ -0,0 +1,28 @@
+import { Gtk } from "ags/gtk4";
+import { Clipboard } from "../../scripts/clipboard";
+import { ResultWidget } from "../../widget/runner/ResultWidget";
+import { Runner } from "../Runner";
+
+
+export const PluginClipboard = {
+    prefix: '>',
+    prioritize: true,
+    handle: (search) => {
+        if(Clipboard.getDefault().history.length < 1) 
+            return <ResultWidget icon={"edit-paste-symbolic"} title={"Clipboard is empty"}
+                description={"Copy something and it will be shown right here!"}
+            />;
+        
+        return Clipboard.getDefault().history.filter(item => // not the best way to search, but it works
+                Runner.regExMatch(search, item.id) || Runner.regExMatch(search, item.preview)).map((item) =>
+            <ResultWidget icon={<Gtk.Label label={`${item.id}`} 
+              css={"font-size: 16px; margin-right: 8px; font-weight: 600;"} />} 
+              title={item.preview} onClick={() => Clipboard.getDefault().selectItem(item).catch((err: Error) => {
+                        console.error(`Runner(Plugin/Clipboard): An error occurred while selecting clipboard item. Stderr:\n${
+                            err.message ? `${err.message}\n` : ""}Stack: ${err.stack}`
+                        );
+                    })
+                }
+            />);
+    }
+} as Runner.Plugin;

ags/runner/plugins/media.ts

@@ -1,79 +1,56 @@
-import { bind, Variable } from "astal";
+import { createBinding, createComputed } from "ags";
 import { ResultWidget, ResultWidgetProps } from "../../widget/runner/ResultWidget";
 import { Runner } from "../Runner";
 import AstalMpris from "gi://AstalMpris";
+import { player } from "../../widget/bar/Media";
 
-export const PluginMedia = (() => {
-    let playTitle: Variable<string>|null;
-    let previousTitle: Variable<string>|null;
-    let nextTitle: Variable<string>|null;
+export const PluginMedia = {
+    prefix: ":",
+    handle() {
+        if(!player.get().available) return new ResultWidget({
+            icon: "folder-music-symbolic",
+            title: "Couldn't find any players",
+            closeOnClick: false,
+            description: "No media / player found with mpris"
+        } as ResultWidgetProps);
 
-    return {
-        prefix: ":",
-
-        onClose: () => {
-            playTitle?.drop();
-            previousTitle?.drop();
-            nextTitle?.drop();
-
-            previousTitle = null;
-            playTitle = null;
-            nextTitle = null;
-        },
-
-        handle() {
-            const player = AstalMpris.get_default().players[0];
-
-            playTitle = Variable.derive([
-                bind(player, "title"),
-                bind(player, "artist"),
-                bind(player, "playbackStatus")
-            ], (title, artist, status) => `${ status === AstalMpris.PlaybackStatus.PLAYING ?
-                "Pause" : "Play"
-            } ${title} | ${artist}`);
-
-            previousTitle = Variable.derive([
-                bind(player, "title"),
-                bind(player, "artist")
-            ], (title, artist) =>
-                `Go Previous ${ title ? title : player.busName }${ artist ? ` | ${artist}` : "" }`
-            );
-
-            nextTitle = Variable.derive([
-                bind(player, "title"),
-                bind(player, "artist")
-            ], (title, artist) =>
-                `Go Next ${ title ? title : player.busName }${ artist ? ` | ${artist}` : "" }`
-            );
-
-            if(!player) return new ResultWidget({
-                icon: "folder-music-symbolic",
-                title: "Couldn't find any players",
+        return [
+            new ResultWidget({
+                icon: createBinding(player.get(), "playbackStatus").as((status) => status === AstalMpris.PlaybackStatus.PLAYING ?
+                    "media-playback-pause-symbolic"
+                : "media-playback-start-symbolic"),
                 closeOnClick: false,
-                description: "No media / player found with mpris"
-            } as ResultWidgetProps);
-            return [
-                new ResultWidget({
-                    icon: bind(player, "playbackStatus").as((status) => status === AstalMpris.PlaybackStatus.PLAYING ?
-                        "media-playback-pause-symbolic"
-                    : "media-playback-start-symbolic"),
-                    closeOnClick: false,
-                    title: playTitle(),
-                    onClick: () => player && player.play_pause()
-                } as ResultWidgetProps),
-                new ResultWidget({
-                    icon: "media-skip-backward-symbolic",
-                    closeOnClick: false,
-                    title: previousTitle(),
-                    onClick: () => player && player.canGoPrevious && player.previous()
-                } as ResultWidgetProps),
-                new ResultWidget({
-                    icon: "media-skip-forward-symbolic",
-                    closeOnClick: false,
-                    title: nextTitle(),
-                    onClick: () => player && player.canGoNext && player.next()
-                } as ResultWidgetProps)
-            ]
-        },
-    } as Runner.Plugin
-})();
+                title: createComputed([
+                    createBinding(player.get(), "title"),
+                    createBinding(player.get(), "artist"),
+                    createBinding(player.get(), "playbackStatus")
+                ], (title, artist, status) => `${ status === AstalMpris.PlaybackStatus.PLAYING ?
+                    "Pause" : "Play"
+                } ${title} | ${artist}`),
+                onClick: () => player.get().play_pause()
+            } as ResultWidgetProps),
+            new ResultWidget({
+                icon: "media-skip-backward-symbolic",
+                closeOnClick: false,
+                title: createComputed([
+                    createBinding(player.get(), "title"),
+                    createBinding(player.get(), "artist")
+                ], (title, artist) =>
+                    `Go Previous ${ title ? title : player.get().busName }${ artist ? ` | ${artist}` : "" }`
+                ),
+                onClick: () => player.get().canGoPrevious && player.get().previous()
+            } as ResultWidgetProps),
+            new ResultWidget({
+                icon: "media-skip-forward-symbolic",
+                closeOnClick: false,
+                title: createComputed([
+                    createBinding(player.get(), "title"),
+                    createBinding(player.get(), "artist")
+                ], (title, artist) =>
+                    `Go Next ${ title ? title : player.get().busName }${ artist ? ` | ${artist}` : "" }`
+                ),
+                onClick: () => player.get().canGoNext && player.get().next()
+            } as ResultWidgetProps)
+        ]
+    },
+} as Runner.Plugin;

ags/runner/plugins/shell.ts

@@ -1,8 +1,11 @@
 import { ResultWidget, ResultWidgetProps } from "../../widget/runner/ResultWidget";
-import { Gio, GLib } from "astal";
 import { Runner } from "../Runner";
 import { Notifications } from "../../scripts/notifications";
 
+import GLib from "gi://GLib?version=2.0";
+import Gio from "gi://Gio?version=2.0";
+
+
 export const PluginShell = (() => {
 
     const shell = GLib.getenv("SHELL") ?? "/bin/sh";

ags/runner/plugins/wallpapers.ts

@@ -1,10 +1,11 @@
-import { Gio } from "astal";
 import { Wallpaper } from "../../scripts/wallpaper";
 import { Runner } from "../Runner";
 import { ResultWidget, ResultWidgetProps } from "../../widget/runner/ResultWidget";
 
+import Gio from "gi://Gio?version=2.0";
 
-export class PluginWallpapers implements Runner.Plugin {
+
+class _PluginWallpapers implements Runner.Plugin {
     prefix = "#";
     prioritize = true;
     #files: (Array<string>|undefined);
@@ -39,3 +40,5 @@ export class PluginWallpapers implements Runner.Plugin {
         } as ResultWidgetProps);
     }
 }
+
+export const PluginWallpapers = new _PluginWallpapers();