fix(StatusAssetSelector): Fixes the issue of longer text overlapping with the arrow. Have also added a max width for the text after which it should elide (#772)

ui/StatusQ/sandbox/pages/StatusAssetSelectorPage.qml

@@ -25,14 +25,24 @@ Column {
                 name: "Status Network Token"
                 balance: "20"
                 symbol: "SNT"
-                currencyBalance: 9992.01
+                totalCurrencyBalance: 9992.01
+                totalBalance: 9992.01
             }
             ListElement {
                 address: "0x1234"
                 name: "DAI Token"
                 balance: "15"
                 symbol: "DAI"
-                currencyBalance: 20.00001
+                totalCurrencyBalance: 20.00001
+                totalBalance: 20.00001
+            }
+            ListElement {
+                address: "0x1234"
+                name: "ABYSS Token"
+                balance: "25"
+                symbol: "ABYSS"
+                totalCurrencyBalance: 24.1
+                totalBalance: 24.1
             }
         }
     }

ui/StatusQ/src/StatusQ/Controls/StatusAssetSelector.qml

@@ -19,7 +19,7 @@ Item {
     }
     // Define this in the usage to get balance in currency selected by user
     property var getCurrencyBalanceString: function (currencyBalance) { return "" }
-    implicitWidth: 86
+    implicitWidth: 106
     implicitHeight: 32
 
     function resetInternal() {
@@ -66,6 +66,8 @@ Item {
                 anchors.verticalCenter: parent.verticalCenter
                 font.pixelSize: 15
                 height: 22
+                width: 50
+                elide: Text.ElideRight
                 verticalAlignment: Text.AlignVCenter
                 color: Theme.palette.directColor1
             }