import QtQuick 2.15 import QtQuick.Controls 2.15 import QtQuick.Layouts 1.15 import Storybook 1.0 import AppLayouts.Wallet 1.0 import AppLayouts.Wallet.stores 1.0 as WalletStores import "../../ui/app/AppLayouts/Wallet/views" // NOTE - there is no AppLayout.Wallet.views import shared.controls 1.0 import shared.stores 1.0 import utils 1.0 SplitView { id: root property bool globalUtilsReady: false property bool mainModuleReady: false property bool rootStoreReady: false property bool isIncoming: false Component.onCompleted: { RootStore.getFiatValue = (cryptoValue, symbol) => { return (cryptoValue * 1800).toPrecision(2) } RootStore.getNetworkIcon = (chainId) => { return "tiny/network/Network=Ethereum" } RootStore.getLatestBlockNumber = () => { return 4 } RootStore.hex2Dec = (number) => { return 10 } RootStore.getNetworkColor = (number) => { return "blue" } RootStore.getNetworkFullName = (chainId) => { return "Ethereum Mainnet" } RootStore.getNetworkShortName = (chainId) => { return "eth" } RootStore.formatCurrencyAmount = (value, symbol) => { return value + " " + symbol } RootStore.getNameForSavedWalletAddress = (address) => { return "Saved Wallet Name" } RootStore.getNameForAddress = (address) => { return "Address Name" } RootStore.getEnsForSavedWalletAddress = (address) => { return "123" } RootStore.getChainShortNamesForSavedWalletAddress = (address) => { return "" } RootStore.getGasEthValue = (gasAmount, gasPrice) => { return (gasAmount * Math.pow(10, -9)).toPrecision(5) } RootStore.getNetworkLayer = (chainId) => { return 1 } RootStore.currentCurrency = "USD" root.rootStoreReady = true } // globalUtilsInst mock QtObject { function getCompressedPk(publicKey) { return "zx3sh" + publicKey } function getColorHashAsJson(publicKey) { return JSON.stringify([{"segmentLength":1,"colorId":12},{"segmentLength":5,"colorId":18}, {"segmentLength":3,"colorId":25},{"segmentLength":3,"colorId":23}, {"segmentLength":1,"colorId":10},{"segmentLength":3,"colorId":26}, {"segmentLength":2,"colorId":30},{"segmentLength":1,"colorId":18}, {"segmentLength":4,"colorId":28},{"segmentLength":1,"colorId":17}, {"segmentLength":2,"colorId":2}]) } function isCompressedPubKey(publicKey) { return true } function getColorId(publicKey) { return Math.floor(Math.random() * 10) } Component.onCompleted: { Utils.globalUtilsInst = this root.globalUtilsReady = true } Component.onDestruction: { root.globalUtilsReady = false Utils.globalUtilsInst = {} } } // mainModuleInst mock QtObject { function getContactDetailsAsJson(publicKey, getVerification) { return JSON.stringify({ displayName: "ArianaP", displayIcon: "", publicKey: publicKey, name: "", alias: "", localNickname: "", isContact: true }) } function isEnsVerified(publicKey) { return false } Component.onCompleted: { Utils.mainModuleInst = this root.mainModuleReady = true } Component.onDestruction: { root.mainModuleReady = false Utils.mainModuleInst = {} } } QtObject { id: contactsStoreMockup readonly property var myContactsModel: QtObject { signal itemChanged(address: string) } function getContactPublicKeyByAddress(address) { return "" } } QtObject { id: historyMockup signal txDecoded(txHash: string, dataDecoded: string) function fetchDecodedTxData(txHash, input) { decodeTimer.txHash = txHash decodeTimer.start() } readonly property Timer decodeTimer: Timer { id: decodeTimer property string txHash: "" interval: 2000 onTriggered: { const data = JSON.stringify({ name: "processDepositQueue", signature: "processDepositQueue(address,uint256)", id: "0xf94d2", inputs: { "0": "0x3030303030303030303030303637306463613632", "1": "0x40e8d703000000000000000", "2": "0x60d8f57dh0bcdd0da0a00ad000000", "3": "0xd8ff5ba7fhfaafbf0fdfa0afaf1d000000" } }) historyMockup.txDecoded(txHash, data) } } } QtObject { id: transactionData property int chainId: 1 property string blockNumber: "0x124" property int timestamp: Date.now() / 1000 property int txStatus: 0 property string type: "eth" property string nonce: "0x123" property string from: "0x29D7d1dd5B6f9C864d9db560D72a247c178aE86B" property string to: "0x4de3f6278C0DdFd3F29df9DcD979038F5c7bbc35" property string contract: "0x4de3f6278C0DdFd3F29df9DcD979038F5c7bbc35" property bool isNFT: false property string input: "0x40e8d703000000000000000000000000670dca62b3418bddd08cbc69cb4490a5a3382a9f0000000000000000000000000000000000000000000000000000000000000064ddd08cbc69cb4490a5a3382a9f0000000000" property string tokenID: "4981676894159712808201908443964193325271219637660871887967796332739046670337" property string nftName: "Happy Meow" property string nftImageUrl: Style.png("collectibles/HappyMeow") property string symbol: "ETH" property string txHash: "0x4de3f6278C0DdFd3F29df9DcD979038F5c7bbc35" readonly property var value: QtObject { property real amount: amountSpinbox.realValue property string symbol: "ETH" property int displayDecimals: 5 property bool stripTrailingZeroes: true } readonly property var totalFees: QtObject { property real amount: (transactionData.value / 15) * Math.pow(10, 9) property string symbol: "Gwei" property int displayDecimals: 8 property bool stripTrailingZeroes: true } readonly property var gasPrice: QtObject { property real amount: 0.0000005 property string symbol: "ETH" } } QtObject { id: overviewMockup property var mixedcaseAddress: root.isIncoming ? transactionData.to : transactionData.from } SplitView { orientation: Qt.Vertical SplitView.fillWidth: true Item { SplitView.fillWidth: true SplitView.fillHeight: true Rectangle { anchors.fill: viewLoader anchors.margins: -1 color: "transparent" border.width: 1 border.color: "#808080" } Loader { id: viewLoader anchors.centerIn: parent width: 800 height: 500 active: root.globalUtilsReady && root.mainModuleReady && root.rootStoreReady sourceComponent: TransactionDetailView { contactsStore: contactsStoreMockup transaction: transactionData overview: overviewMockup } } } LogsAndControlsPanel { SplitView.minimumHeight: 100 SplitView.preferredHeight: 150 SplitView.fillWidth: true } } Pane { SplitView.minimumWidth: 300 SplitView.preferredWidth: 300 ColumnLayout { Label { text: "Amount:" } SpinBox { id: amountSpinbox from: 0 to: 999999999 value: 12345 stepSize: 1 editable: true readonly property int multiplier: Math.pow(10, decimals) property int decimals: 5 property real realValue: value / multiplier validator: DoubleValidator { bottom: 0.0 } textFromValue: function(value, locale) { return Number(value / amountSpinbox.multiplier).toLocaleString(locale, 'f', amountSpinbox.decimals) } valueFromText: function(text, locale) { return Number.fromLocaleString(locale, text) * amountSpinbox.multiplier } } CheckBox { text: "is NFT" checked: transactionData.isNFT onCheckedChanged: transactionData.isNFT = checked } CheckBox { text: "is incoming" checked: root.isIncoming onCheckedChanged: root.isIncoming = checked } } } } // category: Wallet