feat(agsV2): separate from agsV1

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

@@ -0,0 +1,46 @@
+import { execAsync } from 'astal';
+import { Astal } from 'astal/gtk3';
+
+import { hyprMessage } from '../../lib';
+
+import PopupWindow from '../misc/popup-window';
+
+
+const PowermenuWidget = () => (
+    <centerbox className="powermenu widget">
+        <button
+            className="shutdown button"
+            cursor="pointer"
+            onButtonReleaseEvent={() => execAsync(['systemctl', 'poweroff']).catch(print)}
+        >
+            <icon icon="system-shutdown-symbolic" />
+        </button>
+
+        <button
+            className="reboot button"
+            cursor="pointer"
+            onButtonReleaseEvent={() => execAsync(['systemctl', 'reboot']).catch(print)}
+        >
+            <icon icon="system-restart-symbolic" />
+        </button>
+
+        <button
+            className="logout button"
+            cursor="pointer"
+            onButtonReleaseEvent={() => hyprMessage('dispatch exit').catch(print)}
+        >
+            <icon icon="system-log-out-symbolic" />
+        </button>
+    </centerbox>
+);
+
+export default () => (
+    <PopupWindow
+        name="powermenu"
+        transition="slide bottom"
+        // To put it at the center of the screen
+        exclusivity={Astal.Exclusivity.IGNORE}
+    >
+        <PowermenuWidget />
+    </PopupWindow>
+);

nixosModules/ags-v2/config/widgets/powermenu/style.scss

@@ -0,0 +1,29 @@
+.powermenu {
+    font-size: 70px;
+    padding: 10px;
+
+    icon {
+        min-width: 130px;
+        min-height: 130px;
+    }
+
+    button {
+        margin: 5px 10px;
+        transition: all ease .2s;
+
+        &:hover,
+        &:active {
+            background-color: lighten($window_bg_color, 3%);
+        }
+    }
+
+    .shutdown {
+        color: $red_1;
+    }
+    .reboot {
+        color: $purple_1;
+    }
+    .logout {
+        color: $yellow_1;
+    }
+}