From dbf05f4a58ce4cff0b9c820099a6a8296cc0f84e Mon Sep 17 00:00:00 2001 From: Noelia Date: Fri, 31 Mar 2023 12:20:23 +0200 Subject: [PATCH] feat(MintTokens): Holders panel updates Added selector mode that contains a combobox and checkbox. Part of #10051 --- .../panels/communities/TokenHoldersPanel.qml | 108 ++++++++++++++---- .../Chat/stores/CommunityTokensStore.qml | 16 ++- 2 files changed, 95 insertions(+), 29 deletions(-) diff --git a/ui/app/AppLayouts/Chat/panels/communities/TokenHoldersPanel.qml b/ui/app/AppLayouts/Chat/panels/communities/TokenHoldersPanel.qml index 2fb11ee5c5..a1cedb933d 100644 --- a/ui/app/AppLayouts/Chat/panels/communities/TokenHoldersPanel.qml +++ b/ui/app/AppLayouts/Chat/panels/communities/TokenHoldersPanel.qml @@ -15,10 +15,14 @@ import shared.controls 1.0 Control { id: root - // Expected roles: ensName, walletAddress, imageSource and amount + // Expected roles: ensName, walletAddress, imageSource, amount, selfDestructAmount and selfDestruct property var model property string tokenName + property bool isSelectorMode: false + + signal selfDestructChanged() + QtObject { id: d @@ -30,15 +34,6 @@ Control { anchors.fill: parent spacing: Style.current.padding - StatusBaseText { - visible: !root.preview - Layout.fillWidth: true - wrapMode: Text.Wrap - font.pixelSize: Style.current.primaryTextFontSize - color: Theme.palette.baseColor1 - text: qsTr("All %1 token holders").arg(root.tokenName) - } - SortFilterProxyModel { id: filteredModel @@ -55,7 +50,9 @@ Control { SearchBox { id: searcher + Layout.fillWidth: true + topPadding: 0 bottomPadding: 0 minimumHeight: 36 // by design @@ -64,26 +61,87 @@ Control { placeholderText: enabled ? qsTr("Search") : qsTr("No placeholders to search") } - StatusListView { - id: holders + StatusBaseText { + Layout.fillWidth: true + visible: !root.preview + wrapMode: Text.Wrap + font.pixelSize: Style.current.primaryTextFontSize + color: Theme.palette.baseColor1 + text: searcher.text.length > 0 ? qsTr("Search results") : qsTr("All %1 token holders").arg(root.tokenName) + } + + StatusListView { Layout.fillWidth: true Layout.preferredHeight: childrenRect.height - leftMargin: -Style.current.padding - model: filteredModel - delegate: StatusListItem { - readonly property bool unknownHolder: model.ensName === "" - readonly property string formattedTitle: unknownHolder ? "?" : model.ensName - sensor.enabled: false + model: filteredModel + delegate: RowLayout { width: ListView.view.width - title: formattedTitle - statusListItemTitle.visible: !unknownHolder - subTitle: model.walletAddress - asset.name: model.imageSource - asset.isImage: true - asset.isLetterIdenticon: unknownHolder - asset.color: Theme.palette.userCustomizationColors[d.red2Color] + spacing: Style.current.padding + + StatusListItem { + readonly property bool unknownHolder: model.ensName === "" + readonly property string formattedTitle: unknownHolder ? "?" : model.ensName + + Layout.fillWidth: true + + leftPadding: 0 + rightPadding: 0 + sensor.enabled: false + title: formattedTitle + statusListItemTitle.visible: !unknownHolder + subTitle: model.walletAddress + asset.name: model.imageSource + asset.isImage: true + asset.isLetterIdenticon: unknownHolder + asset.color: Theme.palette.userCustomizationColors[d.red2Color] + } + + StatusComboBox { + id: combo + + Layout.preferredWidth: 70 + Layout.preferredHeight: 44 + + visible: root.isSelectorMode && amount > 1 + control.spacing: Style.current.halfPadding / 2 + model: amount + size: StatusComboBox.Size.Small + type: StatusComboBox.Type.Secondary + delegate: StatusItemDelegate { + width: combo.control.width + textHorizontalAligment: Text.AlignHCenter + highlighted: combo.control.highlightedIndex === index + font: combo.control.font + text: Number(modelData) + 1 + } + contentItem: StatusBaseText { + font: combo.control.font + verticalAlignment: Text.AlignVCenter + elide: Text.ElideRight + text: Number(combo.control.displayText) + 1 + color: Theme.palette.baseColor1 + } + + control.onDisplayTextChanged: { + selfDestructAmount = combo.currentIndex + 1 + root.selfDestructChanged() + } + } + + StatusCheckBox { + id: checkBox + + Layout.leftMargin: Style.current.padding + visible: root.isSelectorMode + checked: root.isSelectorMode ? selfDestruct : false + padding: 0 + onCheckStateChanged: { + selfDestruct = checked + root.selfDestructChanged() + } + } } } } diff --git a/ui/app/AppLayouts/Chat/stores/CommunityTokensStore.qml b/ui/app/AppLayouts/Chat/stores/CommunityTokensStore.qml index acf388731a..8c6f518d54 100644 --- a/ui/app/AppLayouts/Chat/stores/CommunityTokensStore.qml +++ b/ui/app/AppLayouts/Chat/stores/CommunityTokensStore.qml @@ -25,25 +25,33 @@ QtObject { ensName: "carmen.eth", walletAddress: "0xb794f5450ba39494ce839613fffba74279579268", imageSource:image, - amount: 3 + amount: 3, + selfDestructAmount: 0, + selfDestruct: false }, { ensName: "chris.eth", walletAddress: "0xb794f5ea0ba39494ce839613fffba74279579268", imageSource: image, - amount: 2 + amount: 2, + selfDestructAmount: 0, + selfDestruct: false }, { ensName: "emily.eth", walletAddress: "0xb794f5ea0ba39494ce839613fffba74279579268", imageSource: image, - amount: 2 + amount: 2, + selfDestructAmount: 0, + selfDestruct: false }, { ensName: "", walletAddress: "0xb794f5ea0ba39494ce839613fffba74279579268", imageSource: "", - amount: 1 + amount: 1, + selfDestructAmount: 0, + selfDestruct: false } ]) }