✨ feat: peek workspace numbers when SUPER is pressed

ags/scripts/arg-handler.ts

@@ -2,9 +2,9 @@ import { Gtk } from "astal/gtk3";
 import { Windows } from "../windows";
 import { restartInstance } from "./reload-handler";
 import { Wireplumber } from "./volume";
-import { AskPopup } from "../widget/AskPopup";
-import { execAsync } from "astal";
 import { startRunnerDefault } from "../runner/Runner";
+import { showWorkspaceNumbers } from "../widget/bar/Workspaces";
+import { timeout } from "astal";
 
 export function handleArguments(request: string): any {
     const args: Array<string> = request.split(" ");
@@ -29,12 +29,10 @@ export function handleArguments(request: string): any {
             startRunnerDefault();
             return "Opening runner..."
 
-        case "test":
+        case "show-ws-numbers":
-            return AskPopup({
+            showWorkspaceNumbers.set(true);
-                onAccept: () => execAsync("notify-send -u normal haha dumb"),
+            timeout(2000, () => showWorkspaceNumbers.set(false));
-                text: "Would you accept?",
+            return "Showing numbers";
-                title: "Dumb Question"
-            });
 
         default:
             return "command not found! try checking help";
@@ -158,6 +156,7 @@ Options:
   reload: creates a new astal instance and removes this one.
   volume: wireplumber volume controller, see "volume help".
   runner: open the application runner.
+  (show|hide)-ws-numbers: show or hide workspace numbers in bar.
   help, -h, --help: shows this help message.
 
 2025 (c) retrozinndev's Hyprland-Dots, licensed under the MIT License.

ags/style/_bar.scss

@@ -66,6 +66,16 @@
       &.focus {
         background: colors.$fg-primary;
         min-width: 31px;
+
+        & label.id {
+          color: colors.$fg-light;
+          margin-right: 0;
+        }
+      }
+
+      & label.id {
+        font-weight: 600;
+        margin-right: 4px;
       }
 
       & icon {

ags/widget/bar/Workspaces.ts

@@ -4,6 +4,7 @@ import AstalHyprland from "gi://AstalHyprland";
 import { getAppIcon } from "../../scripts/apps";
 
 const hyprland = AstalHyprland.get_default();
+export const showWorkspaceNumbers = new Variable<boolean>(false);
 
 export function Workspaces(): Gtk.Widget {
 
@@ -26,7 +27,20 @@ export function Workspaces(): Gtk.Widget {
                                 `${lastClient.get_class()}: `
                             : ""
                         } ${lastClient.title}` : "" }`),
-                        child: new Widget.Icon({
+                        child: new Widget.Box({
+                            children: [
+                                new Widget.Revealer({
+                                    transitionDuration: 120,
+                                    transitionType: Gtk.RevealerTransitionType.SLIDE_LEFT,
+                                    revealChild: showWorkspaceNumbers(),
+                                    child: new Widget.Label({
+                                        label: bind(workspace, "id").as(String),
+                                        className: "id",
+                                        xalign: 0.5,
+                                        hexpand: true,
+                                    } as Widget.LabelProps)
+                                } as Widget.RevealerProps),
+                                new Widget.Icon({
                                     className: "last-app-icon",
                                     visible: Variable.derive([
                                         bind(workspace, "lastClient"),
@@ -38,6 +52,8 @@ export function Workspaces(): Gtk.Widget {
                                             getAppIcon(lastClient.initialClass) || "image-missing"
                                         : "image-missing")
                                 } as Widget.IconProps),
+                            ]
+                        } as Widget.BoxProps),
                         onClicked: () => workspace.focus()
                     } as Widget.ButtonProps)
                 )

hypr/bindings.conf

@@ -24,9 +24,10 @@ $screenshotSelect = hyprshot -m region -o $screenshotDir
 # Wiki: https://wiki.hyprland.org/Configuring/Binds
 
 
+bind = $mainMod, $mainMod_L, exec, astal show-ws-numbers
+
 # Uncomment if you want to press SUPER to launch application search
 # bind = $mainMod, $mainMod_L, exec, astal toggle apps-window
-
 bind = $mainMod, K, exec, $terminal
 bind = $mainMod, Q, killactive
 bind = $mainMod, E, exec, $fm
@@ -62,7 +63,7 @@ bind = $mainMod, V, exec, sh $XDG_CONFIG_HOME/hypr/scripts/clipboard-menu.sh
 # Open wallpaper menu
 bind = $mainMod, W, exec, sh $XDG_CONFIG_HOME/hypr/scripts/change-wallpaper.sh
 
-# Reload UI(Astal and AGS)
+# Reload Shell (Astal)
 bind = $mainMod, F7, exec, ags request reload
 
 ##################