storybook(RecipientSelectorPage): Added new page for `RecipientSelector`
- Added basic models.
This commit is contained in:
Noelia
Noelia
parent
bc74724672
commit
4ea73b50b5
|
|
@ -0,0 +1,238 @@
|
|||
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
|
||||
Loading…
Reference in New Issue