diff --git a/ui/app/AppLayouts/Chat/ChatLayout.qml b/ui/app/AppLayouts/Chat/ChatLayout.qml
index 08619fc518..55b54b5ea7 100644
--- a/ui/app/AppLayouts/Chat/ChatLayout.qml
+++ b/ui/app/AppLayouts/Chat/ChatLayout.qml
@@ -33,6 +33,7 @@ StackLayout {
sourceComponent: CommunitySettingsView {
rootStore: root.rootStore
+ hasAddedContacts: root.contactsStore.myContactsModel.count > 0
chatCommunitySectionModule: root.rootStore.chatCommunitySectionModule
community: root.rootStore.mainModuleInst ? root.rootStore.mainModuleInst.activeSection
|| {} : {}
diff --git a/ui/app/AppLayouts/Chat/panels/communities/CommunityBanner.qml b/ui/app/AppLayouts/Chat/panels/communities/CommunityBanner.qml
new file mode 100644
index 0000000000..8d6b9feffa
--- /dev/null
+++ b/ui/app/AppLayouts/Chat/panels/communities/CommunityBanner.qml
@@ -0,0 +1,80 @@
+import QtQuick 2.13
+import QtQuick.Controls 2.13
+import QtGraphicalEffects 1.13
+
+import StatusQ.Core 0.1
+import StatusQ.Core.Theme 0.1
+import StatusQ.Controls 0.1 as StatusQControls
+
+import shared.panels 1.0
+import shared.status 1.0
+
+import utils 1.0
+
+Rectangle {
+ id: root
+
+ property alias text: bannerText.text
+ property alias buttonText: bannerButton.text
+ property alias icon: bannerIcon.source
+
+
+ implicitWidth: 272
+ implicitHeight: 182
+ border.color: Style.current.border
+ radius: 16
+ color: Style.current.transparent
+
+ signal buttonClicked()
+
+ MouseArea {
+ anchors.fill: parent
+ acceptedButtons: Qt.RightButton
+ propagateComposedEvents: true
+ onClicked: {
+ /* Prevents sending events to the component beneath
+ if Right Mouse Button is clicked. */
+ mouse.accepted = false;
+ }
+ }
+
+ Rectangle {
+ width: 70
+ height: 4
+ color: Style.current.background
+ anchors.top: parent.top
+ anchors.topMargin: -2
+ anchors.horizontalCenter: parent.horizontalCenter
+ }
+
+ SVGImage {
+ id: bannerIcon
+ anchors.top: parent.top
+ anchors.topMargin: -6
+ anchors.horizontalCenter: parent.horizontalCenter
+ width: 66
+ height: 50
+ }
+
+ StatusBaseText {
+ id: bannerText
+ anchors.top: parent.top
+ anchors.topMargin: 60
+ horizontalAlignment: Text.AlignHCenter
+ font.pixelSize: 15
+ color: Theme.palette.directColor1
+ wrapMode: Text.WordWrap
+ anchors.right: parent.right
+ anchors.rightMargin: Style.current.xlPadding
+ anchors.left: parent.left
+ anchors.leftMargin: Style.current.xlPadding
+ }
+
+ StatusQControls.StatusButton {
+ id: bannerButton
+ anchors.horizontalCenter: parent.horizontalCenter
+ anchors.bottom: parent.bottom
+ anchors.bottomMargin: 22
+ onClicked: root.buttonClicked()
+ }
+}
diff --git a/ui/app/AppLayouts/Chat/panels/communities/CommunityOverviewSettingsPanel.qml b/ui/app/AppLayouts/Chat/panels/communities/CommunityOverviewSettingsPanel.qml
index 8db58f62c8..b02b7a3b4e 100644
--- a/ui/app/AppLayouts/Chat/panels/communities/CommunityOverviewSettingsPanel.qml
+++ b/ui/app/AppLayouts/Chat/panels/communities/CommunityOverviewSettingsPanel.qml
@@ -1,4 +1,4 @@
-import QtQuick 2.14
+import QtQuick 2.14
import QtQuick.Layouts 1.14
import QtQuick.Controls 2.14
@@ -9,9 +9,12 @@ import StatusQ.Components 0.1
import "../../layouts"
+import utils 1.0
+
StackLayout {
id: root
+ property string communityId
property string name
property string description
property string introMessage
@@ -30,6 +33,10 @@ StackLayout {
signal edited(Item item) // item containing edited fields (name, description, logoImagePath, color, options, etc..)
+ signal inviteNewPeopleClicked
+ signal airdropTokensClicked
+ signal backUpClicked
+
clip: true
SettingsPageLayout {
@@ -119,6 +126,35 @@ StackLayout {
Item {
Layout.fillHeight: true
}
+
+ RowLayout {
+ CommunityBanner {
+ text: qsTr("Welcome to your community!")
+ buttonText: qsTr("Invite new people")
+ icon: Style.svg("chatEmptyHeader")
+ onButtonClicked: root.inviteNewPeopleClicked()
+ }
+ Item {
+ Layout.fillWidth: true
+ }
+ CommunityBanner {
+ text: qsTr("Try an airdrop to reward your community for engagement!")
+ buttonText: qsTr("Airdrop Tokens")
+ icon: Style.svg("communities/airdrop")
+ onButtonClicked: root.airdropTokensClicked()
+ }
+
+ Item {
+ Layout.fillWidth: true
+ }
+
+ CommunityBanner {
+ text: qsTr("Back up community key")
+ buttonText: qsTr("Back up")
+ icon: Style.svg("communities/backup-community")
+ onButtonClicked: root.backUpClicked()
+ }
+ }
}
}
diff --git a/ui/app/AppLayouts/Chat/views/CommunitySettingsView.qml b/ui/app/AppLayouts/Chat/views/CommunitySettingsView.qml
index ff788b1b8a..d06465ebf8 100644
--- a/ui/app/AppLayouts/Chat/views/CommunitySettingsView.qml
+++ b/ui/app/AppLayouts/Chat/views/CommunitySettingsView.qml
@@ -16,6 +16,7 @@ import StatusQ.Controls 0.1
import StatusQ.Controls.Validators 0.1
import "../panels/communities"
+import "../popups/community"
import "../layouts"
StatusAppTwoPanelLayout {
@@ -34,6 +35,7 @@ StatusAppTwoPanelLayout {
property var rootStore
property var community
property var chatCommunitySectionModule
+ property bool hasAddedContacts: false
signal backToCommunityClicked
signal openLegacyPopupClicked // TODO: remove me when migration to new settings is done
@@ -114,6 +116,7 @@ StatusAppTwoPanelLayout {
currentIndex: d.currentIndex
CommunityOverviewSettingsPanel {
+ communityId: root.community.id
name: root.community.name
description: root.community.description
introMessage: root.community.introMessage
@@ -146,6 +149,22 @@ StatusAppTwoPanelLayout {
errorDialog.open()
}
}
+
+ onInviteNewPeopleClicked: {
+ Global.openPopup(inviteFriendsToCommunityPopup, {
+ community: root.community,
+ hasAddedContacts: root.hasAddedContacts,
+ communitySectionModule: root.chatCommunitySectionModule
+ })
+ }
+
+ onAirdropTokensClicked: { /* TODO in future */ }
+ onBackUpClicked: {
+ Global.openPopup(transferOwnershipPopup, {
+ privateKey: root.chatCommunitySectionModule.exportCommunity(root.communityId),
+ store: root.store
+ })
+ }
}
CommunityMembersSettingsPanel {
@@ -199,4 +218,28 @@ StatusAppTwoPanelLayout {
icon: StandardIcon.Critical
standardButtons: StandardButton.Ok
}
+
+ Component {
+ id: transferOwnershipPopup
+ TransferOwnershipPopup {
+ anchors.centerIn: parent
+ }
+ }
+
+ Component {
+ id: inviteFriendsToCommunityPopup
+ InviteFriendsToCommunityPopup {
+ anchors.centerIn: parent
+ rootStore: root.rootStore
+ contactsStore: root.rootStore.contactStore
+ onClosed: {
+ destroy()
+ }
+
+ onSendInvites: {
+ const error = root.communitySectionModule.inviteUsersToCommunity(JSON.stringify(pubKeys))
+ processInviteResult(error)
+ }
+ }
+ }
}
diff --git a/ui/imports/assets/icons/communities/airdrop.svg b/ui/imports/assets/icons/communities/airdrop.svg
new file mode 100644
index 0000000000..07866fa968
--- /dev/null
+++ b/ui/imports/assets/icons/communities/airdrop.svg
@@ -0,0 +1,4 @@
+
diff --git a/ui/imports/assets/icons/communities/backup-community.svg b/ui/imports/assets/icons/communities/backup-community.svg
new file mode 100644
index 0000000000..ab6559c692
--- /dev/null
+++ b/ui/imports/assets/icons/communities/backup-community.svg
@@ -0,0 +1,5 @@
+