Add AGS power controls and locking

modules/home/ags/app/style.scss

@@ -45,7 +45,8 @@
 .ws:hover,
 .volume:hover,
 .wifi:hover,
-.battery:hover {
+.battery:hover,
+.power:hover {
     background: transparentize($base05, 0.88);
 }
 
@@ -53,7 +54,8 @@
 .mute icon,
 .wifi icon,
 .wifi-header icon,
-.battery icon {
+.battery icon,
+.power icon {
     font-size: 16px;
 }
 
@@ -173,3 +175,21 @@
     font-size: 0.85em;
     opacity: 0.7;
 }
+
+.power-row {
+    padding: 4px 6px;
+    border-radius: 6px;
+    margin: 1px 0;
+
+    icon {
+        font-size: 16px;
+    }
+
+    label {
+        margin: 0 6px;
+    }
+}
+
+.power-row:hover {
+    background: transparentize($base05, 0.88);
+}

modules/home/ags/app/widget/Bar.tsx

@@ -4,22 +4,26 @@ import Clock from "./Clock"
 import { VolumeWidget } from "./Volume"
 import { WifiWidget } from "./Wifi"
 import { BatteryWidget } from "./Battery"
+import { PowerWidget } from "./Power"
 
 export default function Bar(gdkmonitor: Gdk.Monitor) {
     const { TOP, LEFT, RIGHT } = Astal.WindowAnchor
     const volume = VolumeWidget(gdkmonitor)
     const wifi = WifiWidget(gdkmonitor)
     const battery = BatteryWidget(gdkmonitor)
+    const power = PowerWidget(gdkmonitor)
 
     const right: Array<JSX.Element> = []
     if (wifi.button) right.push(wifi.button)
     right.push(volume.button)
     if (battery.button) right.push(battery.button)
+    right.push(power.button)
 
     const popups: Array<JSX.Element> = []
     if (wifi.popup) popups.push(wifi.popup)
     popups.push(volume.popup)
     if (battery.popup) popups.push(battery.popup)
+    popups.push(power.popup)
 
     return [
         (

modules/home/ags/app/widget/Power.tsx

@@ -0,0 +1,62 @@
+import Gtk from "gi://Gtk?version=3.0"
+import { execAsync, Variable } from "astal"
+import Dropdown from "./Dropdown"
+
+const actions = [
+    { label: "lock", icon: "system-lock-screen-symbolic", cmd: ["hyprlock"] },
+    {
+        label: "suspend",
+        icon: "weather-clear-night-symbolic",
+        cmd: ["systemctl", "suspend"],
+    },
+    {
+        label: "log out",
+        icon: "system-log-out-symbolic",
+        cmd: ["hyprctl", "dispatch", "exit"],
+    },
+    {
+        label: "reboot",
+        icon: "system-reboot-symbolic",
+        cmd: ["systemctl", "reboot"],
+    },
+    {
+        label: "shut down",
+        icon: "system-shutdown-symbolic",
+        cmd: ["systemctl", "poweroff"],
+    },
+]
+
+function PowerRow(action: (typeof actions)[number]) {
+    return (
+        <button
+            className="power-row"
+            onClicked={() => execAsync(action.cmd)}
+        >
+            <box>
+                <icon icon={action.icon} />
+                <label label={action.label} halign={Gtk.Align.START} hexpand />
+            </box>
+        </button>
+    )
+}
+
+export function PowerWidget(gdkmonitor: Gdk.Monitor) {
+    const open = Variable(false)
+
+    const button = (
+        <button
+            className="power"
+            onClicked={() => open.set(!open.get())}
+        >
+            <icon icon="system-shutdown-symbolic" />
+        </button>
+    )
+
+    const popup = (
+        <Dropdown gdkmonitor={gdkmonitor} target={button} open={open} width={180}>
+            {actions.map((action) => PowerRow(action))}
+        </Dropdown>
+    )
+
+    return { button, popup }
+}

modules/home/hyprland/default.nix

@@ -5,5 +5,6 @@
   imports = [
     ./binds.nix
     ./hyprland.nix
+    ./hyprlock.nix
   ];
 }

modules/home/hyprland/hyprlock.nix

@@ -0,0 +1,36 @@
+{
+  config,
+  lib,
+  ...
+}:
+with lib;
+let
+  cfg = config.modules.hyprland;
+  colors = config.lib.stylix.colors;
+in
+{
+  config = mkIf cfg.enable {
+    programs.hyprlock = {
+      enable = true;
+      settings = {
+        general = {
+          hide_cursor = true;
+          ignore_empty_input = true;
+        };
+
+        label = [
+          {
+            monitor = "";
+            text = "$TIME12";
+            position = "0, 100";
+            halign = "center";
+            valign = "center";
+            font_size = 48;
+            font_family = "${config.stylix.fonts.sansSerif.name}";
+            color = "rgb(${colors.base05})";
+          }
+        ];
+      };
+    };
+  };
+}

modules/nixos/hyprland.nix

@@ -13,5 +13,7 @@ in
       enable = true;
       withUWSM = true;
     };
+
+    security.pam.services.hyprlock = { };
   };
 }