BatteryPanel: implement basic battery panel with 3 radio buttons

Assets/Translations/en.json

@@ -2,7 +2,6 @@
   "settings": {
     "general": {
       "title": "General",
-
       "profile": {
         "section": {
           "label": "Profile",
@@ -14,7 +13,6 @@
         },
         "select-avatar": "Select avatar image"
       },
-
       "ui": {
         "section": {
           "label": "User interface",
@@ -1197,7 +1195,6 @@
     "enter-width-pixels": "Enter width in pixels",
     "enter-command": "Enter command to execute (app or custom script)",
     "command-example": "echo \"Hello World\"",
-
     "search-wallpapers": "Type to filter wallpapers...",
     "search-launcher": "Search entries... or use > for commands",
     "search": "Search...",
@@ -1444,7 +1441,6 @@
     "thunderstorm": "Thunderstorm",
     "unknown": "Unknown"
   },
-
   "authentication": {
     "failed": "Authentication failed",
     "error": "Authentication error"
@@ -1459,6 +1455,13 @@
     "charging-rate": "Charging rate: {rate} W.",
     "discharging-rate": "Discharging rate: {rate} W.",
     "charging": "Charging.",
-    "discharging": "Discharging."
+    "discharging": "Discharging.",
+    "panel": {
+      "title": "Charging mode",
+      "full": "Full capacity",
+      "balanced": "Balanced",
+      "conservative": "Conservative",
+      "footer": "Charging treshold set to {limit}%"
+    }
   }
 }

Modules/Bar/Battery/BatteryPanel.qml

@@ -0,0 +1,101 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+import Quickshell
+import Quickshell.Wayland
+import qs.Commons
+import qs.Services
+import qs.Widgets
+
+NPanel {
+  id: root
+
+  preferredWidth: 300
+  preferredHeight: 200
+  panelKeyboardFocus: true
+
+  property var optionsModel: []
+
+  function updateOptionsModel() {
+    let newOptions = [{
+                        "id": BatteryService.ChargingMode.Full,
+                        "label": "battery.panel.full",
+                        "icon": "battery-4"
+                      }, {
+                        "id": BatteryService.ChargingMode.Balanced,
+                        "label": "battery.panel.balanced",
+                        "icon": "battery-3"
+                      }, {
+                        "id": BatteryService.ChargingMode.Conservative,
+                        "label": "battery.panel.conservative",
+                        "icon": "battery-2"
+                      }]
+    root.optionsModel = newOptions
+  }
+
+  onOpened: {
+    updateOptionsModel()
+  }
+
+  panelContent: Rectangle {
+    color: Color.transparent
+
+    ColumnLayout {
+      anchors.fill: parent
+      anchors.margins: Style.marginL * scaling
+      spacing: Style.marginM * scaling
+
+      // HEADER
+      RowLayout {
+        Layout.fillWidth: true
+        spacing: Style.marginM * scaling
+
+        NIcon {
+          icon: optionsModel[BatteryService.chargingMode].icon
+          pointSize: Style.fontSizeXXL * scaling
+          color: Color.mPrimary
+        }
+
+        NText {
+          text: I18n.tr("battery.panel.title")
+          pointSize: Style.fontSizeL * scaling
+          font.weight: Style.fontWeightBold
+          color: Color.mOnSurface
+          Layout.fillWidth: true
+        }
+
+        NIconButton {
+          icon: "close"
+          tooltipText: I18n.tr("tooltips.close")
+          baseSize: Style.baseWidgetSize * 0.8
+          onClicked: {
+            root.close()
+          }
+        }
+      }
+
+      NDivider {
+        Layout.fillWidth: true
+      }
+
+      ButtonGroup {
+        id: batteryGroup
+      }
+
+      Repeater {
+        model: optionsModel
+
+        NRadioButton {
+          ButtonGroup.group: batteryGroup
+          required property var modelData
+          text: I18n.tr(modelData.label)
+          checked: BatteryService.chargingMode === modelData.id
+          onClicked: {
+            BatteryService.setChargingMode(modelData.id)
+          }
+          Layout.fillWidth: true
+        }
+      }
+    }
+  }
+}

Modules/Bar/Widgets/Battery.qml

@@ -96,6 +96,7 @@ Item {
     forceOpen: isReady && (testMode || battery.isLaptopBattery) && displayMode === "alwaysShow"
     forceClose: displayMode === "alwaysHide"
     disableOpen: (!isReady || (!testMode && !battery.isLaptopBattery))
+    onClicked: PanelService.getPanel("batteryPanel")?.toggle(this)
     tooltipText: {
       let lines = []
       if (testMode) {

shell.qml

@@ -28,6 +28,7 @@ import qs.Modules.SessionMenu
 import qs.Modules.Bar
 import qs.Modules.Bar.Extras
 import qs.Modules.Bar.Bluetooth
+import qs.Modules.Bar.Battery
 import qs.Modules.Bar.Calendar
 import qs.Modules.Bar.WiFi
 
@@ -159,6 +160,10 @@ ShellRoot {
         id: wallpaperPanel
         objectName: "wallpaperPanel"
       }
+      BatteryPanel {
+        id: batteryPanel
+        objectName: "batteryPanel"
+      }
     }
   }
 }