feat(desktop): show the module glyph in every page title

Page.qml gains an icon rendered before the title, and the drawer binds
it to the loaded module's icon so a module whose glyph changes (network
follows the active link) keeps the header in step.

2 files changed, 27 insertions, 4 deletions

diff --git a/desktop/Drawer.qml b/desktop/Drawer.qml
index aea6855..4ed37d3 100644
--- a/desktop/Drawer.qml
+++ b/desktop/Drawer.qml
@@ -174,6 +174,16 @@ Scope {
                     // `back` and does not know who hosts it.
                     onLoaded: if (item && item.back) item.back.connect(() => root.page = "")
 
+                    // The page header shows the module's tile glyph. A Binding,
+                    // not an assignment in onLoaded, so a module whose icon
+                    // changes (network follows the active link) stays in step.
+                    Binding {
+                        target: pageLoader.item
+                        property: "icon"
+                        value: root.current ? root.current.icon : ""
+                        when: pageLoader.item !== null
+                    }
+
                     // The page enters from the right: the one piece of motion
                     // in the design, and what makes the drawer read as one
                     // surface rather than a window swapping contents. It is a
diff --git a/desktop/Page.qml b/desktop/Page.qml
index 1bf312c..4ef50c1 100644
--- a/desktop/Page.qml
+++ b/desktop/Page.qml
@@ -16,6 +16,8 @@ Item {
     id: page
 
     property string title: ""
+    // The module's tile glyph, set by the drawer, shown before the title.
+    property string icon: ""
     default property alias content: holder.data
     signal back
 
@@ -46,11 +48,22 @@ Item {
             }
         }
 
-        Text {
+        Row {
             anchors { left: backBtn.right; leftMargin: 10; verticalCenter: parent.verticalCenter }
-            text: page.title
-            font { family: Theme.fontFamily; pixelSize: Theme.fontSize + 2; bold: true }
-            color: Theme.text
+            spacing: 8
+
+            Text {
+                visible: page.icon !== ""
+                text: page.icon
+                font { family: Theme.iconFamily; pixelSize: Theme.fontSize + 2 }
+                color: Theme.text
+            }
+
+            Text {
+                text: page.title
+                font { family: Theme.fontFamily; pixelSize: Theme.fontSize + 2; bold: true }
+                color: Theme.text
+            }
         }
     }