status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat(MintAssets): Created preview assets page 

- Updated `CommunityTokenView` with assets design.
- Updated storybook to test assets design.

Part of #10624
This commit is contained in:
Noelia 2023-05-25 12:31:32 +02:00 committed by Noelia
parent 00bdb0ff15
commit 775a93e82c
4 changed files with 293 additions and 200 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
storybook/figma.json
View File

@ -34,13 +34,16 @@
"CommunityTokenView": [
"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"
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2934%3A479570&t=Qo2FwPRxvSxbluqB-1",
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?type=design&node-id=29384-568106&t=mAtmLENvQyRJqDGQ-0"
],
"CommunityMintTokensSettingsPanel": [
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=22721%3A498587&t=v2Krj5iZQaSTK7Om-1",
"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"
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2934%3A480927&t=v2Krj5iZQaSTK7Om-1",
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?type=design&node-id=29566-689073&t=mAtmLENvQyRJqDGQ-0",
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?type=design&node-id=29437-599353&t=mAtmLENvQyRJqDGQ-0"
],
"CommunityMintedTokensView": [
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2934%3A479136&t=zs22ORYUVDYpqubQ-1"

52
storybook/pages/CommunityTokenViewPage.qml
View File

@ -4,6 +4,8 @@ import QtQuick.Layouts 1.14
import AppLayouts.Chat.views.communities 1.0
import StatusQ.Core 0.1
import Storybook 1.0
import Models 1.0
@ -28,6 +30,7 @@ SplitView {
anchors.margins: 50
artworkSource: ModelsData.icons.superRare
preview: previewBox.checked
isAssetView: isAssetBox.checked
remotelyDestructState: remotelyDestructStateBox.checked ? 1 /*In progress*/ : 2 /*Completed*/
burnState: burnDestructStateBox.checked ? 1 /*In progress*/ : 2 /*Completed*/
name: nameText.text
@ -35,6 +38,7 @@ SplitView {
description: descriptionText.text
supplyAmount: parseInt(supplyText.text)
infiniteSupply: unlimitedSupplyChecker.checked
assetDecimals: parseInt(decimalText.text)
remainingTokens: parseInt(remainingText.text)
transferable: transferibleChecker.checked
selfDestruct: selfdestructChecker.checked
@ -43,7 +47,7 @@ SplitView {
chainIcon: ModelsData.networks.ethereum
accountName: "helloworld"
onMintCollectible: logs.logEvent("CommunityTokenView::mintCollectible: \n"
onMintCollectible: logs.logEvent("CommunityTokenView::onMintCollectible: \n"
+ "artworkSource: " + artworkSource + "\n"
+ "name: " + name + "\n"
+ "symbol: " + symbol + "\n"
@ -52,7 +56,19 @@ SplitView {
+ "infiniteSupply: " + infiniteSupply + "\n"
+ "transferable: " + transferable + "\n"
+ "selfDestruct: " + selfDestruct + "\n"
+ "chainId: " + chainId)
+ "chainId: " + chainId + "\n"
+ "accountName: " + accountName)
onMintAsset: logs.logEvent("CommunityTokenView::onMintAsset: \n"
+ "artworkSource: " + artworkSource + "\n"
+ "name: " + name + "\n"
+ "symbol: " + symbol + "\n"
+ "description: " + description + "\n"
+ "supply: " + supply + "\n"
+ "infiniteSupply: " + infiniteSupply + "\n"
+ "decimals: " + decimals + "\n"
+ "chainId: " + chainId + "\n"
+ "accountName: " + accountName)
}
}
@ -70,7 +86,14 @@ SplitView {
SplitView.minimumWidth: 300
SplitView.preferredWidth: 300
StatusScrollView {
width: parent.width
height: parent.height
contentHeight: _column.implicitHeight
contentWidth: _column.implicitWidth
ColumnLayout {
id: _column
CheckBox {
id: previewBox
@ -78,6 +101,12 @@ SplitView {
checked: true
}
CheckBox {
id: isAssetBox
text: "Is Assets View?"
checked: false
}
ColumnLayout {
Label {
text: "Minting state:"
@ -105,6 +134,7 @@ SplitView {
CheckBox {
id: remotelyDestructStateBox
visible: !isAssetBox.checked
text: "Remotely destruct in progress"
checked: false
}
@ -205,15 +235,32 @@ SplitView {
text: "123"
}
Label {
Layout.topMargin: 10
Layout.fillWidth: true
visible: isAssetBox.checked
text: "Decimal"
}
TextField {
id: decimalText
Layout.preferredWidth: 200
background: Rectangle { border.color: 'lightgrey' }
visible: isAssetBox.checked
text: "2"
}
CheckBox {
id: transferibleChecker
Layout.topMargin: 10
visible: !isAssetBox.checked
text: "Tranferible"
checked: true
}
CheckBox {
id: selfdestructChecker
visible: !isAssetBox.checked
text: "Remote self-desctruct"
checked: true
}
@ -257,3 +304,4 @@ SplitView {
}
}
}
}

2
ui/app/AppLayouts/Chat/views/communities/CommunityNewTokenView.qml
View File

@ -209,7 +209,7 @@ StatusScrollView {
id: assetDecimalsInput
visible: root.isAssetView
label: qsTr("Decimals")
label: qsTr("Decimals (DP)")
charLimit: 2
charLimitLabel: qsTr("Max 10")
placeholderText: "2"

68
ui/app/AppLayouts/Chat/views/communities/CommunityTokenView.qml
View File

@ -18,26 +18,35 @@ StatusScrollView {
property int viewWidth: 560 // by design
property bool preview: false
property bool isAssetView: false
// Collectible object properties:
// Token properties
property alias artworkSource: image.source
property rect artworkCropRect
property string name
property alias symbol: symbolBox.value
property alias description: descriptionItem.text
property alias chainName: chainText.text
property string name
property int supplyAmount
property int remainingTokens
property bool infiniteSupply
property bool transferable
property bool selfDestruct
property alias accountName: accountBox.value
property int chainId
property string chainIcon
property int deployState: Constants.BackendProcessState.None
property int remotelyDestructState: Constants.BackendProcessState.None
property int burnState: Constants.BackendProcessState.None
property alias chainName: chainText.text
property var tokenOwnersModel
property alias accountName: accountBox.value
property int deployState: Constants.BackendProcessState.None
property int burnState: Constants.BackendProcessState.None
// Collectible object properties (ERC721)
property bool transferable
property bool selfDestruct
property int remotelyDestructState: Constants.BackendProcessState.None
// Asset properties (ERC20)
property alias assetDecimals: decimalsBox.value
signal mintCollectible(url artworkSource,
string name,
@ -50,10 +59,20 @@ StatusScrollView {
int chainId,
string accountName)
signal mintAsset(url artworkSource,
string name,
string symbol,
string description,
int supply,
bool infiniteSupply,
int decimals,
int chainId,
string accountName)
QtObject {
id: d
readonly property int imageSelectorRectSize: 280
readonly property int imageSelectorRectSize: root.isAssetView ? 104 : 280
readonly property int iconSize: 20
readonly property string infiniteSymbol: "∞"
@ -97,8 +116,10 @@ StatusScrollView {
elide: Text.ElideRight
font.pixelSize: Theme.primaryTextFontSize
text: (root.deployState === Constants.BackendProcessState.InProgress) ?
qsTr("Collectible is being minted") :
(root.deployState === Constants.BackendProcessState.Failed) ? qsTr("Collectible minting failed") : ""
(root.isAssetView ?
qsTr("Asset is being minted") : qsTr("Collectible is being minted")) :
(root.deployState === Constants.BackendProcessState.Failed) ?
(root.isAssetView ? qsTr("Asset minting failed") : qsTr("Collectible minting failed")) : ""
color: (root.deployState === Constants.BackendProcessState.Failed) ? Theme.palette.dangerColor1 : Theme.palette.directColor1
}
}
@ -107,7 +128,7 @@ StatusScrollView {
Layout.preferredHeight: d.imageSelectorRectSize
Layout.preferredWidth: Layout.preferredHeight
radius: 8
radius: root.isAssetView ? Layout.preferredWidth / 2 : 8
color:Theme.palette.baseColor2
clip: true
@ -231,11 +252,20 @@ StatusScrollView {
}
CustomPreviewBox {
id: decimalsBox
visible: root.isAssetView
label: qsTr("DP")
}
CustomPreviewBox {
visible: !root.isAssetView
label: qsTr("Transferable")
value: root.transferable ? qsTr("Yes") : qsTr("No")
}
CustomPreviewBox {
visible: !root.isAssetView
label: qsTr("Remotely destructible")
value: root.selfDestruct ? qsTr("Yes") : qsTr("No")
}
@ -320,6 +350,17 @@ StatusScrollView {
text: qsTr("Mint")
onClicked: {
if(root.isAssetView) {
root.mintAsset(root.artworkSource,
root.name,
root.symbol,
root.description,
root.supplyAmount,
root.infiniteSupply,
root.assetDecimals,
root.chainId,
root.accountName)
} else {
root.mintCollectible(root.artworkSource,
root.name,
root.symbol,
@ -332,6 +373,7 @@ StatusScrollView {
root.accountName)
}
}
}
TokenHoldersPanel {
visible: !root.preview