status-desktop/storybook/pages/RecipientSelectorPanelPage.qml

239 lines
7.8 KiB
QML

import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import AppLayouts.Wallet 1.0
import shared.popups.send.panels 1.0
import shared.stores.send 1.0
import StatusQ.Core.Utils 0.1
import StatusQ.Core.Theme 0.1
import StatusQ 0.1
import utils 1.0
import Storybook 1.0
import Models 1.0
import SortFilterProxyModel 0.2
SplitView {
id: root
readonly property var chainColors: ({
eth: "#627EEA",
oeth: "#E90101",
arb1: "#939ba1"
}
)
ListModel {
id: savedAddressesModel
Component.onCompleted: {
const data = []
for (let i = 0; i < 10; i++)
data.push({
name: "some saved addr name " + i,
ens: [],
address: "0x2B748A02e06B159C7C3E98F5064577B96E55A7b4",
chainShortNames: "eth:arb1"
})
append(data)
}
}
ListModel {
id: walletAccountsModel
readonly property var data: [
{
name: "helloworld",
emoji: "😋",
colorId: Constants.walletAccountColors.primary,
color: "#2A4AF5",
address: "0x7F47C2e18a4BBf5487E6fb082eC2D9Ab0E6d7240",
walletType: "",
preferredSharingChainIds: "5:420:421613",
colorizedChainShortNames: WalletUtils.colorizedChainPrefixNew(chainColors, "eth:oeth:arb1:"),
currencyBalance: ({amount: 1.25,
symbol: "USD",
displayDecimals: 2,
stripTrailingZeroes: false}),
migratedToKeycard: true
},
{
name: "Hot wallet (generated)",
emoji: "🚗",
colorId: Constants.walletAccountColors.army,
color: "#216266",
address: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8881",
walletType: Constants.generatedWalletType,
preferredSharingChainIds: "5:420:421613",
colorizedChainShortNames: WalletUtils.colorizedChainPrefixNew(chainColors, "eth:oeth:arb1:"),
currencyBalance: ({amount: 10,
symbol: "USD",
displayDecimals: 2,
stripTrailingZeroes: false}),
migratedToKeycard: false
},
{
name: "Family (seed)",
emoji: "🎨",
colorId: Constants.walletAccountColors.magenta,
color: "#EC266C",
address: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8882",
walletType: Constants.seedWalletType,
preferredSharingChainIds: "5:420:421613",
colorizedChainShortNames: WalletUtils.colorizedChainPrefixNew(chainColors, "eth:oeth:arb1:"),
currencyBalance: ({amount: 110.05,
symbol: "USD",
displayDecimals: 2,
stripTrailingZeroes: false}),
migratedToKeycard: false
},
{
name: "Tag Heuer (watch)",
emoji: "⌚",
colorId: Constants.walletAccountColors.copper,
color: "#CB6256",
address: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8883",
walletType: Constants.watchWalletType,
preferredSharingChainIds: "5:420:421613",
colorizedChainShortNames: WalletUtils.colorizedChainPrefixNew(chainColors, "eth:oeth:arb1:"),
currencyBalance: ({amount: 3,
symbol: "USD",
displayDecimals: 2,
stripTrailingZeroes: false}),
migratedToKeycard: false
},
{
name: "Fab (key)",
emoji: "🔑",
colorId: Constants.walletAccountColors.camel,
color: "#C78F67",
address: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8884",
walletType: Constants.keyWalletType,
preferredSharingChainIds: "5:420:421613",
colorizedChainShortNames: WalletUtils.colorizedChainPrefixNew(chainColors, "eth:oeth:arb1:"),
currencyBalance: ({amount: 999,
symbol: "USD",
displayDecimals: 2,
stripTrailingZeroes: false}),
migratedToKeycard: false
}
]
Component.onCompleted: append(data)
}
ListModel {
id: recentsModel
readonly property var data: [
{
activityEntry:
{
sender: "0x10bbfe4072ebb77e53aa9117c7300531d151feaf",
recipient: "0x10bbfe4072ebb77e53aa9117c7300531d151ffff",
timestamp: "1715274859",
txType: 0,
amountCurrency: {
objectName: "",
amount: 1,
symbol:"",
displayDecimals: 0,
stripTrailingZeroes: true
}
}
},
{
activityEntry:
{
sender: "0x1bbbfe4072ebb77e53aa9117c7300531d151feaf",
recipient: "0xebfbfe4072ebb77e53aa9117c7300531d1511111",
timestamp: "1709832115",
txType: 1,
amountCurrency: {
objectName: "",
amount: 1,
symbol:"",
displayDecimals: 0,
stripTrailingZeroes: true
}
}
}
]
Component.onCompleted: append(data)
}
SplitView {
SplitView.fillWidth: true
SplitView.fillHeight: true
orientation: Qt.Vertical
Rectangle {
SplitView.fillWidth: true
SplitView.fillHeight: true
color: Theme.palette.baseColor3
RecipientSelectorPanel {
anchors.centerIn: parent
height: heightSlider.value
width: widthSlider.value
savedAddressesModel: savedAddressesModel
myAccountsModel: walletAccountsModel
recentRecipientsModel: recentsModel
onRecipientSelected: logs.logEvent("RecipientSelectorPanel::onRecipientSelected - [Type, Recipient]: [" + type + ", " + recipient + "]")
onRecentRecipientsTabSelected: logs.logEvent("RecipientSelectorPanel::onRecentRecipientsTabSelected - Recents tab selected")
}
}
Logs {
id: logs
}
LogsView {
clip: true
SplitView.preferredHeight: 150
SplitView.fillWidth: true
logText: logs.logText
}
}
Pane {
SplitView.preferredWidth: 300
ColumnLayout {
Label {
text: "Heigth:"
}
Slider {
id: heightSlider
from: 300
to: 600
stepSize: 1
value: 500
}
Label {
text: "Width:"
}
Slider {
id: widthSlider
from: 300
to: 600
stepSize: 1
value: 450
}
}
}
}
// category: Panel