feat(StatusModal): Add popup menu support for StatusModal

Added logic to support a popup menu to be launched from the StatusModal header.
Added an example in sandbox to demonstrate its usage.

fixes #374

sandbox/Popups.qml

@@ -53,6 +53,11 @@ Column {
         onClicked: modalWithLongTitles.open()
     }
 
+    StatusButton {
+        text: "Modal with Header Popup Menu"
+        onClicked: modalWithHeaderPopupMenu.open()
+    }
+
     StatusModal {
         id: simpleModal
         anchors.centerIn: parent
@@ -264,4 +269,33 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
             }
         ]
     }
+
+    StatusModal {
+        id: modalWithHeaderPopupMenu
+        anchors.centerIn: parent
+        header.title: "helloworld.eth"
+        header.subTitle: "Basic address"
+        header.popupMenu: StatusPopupMenu {
+            id: popupMenu
+            Repeater {
+                model: dummyAccountsModel
+                delegate: Loader {
+                    sourceComponent: popupMenu.delegate
+                    onLoaded: {
+                        item.action.text = model.name
+                        item.action.iconSettings.name = model.iconName
+                    }
+                }
+            }
+            onMenuItemClicked: {
+                popupMenu.dismiss()
+            }
+        }
+    }
+
+    ListModel {
+        id: dummyAccountsModel
+        ListElement{name: "Account 1"; iconName: "filled-account"}
+        ListElement{name: "Account 2"; iconName: "filled-account"}
+    }
 }

src/StatusQ/Core/StatusModalHeaderSettings.qml

@@ -5,6 +5,7 @@ QtObject {
     property string subTitle
     property int titleElide: Text.ElideRight
     property int subTitleElide: Text.ElideRight
+    property Component popupMenu
     property StatusImageSettings image: StatusImageSettings {
         width: 40
         height: 40

src/StatusQ/Popups/StatusModal.qml

@@ -54,6 +54,7 @@ QC.Popup {
             subTitleElide: header.subTitleElide
             image: header.image
             icon: header.icon
+            popupMenu: header.popupMenu
 
             onEditButtonClicked: statusModal.editButtonClicked()
             onClose: statusModal.close()

src/StatusQ/Popups/statusModal/StatusModalHeader.qml

@@ -18,6 +18,7 @@ Rectangle {
     property alias image: imageWithTitle.image
     property alias icon: imageWithTitle.icon
     property bool editable: false
+    property Component popupMenu
 
     signal editButtonClicked
     signal close
@@ -29,6 +30,12 @@ Rectangle {
 
     color: Theme.palette.statusModal.backgroundColor
 
+    onPopupMenuChanged: {
+        if (!!popupMenu) {
+            popupMenuSlot.sourceComponent = popupMenu
+        }
+    }
+
     StatusImageWithTitle {
         id: imageWithTitle
         anchors.verticalCenter: parent.verticalCenter
@@ -42,6 +49,15 @@ Rectangle {
         onEditButtonClicked: statusModalHeader.editButtonClicked()
     }
 
+    MouseArea {
+        anchors.fill: imageWithTitle
+        visible: !!statusModalHeader.popupMenu
+        cursorShape: Qt.PointingHandCursor
+        onClicked: {
+            popupMenuSlot.item.popup(imageWithTitle.x, imageWithTitle.y + imageWithTitle.height + 8)
+        }
+    }
+
     Loader {
         id: actionButtonLoader
         anchors.right: closeButton.left
@@ -78,4 +94,9 @@ Rectangle {
             width: parent.width
         }
     }
+
+    Loader {
+        id: popupMenuSlot
+        active: !!statusModalHeader.popupMenu
+    }
 }