From a10ca6490b04f291d00e7d73ef2615f53f952e17 Mon Sep 17 00:00:00 2001
From: Khushboo Mehta <mehtakhushboo@hotmail.com>
Date: Tue, 3 Dec 2024 13:01:12 +0100
Subject: [PATCH] feat(@desktop/wallet): Adds enabled state for the token
 selector needed when Simple send is scrolling

---
 storybook/pages/TokenSelectorButtonPage.qml        | 10 ++++++++++
 storybook/pages/TokenSelectorPage.qml              |  9 +++++++++
 .../AppLayouts/Wallet/controls/TokenSelector.qml   |  3 +++
 .../Wallet/controls/TokenSelectorButton.qml        | 14 ++++++++++++--
 .../AppLayouts/Wallet/panels/SendModalHeader.qml   |  4 ++++
 5 files changed, 38 insertions(+), 2 deletions(-)

diff --git a/storybook/pages/TokenSelectorButtonPage.qml b/storybook/pages/TokenSelectorButtonPage.qml
index baafa35153..a13ca65306 100644
--- a/storybook/pages/TokenSelectorButtonPage.qml
+++ b/storybook/pages/TokenSelectorButtonPage.qml
@@ -36,6 +36,9 @@ Pane {
 
                 selected: selectionCheckBox.checked
                 forceHovered: forceHoveredCheckBox.checked
+                size: smallCheckBox.checked ? TokenSelectorButton.Size.Small :
+                                              TokenSelectorButton.Size.Normal
+
 
                 name: "My token" + (longNameCheckBox.checked ? " long name" : "")
                 icon: Constants.tokenIcon("CFI")
@@ -61,6 +64,13 @@ Pane {
 
             text: "force hovered"
         }
+
+
+        CheckBox {
+            id: smallCheckBox
+
+            text: "small"
+        }
     }
 
     Settings {
diff --git a/storybook/pages/TokenSelectorPage.qml b/storybook/pages/TokenSelectorPage.qml
index a73daa9fb8..b977a104be 100644
--- a/storybook/pages/TokenSelectorPage.qml
+++ b/storybook/pages/TokenSelectorPage.qml
@@ -190,6 +190,9 @@ Pane {
 
         anchors.centerIn: parent
 
+        size: smallCheckbox.checked ? TokenSelectorButton.Size.Small :
+                                      TokenSelectorButton.Size.Normal
+
         assetsModel: assetsModelCheckBox.checked ? assetsModel : null
         collectiblesModel: collectiblesModelCheckBox.checked ? collectiblesModel : null
 
@@ -215,6 +218,12 @@ Pane {
             checked: true
             text: "Collectibles model assigned"
         }
+
+        CheckBox {
+            id: smallCheckbox
+
+            text: "small"
+        }
     }
 }
 
diff --git a/ui/app/AppLayouts/Wallet/controls/TokenSelector.qml b/ui/app/AppLayouts/Wallet/controls/TokenSelector.qml
index 04bf8eca45..8164e56fa6 100644
--- a/ui/app/AppLayouts/Wallet/controls/TokenSelector.qml
+++ b/ui/app/AppLayouts/Wallet/controls/TokenSelector.qml
@@ -20,6 +20,9 @@ Control {
     /** Exposes insatnce of popup **/
     property var popup: dropdown
 
+    /** Sets size of the TokenSelectorButton **/
+    property alias size: tokenSelectorButton.size
+
     readonly property bool isTokenSelected: tokenSelectorButton.selected
 
     signal assetSelected(string key)
diff --git a/ui/app/AppLayouts/Wallet/controls/TokenSelectorButton.qml b/ui/app/AppLayouts/Wallet/controls/TokenSelectorButton.qml
index 3f26c28ffa..0ad00f4ca9 100644
--- a/ui/app/AppLayouts/Wallet/controls/TokenSelectorButton.qml
+++ b/ui/app/AppLayouts/Wallet/controls/TokenSelectorButton.qml
@@ -20,9 +20,17 @@ Control {
     property string name
     property url icon
 
+    /** Sets size of the Token Selector Button **/
+    property int size: TokenSelectorButton.Size.Normal
+
     signal clicked
 
-    padding: 10
+    enum Size {
+        Small,
+        Normal
+    }
+
+    padding: root.selected ? 0 : 10
 
     background: StatusComboboxBackground {
         border.width: 0
@@ -83,7 +91,9 @@ Control {
                 Layout.fillWidth: true
 
                 objectName: "tokenSelectorContentItemText"
-                font.pixelSize: 28
+                font.pixelSize: root.size === TokenSelectorButton.Size.Normal ? 28 : 22
+                lineHeightMode: Text.FixedHeight
+                lineHeight: root.size === TokenSelectorButton.Size.Normal ? 38 : 30
                 color: root.hovered ? Theme.palette.blue : Theme.palette.darkBlue
 
                 elide: Text.ElideRight
diff --git a/ui/app/AppLayouts/Wallet/panels/SendModalHeader.qml b/ui/app/AppLayouts/Wallet/panels/SendModalHeader.qml
index 8e92653f2d..898b78dd75 100644
--- a/ui/app/AppLayouts/Wallet/panels/SendModalHeader.qml
+++ b/ui/app/AppLayouts/Wallet/panels/SendModalHeader.qml
@@ -92,6 +92,10 @@ RowLayout {
         Layout.fillWidth: true
         Layout.maximumWidth: implicitWidth
 
+        size: root.isStickyHeader ?
+                  TokenSelectorButton.Size.Small:
+                  TokenSelectorButton.Size.Normal
+
         assetsModel: root.assetsModel
         collectiblesModel: root.collectiblesModel