import QtQuick 2.13 import QtQuick.Controls 2.13 import QtQuick.Layouts 1.13 import utils 1.0 import StatusQ.Controls 0.1 import StatusQ.Popups 0.1 import StatusQ.Components 0.1 import StatusQ.Core 0.1 import StatusQ.Core.Theme 0.1 import "../controls" RowLayout { id: root property var store property var bestRoutes property double amountToSend: 0 property bool isLoading: false property bool isBridgeTx: false property var weiToEth: function(wei) {} property var reCalculateSuggestedRoute: function() {} spacing: 10 StatusRoundIcon { Layout.alignment: Qt.AlignTop radius: 8 asset.name: "flash" } ColumnLayout { Layout.alignment: Qt.AlignTop Layout.preferredWidth: root.width StatusBaseText { Layout.maximumWidth: 410 font.pixelSize: 15 font.weight: Font.Medium color: Theme.palette.directColor1 text: qsTr("Networks") wrapMode: Text.WordWrap } StatusBaseText { Layout.maximumWidth: 410 font.pixelSize: 15 color: Theme.palette.baseColor1 text: isBridgeTx ? qsTr("Choose the network to bridge token to") : qsTr("The networks where the receipient will receive tokens. Amounts calculated automatically for the lowest cost.") wrapMode: Text.WordWrap } ScrollView { Layout.fillWidth: true Layout.preferredHeight: row.height + 10 Layout.topMargin: Style.current.bigPadding contentWidth: row.width contentHeight: row.height + 10 ScrollBar.vertical.policy: ScrollBar.AlwaysOff ScrollBar.horizontal.policy: ScrollBar.AsNeeded clip: true visible: !root.isLoading ? root.isBridgeTx ? true : root.bestRoutes !== undefined ? root.bestRoutes.length > 0 : true : false Row { id: row spacing: Style.current.padding Repeater { id: repeater objectName: "networksList" model: isBridgeTx ? store.allNetworks : root.bestRoutes delegate: isBridgeTx ? networkItem : routeItem } } } BalanceExceeded { Layout.fillWidth: true Layout.alignment: Qt.AlignHCenter Layout.topMargin: Style.current.bigPadding transferPossible: root.bestRoutes !== undefined ? root.bestRoutes.length > 0 : true amountToSend: root.amountToSend isLoading: root.isLoading } } ButtonGroup { buttons: repeater.children } Component { id: routeItem StatusListItem { objectName: modelData.toNetwork.chainName leftPadding: 5 rightPadding: 5 implicitWidth: 126 title: modelData.toNetwork.chainName subTitle: root.weiToEth(modelData.amountIn) statusListItemSubTitle.color: Theme.palette.primaryColor1 asset.width: 32 asset.height: 32 asset.name: Style.svg("tiny/" + modelData.toNetwork.iconUrl) asset.isImage: true color: "transparent" } } Component { id: networkItem StatusRadioButton { id: gasRectangle width: contentItem.implicitWidth contentItem: StatusListItem { id: card objectName: chainName leftPadding: 5 rightPadding: 5 implicitWidth: 150 title: chainName subTitle: root.weiToEth(balance) statusListItemSubTitle.color: Theme.palette.primaryColor1 asset.width: 32 asset.height: 32 asset.name: Style.svg("tiny/" + iconUrl) asset.isImage: true color: { if (sensor.containsMouse || highlighted || gasRectangle.checked) { return Theme.palette.baseColor2 } return Theme.palette.statusListItem.backgroundColor } onClicked: gasRectangle.toggle() } onCheckedChanged: { store.addRemoveDisabledToChain(chainId, !gasRectangle.checked) if(checked) root.reCalculateSuggestedRoute() } checked: index === 0 indicator: Item { width: card.width height: card.height } Component.onCompleted: { store.addRemoveDisabledToChain(chainId, !gasRectangle.checked) if(index === (repeater.count -1)) root.reCalculateSuggestedRoute() } } } }