diff --git a/ui/app/AppLayouts/CommunitiesPortal/CommunitiesPortalLayout.qml b/ui/app/AppLayouts/CommunitiesPortal/CommunitiesPortalLayout.qml index 54201bad49..ce6a98e867 100644 --- a/ui/app/AppLayouts/CommunitiesPortal/CommunitiesPortalLayout.qml +++ b/ui/app/AppLayouts/CommunitiesPortal/CommunitiesPortalLayout.qml @@ -98,7 +98,7 @@ StatusSectionLayout { spacing: 18 StatusBaseText { - text: qsTr("Find community") + text: qsTr("Discover Communities") font.weight: Font.Bold font.pixelSize: d.titlePixelSize color: Theme.palette.directColor1 diff --git a/ui/app/AppLayouts/Profile/views/CommunitiesView.qml b/ui/app/AppLayouts/Profile/views/CommunitiesView.qml index 11dc2b0350..8b06c0de42 100644 --- a/ui/app/AppLayouts/Profile/views/CommunitiesView.qml +++ b/ui/app/AppLayouts/Profile/views/CommunitiesView.qml @@ -13,6 +13,8 @@ import shared.panels 1.0 import shared.status 1.0 import shared.popups 1.0 +import SortFilterProxyModel 0.2 + import "../panels" import "../../Chat/popups/community" @@ -27,6 +29,7 @@ SettingsContentBase { titleRowComponentLoader.sourceComponent: StatusButton { text: qsTr("Import community") + size: StatusBaseButton.Size.Small onClicked: { Global.openPopup(importCommunitiesPopupComponent) } @@ -34,11 +37,55 @@ SettingsContentBase { Item { id: rootItem - width: root.contentWidth height: childrenRect.height + width: root.contentWidth + + ColumnLayout { + id: noCommunitiesLayout + anchors.fill: parent + visible: communitiesList.count === 0 + Layout.alignment: Qt.AlignHCenter | Qt.AlignTop + + Image { + source: Style.png("settings/communities") + mipmap: true + Layout.alignment: Qt.AlignHCenter | Qt.AlignTop + Layout.preferredWidth: 434 + Layout.preferredHeight: 213 + Layout.topMargin: 18 + } + + StatusBaseText { + text: qsTr("Discover your Communities") + color: Theme.palette.directColor1 + wrapMode: Text.WordWrap + font.weight: Font.Bold + font.pixelSize: 17 + Layout.topMargin: 35 + + Layout.alignment: Qt.AlignHCenter | Qt.AlignTop + } + + StatusBaseText { + text: qsTr("Explore and see what communities are trending") + color: Theme.palette.baseColor1 + wrapMode: Text.WordWrap + font.pixelSize: 15 + Layout.topMargin: 8 + Layout.alignment: Qt.AlignHCenter | Qt.AlignTop + } + + StatusButton { + text: qsTr("Discover") + Layout.topMargin: 16 + Layout.alignment: Qt.AlignHCenter | Qt.AlignTop + onClicked: Global.changeAppSectionBySectionType(Constants.appSection.communitiesPortal) + } + } Column { id: rootLayout + visible: !noCommunitiesLayout.visible width: parent.width anchors.top: parent.top anchors.left: parent.left @@ -52,8 +99,20 @@ SettingsContentBase { } CommunitiesListPanel { + id: communitiesList width: parent.width - model: root.profileSectionStore.communitiesList + + model: SortFilterProxyModel { + id: filteredModel + + sourceModel: root.profileSectionStore.communitiesList + filters: [ + ValueFilter { + roleName: "joined" + value: true + } + ] + } onLeaveCommunityClicked: { root.profileSectionStore.communitiesProfileModule.leaveCommunity(communityId) diff --git a/ui/app/AppLayouts/Profile/views/SettingsContentBase.qml b/ui/app/AppLayouts/Profile/views/SettingsContentBase.qml index f6669e176c..fdfd6fdb90 100644 --- a/ui/app/AppLayouts/Profile/views/SettingsContentBase.qml +++ b/ui/app/AppLayouts/Profile/views/SettingsContentBase.qml @@ -101,6 +101,7 @@ Item { onClicked: root.baseAreaClicked() width: contentWrapper.implicitWidth height: contentWrapper.implicitHeight + hoverEnabled: true Column { id: contentWrapper diff --git a/ui/imports/assets/png/settings/communities.png b/ui/imports/assets/png/settings/communities.png new file mode 100644 index 0000000000..125fdd8b6c Binary files /dev/null and b/ui/imports/assets/png/settings/communities.png differ diff --git a/ui/imports/assets/png/settings/communities@2x.png b/ui/imports/assets/png/settings/communities@2x.png new file mode 100644 index 0000000000..61429223a6 Binary files /dev/null and b/ui/imports/assets/png/settings/communities@2x.png differ