fix(@desktop/settings): empty screen when having 0 communities joined in Profile

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

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)

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