fix(ConnectDAppModal): don't overflow texts (#15907)

- set the correct widths and elide mode
- fixup the visuals of the NetworkFilter combo box (to disable it w/o
making it look disabled)
- fix passing the connection status down to DAppCard

storybook/qmlTests/tests/tst_ConnectDAppModal.qml

@@ -180,14 +180,14 @@ Item {
             verify(chainSelector, "Chain selector should be present")
             compare(chainSelector.selection.length, NetworksModel.flatNetworks.count)
 
-            // User should not be able to deselect a chain
+            // User should not be able to open the popup
             mouseClick(chainSelector)
             waitForItemPolished(chainSelector)
             const networkSelectorList = findChild(chainSelector, "networkSelectorList")
             verify(networkSelectorList, "Network selector list should be present")
-            mouseClick(networkSelectorList.itemAtIndex(0))
             compare(chainSelector.selection.length, NetworksModel.flatNetworks.count)
             compare(dappModal.selectedChains.length, NetworksModel.flatNetworks.count)
+            verify(!chainSelector.control.popup.opened)
 
             const connectionTag = findChild(dappModal, "connectionStatusTag")
             compare(connectionTag.visible, true)
@@ -236,14 +236,14 @@ Item {
             verify(chainSelector, "Chain selector should be present")
             compare(chainSelector.selection.length, NetworksModel.flatNetworks.count)
 
-            // User should not be able to deselect a chain
+            // User should not be able to open the popup
             mouseClick(chainSelector)
             waitForItemPolished(chainSelector)
             const networkSelectorList = findChild(chainSelector, "networkSelectorList")
             verify(networkSelectorList, "Network selector list should be present")
-            mouseClick(networkSelectorList.itemAtIndex(0))
             compare(chainSelector.selection.length, NetworksModel.flatNetworks.count)
             compare(dappModal.selectedChains.length, NetworksModel.flatNetworks.count)
+            verify(!chainSelector.control.popup.opened)
 
             const connectionTag = findChild(dappModal, "connectionStatusTag")
             compare(connectionTag.visible, true)

ui/app/AppLayouts/Wallet/controls/NetworkFilter.qml

@@ -61,7 +61,7 @@ StatusComboBox {
     control.indicator: SQP.StatusComboboxIndicator {
         x: root.control.mirrored ? root.control.horizontalPadding : root.width - width - root.control.horizontalPadding
         y: root.control.topPadding + (root.control.availableHeight - height) / 2
-        visible: !d.selectionUnavailable
+        visible: !d.selectionUnavailable && root.selectionAllowed
     }
 
     control.contentItem: RowLayout {

ui/imports/shared/popups/walletconnect/ConnectDAppModal.qml

@@ -113,16 +113,18 @@ StatusDialog {
 
             DAppCard {
                 id: dappCard
-                Layout.maximumWidth: root.availableWidth - Layout.leftMargin * 2
+                Layout.maximumWidth: scrollView.availableWidth - Layout.leftMargin * 2
                 Layout.leftMargin: 12
                 Layout.rightMargin: Layout.leftMargin
                 Layout.topMargin: 14
                 Layout.bottomMargin: Layout.topMargin
+                connectionSuccessful: d.connectionSuccessful
+                connectionAttempted: d.connectionAttempted
             }
 
             ContextCard {
                 id: contextCard
-                Layout.maximumWidth: root.availableWidth
+                Layout.maximumWidth: scrollView.availableWidth
                 Layout.fillWidth: true
 
                 multipleChainSelection: root.multipleChainSelection
@@ -140,7 +142,7 @@ StatusDialog {
             }
 
             PermissionsCard {
-                Layout.maximumWidth: root.availableWidth
+                Layout.maximumWidth: scrollView.availableWidth
                 Layout.fillWidth: true
 
                 Layout.leftMargin: 16

ui/imports/shared/popups/walletconnect/private/ContextCard.qml

@@ -1,4 +1,5 @@
 import QtQuick 2.15
+import QtQuick.Controls 2.15
 import QtQuick.Layouts 1.15
 
 import StatusQ 0.1
@@ -83,7 +84,14 @@ Rectangle {
                 multiSelection: root.multipleChainSelection
                 showAllSelectedText: false
                 selectionAllowed: false
+
+                // disable interactions w/o looking disabled
+                control.hoverEnabled: false
+                MouseArea {
+                    anchors.fill: parent
+                    onPressed: mouse.accepted = true
+                }
             }
         }
     }
-}
+}

ui/imports/shared/popups/walletconnect/private/DAppCard.qml

@@ -1,4 +1,5 @@
 import QtQuick 2.15
+import QtQuick.Controls 2.15
 import QtQuick.Layouts 1.15
 
 import StatusQ 0.1
@@ -15,6 +16,8 @@ ColumnLayout {
     property alias name: appNameText.text
     property url dAppUrl: ""
     property url iconUrl: ""
+    property bool connectionSuccessful
+    property bool connectionAttempted
 
     spacing: Style.current.padding
 
@@ -67,8 +70,8 @@ ColumnLayout {
             Layout.alignment: Qt.AlignHCenter
             Layout.maximumWidth: root.width
             objectName: "connectionStatusTag"
-            success: d.connectionSuccessful
-            visible: d.connectionAttempted
+            success: root.connectionSuccessful
+            visible: root.connectionAttempted
         }
     }
-}
+}

ui/imports/shared/popups/walletconnect/private/PermissionsCard.qml

@@ -11,24 +11,28 @@ ColumnLayout {
     property string dappName: ""
 
     StatusBaseText {
+        Layout.fillWidth: true
         objectName: "permissionsTitle"
         text: qsTr("%1 will be able to:").arg(root.dappName)
         Layout.preferredHeight: 18
         font.pixelSize: 13
+        elide: Text.ElideMiddle
         color: Theme.palette.baseColor1
     }
 
     StatusBaseText {
         text: qsTr("Check your account balance and activity")
+        Layout.fillWidth: true
         Layout.preferredHeight: 18
-
+        elide: Text.ElideRight
         font.pixelSize: 13
     }
 
     StatusBaseText {
         text: qsTr("Request transactions and message signing")
+        Layout.fillWidth: true
         Layout.preferredHeight: 18
-
+        elide: Text.ElideRight
         font.pixelSize: 13
     }
-}
+}