status-desktop/ui/app/AppLayouts/Communities/controls/TokenHolderListItem.qml

203 lines
6.4 KiB
QML

import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Components 0.1
import StatusQ.Core.Utils 0.1 as StatusQUtils
import utils 1.0
/*!
\qmltype TokenHolderListItem
\inherits ItemDelegate
\brief Represents a token holder which can be a community member or a bare wallet address
*/
ItemDelegate {
id: root
property int usernameHeaderWidth: 0
property int noOfMessagesHeaderWidth: 0
property int holdingHeaderWidth: 0
property bool isCurrentItem: false
property bool remotelyDestructInProgress: false
property bool showSeparator: false
property bool isFirstRowAddress: false
property string name
property string contactId
property string walletAddress
property string imageSource
property int numberOfMessages: 0
property int amount: 0
property var contactDetails: null
readonly property string addressElided: StatusQUtils.Utils.elideText(root.walletAddress, 6, 3).replace(
"0x", "0" + String.fromCodePoint(0x00D7))
signal clicked(var mouse)
function updateContactDetails() {
contactDetails = contactId !== "" ? Utils.getContactDetailsAsJson(contactId, false) : null
}
Component.onCompleted: root.updateContactDetails()
onContactIdChanged: root.updateContactDetails()
onRemotelyDestructInProgressChanged: {
if (!remotelyDestructInProgress)
colorAnimation.restart()
}
padding: 0
horizontalPadding: Style.current.padding
topPadding: showSeparator ? Style.current.halfPadding : 0
background: Item {
Rectangle {
anchors.fill: parent
anchors.topMargin: root.topPadding
radius: Style.current.radius
color: root.hovered || root.isCurrentItem ? Theme.palette.baseColor2 : "transparent"
}
Rectangle {
anchors.fill: parent
anchors.topMargin: root.topPadding
radius: Style.current.radius
color: "transparent"
SequentialAnimation on color {
id: colorAnimation
running: false
PropertyAction { value: Theme.palette.primaryColor3 }
PauseAnimation { duration: 1000 }
ColorAnimation { to: "transparent"; duration: 500 }
}
}
Rectangle {
visible: root.showSeparator
anchors.top: parent.top
anchors.left: parent.left
anchors.right: parent.right
height: 1
color: Theme.palette.baseColor2
}
}
Component {
id: communityMemberContentItem
StatusMemberListItem {
color: "transparent"
leftPadding: 0
rightPadding: 0
sensor.enabled: false
nickName: root.contactDetails.localNickname
userName: ProfileUtils.displayName("", root.contactDetails.ensName, root.contactDetails.displayName, root.contactDetails.alias)
pubKey: root.contactDetails.isEnsVerified ? "" : Utils.getCompressedPk(root.contactId)
isContact: root.contactDetails.isContact
isVerified: root.contactDetails.verificationStatus === Constants.verificationStatus.verified
isUntrustworthy: root.contactDetails.trustStatus == Constants.trustStatus.untrustworthy
isAdmin: root.contactDetails.memberRole === Constants.memberRole.owner
status: root.contactDetails.onlineStatus
asset.name: root.contactDetails.displayIcon
asset.isImage: (asset.name !== "")
asset.isLetterIdenticon: (asset.name === "")
asset.color: Utils.colorForPubkey(root.contactId)
ringSettings.ringSpecModel: Utils.getColorHashAsJson(root.contactId)
}
}
Component {
id: bareAddressContentItem
StatusListItem {
color: "transparent"
leftPadding: 0
rightPadding: 0
sensor.enabled: false
title: root.addressElided
statusListItemIcon.name: "?"
statusListItemSubTitle.font.pixelSize: Theme.asideTextFontSize
statusListItemSubTitle.lineHeightMode: Text.FixedHeight
statusListItemSubTitle.lineHeight: 14
asset.name: root.imageSource
asset.isImage: true
asset.isLetterIdenticon: true
asset.color: Theme.palette.userCustomizationColors[d.red2Color]
}
}
contentItem: Item {
implicitWidth: delegateRow.implicitWidth
implicitHeight: delegateRow.implicitHeight
RowLayout {
id: delegateRow
spacing: Style.current.padding
Loader {
Layout.preferredWidth: root.usernameHeaderWidth
sourceComponent: contactDetails ? communityMemberContentItem : bareAddressContentItem
}
TokenHolderNumberCell {
Layout.preferredWidth: root.noOfMessagesHeaderWidth
text: root.name
? LocaleUtils.numberToLocaleString(root.numberOfMessages)
: "-"
}
RowLayout {
Layout.preferredWidth: root.holdingHeaderWidth
spacing: 4
StatusBaseText {
Layout.fillWidth: true
horizontalAlignment: Qt.AlignRight
text: StatusQUtils.Emoji.fromCodePoint("1f525") // :fire: emoji
font.pixelSize: Style.current.tertiaryTextFontSize
visible: root.remotelyDestructInProgress
color: Theme.palette.directColor1
}
TokenHolderNumberCell {
Layout.alignment: Qt.AlignRight
text: LocaleUtils.numberToLocaleString(root.amount)
}
StatusLoadingIndicator {
Layout.preferredHeight: Theme.primaryTextFontSize
Layout.preferredWidth: Layout.preferredHeight
Layout.leftMargin: 6
visible: root.remotelyDestructInProgress
color: Theme.palette.primaryColor1
}
}
}
}
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.AllButtons
cursorShape: Qt.PointingHandCursor
onClicked: root.clicked(mouse)
}
}