status-desktop/storybook/pages/TransactionDelegatePage.qml

197 lines
6.9 KiB
QML
Raw Normal View History

import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import StatusQ.Core 0.1
import Storybook 1.0
import utils 1.0
import shared.controls 1.0
SplitView {
id: root
// mirrors ActivityEntry defined in src/app/modules/main/wallet_section/activity/entry.nim
readonly property QtObject mockupModelData: QtObject {
readonly property int timestamp: Date.now() / 1000
readonly property int status: ctrlStatus.currentValue
readonly property double amount: 123.45
readonly property double inAmount: amount
readonly property double outAmount: amount
readonly property string symbol: "SNT"
readonly property string inSymbol: symbol
readonly property string outSymbol: symbol
readonly property bool isMultiTransaction: ctrlMultiTrans.checked
readonly property int txType: ctrlType.currentValue
readonly property string sender: "0xfB8131c260749c7835a08ccBdb64728De432858E"
readonly property string recipient: "0x3fb81384583b3910BB14Cc72582E8e8a56E83ae9"
readonly property bool isNFT: ctrlIsNft.checked
readonly property bool isCommunityAssetViaAirdrop: isCommunityAssetViaAirdrop.checked
readonly property string communityName: "Doodles"
readonly property string communityImageUrl: Style.png("collectibles/HappyMeow")
readonly property string tokenID: "4981676894159712808201908443964193325271219637660871887967796332739046670337"
readonly property string tokenAddress: "0xdeadbeef"
readonly property string tokenInAddress: "0xdeadbeef-00"
readonly property string tokenOutAddress: "0xdeadbeef-00"
readonly property string nftName: "Happy Meow NFT"
readonly property string nftImageUrl: Style.png("collectibles/HappyMeow")
readonly property string chainId: "NETWORKID"
readonly property string chainIdIn: "NETWORKID-IN"
readonly property string chainIdOut: "NETWORKID-OUT"
readonly property bool highlight: _highlight
function doneHighlighting() {
_highlight = false
}
property bool _highlight: false
}
SplitView {
orientation: Qt.Vertical
SplitView.fillWidth: true
Item {
SplitView.fillWidth: true
SplitView.fillHeight: true
Rectangle {
anchors.fill: column
anchors.margins: -1
border.color: "lightgray"
}
ColumnLayout {
id: column
anchors.centerIn: parent
width: 600
TransactionDelegate {
id: delegate
Layout.fillWidth: true
modelData: root.mockupModelData
rootStore: QtObject {
readonly property string currentCurrency: "EUR"
function getFiatValue(cryptoValue, symbol) {
return cryptoValue * 0.1;
}
function formatCurrencyAmount(cryptoValue, symbol) {
return "%L1 %2".arg(cryptoValue).arg(symbol)
}
function getNetworkFullName(chainId) {
return chainId
}
function getNetworkColor(chainId) {
return "pink"
}
}
walletRootStore: QtObject {
function getNameForAddress(address) {
return "NAMEFOR: %1".arg(address)
}
}
}
}
}
LogsAndControlsPanel {
SplitView.minimumHeight: 100
SplitView.preferredHeight: 200
SplitView.fillWidth: true
}
}
Pane {
SplitView.minimumWidth: 300
SplitView.preferredWidth: 300
ColumnLayout {
CheckBox {
text: "Is loading"
checked: delegate.loading
onToggled: delegate.loading = checked
}
CheckBox {
text: "Is activity details header"
readonly property string headerState: "header"
checked: delegate.state === headerState
onToggled: delegate.state = checked ? headerState : ""
}
CheckBox {
id: ctrlIsNft
text: "Is NFT"
}
CheckBox {
id: isCommunityAssetViaAirdrop
checked: true
text: "Is Community Asset Via Airdrop"
}
Label {
Layout.topMargin: 10
Layout.fillWidth: true
text: "Transaction type:"
}
ComboBox {
id: ctrlType
Layout.fillWidth: true
textRole: "name"
valueRole: "type"
model: ListModel {
ListElement { name: "Send"; type: Constants.TransactionType.Send }
ListElement { name: "Receive"; type: Constants.TransactionType.Receive }
ListElement { name: "Buy"; type: Constants.TransactionType.Buy }
ListElement { name: "Swap"; type: Constants.TransactionType.Swap }
ListElement { name: "Bridge"; type: Constants.TransactionType.Bridge }
ListElement { name: "ContractDeployment"; type: Constants.TransactionType.ContractDeployment }
ListElement { name: "Mint"; type: Constants.TransactionType.Mint }
ListElement { name: "Sell"; type: Constants.TransactionType.Sell }
ListElement { name: "Destroy"; type: Constants.TransactionType.Destroy }
}
}
Label {
Layout.topMargin: 10
Layout.fillWidth: true
text: "Transaction status:"
}
ComboBox {
id: ctrlStatus
Layout.fillWidth: true
textRole: "name"
valueRole: "status"
model: ListModel {
ListElement { name: "Failed"; status: Constants.TransactionStatus.Failed }
ListElement { name: "Pending"; status: Constants.TransactionStatus.Pending }
ListElement { name: "Complete"; status: Constants.TransactionStatus.Complete }
ListElement { name: "Finalised"; status: Constants.TransactionStatus.Finalised }
}
}
Switch {
id: ctrlMultiTrans
text: "Multi transaction"
}
Button {
text: "New transaction"
onClicked: {
mockupModelData._highlight = true
}
}
}
}
}
// category: Wallet