mirror of
https://github.com/status-im/status-desktop.git
synced 2025-01-22 04:21:44 +00:00
feat(storybook): Added new mint token views pages
Added `CommunityCollectibleViewPage` and `CommunityNewCollectibleViewPage`. Added new `TokenHoldersModel` model.
This commit is contained in:
Noelia
Noelia
parent
02cf07044d
commit
4ad4a7e2b5
@ -33,6 +33,14 @@ ListModel {
|
||||
title: "JoinCommunityView"
|
||||
section: "Views"
|
||||
}
|
||||
ListElement {
|
||||
title: "CommunityNewCollectibleView"
|
||||
section: "Views"
|
||||
}
|
||||
ListElement {
|
||||
title: "CommunityCollectibleView"
|
||||
section: "Views"
|
||||
}
|
||||
ListElement {
|
||||
title: "StatusCommunityCard"
|
||||
section: "Panels"
|
||||
|
||||
@ -107,5 +107,15 @@
|
||||
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2934%3A480877&t=v2Krj5iZQaSTK7Om-1",
|
||||
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=22721%3A498811&t=v2Krj5iZQaSTK7Om-1",
|
||||
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2934%3A480927&t=v2Krj5iZQaSTK7Om-1"
|
||||
],
|
||||
"CommunityCollectibleView": [
|
||||
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2934%3A481005&t=Qo2FwPRxvSxbluqB-1",
|
||||
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2934%3A479431&t=Qo2FwPRxvSxbluqB-1",
|
||||
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2934%3A479570&t=Qo2FwPRxvSxbluqB-1"
|
||||
],
|
||||
"CommunityNewCollectibleView": [
|
||||
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2934%3A480877&t=Qo2FwPRxvSxbluqB-1",
|
||||
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=26601%3A518245&t=Qo2FwPRxvSxbluqB-1",
|
||||
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=22721%3A498811&t=Qo2FwPRxvSxbluqB-1"
|
||||
]
|
||||
}
|
||||
|
||||
216
storybook/pages/CommunityCollectibleViewPage.qml
Normal file
216
storybook/pages/CommunityCollectibleViewPage.qml
Normal file
@ -0,0 +1,216 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import AppLayouts.Chat.views.communities 1.0
|
||||
|
||||
import Storybook 1.0
|
||||
import Models 1.0
|
||||
|
||||
SplitView {
|
||||
|
||||
Logs { id: logs }
|
||||
|
||||
SplitView {
|
||||
orientation: Qt.Vertical
|
||||
SplitView.fillWidth: true
|
||||
|
||||
Item {
|
||||
SplitView.fillWidth: true
|
||||
SplitView.fillHeight: true
|
||||
|
||||
CommunityCollectibleView {
|
||||
id: view
|
||||
|
||||
anchors.fill: parent
|
||||
anchors.margins: 50
|
||||
holdersModel: TokenHoldersModel {}
|
||||
artworkSource: ModelsData.icons.superRare
|
||||
preview: previewBox.checked
|
||||
deployState: mintingStateBox.checked ? 1 : 0
|
||||
name: nameText.text
|
||||
symbol: symbolText.text
|
||||
description: descriptionText.text
|
||||
supplyText: supplyText.text
|
||||
infiniteSupply: unlimitedSupplyChecker.checked
|
||||
transferable: transferibleChecker.checked
|
||||
selfDestruct: selfdestructChecker.checked
|
||||
chainId: 1
|
||||
chainName: "Ethereum Mainnet"
|
||||
chainIcon: ModelsData.networks.ethereum
|
||||
|
||||
onMintCollectible: logs.logEvent("CommunityCollectibleView::mintCollectible: \n"
|
||||
+ "artworkSource: " + artworkSource + "\n"
|
||||
+ "name: " + name + "\n"
|
||||
+ "symbol: " + symbol + "\n"
|
||||
+ "description: " + description + "\n"
|
||||
+ "supply: " + supply + "\n"
|
||||
+ "infiniteSupply: " + infiniteSupply + "\n"
|
||||
+ "transferable: " + transferable + "\n"
|
||||
+ "selfDestruct: " + selfDestruct + "\n"
|
||||
+ "chainId: " + chainId)
|
||||
}
|
||||
}
|
||||
|
||||
LogsAndControlsPanel {
|
||||
id: logsAndControlsPanel
|
||||
|
||||
SplitView.minimumHeight: 100
|
||||
SplitView.preferredHeight: 150
|
||||
|
||||
logsView.logText: logs.logText
|
||||
}
|
||||
}
|
||||
|
||||
Pane {
|
||||
SplitView.minimumWidth: 300
|
||||
SplitView.preferredWidth: 300
|
||||
|
||||
ColumnLayout {
|
||||
|
||||
CheckBox {
|
||||
id: previewBox
|
||||
text: "Is preview view?"
|
||||
checked: true
|
||||
}
|
||||
|
||||
CheckBox {
|
||||
id: mintingStateBox
|
||||
text: "Minting in progress"
|
||||
checked: true
|
||||
}
|
||||
|
||||
Label {
|
||||
Layout.topMargin: 10
|
||||
Layout.fillWidth: true
|
||||
text: "Artwork"
|
||||
}
|
||||
|
||||
RadioButton {
|
||||
text: "Small"
|
||||
checked: true
|
||||
onCheckedChanged: view.artworkSource = ModelsData.icons.superRare
|
||||
}
|
||||
|
||||
RadioButton {
|
||||
text: "Medium"
|
||||
onCheckedChanged: view.artworkSource = ModelsData.collectibles.kitty2Big
|
||||
}
|
||||
|
||||
RadioButton {
|
||||
text: "Large"
|
||||
onCheckedChanged: view.artworkSource = ModelsData.banners.superRare
|
||||
}
|
||||
|
||||
Label {
|
||||
Layout.topMargin: 10
|
||||
Layout.fillWidth: true
|
||||
text: "Name"
|
||||
}
|
||||
|
||||
TextField {
|
||||
id: nameText
|
||||
background: Rectangle { border.color: 'lightgrey' }
|
||||
Layout.preferredWidth: 200
|
||||
text: "Art work"
|
||||
}
|
||||
|
||||
Label {
|
||||
Layout.topMargin: 10
|
||||
Layout.fillWidth: true
|
||||
text: "Description"
|
||||
}
|
||||
|
||||
TextField {
|
||||
id: descriptionText
|
||||
background: Rectangle { border.color: 'lightgrey' }
|
||||
Layout.preferredWidth: 200
|
||||
text: "Long art work description Long art work description Long art work description Long art work description Long art work description Long art work description Long art work description Long art work description Long art work description"
|
||||
}
|
||||
|
||||
Label {
|
||||
Layout.topMargin: 10
|
||||
Layout.fillWidth: true
|
||||
text: "Symbol"
|
||||
}
|
||||
|
||||
TextField {
|
||||
id: symbolText
|
||||
background: Rectangle { border.color: 'lightgrey' }
|
||||
Layout.preferredWidth: 200
|
||||
text: "ABC"
|
||||
}
|
||||
|
||||
CheckBox {
|
||||
id: unlimitedSupplyChecker
|
||||
Layout.topMargin: 10
|
||||
text: "Unlimited supply"
|
||||
checked: true
|
||||
}
|
||||
|
||||
Label {
|
||||
visible: !unlimitedSupplyChecker.checked
|
||||
Layout.fillWidth: true
|
||||
text: "Supply"
|
||||
}
|
||||
|
||||
TextField {
|
||||
id: supplyText
|
||||
visible: !unlimitedSupplyChecker.checked
|
||||
background: Rectangle { border.color: 'lightgrey' }
|
||||
Layout.preferredWidth: 200
|
||||
text: "123"
|
||||
}
|
||||
|
||||
CheckBox {
|
||||
id: transferibleChecker
|
||||
Layout.topMargin: 10
|
||||
text: "Tranferible"
|
||||
checked: true
|
||||
}
|
||||
|
||||
CheckBox {
|
||||
id: selfdestructChecker
|
||||
text: "Remote self-desctruct"
|
||||
checked: true
|
||||
}
|
||||
|
||||
Label {
|
||||
Layout.topMargin: 10
|
||||
Layout.fillWidth: true
|
||||
text: "Network"
|
||||
}
|
||||
|
||||
RadioButton {
|
||||
id: eth
|
||||
text: "Ethereum Mainnet"
|
||||
checked: true
|
||||
onCheckedChanged: {
|
||||
view.chainName = text
|
||||
view.chainIcon = ModelsData.networks.ethereum
|
||||
view.chainId = 1
|
||||
}
|
||||
}
|
||||
|
||||
RadioButton {
|
||||
id: opt
|
||||
text: "Optimism"
|
||||
onCheckedChanged: {
|
||||
view.chainName = text
|
||||
view.chainIcon = ModelsData.networks.optimism
|
||||
view.chainId = 2
|
||||
}
|
||||
}
|
||||
|
||||
RadioButton {
|
||||
id: arb
|
||||
text: "Arbitrum"
|
||||
onCheckedChanged: {
|
||||
view.chainName = text
|
||||
view.chainIcon = ModelsData.networks.arbitrum
|
||||
view.chainId = 3
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -29,7 +29,7 @@ SplitView {
|
||||
}
|
||||
}
|
||||
communitiesStore: QtObject {
|
||||
|
||||
readonly property TokenHoldersModel holdersModel: TokenHoldersModel {}
|
||||
property var layer1Networks: NetworksModel.layer1Networks
|
||||
property var layer2Networks: NetworksModel.layer2Networks
|
||||
property var testNetworks: NetworksModel.testNetworks
|
||||
@ -39,9 +39,11 @@ SplitView {
|
||||
function mintCollectible(communityId, address, artworkSource, name, symbol, description, supply,
|
||||
infiniteSupply, transferable, selfDestruct, chainId)
|
||||
{
|
||||
logs.logEvent("CommunityMintTokensSettingsPanel::mintCollectible")
|
||||
logs.logEvent("CommunityMintTokensSettingsPanel::mintCollectible")
|
||||
}
|
||||
}
|
||||
|
||||
tokensModel: ListModel {}
|
||||
}
|
||||
}
|
||||
|
||||
@ -52,11 +54,5 @@ SplitView {
|
||||
SplitView.preferredHeight: 150
|
||||
|
||||
logsView.logText: logs.logText
|
||||
|
||||
CheckBox {
|
||||
id: isOwnerCheckBox
|
||||
|
||||
text: "Is owner"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
52
storybook/pages/CommunityNewCollectibleViewPage.qml
Normal file
52
storybook/pages/CommunityNewCollectibleViewPage.qml
Normal file
@ -0,0 +1,52 @@
|
||||
import QtQuick 2.14
|
||||
import QtQuick.Controls 2.14
|
||||
import QtQuick.Layouts 1.14
|
||||
|
||||
import StatusQ.Core.Theme 0.1
|
||||
import StatusQ.Components 0.1
|
||||
|
||||
import AppLayouts.Chat.views.communities 1.0
|
||||
|
||||
import Storybook 1.0
|
||||
import Models 1.0
|
||||
|
||||
import utils 1.0
|
||||
|
||||
SplitView {
|
||||
|
||||
Logs { id: logs }
|
||||
|
||||
SplitView {
|
||||
orientation: Qt.Vertical
|
||||
SplitView.fillWidth: true
|
||||
|
||||
Item {
|
||||
SplitView.fillWidth: true
|
||||
SplitView.fillHeight: true
|
||||
|
||||
CommunityNewCollectibleView {
|
||||
anchors.fill: parent
|
||||
anchors.margins: 50
|
||||
store: QtObject {
|
||||
property var layer1Networks: NetworksModel.layer1Networks
|
||||
property var layer2Networks: NetworksModel.layer2Networks
|
||||
property var testNetworks: NetworksModel.testNetworks
|
||||
property var enabledNetworks: NetworksModel.enabledNetworks
|
||||
property var allNetworks: enabledNetworks
|
||||
}
|
||||
|
||||
onPreviewClicked: logs.logEvent("CommunityNewCollectibleView::previewClicked")
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
LogsAndControlsPanel {
|
||||
id: logsAndControlsPanel
|
||||
|
||||
SplitView.minimumHeight: 100
|
||||
SplitView.preferredHeight: 150
|
||||
|
||||
logsView.logText: logs.logText
|
||||
}
|
||||
}
|
||||
}
|
||||
35
storybook/src/Models/TokenHoldersModel.qml
Normal file
35
storybook/src/Models/TokenHoldersModel.qml
Normal file
@ -0,0 +1,35 @@
|
||||
import QtQuick 2.15
|
||||
|
||||
ListModel {
|
||||
|
||||
readonly property string image: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/
|
||||
nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
|
||||
readonly property var data: [
|
||||
{
|
||||
ensName: "carmen.eth",
|
||||
walletAddress: "0xb794f5450ba39494ce839613fffba74279579268",
|
||||
imageSource: image,
|
||||
amount: 3
|
||||
},
|
||||
{
|
||||
ensName: "chris.eth",
|
||||
walletAddress: "0xb794f5ea0ba39494ce839613fffba74279579268",
|
||||
imageSource: image,
|
||||
amount: 2
|
||||
},
|
||||
{
|
||||
ensName: "emily.eth",
|
||||
walletAddress: "0xb794f5ea0ba39494ce839613fffba74279579268",
|
||||
imageSource: image,
|
||||
amount: 2
|
||||
},
|
||||
{
|
||||
ensName: "",
|
||||
walletAddress: "0xb794f5ea0ba39494ce839613fffba74279579268",
|
||||
imageSource: "",
|
||||
amount: 1
|
||||
}
|
||||
]
|
||||
|
||||
Component.onCompleted: append(data)
|
||||
}
|
||||
@ -8,3 +8,4 @@ AssetsModel 1.0 AssetsModel.qml
|
||||
CollectiblesModel 1.0 CollectiblesModel.qml
|
||||
ChannelsModel 1.0 ChannelsModel.qml
|
||||
AssetsCollectiblesIconsModel 1.0 AssetsCollectiblesIconsModel.qml
|
||||
TokenHoldersModel 1.0 TokenHoldersModel.qml
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user