From deaaeebb31775aadf1734983db83c07ef1af8c63 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Luk=C3=A1=C5=A1=20Tinkl?= <lukast@status.im>
Date: Mon, 29 Jul 2024 20:29:43 +0200
Subject: [PATCH] fix(ConnectDAppModal): add scrolling (#15854)

- wrap the contents into a scroll view and don't hardcode the height

Fixes #15592
---
 .../qmlTests/tests/tst_ConnectDAppModal.qml   |  3 +-
 .../popups/walletconnect/ConnectDAppModal.qml | 90 ++++++++++---------
 2 files changed, 48 insertions(+), 45 deletions(-)

diff --git a/storybook/qmlTests/tests/tst_ConnectDAppModal.qml b/storybook/qmlTests/tests/tst_ConnectDAppModal.qml
index f2c58e0b0a..ca8d92abc3 100644
--- a/storybook/qmlTests/tests/tst_ConnectDAppModal.qml
+++ b/storybook/qmlTests/tests/tst_ConnectDAppModal.qml
@@ -65,7 +65,6 @@ Item {
             verify(dappModal.flatNetworks, "ConnectDAppModal should have networks")
 
             compare(dappModal.width, 480)
-            compare(dappModal.height, 633)
             compare(dappModal.dAppName, "")
             compare(dappModal.dAppUrl, "")
             compare(dappModal.dAppIconUrl, "")
@@ -318,4 +317,4 @@ Item {
             // compare(connectButton.enabled, true)
         }
     }
-}
\ No newline at end of file
+}
diff --git a/ui/imports/shared/popups/walletconnect/ConnectDAppModal.qml b/ui/imports/shared/popups/walletconnect/ConnectDAppModal.qml
index d4f6371341..8b762a7ed2 100644
--- a/ui/imports/shared/popups/walletconnect/ConnectDAppModal.qml
+++ b/ui/imports/shared/popups/walletconnect/ConnectDAppModal.qml
@@ -1,11 +1,9 @@
 import QtQuick 2.15
 import QtQuick.Controls 2.15
 import QtQuick.Layouts 1.15
-import QtQml.Models 2.14
+import QtQml.Models 2.15
 import SortFilterProxyModel 0.2
 
-import QtGraphicalEffects 1.15
-
 import StatusQ 0.1
 import StatusQ.Core 0.1
 import StatusQ.Core.Utils 0.1
@@ -93,56 +91,64 @@ StatusDialog {
     signal disconnect()
 
     width: 480
-    implicitHeight: !d.connectionAttempted ? 633 : 681
-
-    closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
 
     title: d.connectionSuccessful ? qsTr("dApp connected") :
                                     qsTr("Connection request")
 
-    padding: 20
+    padding: 0
 
-    contentItem: ColumnLayout {
-        spacing: 20
-        clip: true
+    StatusScrollView {
+        id: scrollView
+        anchors.fill: parent
+        contentWidth: availableWidth
+        topPadding: 0
+        bottomPadding: 0
 
-        DAppCard {
-            id: dappCard
-            Layout.maximumWidth: root.availableWidth - Layout.leftMargin * 2
-            Layout.leftMargin: 12
-            Layout.rightMargin: Layout.leftMargin
-            Layout.topMargin: 14
-            Layout.bottomMargin: Layout.topMargin
-        }
+        ColumnLayout {
+            spacing: 20
+            anchors.left: parent.left
+            anchors.leftMargin: 4
+            anchors.right: parent.right
+            anchors.rightMargin: 4
 
-        ContextCard {
-            id: contextCard
-            Layout.maximumWidth: root.availableWidth
-            Layout.fillWidth: true
+            DAppCard {
+                id: dappCard
+                Layout.maximumWidth: root.availableWidth - Layout.leftMargin * 2
+                Layout.leftMargin: 12
+                Layout.rightMargin: Layout.leftMargin
+                Layout.topMargin: 14
+                Layout.bottomMargin: Layout.topMargin
+            }
 
-            multipleChainSelection: root.multipleChainSelection
-            selectedAccountAddress: root.selectedAccountAddress
-            connectionAttempted: d.connectionAttempted
-            accountsModel: d.accountsProxy
-            chainsModel: root.flatNetworks
-            chainSelection: d.selectedChains
+            ContextCard {
+                id: contextCard
+                Layout.maximumWidth: root.availableWidth
+                Layout.fillWidth: true
 
-            onChainSelectionChanged: {
-                if (d.selectedChains !== chainSelection) {
-                    d.selectedChains = chainSelection
+                multipleChainSelection: root.multipleChainSelection
+                selectedAccountAddress: root.selectedAccountAddress
+                connectionAttempted: d.connectionAttempted
+                accountsModel: d.accountsProxy
+                chainsModel: root.flatNetworks
+                chainSelection: d.selectedChains
+
+                onChainSelectionChanged: {
+                    if (d.selectedChains !== chainSelection) {
+                        d.selectedChains = chainSelection
+                    }
                 }
             }
-        }
 
-        PermissionsCard {
-            Layout.maximumWidth: root.availableWidth
-            Layout.fillWidth: true
+            PermissionsCard {
+                Layout.maximumWidth: root.availableWidth
+                Layout.fillWidth: true
 
-            Layout.leftMargin: 16
-            Layout.rightMargin: Layout.leftMargin
-            Layout.topMargin: 12
-            Layout.bottomMargin: Layout.topMargin
-            dappName: dappCard.name
+                Layout.leftMargin: 16
+                Layout.rightMargin: Layout.leftMargin
+                Layout.topMargin: 12
+                Layout.bottomMargin: Layout.topMargin
+                dappName: dappCard.name
+            }
         }
     }
 
@@ -172,9 +178,7 @@ StatusDialog {
             StatusButton {
                 objectName: "primaryActionButton"
                 height: 44
-                text: d.connectionAttempted
-                            ? qsTr("Close")
-                            : qsTr("Connect")
+                text: d.connectionAttempted ? qsTr("Close") : qsTr("Connect")
                 enabled: {
                     if (!d.connectionAttempted)
                         return root.selectedChains.length > 0