fix(SendModal): Bridge modal Simple mode's scroll is very clunky

- remove the nested unneeded ScrollView
- cleanups and fixes in mocked models and stores to unbreak showing the
networks/routing in storybook

Fixes #15902
This commit is contained in:
Lukáš Tinkl 2024-08-02 10:37:02 +02:00 committed by Lukáš Tinkl
parent b8bc0a9631
commit b67ea6643a
4 changed files with 27 additions and 85 deletions

View File

@ -92,6 +92,11 @@ SplitView {
TransactionStore { TransactionStore {
id: txStore id: txStore
property bool areTestNetworksEnabled: true
function setRouteDisabledChains(chainId, disabled) {}
walletAssetStore: root.walletAssetStore walletAssetStore: root.walletAssetStore
tokensStore.showCommunityAssetsInSend: showCommunityAssetsCheckBox.checked tokensStore.showCommunityAssetsInSend: showCommunityAssetsCheckBox.checked
tokensStore.displayAssetsBelowBalance: balanceThresholdCheckbox.checked tokensStore.displayAssetsBelowBalance: balanceThresholdCheckbox.checked
@ -104,10 +109,12 @@ SplitView {
property ListModel toModel: ListModel { property ListModel toModel: ListModel {
ListElement { ListElement {
chainId: 420 chainId: 420
chainName: "Optimism"
iconUrl: "network/Network=Optimism"
amountOut: "3003845308235848343" amountOut: "3003845308235848343"
} }
ListElement {
chainId: 1
amountOut: "30038453082358483445"
}
} }
property var suggestesRoutes: [{ property var suggestesRoutes: [{
bridgeName:"Hop", bridgeName:"Hop",

View File

@ -166,15 +166,6 @@ QtObject {
Component.onCompleted: append([ Component.onCompleted: append([
{ {
chainId: 1, chainId: 1,
chainName: "Ethereum Mainnet",
iconUrl: ModelsData.networks.ethereum,
chainColor: "blue",
shortName: "ETH",
layer: 1,
nativeCurrencyDecimals: 18,
nativeCurrencyName: "Ether",
nativeCurrencySymbol: "ETH",
isRouteEnabled: true,
isRoutePreferred: true, isRoutePreferred: true,
hasGas: true, hasGas: true,
tokenBalance: ({ tokenBalance: ({
@ -190,15 +181,6 @@ QtObject {
}, },
{ {
chainId: 10, chainId: 10,
chainName: "Optimism",
iconUrl: ModelsData.networks.optimism,
chainColor: "red",
shortName: "OPT",
layer: 2,
nativeCurrencyDecimals: 18,
nativeCurrencyName: "Ether",
nativeCurrencySymbol: "ETH",
isRouteEnabled: true,
isRoutePreferred: true, isRoutePreferred: true,
hasGas: true, hasGas: true,
tokenBalance: ({ tokenBalance: ({
@ -214,16 +196,6 @@ QtObject {
}, },
{ {
chainId: 42161, chainId: 42161,
chainName: "Arbitrum",
iconUrl: ModelsData.networks.arbitrum,
isActive: false,
shortName: "ARB",
chainColor: "purple",
layer: 2,
nativeCurrencyDecimals: 18,
nativeCurrencyName: "Ether",
nativeCurrencySymbol: "ETH",
isRouteEnabled: true,
isRoutePreferred: true, isRoutePreferred: true,
hasGas: true, hasGas: true,
tokenBalance: ({ tokenBalance: ({
@ -285,15 +257,6 @@ QtObject {
Component.onCompleted: append([ Component.onCompleted: append([
{ {
chainId: 1, chainId: 1,
chainName: "Ethereum Mainnet",
iconUrl: ModelsData.networks.ethereum,
chainColor: "blue",
shortName: "ETH",
layer: 1,
nativeCurrencyDecimals: 18,
nativeCurrencyName: "Ether",
nativeCurrencySymbol: "ETH",
isRouteEnabled: true,
isRoutePreferred: true, isRoutePreferred: true,
hasGas: true, hasGas: true,
tokenBalance: ({ tokenBalance: ({
@ -309,16 +272,6 @@ QtObject {
}, },
{ {
chainId: 10, chainId: 10,
chainName: "Optimism",
iconUrl: ModelsData.networks.optimism,
chainColor: "red",
shortName: "OPT",
layer: 2,
nativeCurrencyDecimals: 18,
nativeCurrencyName: "Ether",
nativeCurrencySymbol: "ETH",
isRouteEnabled: true,
isRoutePreferred: true,
hasGas: true, hasGas: true,
tokenBalance: ({ tokenBalance: ({
displayDecimals: true, displayDecimals: true,
@ -333,17 +286,6 @@ QtObject {
}, },
{ {
chainId: 42161, chainId: 42161,
chainName: "Arbitrum",
iconUrl: ModelsData.networks.arbitrum,
isActive: false,
isEnabled: true,
shortName: "ARB",
chainColor: "purple",
layer: 2,
nativeCurrencyDecimals: 18,
nativeCurrencyName: "Ether",
nativeCurrencySymbol: "ETH",
isRouteEnabled: true,
isRoutePreferred: true, isRoutePreferred: true,
hasGas: true, hasGas: true,
tokenBalance: ({ tokenBalance: ({

View File

@ -143,7 +143,7 @@ StatusDialog {
readonly property bool isCollectiblesTransfer: store.sendType === Constants.SendType.ERC721Transfer || readonly property bool isCollectiblesTransfer: store.sendType === Constants.SendType.ERC721Transfer ||
store.sendType === Constants.SendType.ERC1155Transfer store.sendType === Constants.SendType.ERC1155Transfer
property var selectedHolding: null property var selectedHolding: null
property var selectedHoldingType: Constants.TokenType.Unknown property int selectedHoldingType: Constants.TokenType.Unknown
readonly property bool isSelectedHoldingValidAsset: !!selectedHolding && selectedHoldingType === Constants.TokenType.ERC20 readonly property bool isSelectedHoldingValidAsset: !!selectedHolding && selectedHoldingType === Constants.TokenType.ERC20
onSelectedHoldingChanged: { onSelectedHoldingChanged: {

View File

@ -65,41 +65,34 @@ RowLayout {
font.pixelSize: 15 font.pixelSize: 15
color: Theme.palette.baseColor1 color: Theme.palette.baseColor1
text: isBridgeTx ? qsTr("Routes will be automatically calculated to give you the lowest cost.") : text: isBridgeTx ? qsTr("Routes will be automatically calculated to give you the lowest cost.") :
qsTr("The networks where the recipient will receive tokens. Amounts calculated automatically for the lowest cost.") qsTr("The networks where the recipient will receive tokens. Amounts calculated automatically for the lowest cost.")
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
} }
ScrollView { Column {
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: visible ? row.height + 10 : 0
Layout.topMargin: Style.current.smallPadding Layout.topMargin: Style.current.smallPadding
contentWidth: row.width Layout.bottomMargin: Style.current.smallPadding
contentHeight: row.height + 10 spacing: Style.current.halfPadding
ScrollBar.vertical.policy: ScrollBar.AlwaysOff
ScrollBar.horizontal.policy: ScrollBar.AsNeeded
clip: true
visible: root.isBridgeTx ? true : !root.isLoading ? root.errorType === Constants.NoError : false visible: root.isBridgeTx ? true : !root.isLoading ? root.errorType === Constants.NoError : false
Column {
id: row
spacing: Style.current.padding
// TODO: This transformation should come from an adaptor outside this component // TODO: This transformation should come from an adaptor outside this component
LeftJoinModel { LeftJoinModel {
id: toNetworksListLeftJoinModel id: toNetworksListLeftJoinModel
leftModel: root.suggestedToNetworksList leftModel: root.suggestedToNetworksList
rightModel: root.store.flatNetworksModel rightModel: root.store.flatNetworksModel
joinRole: "chainId" joinRole: "chainId"
} }
Repeater { Repeater {
id: repeater id: repeater
objectName: "networksList" objectName: "networksList"
model: isBridgeTx ? root.fromNetworksList : toNetworksListLeftJoinModel model: isBridgeTx ? root.fromNetworksList : toNetworksListLeftJoinModel
delegate: isBridgeTx ? networkItem : routeItem delegate: isBridgeTx ? networkItem : routeItem
}
} }
} }
BalanceExceeded { BalanceExceeded {
Layout.fillWidth: true Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter