status-desktop/storybook/pages/SwapModalPage.qml

442 lines
16 KiB
QML

import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import SortFilterProxyModel 0.2
import QtTest 1.15
import StatusQ 0.1
import StatusQ.Core 0.1
import StatusQ.Core.Utils 0.1
import StatusQ.Controls 0.1
import utils 1.0
import Storybook 1.0
import Models 1.0
import shared.stores 1.0
import AppLayouts.Wallet.stores 1.0
import AppLayouts.Wallet.popups.swap 1.0
SplitView {
id: root
Logs { id: logs }
orientation: Qt.Horizontal
QtObject {
id: d
readonly property var tokenBySymbolModel: TokensBySymbolModel {}
function launchPopup() {
swapModal.createObject(root)
}
readonly property SwapTransactionRoutes dummySwapTransactionRoutes: SwapTransactionRoutes{}
property string uuid
function resetValues() {
accountComboBox.currentIndex = 0
fromTokenComboBox.currentIndex = 0
swapInput.text = ""
fetchSuggestedRoutesSpy.clear()
authenticateAndTransferSpy.clear()
}
}
PopupBackground {
id: popupBg
SplitView.fillWidth: true
SplitView.fillHeight: true
Button {
id: reopenButton
anchors.centerIn: parent
text: "Reopen"
enabled: !swapModal.visible
onClicked: d.launchPopup()
}
Component.onCompleted: d.launchPopup()
SwapStore {
id: dSwapStore
signal suggestedRoutesReady(var txRoutes)
signal transactionSent(var chainId,var txHash, var uuid, var error)
signal transactionSendingComplete(var txHash, var success)
readonly property var accounts: WalletAccountsModel {}
readonly property var flatNetworks: NetworksModel.flatNetworks
readonly property bool areTestNetworksEnabled: areTestNetworksEnabledCheckbox.checked
function fetchSuggestedRoutes(uuid, accountFrom, accountTo, amount, tokenFrom, tokenTo,
disabledFromChainIDs, disabledToChainIDs, preferredChainIDs, sendType, lockedInAmounts) {
console.debug("fetchSuggestedRoutes called >> uuid = ", uuid, " accountFrom = ", accountFrom, " accountTo =",
accountTo, "amount = ", amount, " tokenFrom = ", tokenFrom, " tokenTo = ", tokenTo,
" disabledFromChainIDs = ", disabledFromChainIDs, " disabledToChainIDs = ", disabledToChainIDs,
" preferredChainIDs = ", preferredChainIDs, " sendType =", sendType, " lockedInAmounts = ", lockedInAmounts)
fetchSuggestedRoutesSignal()
}
function authenticateAndTransfer(uuid, accountFrom, accountTo, tokenFrom,
tokenTo, sendType, tokenName, tokenIsOwnerToken, paths) {
console.debug("authenticateAndTransfer called >> uuid ", uuid, " accountFrom = ",accountFrom, " accountTo =",
accountTo, "tokenFrom = ",tokenFrom, " tokenTo = ",tokenTo, " sendType = ", sendType,
" tokenName = ", tokenName, " tokenIsOwnerToken = ", tokenIsOwnerToken, " paths = ", paths)
d.uuid = uuid
authenticateAndTransferSignal()
}
function getWei2Eth(wei, decimals) {
return wei/(10**decimals)
}
// only for testing
signal fetchSuggestedRoutesSignal()
signal authenticateAndTransferSignal()
}
SignalSpy {
id: fetchSuggestedRoutesSpy
target: dSwapStore
signalName: "fetchSuggestedRoutesSignal"
}
SignalSpy {
id: authenticateAndTransferSpy
target: dSwapStore
signalName: "authenticateAndTransferSignal"
}
TokensStore {
id: tokensStore
plainTokensBySymbolModel: TokensBySymbolModel {}
getDisplayAssetsBelowBalanceThresholdDisplayAmount: () => 0
}
SwapModalAdaptor {
id: adaptor
swapStore: dSwapStore
walletAssetsStore: WalletAssetsStore {
id: thisWalletAssetStore
walletTokensStore: tokensStore
readonly property var baseGroupedAccountAssetModel: GroupedAccountsAssetsModel {}
assetsWithFilteredBalances: thisWalletAssetStore.groupedAccountsAssetsModel
}
currencyStore: CurrenciesStore {}
swapFormData: SwapInputParamsForm {
defaultToTokenKey: "STT"
onSelectedAccountAddressChanged: {
if (selectedAccountAddress !== accountComboBox.currentValue)
accountComboBox.currentIndex = accountComboBox.indexOfValue(selectedAccountAddress)
}
}
swapOutputData: SwapOutputData {}
}
Component {
id: swapModal
SwapModal {
id: modal
visible: true
modal: false
closePolicy: Popup.CloseOnEscape
destroyOnClose: true
swapInputParamsForm: adaptor.swapFormData
swapAdaptor: adaptor
plainTokensBySymbolModel: ListModel {
ListElement {
key: "aave"
name: "Aave"
symbol: "AAVE"
image: "https://cryptologos.cc/logos/aave-aave-logo.png"
communityId: ""
decimals: 18
marketDetails: []
}
ListElement {
key: "usdc"
name: "USDC"
symbol: "USDC"
image: ""
communityId: ""
decimals: 18
marketDetails: []
}
ListElement {
key: "hst"
name: "Decision Token"
symbol: "HST"
image: ""
communityId: ""
decimals: 18
marketDetails: []
}
}
Binding {
target: swapInputParamsForm
property: "fromTokensKey"
value: fromTokenComboBox.currentValue ?? ""
}
Binding {
target: swapInputParamsForm
property: "toTokenKey"
value: toTokenComboBox.currentValue ?? ""
}
Binding {
target: swapInputParamsForm
property: "selectedNetworkChainId"
value: networksComboBox.currentValue ?? -1
}
Binding {
target: swapInputParamsForm
property: "selectedAccountAddress"
value: accountComboBox.currentValue ?? ""
}
Binding {
target: swapInputParamsForm
property: "fromTokenAmount"
value: swapInput.text
}
Binding {
target: swapInputParamsForm
property: "selectedNetworkChainId"
value: networksComboBox.currentValue ?? -1
}
Binding {
target: swapInputParamsForm
property: "selectedAccountAddress"
value: accountComboBox.currentValue ?? ""
}
Binding {
target: swapInputParamsForm
property: "fromTokenAmount"
value: swapInput.text
}
Connections {
target: approveTxButton
function onClicked() {
modal.swapAdaptor.sendApproveTx()
}
}
}
}
}
ScrollView {
id: rightPanel
SplitView.minimumWidth: 300
SplitView.preferredWidth: 300
SplitView.minimumHeight: 300
ColumnLayout {
spacing: 10
CheckBox {
id: areTestNetworksEnabledCheckbox
text: "areTestNetworksEnabled"
checked: true
onToggled: networksComboBox.currentIndex = 0
}
StatusBaseText {
text:"Selected Account"
}
ComboBox {
id: accountComboBox
textRole: "name"
valueRole: "address"
model: adaptor.nonWatchAccounts
currentIndex: 0
}
StatusBaseText {
text: "Selected Network"
}
ComboBox {
id: networksComboBox
textRole: "chainName"
valueRole: "chainId"
model: adaptor.filteredFlatNetworksModel
currentIndex: 0
onCountChanged: currentIndex = 0
}
StatusBaseText {
text: "From Token"
}
ComboBox {
id: fromTokenComboBox
textRole: "name"
valueRole: "key"
model: d.tokenBySymbolModel
}
StatusInput {
id: swapInput
Layout.preferredWidth: 250
label: "Token amount to swap"
text: ""
}
StatusBaseText {
text: "To Token"
}
ComboBox {
id: toTokenComboBox
textRole: "name"
valueRole: "key"
model: d.tokenBySymbolModel
currentIndex: 1
}
Button {
text: "simulate happy path no approval needed"
onClicked: {
d.resetValues()
fromTokenComboBox.currentIndex = 0
swapInput.text = "0.2"
fetchSuggestedRoutesSpy.wait()
Backpressure.debounce(this, 250, () => {
dSwapStore.suggestedRoutesReady(d.dummySwapTransactionRoutes.txHasRouteNoApproval)
})()
}
}
Button {
text: "simulate happy path with approval needed"
onClicked: {
d.resetValues()
accountComboBox.currentIndex = 2
fromTokenComboBox.currentIndex = 2
swapInput.text = "0.1"
fetchSuggestedRoutesSpy.wait()
Backpressure.debounce(this, 1000, () => {
dSwapStore.suggestedRoutesReady(d.dummySwapTransactionRoutes.txHasRoutesApprovalNeeded)
})()
Backpressure.debounce(this, 1500, () => {approveTxButton.clicked()})()
authenticateAndTransferSpy.wait()
Backpressure.debounce(this, 1000, () => {
dSwapStore.transactionSent(networksComboBox.currentValue, "0x877ffe47fc29340312611d4e833ab189fe4f4152b01cc9a05bb4125b81b2a89a", d.uuid, "")
})()
Backpressure.debounce(this, 2000, () => {
dSwapStore.transactionSendingComplete("0x877ffe47fc29340312611d4e833ab189fe4f4152b01cc9a05bb4125b81b2a89a", true)
})()
fetchSuggestedRoutesSpy.wait()
Backpressure.debounce(this, 1000, () => {
dSwapStore.suggestedRoutesReady(d.dummySwapTransactionRoutes.txHasRouteNoApproval)
})()
}
}
Button {
text: "simulate fetching proposal error"
onClicked: {
d.resetValues()
fromTokenComboBox.currentIndex = 0
swapInput.text = "0.2"
fetchSuggestedRoutesSpy.wait()
Backpressure.debounce(this, 250, () => {
dSwapStore.suggestedRoutesReady(d.dummySwapTransactionRoutes.txNoRoutes)
})()
}
}
Button {
text: "simulate approval failed"
onClicked: {
d.resetValues()
accountComboBox.currentIndex = 2
fromTokenComboBox.currentIndex = 2
swapInput.text = "0.1"
fetchSuggestedRoutesSpy.wait()
Backpressure.debounce(this, 1000, () => {
dSwapStore.suggestedRoutesReady(d.dummySwapTransactionRoutes.txHasRoutesApprovalNeeded)
})()
Backpressure.debounce(this, 1500, () => {approveTxButton.clicked()})()
authenticateAndTransferSpy.wait()
Backpressure.debounce(this, 1000, () => {
dSwapStore.transactionSent(networksComboBox.currentValue, "0x877ffe47fc29340312611d4e833ab189fe4f4152b01cc9a05bb4125b81b2a89a", d.uuid, "")
})()
Backpressure.debounce(this, 2000, () => {
dSwapStore.transactionSendingComplete("0x877ffe47fc29340312611d4e833ab189fe4f4152b01cc9a05bb4125b81b2a89a", false)
})()
}
}
CheckBox {
id: advancedSignalsCheckBox
text: "show advanced signals for testing"
checked: false
}
Button {
text: "emit no routes found event"
onClicked: {
dSwapStore.suggestedRoutesReady(d.dummySwapTransactionRoutes.txNoRoutes)
}
visible: advancedSignalsCheckBox.checked
}
Button {
text: "emit no approval needed route"
onClicked: {
dSwapStore.suggestedRoutesReady(d.dummySwapTransactionRoutes.txHasRouteNoApproval)
}
visible: advancedSignalsCheckBox.checked
}
Button {
text: "emit approval needed route"
onClicked: {
dSwapStore.suggestedRoutesReady(d.dummySwapTransactionRoutes.txHasRoutesApprovalNeeded)
}
visible: advancedSignalsCheckBox.checked
}
Button {
id: approveTxButton
text: "call approveTX"
visible: advancedSignalsCheckBox.checked
}
Button {
text: "emit transactionSent successful"
onClicked: {
dSwapStore.transactionSent(networksComboBox.currentValue, "0x877ffe47fc29340312611d4e833ab189fe4f4152b01cc9a05bb4125b81b2a89a", d.uuid, "")
}
visible: advancedSignalsCheckBox.checked
}
Button {
text: "emit transactionSent failure"
onClicked: {
dSwapStore.transactionSent(networksComboBox.currentValue, "", d.uuid, "no password given")
}
visible: advancedSignalsCheckBox.checked
}
Button {
text: "emit approval completed successfully"
onClicked: {
dSwapStore.transactionSendingComplete("0x877ffe47fc29340312611d4e833ab189fe4f4152b01cc9a05bb4125b81b2a89a", true)
}
visible: advancedSignalsCheckBox.checked
}
Button {
text: "emit approval completed with failure"
onClicked: {
dSwapStore.transactionSendingComplete("0x877ffe47fc29340312611d4e833ab189fe4f4152b01cc9a05bb4125b81b2a89a", false)
}
visible: advancedSignalsCheckBox.checked
}
}
}
}
// category: Popups