From ccba01a5301100acd633afe98230a7ca1f2d7c96 Mon Sep 17 00:00:00 2001 From: Ricardo Guilherme Schmidt <3esmit@gmail.com> Date: Sat, 18 Jul 2026 11:38:47 -0300 Subject: [PATCH] fix(liquidity): place balances below amount input --- .../liquidity/AmmTokenAccessory.qml | 34 ------------------- .../liquidity/AmmTokenAmountSurface.qml | 31 +++++++++++++++++ .../components/liquidity/TokenAmountInput.qml | 7 ++-- apps/amm/tests/qml/tst_TokenAmountInput.qml | 10 +++--- 4 files changed, 40 insertions(+), 42 deletions(-) diff --git a/apps/amm/qml/components/liquidity/AmmTokenAccessory.qml b/apps/amm/qml/components/liquidity/AmmTokenAccessory.qml index 4888c5b..836a27a 100644 --- a/apps/amm/qml/components/liquidity/AmmTokenAccessory.qml +++ b/apps/amm/qml/components/liquidity/AmmTokenAccessory.qml @@ -1,7 +1,6 @@ pragma ComponentBehavior: Bound import QtQuick -import QtQuick.Controls import QtQuick.Layouts ColumnLayout { @@ -12,44 +11,11 @@ ColumnLayout { property string tokenColor: root.theme.colors.noTokenCircle property string tokenLetter: "" property string tokenText: qsTr("Select token") - property string balance: "" - property bool balanceUpdating: false - readonly property bool showBalanceLoadingIndicator: root.balance.length > 0 - && root.balanceUpdating property string accessibleName: qsTr("Select token") property bool invalid: false signal clicked - spacing: 2 - - RowLayout { - Layout.fillWidth: true - visible: root.balance.length > 0 - spacing: 4 - - Text { - id: balanceText - - objectName: "tokenBalanceText" - Layout.fillWidth: true - text: qsTr("Balance %1").arg(root.balance) - color: root.theme.colors.textSecondary - font.pixelSize: 10 - horizontalAlignment: Text.AlignRight - elide: Text.ElideRight - } - - BusyIndicator { - objectName: "tokenBalanceLoadingIndicator" - Layout.preferredWidth: 12 - Layout.preferredHeight: 12 - visible: root.showBalanceLoadingIndicator - running: visible - Accessible.name: qsTr("Updating balance") - } - } - AmmTokenSelectButton { objectName: "tokenSelectButton" Layout.fillWidth: true diff --git a/apps/amm/qml/components/liquidity/AmmTokenAmountSurface.qml b/apps/amm/qml/components/liquidity/AmmTokenAmountSurface.qml index 39ccd5d..418a85e 100644 --- a/apps/amm/qml/components/liquidity/AmmTokenAmountSurface.qml +++ b/apps/amm/qml/components/liquidity/AmmTokenAmountSurface.qml @@ -13,6 +13,8 @@ Rectangle { property string supportingText: "" property string errorText: "" property string supportingActionText: "" + property string availableBalance: "" + property bool availableBalanceUpdating: false property bool readOnly: false property bool muted: false property bool invalid: root.errorText.length > 0 @@ -22,6 +24,7 @@ Rectangle { property Component adjustment property real adjustmentWidth: 0 property real adjustmentHeight: 0 + readonly property bool showAvailableBalance: root.availableBalance.length > 0 signal amountEdited(string value) signal amountEditingFinished(string value) @@ -165,6 +168,34 @@ Rectangle { } } + RowLayout { + Layout.maximumWidth: 150 + spacing: 4 + visible: root.showAvailableBalance + + Text { + id: availableBalanceText + + objectName: "availableBalanceText" + Layout.minimumWidth: 0 + Layout.preferredWidth: Math.min(implicitWidth, 150) + Layout.maximumWidth: 150 + text: qsTr("Balance %1").arg(root.availableBalance) + color: root.theme.colors.textSecondary + font.pixelSize: 11 + elide: Text.ElideRight + } + + BusyIndicator { + objectName: "availableBalanceLoadingIndicator" + Layout.preferredWidth: 12 + Layout.preferredHeight: 12 + visible: root.availableBalanceUpdating + running: visible + Accessible.name: qsTr("Updating balance") + } + } + Text { Layout.fillWidth: true text: root.supportingText diff --git a/apps/amm/qml/components/liquidity/TokenAmountInput.qml b/apps/amm/qml/components/liquidity/TokenAmountInput.qml index 3e8749e..56865bb 100644 --- a/apps/amm/qml/components/liquidity/TokenAmountInput.qml +++ b/apps/amm/qml/components/liquidity/TokenAmountInput.qml @@ -42,10 +42,11 @@ AmmTokenAmountSurface { amount: root.text supportingText: root.helperText supportingActionText: root.showMaxButton ? qsTr("MAX") : "" + availableBalance: root.balance + availableBalanceUpdating: root.balanceUpdating accessory: tokenActions accessoryWidth: width < 360 ? 132 : 180 - accessoryHeight: root.holdings.length > 1 ? 88 - : root.balance.length > 0 ? 58 : 40 + accessoryHeight: root.holdings.length > 1 ? 88 : 40 onAmountEdited: function(value) { root.pendingValue = value @@ -89,8 +90,6 @@ AmmTokenAmountSurface { tokenColor: root.tokenColor(root.tokenData) tokenLetter: root.tokenLetter(root.tokenData) tokenText: root.tokenText(root.tokenData) - balance: root.balance - balanceUpdating: root.balanceUpdating accessibleName: qsTr("Select %1").arg(root.label) onClicked: tokenModal.open() } diff --git a/apps/amm/tests/qml/tst_TokenAmountInput.qml b/apps/amm/tests/qml/tst_TokenAmountInput.qml index c01f6e2..0f6f4fa 100644 --- a/apps/amm/tests/qml/tst_TokenAmountInput.qml +++ b/apps/amm/tests/qml/tst_TokenAmountInput.qml @@ -120,16 +120,18 @@ TestCase { } function test_balanceRefreshShowsLoadingIndicatorWithoutClearingBalance() { + failOnWarning(/Detected recursive rearrange/) var input = createTemporaryObject(inputComponent, testCase, { "balance": "12", "balanceUpdating": true }) verify(input) - var accessory = findChild(input, "tokenAccessory") - verify(accessory) - compare(accessory.balance, "12") - compare(accessory.showBalanceLoadingIndicator, true) + var balanceText = findChild(input, "availableBalanceText") + verify(balanceText) + compare(balanceText.text, "Balance 12") + compare(input.showAvailableBalance, true) + compare(input.accessoryHeight, 40) } function test_disabledTokenIsRejectedByTypedInput() {