Add icon for current connection to Main Page Header

nymea-app/ui/MainPage.qml

@@ -13,6 +13,27 @@ Page {
 
     header: FancyHeader {
         title: swipeView.currentItem.title
+        leftButtonVisible: true
+        leftButtonImageSource: {
+            switch (engine.connection.currentConnection.bearerType) {
+            case Connection.BearerTypeLan:
+            case Connection.BearerTypeWan:
+                if (engine.connection.availableBearerTypes & NymeaConnection.BearerTypeEthernet != NymeaConnection.BearerTypeNone) {
+                    return "../images/network-wired.svg"
+                }
+                return "../images/network-wifi.svg";
+            case Connection.BearerTypeBluetooth:
+                return "../images/network-wifi.svg";
+            case Connection.BearerTypeCloud:
+                return "../images/cloud.svg"
+            }
+            return ""
+        }
+        onLeftButtonClicked: {
+            var dialog = connectionDialogComponent.createObject(root, {headerIcon: leftButtonImageSource})
+            dialog.open();
+        }
+
 
         model: ListModel {
             ListElement { iconSource: "../images/share.svg"; text: qsTr("Configure things"); page: "thingconfiguration/EditThingsPage.qml" }
@@ -249,4 +270,74 @@ Page {
             }
         }
     }
+
+    Component {
+        id: connectionDialogComponent
+        MeaDialog {
+            id: connectionDialog
+            title: engine.connection.currentHost.name
+            standardButtons: Dialog.NoButton
+
+            Label {
+                Layout.fillWidth: true
+                text: qsTr("Connected to")
+                font.pixelSize: app.smallFont
+                elide: Text.ElideRight
+                wrapMode: Text.WrapAtWordBoundaryOrAnywhere
+                horizontalAlignment: Text.AlignHCenter
+            }
+            Label {
+                Layout.fillWidth: true
+                text: engine.connection.currentHost.name
+                elide: Text.ElideRight
+                wrapMode: Text.WrapAtWordBoundaryOrAnywhere
+                horizontalAlignment: Text.AlignHCenter
+            }
+            Label {
+                Layout.fillWidth: true
+                text: engine.connection.currentHost.uuid
+                font.pixelSize: app.smallFont
+                elide: Text.ElideRight
+                color: Material.color(Material.Grey)
+                horizontalAlignment: Text.AlignHCenter
+            }
+            Label {
+                Layout.fillWidth: true
+                text: engine.connection.currentConnection.url
+                font.pixelSize: app.smallFont
+                elide: Text.ElideRight
+                color: Material.color(Material.Grey)
+                horizontalAlignment: Text.AlignHCenter
+            }
+
+            Item {
+                Layout.fillWidth: true
+                Layout.preferredHeight: app.margins
+            }
+
+            RowLayout {
+                Layout.fillWidth: true
+                Button {
+                    id: cancelButton
+                    text: qsTr("OK")
+                    Layout.preferredWidth: Math.max(cancelButton.implicitWidth, disconnectButton.implicitWidth)
+                    onClicked: connectionDialog.close()
+                }
+
+                Item {
+                    Layout.fillWidth: true
+                }
+
+                Button {
+                    id: disconnectButton
+                    text: qsTr("Disconnect")
+                    Layout.preferredWidth: Math.max(cancelButton.implicitWidth, disconnectButton.implicitWidth)
+                    onClicked: {
+                        tabSettings.lastConnectedHost = "";
+                        engine.connection.disconnect();
+                    }
+                }
+            }
+        }
+    }
 }

nymea-app/ui/SettingsPage.qml

@@ -11,28 +11,6 @@ Page {
         text: qsTr("Box settings")
         backButtonVisible: true
         onBackPressed: pageStack.pop()
-
-        HeaderButton {
-            imageSource: {
-                switch (engine.connection.currentConnection.bearerType) {
-                case Connection.BearerTypeLan:
-                case Connection.BearerTypeWan:
-                    if (engine.connection.availableBearerTypes & NymeaConnection.BearerTypeEthernet != NymeaConnection.BearerTypeNone) {
-                        return "../images/network-wired-offline.svg"
-                    }
-                    return "../images/network-wifi-offline.svg";
-                case Connection.BearerTypeBluetooth:
-                    return "../images/network-wifi-offline.svg";
-                case Connection.BearerTypeCloud:
-                    return "../images/cloud-offline.svg"
-                }
-                return ""
-            }
-            onClicked: {
-                tabSettings.lastConnectedHost = "";
-                engine.connection.disconnect();
-            }
-        }
     }
 
     Flickable {

nymea-app/ui/appsettings/CloudLoginPage.qml

@@ -338,7 +338,7 @@ Page {
                     Button {
                         Layout.fillWidth: true
                         Layout.leftMargin: app.margins; Layout.rightMargin: app.margins; Layout.topMargin: app.margins
-                        text: qsTr("Sign Up")
+                        text: qsTr("Sign up")
                         enabled: usernameTextField.acceptableInput && passwordTextField.isValidPassword
                         onClicked: {
                             busyOverlay.shown = true;

nymea-app/ui/components/FancyHeader.qml

@@ -11,9 +11,11 @@ ToolBar {
     property string title
     property alias model: menuRepeater.model
 
-    property bool showNewTabButton: false
+    property alias leftButtonVisible: leftButton.visible
+    property alias leftButtonImageSource: leftButton.imageSource
 
     signal clicked(int index);
+    signal leftButtonClicked();
 
     QtObject {
         id: d
@@ -27,6 +29,13 @@ ToolBar {
         opacity: d.menuOpen ? 0 : 1
         Behavior on opacity { NumberAnimation { easing.type: Easing.InOutQuad; duration: 200 } }
 
+        HeaderButton {
+            id: leftButton
+            imageSource: "../images/navigation-menu.svg"
+            visible: false
+            onClicked: root.leftButtonClicked()
+        }
+
         Label {
             id: label
             Layout.fillWidth: true