From 420708c86fd0a859a15199e29e0539f5b3344adb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Cie=C5=9Blak?= <michalcieslak@status.im>
Date: Wed, 10 May 2023 13:19:25 +0200
Subject: [PATCH] fix(SendModal): Modal height calculation and clipping fixed

Closes: #10323
---
 ui/imports/shared/popups/SendModal.qml        | 54 +++++++++++++------
 .../shared/views/TabAddressSelectorView.qml   | 15 ++----
 2 files changed, 42 insertions(+), 27 deletions(-)

diff --git a/ui/imports/shared/popups/SendModal.qml b/ui/imports/shared/popups/SendModal.qml
index 26316602ca..c1dbe2d9cd 100644
--- a/ui/imports/shared/popups/SendModal.qml
+++ b/ui/imports/shared/popups/SendModal.qml
@@ -8,12 +8,13 @@ import utils 1.0
 import shared.stores 1.0
 import shared.panels 1.0
 
-import StatusQ.Controls 0.1
-import StatusQ.Popups.Dialog 0.1
 import StatusQ.Components 0.1
+import StatusQ.Controls 0.1
+import StatusQ.Controls.Validators 0.1
 import StatusQ.Core 0.1
 import StatusQ.Core.Theme 0.1
-import StatusQ.Controls.Validators 0.1
+import StatusQ.Core.Utils 0.1
+import StatusQ.Popups.Dialog 0.1
 
 import "../panels"
 import "../controls"
@@ -155,22 +156,30 @@ StatusDialog {
         onSelectedIndexChanged: store.switchSenderAccount(selectedIndex)
     }
 
-    StackLayout {
-        id: stack
+
+    ColumnLayout {
+        id: group1
+
         anchors.fill: parent
-        currentIndex: 0
-        clip: true
-        ColumnLayout {
-            id: group1
+
+        // Workaround for https://bugreports.qt.io/browse/QTBUG-87804
+        onImplicitHeightChanged: {
+            margins--
+            margins++
+        }
+
+        ClippingWrapper {
             Layout.fillWidth: true
-            Layout.fillHeight: true
+            Layout.preferredHeight: assetAndAmountSelector.implicitHeight
+                                    + Style.current.halfPadding
+            z: 100
+
+            clipBottomMargin: 20
 
             Rectangle {
-                Layout.fillWidth: true
-                Layout.preferredHeight: assetAndAmountSelector.implicitHeight + Style.current.halfPadding
+                anchors.fill: parent
 
                 color: Theme.palette.baseColor3
-                z: 100
 
                 layer.enabled: scrollView.contentY > 0
                 layer.effect: DropShadow {
@@ -324,19 +333,30 @@ StatusDialog {
                     }
                 }
             }
+        }
+
+        ClippingWrapper {
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
+            implicitWidth: scrollView.implicitWidth
+            implicitHeight: scrollView.implicitHeight
+
+            clipTopMargin: 40
+            clipBottomMargin: popup.bottomPadding
 
             StatusScrollView {
                 id: scrollView
+
                 topPadding: 12
+                anchors.fill: parent
 
                 implicitWidth: contentWidth + leftPadding + rightPadding
                 implicitHeight: contentHeight + topPadding + bottomPadding
-                Layout.fillWidth: true
-                Layout.fillHeight: true
 
-                contentHeight: layout.height + Style.current.padding
+                contentHeight: layout.implicitHeight
 
-                z: 0
+                clip: false
                 objectName: "sendModalScroll"
 
                 Column {
diff --git a/ui/imports/shared/views/TabAddressSelectorView.qml b/ui/imports/shared/views/TabAddressSelectorView.qml
index ea09853f24..bea50c542d 100644
--- a/ui/imports/shared/views/TabAddressSelectorView.qml
+++ b/ui/imports/shared/views/TabAddressSelectorView.qml
@@ -22,7 +22,7 @@ import "../views"
 Item {
     id: root
     clip: true
-    implicitHeight: visible ? accountSelectionTabBar.height + stackLayout.height + Style.current.bigPadding: 0
+    implicitHeight: visible ? accountSelectionTabBar.height + stackLayout.height : 0
 
     property var selectedAccount
     property var store
@@ -38,17 +38,12 @@ Item {
         None
     }
 
-    QtObject {
-        id: d
-        readonly property int maxHeightForList: 281
-    }
-
     StatusTabBar {
         id: accountSelectionTabBar
         anchors.top: parent.top
         anchors.left: parent.left
         width: parent.width
-        
+
         StatusTabButton {
             id: assetBtn
             width: implicitWidth
@@ -87,7 +82,7 @@ Item {
                 anchors.horizontalCenter: parent.horizontalCenter
                 anchors.top: parent.top
                 implicitWidth: parent.width
-                height: Math.min(d.maxHeightForList, savedAddresses.contentHeight)
+                height: savedAddresses.contentHeight
 
                 model: root.store.savedAddressesModel
                 header: savedAddresses.count > 0 ? search : nothingInList
@@ -133,7 +128,7 @@ Item {
                 anchors.horizontalCenter: parent.horizontalCenter
                 anchors.top: parent.top
                 width: parent.width
-                height: Math.min(d.maxHeightForList, myAccounts.contentHeight)
+                height: myAccounts.contentHeight
 
                 delegate: WalletAccountListItem {
                     implicitWidth: ListView.view.width
@@ -162,7 +157,7 @@ Item {
                 anchors.horizontalCenter: parent.horizontalCenter
                 anchors.top: parent.top
                 width: parent.width
-                height: Math.min(d.maxHeightForList, recents.contentHeight)
+                height: recents.contentHeight
 
                 header: StatusBaseText {
                     height: visible ? 56 : 0