feat: Implement battery widget in Control Center

Modules/ControlCenter/ControlCenterPopout.qml

@@ -11,6 +11,7 @@ import qs.Modules.ControlCenter
 import qs.Modules.ControlCenter.Widgets
 import qs.Modules.ControlCenter.Details
 import qs.Modules.ControlCenter.Details 1.0 as Details
+import qs.Modules.TopBar
 import qs.Services
 import qs.Widgets
 
@@ -239,6 +240,24 @@ DankPopout {
                         anchors.rightMargin: Theme.spacingL
                         spacing: Theme.spacingS
 
+                        Battery {
+                            widgetHeight: 40
+                            popupTarget: controlCenterBatteryPopout
+                            parentScreen: root.triggerScreen
+                            section: "right"
+                            barHeight: 123
+                            batteryPopupVisible: controlCenterBatteryPopout.shouldBeVisible
+                            visible: BatteryService.batteryAvailable
+
+                            onToggleBatteryPopup: {
+                                if (controlCenterBatteryPopout.shouldBeVisible) {
+                                    controlCenterBatteryPopout.close()
+                                } else {
+                                    controlCenterBatteryPopout.open()
+                                }
+                            }
+                        }
+
                         DankActionButton {
                             buttonSize: 40
                             iconName: "lock"
@@ -718,6 +737,10 @@ DankPopout {
         }
     }
 
+    BatteryPopout {
+        id: controlCenterBatteryPopout
+    }
+
     Component {
         id: networkDetailComponent
         NetworkDetail {}