add battery for laptops

components/LucideIcon.qml

@@ -2,9 +2,12 @@ import qs.config
 import QtQuick
 
 Text {
-
     color: Theme.palette.basecontent
-
+    Behavior on color {
+        ColorAnimation {
+            duration: 100
+        }
+    }
     font.family: Theme.lucide.font.family
     font.pixelSize: Dimensions.gpu.iconSize
     font.bold: true

constants/Icons.qml

@@ -3,6 +3,7 @@ pragma Singleton
 import Quickshell
 
 Singleton {
+    property string batteryCharging: "\u{E058}"
     property string batteryFull: "\u{E059}"
     property string batteryMedium: "\u{E05b}"
     property string batteryLow: "\u{E05a}"

modules/bar/Bar.qml

@@ -107,6 +107,8 @@ PanelWindow {
 
             Gpu {}
 
+            Power {}
+
             Clock {}
 
             Notifications {}

modules/bar/components/Power.qml

@@ -0,0 +1,60 @@
+import qs.components
+import qs.config
+import qs.constants
+import qs.widgets
+import QtQuick
+import QtQuick.Layouts
+import Quickshell.Services.UPower
+
+StyledButton {
+    id: root
+    property UPowerDevice laptopBattery: UPower.devices.values.find(device => device.isLaptopBattery)
+    property bool isCritical: laptopBattery.percentage < 0.10
+
+    contentItem: RowLayout {
+        spacing: 4
+        LucideIcon {
+            Layout.alignment: Qt.AlignVCenter
+            color: {
+                if (root.isCritical) {
+                    return Theme.palette.error;
+                }
+                if (root.hovered) {
+                    return Theme.palette.primarycontent;
+                }
+                return Theme.palette.basecontent;
+            }
+            font.pixelSize: 16
+            text: {
+                if (root.laptopBattery.state == UPowerDeviceState.Charging) {
+                    return Icons.batteryCharging;
+                }
+                if (root.isCritical) {
+                    return Icons.batteryWarning;
+                }
+                if (root.laptopBattery.percentage < 0.33) {
+                    return Icons.batteryLow;
+                }
+                if (root.laptopBattery.percentage < 0.66) {
+                    return Icons.batteryMedium;
+                }
+                return Icons.batteryFull;
+            }
+        }
+
+        StyledText {
+            Layout.alignment: Qt.AlignVCenter
+            color: {
+                if (root.isCritical) {
+                    return Theme.palette.error;
+                }
+                if (root.hovered) {
+                    return Theme.palette.primarycontent;
+                }
+                return Theme.palette.basecontent;
+            }
+            text: `${root.laptopBattery.percentage * 100}%`
+        }
+    }
+    visible: laptopBattery
+}

modules/launcher/Launcher.qml

@@ -2,10 +2,8 @@ pragma ComponentBehavior: Bound
 
 import "services"
 import qs.components
-import qs.config
 import qs.constants
 import qs.services
-import qs.widgets
 import Quickshell.Hyprland
 import Quickshell.Wayland
 import QtQuick

services/PowerService.qml

@@ -0,0 +1,12 @@
+pragma Singleton
+
+import Quickshell
+import Quickshell.Services.UPower
+
+Singleton {
+    id: root
+
+    property bool onBattery: UPower.onBattery
+    property UPowerDevice laptopBattery: UPower.devices.values.find(device => device.isLaptopBattery)
+
+}