tray: use more descriptive text for tooltip and update on entry

The systray id is intended for programmatic use rather than frontend
presentation. It is recommended to use the tooltipTitle and title
attributes when available, and these should be updated upon entry, as
their values may change dynamically.

.config/quickshell/ii/modules/bar/SysTrayItem.qml

@@ -29,6 +29,12 @@ MouseArea {
         }
         event.accepted = true;
     }
+    onEntered: {
+        tooltip.content = item.tooltipTitle.length > 0 ? item.tooltipTitle
+                : (item.title.length > 0 ? item.title : item.id);
+        if (item.tooltipDescription.length > 0) tooltip.content += " • " + item.tooltipDescription;
+        if (Config.options.bar.tray.showItemId) tooltip.content += "\n[" + item.id + "]";
+    }
 
     QsMenuAnchor {
         id: menu
@@ -71,11 +77,7 @@ MouseArea {
     }
 
     StyledToolTip {
-        content: {
-            let c = root.item.id
-            if (root.item.tooltipDescription.length > 0) c += " • " + root.item.tooltipDescription
-            return c;
-        }
+        id: tooltip
         extraVisibleCondition: root.containsMouse
         alternativeVisibleCondition: extraVisibleCondition
     }

.config/quickshell/ii/modules/common/Config.qml

@@ -172,6 +172,7 @@ Singleton {
                 }
                 property JsonObject tray: JsonObject {
                     property bool monochromeIcons: true
+                    property bool showItemId: false
                     property bool invertPinnedItems: false // Makes the below a whitelist for the tray and blacklist for the pinned area
                     property list<string> pinnedItems: [ "Fcitx" ]
                 }