From ec8b03be6ef9700129c221e2824bfa90b88d6ebd Mon Sep 17 00:00:00 2001 From: Noelia Date: Wed, 1 Feb 2023 18:26:59 +0100 Subject: [PATCH] feat(JoinCommunity): Created join permission overlay panel Created needed components to display permission requirements to join a community. Part of #9267 --- .../panels/communities/HoldingsListPanel.qml | 96 +++++++++++++++ .../JoinPermissionsOverlayPanel.qml | 115 ++++++++++++++++++ .../AppLayouts/Chat/panels/communities/qmldir | 1 + 3 files changed, 212 insertions(+) create mode 100644 ui/app/AppLayouts/Chat/panels/communities/HoldingsListPanel.qml create mode 100644 ui/app/AppLayouts/Chat/panels/communities/JoinPermissionsOverlayPanel.qml diff --git a/ui/app/AppLayouts/Chat/panels/communities/HoldingsListPanel.qml b/ui/app/AppLayouts/Chat/panels/communities/HoldingsListPanel.qml new file mode 100644 index 0000000000..11a05f654f --- /dev/null +++ b/ui/app/AppLayouts/Chat/panels/communities/HoldingsListPanel.qml @@ -0,0 +1,96 @@ +import QtQuick 2.14 +import QtQuick.Controls 2.14 +import QtQuick.Layouts 1.14 + +import StatusQ.Core 0.1 +import StatusQ.Core.Theme 0.1 +import StatusQ.Components 0.1 +import StatusQ.Controls 0.1 + +import AppLayouts.Chat.helpers 1.0 +import AppLayouts.Chat.controls.community 1.0 + +import SortFilterProxyModel 0.2 + +import utils 1.0 + +Control { + id: root + + property var model + property string introText + + QtObject { + id: d + + // By design values: + readonly property int defaultHoldingsSpacing: 8 + + function holdingsTextFormat(name, amount) { + return CommunityPermissionsHelpers.setHoldingsTextFormat(HoldingTypes.Type.Asset, name, amount) + } + } + + contentItem: ColumnLayout { + spacing: root.spacing + + StatusBaseText { + Layout.fillWidth: true + horizontalAlignment: Text.AlignHCenter + wrapMode: Text.WordWrap + text: root.introText + textFormat: Text.StyledText + } + + ColumnLayout { + Layout.alignment: Qt.AlignHCenter + spacing: d.defaultHoldingsSpacing + + Repeater { + model: root.model + + ColumnLayout { + Layout.alignment: Qt.AlignHCenter + spacing: d.defaultHoldingsSpacing + + RowLayout { + spacing: 18 // by design + + Repeater { + model: SortFilterProxyModel { + sourceModel: holdingsListModel + proxyRoles: ExpressionRole { + name: "text" + // Direct call for singleton function is not handled properly by SortFilterProxyModel that's why `holdingsTextFormat` is used instead. + expression: d.holdingsTextFormat(model.name, model.amount) + } + } + + StatusListItemTag { + enabled: false + leftPadding: 2 + title: text + asset.name: model.imageSource + asset.isImage: true + asset.bgColor: "transparent" + asset.height: 28 + asset.width: asset.height + closeButtonVisible: false + titleText.color: model.available ? Theme.palette.primaryColor1 : Theme.palette.dangerColor1 + bgColor: model.available ? Theme.palette.primaryColor2 :Theme.palette.dangerColor2 + titleText.font.pixelSize: 15 + } + } + } + + StatusBaseText { + Layout.alignment: Qt.AlignHCenter + text: qsTr("or") + textFormat: Text.StyledText + visible: (index !== root.model.count - 1) + } + } + } + } + } +} diff --git a/ui/app/AppLayouts/Chat/panels/communities/JoinPermissionsOverlayPanel.qml b/ui/app/AppLayouts/Chat/panels/communities/JoinPermissionsOverlayPanel.qml new file mode 100644 index 0000000000..f726589b7e --- /dev/null +++ b/ui/app/AppLayouts/Chat/panels/communities/JoinPermissionsOverlayPanel.qml @@ -0,0 +1,115 @@ +import QtQuick 2.14 +import QtQuick.Controls 2.14 +import QtQuick.Layouts 1.14 + +import StatusQ.Core 0.1 +import StatusQ.Core.Theme 0.1 +import StatusQ.Components 0.1 +import StatusQ.Controls 0.1 + +import AppLayouts.Chat.helpers 1.0 +import AppLayouts.Chat.controls.community 1.0 + +import SortFilterProxyModel 0.2 + + +Control { + id: root + + property bool joinCommunity: true // Otherwise it means join channel action + property bool requirementsMet: false + property bool requiresRequest: false + property bool isInvitationPending: false + property bool isJoinRequestRejected: false + property string communityName + property var communityHoldings + property string channelName + property var viewOnlyHoldings + property var viewAndPostHoldings + property var moderateHoldings + + signal revealAddressClicked + signal invitationPendingClicked + + QtObject { + id: d + + readonly property string communityRequirementsNotMetText: qsTr("Membership requirements not met") + readonly property string communityRevealAddressText: qsTr("Reveal your address to join") + readonly property string communityRevealAddressWithRequestText: qsTr("Reveal your address and request to join") + readonly property string communityMembershipRequestPendingText: qsTr("Membership Request Pending...") + readonly property string channelRequirementsNotMetText: qsTr("Channel requirements not met") + readonly property string channelRevealAddressText: qsTr("Reveal your address to enter") + readonly property string channelMembershipRequestPendingText: qsTr("Channel Membership Request Pending...") + readonly property string memberchipRequestRejectedText: qsTr("Membership Request Rejected") + + function holdingsTextFormat(name, amount) { + return CommunityPermissionsHelpers.setHoldingsTextFormat(HoldingTypes.Type.Asset, name, amount) + } + + function getInvitationPendingText() { + return root.joinCommunity ? d.communityMembershipRequestPendingText : d.channelMembershipRequestPendingText + } + + function getRevealAddressText() { + return root.joinCommunity ? (root.requiresRequest ? d.communityRevealAddressWithRequestText : d.communityRevealAddressText) : d.channelRevealAddressText + } + } + + padding: 35 // default by design + spacing: 32 // default by design + contentItem: ColumnLayout { + id: column + spacing: root.spacing + + HoldingsListPanel { + Layout.fillWidth: true + spacing: root.spacing + visible: root.joinCommunity && root.communityHoldings + introText: qsTr("To join %1 you need to prove that you hold").arg(root.communityName) + model: root.communityHoldings + } + + HoldingsListPanel { + Layout.fillWidth: true + spacing: root.spacing + visible: !root.joinCommunity && !!root.viewOnlyHoldings + introText: qsTr("To only view the %1 channel you need to hold").arg(root.channelName) + model: root.viewOnlyHoldings + } + + HoldingsListPanel { + Layout.fillWidth: true + spacing: root.spacing + visible: !root.joinCommunity && !!root.viewAndPostHoldings + introText: qsTr("To view and post in the %1 channel you need to hold").arg(root.channelName) + model: root.viewAndPostHoldings + } + + HoldingsListPanel { + Layout.fillWidth: true + spacing: root.spacing + visible: !root.joinCommunity && !!root.moderateHoldings + introText: qsTr("To moderate in the %1 channel you need to hold").arg(root.channelName) + model: root.moderateHoldings + } + + StatusButton { + Layout.alignment: Qt.AlignHCenter + visible: !root.isJoinRequestRejected + text: root.isInvitationPending ? d.getInvitationPendingText() : d.getRevealAddressText() + font.pixelSize: 13 + enabled: root.requirementsMet + onClicked: root.isInvitationPending ? root.invitationPendingClicked() : root.revealAddressClicked() + } + + StatusBaseText { + Layout.alignment: Qt.AlignHCenter + visible: root.isJoinRequestRejected || !root.requirementsMet + text: root.isJoinRequestRejected ? d.memberchipRequestRejectedText : + (root.joinCommunity ? d.communityRequirementsNotMetText : d.channelRequirementsNotMetText) + color: Theme.palette.dangerColor1 + } + } +} + diff --git a/ui/app/AppLayouts/Chat/panels/communities/qmldir b/ui/app/AppLayouts/Chat/panels/communities/qmldir index f435be986b..5c04081be8 100644 --- a/ui/app/AppLayouts/Chat/panels/communities/qmldir +++ b/ui/app/AppLayouts/Chat/panels/communities/qmldir @@ -4,3 +4,4 @@ CommunityProfilePopupInviteMessagePanel 1.0 CommunityProfilePopupInviteMessagePa PermissionQualificationPanel 1.0 PermissionQualificationPanel.qml PermissionConflictWarningPanel 1.0 PermissionConflictWarningPanel.qml CommunityColumnHeaderPanel 1.0 CommunityColumnHeaderPanel.qml +JoinPermissionsOverlayPanel 1.0 JoinPermissionsOverlayPanel.qml