feat(community): add option to see community rules

Fixes #16826 Adds the option to see the community rules in the community context menu on the left. Also adapts a few things according to designs
status-im · Jan 3, 2025 · 04a9a3b · 04a9a3b
1 parent 751f274
commit 04a9a3b
Show file tree

Hide file tree

Showing 4 changed files with 78 additions and 2 deletions.
diff --git a/ui/app/AppLayouts/Communities/popups/CommunityRulesPopup.qml b/ui/app/AppLayouts/Communities/popups/CommunityRulesPopup.qml
@@ -0,0 +1,57 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+
+import StatusQ 0.1
+import StatusQ.Core 0.1
+import StatusQ.Components 0.1
+import StatusQ.Controls 0.1
+import StatusQ.Popups 0.1
+
+import utils 1.0
+
+import AppLayouts.Communities.panels 1.0
+
+StatusModal {
+    id: root
+
+    property var community
+
+    headerSettings.title: qsTr("%1 community rules").arg(community.name)
+
+    contentItem: StatusScrollView {
+        id: scrollView
+        contentWidth: availableWidth
+
+        ColumnLayout {
+            width: scrollView.availableWidth
+            spacing: 24
+
+            StatusSmartIdenticon {
+                Layout.alignment: Qt.AlignHCenter
+                name: asset.isImage ? "" : community.name
+                asset.isImage: community.image !== ""
+                asset.name: community.image
+                asset.isLetterIdenticon: !asset.isImage
+                asset.color: community.color
+                asset.charactersLen: 1
+                asset.useAcronymForLetterIdenticon: false
+                asset.width: 64
+                asset.height: 64
+            }
+
+            StatusBaseText {
+                text: community.introMessage
+                Layout.fillWidth: true
+                Layout.fillHeight: true
+                wrapMode: Text.WordWrap
+            }
+        }
+    }
+
+    rightButtons: [
+        StatusButton {
+            text: qsTr("Done")
+            onClicked: root.close()
+        }
+    ]
+}
diff --git a/ui/app/AppLayouts/Communities/popups/qmldir b/ui/app/AppLayouts/Communities/popups/qmldir
@@ -1,6 +1,7 @@
 AlertPopup 1.0 AlertPopup.qml
 BurnTokensPopup 1.0 BurnTokensPopup.qml
 CommunityProfilePopup 1.0 CommunityProfilePopup.qml
+CommunityRulesPopup 1.0 CommunityRulesPopup.qml
 CreateCategoryPopup 1.0 CreateCategoryPopup.qml
 CreateChannelPopup 1.0 CreateChannelPopup.qml
 CreateCommunityPopup 1.0 CreateCommunityPopup.qml

diff --git a/ui/app/mainui/AppMain.qml b/ui/app/mainui/AppMain.qml
@@ -994,11 +994,17 @@ Item {
                         }
 
                         StatusAction {
-                            text: qsTr("View Community")
-                            icon.name: "group-chat"
+                            text: qsTr("Community Info")
+                            icon.name: "info"
                             onTriggered: popups.openCommunityProfilePopup(appMain.rootStore, model, communityContextMenu.chatCommunitySectionModule)
                         }
 
+                        StatusAction {
+                            text: qsTr("Community Rules")
+                            icon.name: "text"
+                            onTriggered: popups.openCommunityRulesPopup(model)
+                        }
+
                         StatusMenuSeparator {}
 
                         MuteChatMenuItem {

diff --git a/ui/app/mainui/Popups.qml b/ui/app/mainui/Popups.qml
@@ -206,6 +206,10 @@ QtObject {
         openPopup(communityProfilePopup, { store: store, community: community, communitySectionModule: communitySectionModule})
     }
 
+    function openCommunityRulesPopup(community) {
+        openPopup(communityRulesPopup, { community: community})
+    }
+
     function openMarkAsIDVerifiedPopup(publicKey, cb) {
         const contactDetails = Utils.getContactDetailsAsJson(
                                  publicKey, true, true, true)
@@ -631,6 +635,14 @@ QtObject {
             }
         },
 
+        Component {
+            id: communityRulesPopup
+
+            CommunityRulesPopup {
+                onClosed: destroy()
+            }
+        },
+
         Component {
             id: pinnedMessagesPopup