From 3cc62d65aa8539df554398faf85ab83c9a1ddc7a Mon Sep 17 00:00:00 2001 From: Jonathan Rainville Date: Thu, 11 Feb 2021 14:06:39 -0500 Subject: [PATCH] feat: show membership requests in the admin popup --- ui/app/AppLayouts/Chat/CommunityColumn.qml | 63 ++---------- .../CommunityMembersPopup.qml | 34 ++++++- .../CommunityPopupButton.qml | 3 +- .../CommunityProfilePopup.qml | 95 ++++++++++++------- .../MembershipRequestsButton.qml | 67 +++++++++++++ .../MembershipRequestsPopup.qml | 1 + ui/nim-status-client.pro | 2 + 7 files changed, 169 insertions(+), 96 deletions(-) create mode 100644 ui/app/AppLayouts/Chat/CommunityComponents/MembershipRequestsButton.qml diff --git a/ui/app/AppLayouts/Chat/CommunityColumn.qml b/ui/app/AppLayouts/Chat/CommunityColumn.qml index eaf5f58f15..557f1f5620 100644 --- a/ui/app/AppLayouts/Chat/CommunityColumn.qml +++ b/ui/app/AppLayouts/Chat/CommunityColumn.qml @@ -87,64 +87,15 @@ Item { } } - Rectangle { - property int nbRequests: chatsModel.activeCommunity.communityMembershipRequests.nbRequests - - id: membershipRequestsBtn - visible: nbRequests > 0 + Loader { + id: membershipRequestsLoader width: parent.width - height: visible ? 52 : 0 - color: Style.current.secondaryBackground + active: chatsModel.activeCommunity.admin anchors.top: communityHeader.bottom - anchors.topMargin: visible ? Style.current.halfPadding : 0 + anchors.topMargin: item && item.visible ? Style.current.halfPadding : 0 - StyledText { - text: qsTr("Membership requests") - font.pixelSize: 15 - anchors.left: parent.left - anchors.leftMargin: Style.current.padding - anchors.verticalCenter: parent.verticalCenter - } - - Rectangle { - id: badge - anchors.right: caret.left - anchors.rightMargin: Style.current.padding - anchors.verticalCenter: parent.verticalCenter - color: Style.current.blue - width: 22 - height: 22 - radius: width / 2 - Text { - font.pixelSize: 12 - color: Style.current.white - anchors.centerIn: parent - text: membershipRequestsBtn.nbRequests.toString() - } - } - - SVGImage { - id: caret - source: "../../img/caret.svg" - fillMode: Image.PreserveAspectFit - rotation: -90 - anchors.right: parent.right - anchors.rightMargin: Style.current.padding - anchors.verticalCenter: parent.verticalCenter - width: 13 - - - ColorOverlay { - anchors.fill: parent - source: parent - color: Style.current.darkGrey - } - } - - MouseArea { - anchors.fill: parent - cursorShape: Qt.PointingHandCursor - onClicked: membershipRequestPopup.open() + sourceComponent: Component { + MembershipRequestsButton {} } } @@ -154,7 +105,7 @@ Item { ScrollView { id: chatGroupsContainer - anchors.top: membershipRequestsBtn.bottom + anchors.top: membershipRequestsLoader.bottom anchors.topMargin: Style.current.padding anchors.bottom: parent.bottom anchors.left: parent.left diff --git a/ui/app/AppLayouts/Chat/CommunityComponents/CommunityMembersPopup.qml b/ui/app/AppLayouts/Chat/CommunityComponents/CommunityMembersPopup.qml index d8548b3817..9495778463 100644 --- a/ui/app/AppLayouts/Chat/CommunityComponents/CommunityMembersPopup.qml +++ b/ui/app/AppLayouts/Chat/CommunityComponents/CommunityMembersPopup.qml @@ -28,6 +28,7 @@ ModalPopup { } StyledText { + id: nbMembersText text: community.nbMembers.toString() width: 160 anchors.left: parent.left @@ -36,6 +37,11 @@ ModalPopup { font.pixelSize: 14 color: Style.current.darkGrey } + + Separator { + anchors.top: nbMembersText.bottom + anchors.topMargin: Style.current.padding + } } CommunityPopupButton { @@ -61,13 +67,35 @@ ModalPopup { anchors.right: parent.right anchors.top: inviteBtn.bottom anchors.topMargin: Style.current.smallPadding - anchors.leftMargin: -Style.current.padding - anchors.rightMargin: -Style.current.padding + anchors.leftMargin: -Style.current.xlPadding + anchors.rightMargin: -Style.current.xlPadding } + MembershipRequestsButton { + id: membershipRequestsBtn + anchors.top: sep.bottom + anchors.topMargin: visible ? Style.current.smallPadding : 0 + anchors.left: parent.left + anchors.right: parent.right + anchors.leftMargin: -Style.current.xlPadding + anchors.rightMargin: -Style.current.xlPadding + } + + Separator { + id: sep2 + visible: membershipRequestsBtn.visible + anchors.left: parent.left + anchors.right: parent.right + anchors.top: membershipRequestsBtn.bottom + anchors.topMargin: Style.current.smallPadding + anchors.leftMargin: -Style.current.xlPadding + anchors.rightMargin: -Style.current.xlPadding + } + + ListView { id: memberList - anchors.top: sep.bottom + anchors.top: sep2.visible ? sep2.bottom : sep.bottom anchors.topMargin: Style.current.smallPadding anchors.bottom: popup.bottom anchors.left: parent.left diff --git a/ui/app/AppLayouts/Chat/CommunityComponents/CommunityPopupButton.qml b/ui/app/AppLayouts/Chat/CommunityComponents/CommunityPopupButton.qml index a3496c9854..ee65dcd705 100644 --- a/ui/app/AppLayouts/Chat/CommunityComponents/CommunityPopupButton.qml +++ b/ui/app/AppLayouts/Chat/CommunityComponents/CommunityPopupButton.qml @@ -10,7 +10,6 @@ Item { id: root width: contentItem.width height: contentItem.height - default property alias actionContent: placeholder.data signal clicked() @@ -55,4 +54,4 @@ Item { cursorShape: Qt.PointingHandCursor onClicked: root.clicked() } -} \ No newline at end of file +} diff --git a/ui/app/AppLayouts/Chat/CommunityComponents/CommunityProfilePopup.qml b/ui/app/AppLayouts/Chat/CommunityComponents/CommunityProfilePopup.qml index df7404a0b6..b0d2928db2 100644 --- a/ui/app/AppLayouts/Chat/CommunityComponents/CommunityProfilePopup.qml +++ b/ui/app/AppLayouts/Chat/CommunityComponents/CommunityProfilePopup.qml @@ -116,46 +116,71 @@ ModalPopup { Loader { active: isAdmin width: parent.width - sourceComponent: CommunityPopupButton { - //% "Members" - label: qsTrId("members-title") - iconName: "members" - txtColor: Style.current.textColor - onClicked: openPopup(communityMembersPopup) - Component { - id: communityMembersPopup - CommunityMembersPopup { } - } - Item { - anchors.top: parent.top - anchors.right: parent.right - anchors.rightMargin: 0 - width: 100 - StyledText { - text: nbMembers.toString() - anchors.right: caret.left - anchors.rightMargin: Style.current.smallPadding - anchors.top: parent.top - anchors.topMargin: 10 - padding: 0 - font.pixelSize: 15 - color: Style.current.secondaryText + sourceComponent: Component { + CommunityPopupButton { + id: memberBtn + label: qsTr("Members") + iconName: "members" + txtColor: Style.current.textColor + onClicked: openPopup(communityMembersPopup) + + Component { + id: communityMembersPopup + CommunityMembersPopup {} } - SVGImage { - id: caret - anchors.right: parent.right - anchors.topMargin: Style.current.padding + Item { + property int nbRequests: chatsModel.activeCommunity.communityMembershipRequests.nbRequests + + id: memberBlock anchors.top: parent.top - source: "../../../img/caret.svg" - width: 13 - height: 7 - rotation: -90 - ColorOverlay { - anchors.fill: parent - source: parent + anchors.right: parent.right + anchors.rightMargin: 0 + width: childrenRect.width + height: memberBtn.height + + StyledText { + id: nbMemberText + text: nbMembers.toString() + anchors.verticalCenter: parent.verticalCenter + padding: 0 + font.pixelSize: 15 color: Style.current.secondaryText } + + Rectangle { + id: badge + visible: memberBlock.nbRequests > 0 + anchors.left: nbMemberText.right + anchors.leftMargin: visible ? Style.current.halfPadding : 0 + anchors.verticalCenter: parent.verticalCenter + color: Style.current.blue + width: visible ? 22 : 0 + height: 22 + radius: width / 2 + Text { + font.pixelSize: 12 + color: Style.current.white + anchors.centerIn: parent + text: memberBlock.nbRequests + } + } + + SVGImage { + id: caret + anchors.left: badge.right + anchors.leftMargin: Style.current.padding + anchors.verticalCenter: parent.verticalCenter + source: "../../../img/caret.svg" + width: 13 + height: 7 + rotation: -90 + ColorOverlay { + anchors.fill: parent + source: parent + color: Style.current.secondaryText + } + } } } } diff --git a/ui/app/AppLayouts/Chat/CommunityComponents/MembershipRequestsButton.qml b/ui/app/AppLayouts/Chat/CommunityComponents/MembershipRequestsButton.qml new file mode 100644 index 0000000000..d96c51cb7e --- /dev/null +++ b/ui/app/AppLayouts/Chat/CommunityComponents/MembershipRequestsButton.qml @@ -0,0 +1,67 @@ +import QtQuick 2.13 +import QtQuick.Controls 2.13 +import QtQuick.Layouts 1.13 +import QtGraphicalEffects 1.13 +import "../../../../shared" +import "../../../../imports" +import "../components" +import "./" + +Rectangle { + property int nbRequests: chatsModel.activeCommunity.communityMembershipRequests.nbRequests + + id: membershipRequestsBtn + visible: nbRequests > 0 + width: parent.width + height: visible ? 52 : 0 + color: Style.current.secondaryBackground + + StyledText { + text: qsTr("Membership requests") + font.pixelSize: 15 + anchors.left: parent.left + anchors.leftMargin: Style.current.padding + anchors.verticalCenter: parent.verticalCenter + } + + Rectangle { + id: badge + anchors.right: caret.left + anchors.rightMargin: Style.current.padding + anchors.verticalCenter: parent.verticalCenter + color: Style.current.blue + width: 22 + height: 22 + radius: width / 2 + Text { + font.pixelSize: 12 + color: Style.current.white + anchors.centerIn: parent + text: membershipRequestsBtn.nbRequests.toString() + } + } + + SVGImage { + id: caret + source: "../../../img/caret.svg" + fillMode: Image.PreserveAspectFit + rotation: -90 + anchors.right: parent.right + anchors.rightMargin: Style.current.padding + anchors.verticalCenter: parent.verticalCenter + width: 13 + + + ColorOverlay { + anchors.fill: parent + source: parent + color: Style.current.darkGrey + } + } + + MouseArea { + anchors.fill: parent + cursorShape: Qt.PointingHandCursor + onClicked: membershipRequestPopup.open() + } +} diff --git a/ui/app/AppLayouts/Chat/CommunityComponents/MembershipRequestsPopup.qml b/ui/app/AppLayouts/Chat/CommunityComponents/MembershipRequestsPopup.qml index 49103985bb..72ac9fb13a 100644 --- a/ui/app/AppLayouts/Chat/CommunityComponents/MembershipRequestsPopup.qml +++ b/ui/app/AppLayouts/Chat/CommunityComponents/MembershipRequestsPopup.qml @@ -96,6 +96,7 @@ ModalPopup { StyledText { text: requestLine.displayName + elide: Text.ElideRight anchors.left: accountImage.right anchors.leftMargin: Style.current.padding anchors.right: thumbsUp.left diff --git a/ui/nim-status-client.pro b/ui/nim-status-client.pro index 3cde22aceb..8f6b843720 100644 --- a/ui/nim-status-client.pro +++ b/ui/nim-status-client.pro @@ -130,6 +130,7 @@ DISTFILES += \ app/AppLayouts/Chat/CommunityComponents/CommunityButton.qml \ app/AppLayouts/Chat/CommunityComponents/CommunityDetailPopup.qml \ app/AppLayouts/Chat/CommunityComponents/CommunityMembersPopup.qml \ + app/AppLayouts/Chat/CommunityComponents/CommunityProfilePopup.qml \ app/AppLayouts/Chat/CommunityComponents/CommunityList.qml \ app/AppLayouts/Chat/CommunityComponents/CommunityWelcomeBanner.qml \ app/AppLayouts/Chat/CommunityComponents/CreateChannelPopup.qml \ @@ -137,6 +138,7 @@ DISTFILES += \ app/AppLayouts/Chat/CommunityComponents/ImportCommunityPopup.qml \ app/AppLayouts/Chat/CommunityComponents/InviteFriendsToCommunityPopup.qml \ app/AppLayouts/Chat/CommunityComponents/MembershipRadioButton.qml \ + app/AppLayouts/Chat/CommunityComponents/MembershipRequestsButton.qml \ app/AppLayouts/Chat/CommunityComponents/MembershipRequestsPopup.qml \ app/AppLayouts/Chat/CommunityComponents/MembershipRequirementPopup.qml \ app/AppLayouts/Chat/ContactsColumn/AddChat.qml \