Battery + NPill working and factorized

Modules/Bar/Battery.qml

@@ -62,24 +62,7 @@ Item {
     iconCircleColor: Colors.accentPrimary
     iconTextColor: Colors.backgroundPrimary
     textColor: charging ? Colors.accentPrimary : Colors.textPrimary
-    MouseArea {
+    tooltipText: {
-      anchors.fill: parent
-      hoverEnabled: true
-      onEntered: {
-        pill.showDelayed()
-        batteryTooltip.show()
-      }
-      onExited: {
-        pill.hide()
-        batteryTooltip.show()
-      }
-    }
-    NTooltip {
-      id: batteryTooltip
-      positionAbove: false
-      target: pill
-      delay: Style.tooltipDelayLong
-      text: {
       let lines = []
       if (!root.isReady) {
         return ""
@@ -113,11 +96,9 @@ Item {
 
       if (root.battery.healthPercentage !== undefined
           && root.battery.healthPercentage > 0) {
-          lines.push("Health: " + Math.round(
+        lines.push("Health: " + Math.round(root.battery.healthPercentage) + "%")
-                       root.battery.healthPercentage) + "%")
       }
       return lines.join("\n")
     }
   }
 }
-}

Widgets/NPill.qml

@@ -9,6 +9,7 @@ Item {
 
   property string icon: ""
   property string text: ""
+  property string tooltipText: ""
   property color pillColor: Colors.surfaceVariant
   property color textColor: Colors.textPrimary
   property color iconCircleColor: Colors.accentPrimary
@@ -30,6 +31,7 @@ Item {
                                         1, textItem.implicitWidth
                                         + pillPaddingHorizontal * 2 + pillOverlap)
 
+  // TBC, do we use those ?
   signal shown
   signal hidden
 
@@ -165,6 +167,37 @@ Item {
     }
   }
 
+  NTooltip {
+    id: tooltip
+    positionAbove: false
+    target: pill
+    delay: Style.tooltipDelayLong
+    text: root.tooltipText
+  }
+
+  Timer {
+    id: showTimer
+    interval: Style.pillDelay
+    onTriggered: {
+      if (!showPill) {
+        showAnim.start()
+      }
+    }
+  }
+
+  MouseArea {
+    anchors.fill: parent
+    hoverEnabled: true
+    onEntered: {
+      showDelayed()
+      tooltip.show()
+    }
+    onExited: {
+      hide()
+      tooltip.hide()
+    }
+  }
+
   function show() {
     if (!showPill) {
       shouldAnimateHide = autoHide
@@ -191,14 +224,4 @@ Item {
       delayedHideAnim.restart()
     }
   }
-
-  Timer {
-    id: showTimer
-    interval: Style.pillDelay
-    onTriggered: {
-      if (!showPill) {
-        showAnim.start()
-      }
-    }
-  }
 }