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(@desktop/wallet2): Added traits for the opensea Assets 

fixes #3435
This commit is contained in:
Khushboo Mehta 2021-09-10 15:11:34 +02:00 committed by Iuri Matias
parent 06d7dbed95
commit b9073919cb
12 changed files with 277 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/app/wallet/v2/views/asset_list.nim
View File

@ -1,4 +1,5 @@
import NimQml, Tables
import NimQml, Tables, strutils
import trait_list
from status/wallet2 import OpenseaAsset
type
@ -8,10 +9,17 @@ type
Description = UserRole + 3,
Permalink = UserRole + 4,
ImageUrl = UserRole + 5,
BackgroundColor = UserRole + 6,
Properties = UserRole + 7,
Rankings = UserRole + 8,
Stats = UserRole + 9
QtObject:
type AssetList* = ref object of QAbstractListModel
assets*: seq[OpenseaAsset]
propertiesList*: TraitsList
rankingList*: TraitsList
statsList*: TraitsList
proc setup(self: AssetList) = self.QAbstractListModel.setup
@ -22,6 +30,9 @@ QtObject:
proc newAssetList*(): AssetList =
new(result, delete)
result.assets = @[]
result.propertiesList = newTraitsList()
result.rankingList = newTraitsList()
result.statsList = newTraitsList()
result.setup
proc assetsChanged*(self: AssetList) {.signal.}
@ -55,16 +66,33 @@ QtObject:
of AssetRoles.Description: result = newQVariant(asset.description)
of AssetRoles.Permalink: result = newQVariant(asset.permalink)
of AssetRoles.ImageUrl: result = newQVariant(asset.imageUrl)
of AssetRoles.BackgroundColor: result = newQVariant(if (asset.backgroundColor == ""): "transparent" else: ("#" & asset.backgroundColor))
of AssetRoles.Properties:
self.propertiesList.traits = @[]
self.propertiesList.traits = asset.properties
result = newQVariant(self.propertiesList)
of AssetRoles.Rankings:
self.rankingList.traits = @[]
self.rankingList.traits = asset.rankings
result = newQVariant(self.rankingList)
of AssetRoles.Stats:
self.statsList.traits = @[]
self.statsList.traits = asset.statistics
result = newQVariant(self.statsList)
method roleNames(self: AssetList): Table[int, string] =
{ AssetRoles.Id.int:"id",
AssetRoles.Name.int:"name",
AssetRoles.Description.int:"description",
AssetRoles.Permalink.int:"permalink",
AssetRoles.ImageUrl.int:"imageUrl"}.toTable
AssetRoles.ImageUrl.int:"imageUrl",
AssetRoles.BackgroundColor.int:"backgroundColor",
AssetRoles.Properties.int:"properties",
AssetRoles.Rankings.int:"rankings",
AssetRoles.Stats.int:"stats"}.toTable
proc setData*(self: AssetList, assets: seq[OpenseaAsset]) =
self.beginResetModel()
self.assets = assets
self.endResetModel()
self.assetsChanged()
self.assetsChanged()

6
src/app/wallet/v2/views/collection_list.nim
View File

@ -60,7 +60,11 @@ QtObject:
CollectionRoles.ImageUrl.int:"imageUrl",
CollectionRoles.OwnedAssetCount.int:"ownedAssetCount"}.toTable
proc getCollectionTraitMaxValue(self: CollectionList, index: int, traitType: string): int {.slot.} =
let collection = self.collections[index]
return int(collection.trait[traitType].max)
proc setData*(self: CollectionList, collections: seq[OpenseaCollection]) =
self.beginResetModel()
self.collections = collections
self.endResetModel()
self.endResetModel()

49
src/app/wallet/v2/views/trait_list.nim Normal file
View File

@ -0,0 +1,49 @@
import NimQml, Tables
from status/wallet2 import OpenseaTrait
type
TraitRoles {.pure.} = enum
TraitType = UserRole + 1,
Value = UserRole + 2,
DisplayType = UserRole + 3,
MaxValue = UserRole + 4
QtObject:
type TraitsList* = ref object of QAbstractListModel
traits*: seq[OpenseaTrait]
proc setup(self: TraitsList) = self.QAbstractListModel.setup
proc delete(self: TraitsList) =
self.traits = @[]
self.QAbstractListModel.delete
proc newTraitsList*(): TraitsList =
new(result, delete)
result.traits = @[]
result.setup
method rowCount*(self: TraitsList, index: QModelIndex = nil): int =
return self.traits.len
method data(self: TraitsList, index: QModelIndex, role: int): QVariant =
if not index.isValid:
return
if index.row < 0 or index.row >= self.traits.len:
return
let trait = self.traits[index.row]
let traitRole = role.TraitRoles
case traitRole:
of TraitRoles.TraitType: result = newQVariant(trait.traitType)
of TraitRoles.Value: result = newQVariant(trait.value)
of TraitRoles.DisplayType: result = newQVariant(trait.displayType)
of TraitRoles.MaxValue: result = newQVariant(trait.maxValue)
method roleNames(self: TraitsList): Table[int, string] =
{ TraitRoles.TraitType.int:"traitType",
TraitRoles.Value.int:"value",
TraitRoles.DisplayType.int:"displayType",
TraitRoles.MaxValue.int:"maxValue"}.toTable

2
ui/StatusQ

@ -1 +1 @@
Subproject commit 718171fd7b1de3e32aba06672621db75c1c5888a
Subproject commit 2bf1cae52833ae3cd8f6be8f939d53363a201452

6
ui/app/AppLayouts/WalletV2/CollectiblesTab.qml
View File

@ -54,11 +54,6 @@ Item {
}
}
// To-do remove
CollectibleModal {
id: collectibleModalComponent
}
Component {
id: loaded
@ -84,6 +79,7 @@ Item {
expandableComponent: CollectibleCollection {
slug: model.slug
collectionImageUrl: model.imageUrl
collectionIndex: model.index
}
}
}

1
ui/app/AppLayouts/WalletV2/LeftTab.qml
View File

@ -18,6 +18,7 @@ Rectangle {
}
selectedAccount = newIndex
walletV2Model.setCurrentAccountByIndex(newIndex)
collectiblesDetailPage.active = false
}
StyledText {

20
ui/app/AppLayouts/WalletV2/WalletV2Layout.qml
View File

@ -14,7 +14,8 @@ Item {
property bool hideSignPhraseModal: false
function openCollectibleDetailView(options) {
collectiblesDetailPage.show(options)
collectiblesDetailPage.active = true
collectiblesDetailPage.item.show(options)
}
function showSigningPhrasePopup(){
@ -56,7 +57,7 @@ Item {
WalletHeader {
id: walletHeader
changeSelectedAccount: leftTab.changeSelectedAccount
visible: !collectiblesDetailPage.visible
visible: !collectiblesDetailPage.active
}
RowLayout {
@ -69,7 +70,7 @@ Item {
anchors.rightMargin: 0
anchors.top: walletHeader.bottom
anchors.topMargin: 23
visible: !collectiblesDetailPage.visible
visible: !collectiblesDetailPage.active
Item {
id: walletInfoContent
@ -124,10 +125,17 @@ Item {
id: walletFooter
anchors.bottom: parent.bottom
}
CollectibleDetailsPage {
Loader {
id: collectiblesDetailPage
anchors.fill: parent
anchors.bottom: walletFooter.top
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
active: false
sourceComponent: CollectibleDetailsPage {
anchors.fill: parent
}
}
}
}

9
ui/app/AppLayouts/WalletV2/components/CollectibleCollection.qml
View File

@ -11,6 +11,7 @@ Item {
property string slug: ""
property bool assetsLoaded: false
property string collectionImageUrl: ""
property int collectionIndex: -1
signal clicked()
@ -69,6 +70,7 @@ Item {
border.color: Theme.palette.baseColor2
border.width: 1
showLoadingIndicator: true
color: model.backgroundColor
MouseArea {
anchors.fill: parent
onClicked: {
@ -77,7 +79,12 @@ Item {
collectibleId: model.id,
description: model.description,
permalink: model.permalink,
imageUrl: model.imageUrl
imageUrl: model.imageUrl,
backgroundColor: model.backgroundColor,
properties: model.properties,
rankings: model.rankings,
stats: model.stats,
collectionIndex: root.collectionIndex
})
}
}

204
ui/app/AppLayouts/WalletV2/components/CollectibleDetailsPage.qml
View File

@ -10,21 +10,34 @@ import StatusQ.Controls 0.1
Item {
id: collectiblesDetailContainer
visible: false
property var assetProperties
property var assetRankings
property var assetStats
property int collectionIndex: -1
function show(options) {
visible = true
collectibleHeader.image.source = options.collectibleImageUrl
collectibleHeader.primaryText = options.name
collectibleHeader.secondaryText = options.collectibleId
collectibleimage.image.source = options.imageUrl
collectibleText.text = options.description
collectibleimage.color = options.backgroundColor
assetProperties = options.properties
assetRankings = options.rankings
assetStats = options.stats
collectionIndex = options.collectionIndex
}
function hide() {
visible = false
active = false
}
function getCollectionMaxValue(traitType, value, maxValue) {
if(maxValue !== "")
return parseInt(value) + qsTr(" of ") + maxValue
else
return parseInt(value) + qsTr(" of ") + walletV2Model.collectiblesView.collections.getCollectionTraitMaxValue(collectionIndex, traitType).toString()
}
CollectibleDetailsHeader {
@ -51,7 +64,6 @@ Item {
width: parent.width
spacing: 24
// To-do update color of background once design is finalized
StatusRoundedImage {
id: collectibleimage
width: 253
@ -76,54 +88,168 @@ Item {
}
}
Column {
ListView {
anchors.top: collectibleImageDetails.bottom
anchors.topMargin: 32
anchors.bottom: parent.bottom
anchors.bottomMargin: 20
anchors.horizontalCenter: parent.horizontalCenter
width: parent.width
StatusExpandableItem {
clip: true
boundsBehavior: Flickable.StopAtBounds
model: 3
delegate: StatusExpandableItem {
width: parent.width
height: childrenRect.height
anchors.horizontalCenter: parent.horizontalCenter
primaryText: qsTr("Properties")
primaryText: index === 0 ? qsTr("Properties") : index === 1 ? qsTr("Levels") : qsTr("Stats")
type: StatusExpandableItem.Type.Tertiary
expandableComponent: notImplemented
}
StatusExpandableItem {
width: parent.width
anchors.horizontalCenter: parent.horizontalCenter
primaryText: "Data group 2"
type: StatusExpandableItem.Type.Tertiary
expandableComponent: notImplemented
}
StatusExpandableItem {
width: parent.width
anchors.horizontalCenter: parent.horizontalCenter
primaryText: "Data group 3"
type: StatusExpandableItem.Type.Tertiary
expandableComponent: notImplemented
expandableComponent: index === 0 ? properties : index === 1 ? rankings : stats
visible: index === 0 ? (!!assetProperties ? assetProperties.rowCount() !== 0 : false) :
index === 1 ? (!!assetRankings ? assetRankings.rowCount() !== 0 : false) :
(!!assetStats ? assetStats.rowCount() !== 0 : false)
}
}
}
Component {
id: notImplemented
Rectangle {
anchors.centerIn: parent
id: properties
Flow {
width: parent.width
height: infoText.implicitHeight
color: Theme.palette.baseColor5
StatusBaseText {
id: infoText
anchors.centerIn: parent
color: Theme.palette.directColor4
font.pixelSize: 15
lineHeight: 22
lineHeightMode: Text.FixedHeight
font.weight: Font.Medium
text: qsTr("Not Implemented")
spacing: 10
Repeater {
model: assetProperties
Rectangle {
id: containerRect
height: 52
width: 147
color: "transparent"
border.color: Theme.palette.baseColor2
border.width: 1
radius: 8
Column {
anchors.horizontalCenter: parent.horizontalCenter
anchors.top: parent.top
anchors.topMargin: 6
StatusBaseText {
width: containerRect.width - 12
color: Theme.palette.baseColor1
font.pixelSize: 13
lineHeight: 18
lineHeightMode: Text.FixedHeight
elide: Text.ElideRight
horizontalAlignment: Text.AlignHCenter
text: model.traitType
font.capitalization: Font.Capitalize
}
StatusBaseText {
width: containerRect.width - 12
color: Theme.palette.directColor1
font.pixelSize: 15
lineHeight: 22
lineHeightMode: Text.FixedHeight
horizontalAlignment: Text.AlignHCenter
elide: Text.ElideRight
text: model.value
}
}
}
}
}
}
// To-do change to progress bar one design is finalized
Component {
id: rankings
Column {
width: parent.width
spacing: 10
Repeater {
model: assetRankings
Rectangle {
anchors.horizontalCenter: parent.horizontalCenter
width: parent.width
height: 52
color: Theme.palette.baseColor4
StatusBaseText {
anchors.left: parent.left
anchors.leftMargin: 10
anchors.verticalCenter: parent.verticalCenter
color: Theme.palette.baseColor1
font.pixelSize: 15
lineHeight: 22
lineHeightMode: Text.FixedHeight
elide: Text.ElideRight
horizontalAlignment: Text.AlignLeft
text: model.traitType
font.capitalization: Font.Capitalize
}
StatusBaseText {
anchors.right: parent.right
anchors.rightMargin: 10
anchors.verticalCenter: parent.verticalCenter
color: Theme.palette.directColor1
font.pixelSize: 15
lineHeight: 22
lineHeightMode: Text.FixedHeight
horizontalAlignment: Text.AlignLeft
elide: Text.ElideRight
text: collectiblesDetailContainer.getCollectionMaxValue(model.traitType, model.value, model.maxValue)
}
}
}
}
}
// To-do change to progress bar one design is finalized
Component {
id: stats
Column {
width: parent.width
spacing: 10
Repeater {
model: assetStats
Rectangle {
anchors.horizontalCenter: parent.horizontalCenter
width: parent.width
height: 52
color: Theme.palette.baseColor4
StatusBaseText {
anchors.left: parent.left
anchors.leftMargin: 10
anchors.verticalCenter: parent.verticalCenter
color: Theme.palette.baseColor1
font.pixelSize: 15
lineHeight: 22
lineHeightMode: Text.FixedHeight
elide: Text.ElideRight
horizontalAlignment: Text.AlignLeft
text: model.traitType
font.capitalization: Font.Capitalize
}
StatusBaseText {
anchors.right: parent.right
anchors.rightMargin: 10
anchors.verticalCenter: parent.verticalCenter
color: Theme.palette.directColor1
font.pixelSize: 15
lineHeight: 22
lineHeightMode: Text.FixedHeight
horizontalAlignment: Text.AlignLeft
elide: Text.ElideRight
text: collectiblesDetailContainer.getCollectionMaxValue(model.traitType, model.value, model.maxValue)
}
}
}
}
}

1
ui/app/AppLayouts/WalletV2/components/qmldir
View File

@ -1,6 +1,5 @@
AddAccount 1.0 AddAccount.qml
HeaderButton 1.0 HeaderButton.qml
CollectibleCollection 1.0 CollectibleCollection.qml
CollectibleModal 1.0 CollectibleModal.qml
AddAccountPopup 1.0 AddAccountPopup.qml
CollectibleDetailsPage 1.0 CollectibleDetailsPage.qml

2
vendor/status-go vendored

@ -1 +1 @@
Subproject commit 07651d4d0696a2810666d49baaebcebc308c992a
Subproject commit cf233861a52bbe7c88b175ce5114f97cd21898f0

2
vendor/status-lib vendored

@ -1 +1 @@
Subproject commit 99b85d206381ac1654f4099d91c75640c5613c1a
Subproject commit 12a8b59780fa586663ec3414d904f5f822b63d86