diff --git a/storybook/figma.json b/storybook/figma.json index cbf323fa33..1e56576904 100644 --- a/storybook/figma.json +++ b/storybook/figma.json @@ -91,6 +91,9 @@ "EditSettingsPanel": [ "https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba⎜Desktop?node-id=3132%3A383870&mode=dev" ], + "EnableShardingPopup": [ + "https://www.figma.com/file/qHfFm7C9LwtXpfdbxssCK3/Kuba%E2%8E%9CDesktop---Communities?node-id=37239%3A184324&mode=dev" + ], "ExportControlNodePopup": [ "https://www.figma.com/file/qHfFm7C9LwtXpfdbxssCK3/Kuba%E2%8E%9CDesktop---Communities?type=design&node-id=36894-685070&mode=design&t=6k1ago8SSQ5Ip9J8-0", "https://www.figma.com/file/qHfFm7C9LwtXpfdbxssCK3/Kuba%E2%8E%9CDesktop---Communities?type=design&node-id=37275-289960&mode=design&t=6k1ago8SSQ5Ip9J8-0", @@ -138,6 +141,9 @@ "LoginView": [ "https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=1080%3A313192" ], + "ManageShardingPopup": [ + "https://www.figma.com/file/qHfFm7C9LwtXpfdbxssCK3/Kuba%E2%8E%9CDesktop---Communities?type=design&node-id=37242-186255&mode=design&t=tn8u8VaIZDDrCXN4-0" + ], "MembersDropdown": [ "https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=22647-498410", "https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=22642-497015" @@ -264,14 +270,14 @@ "https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=8159%3A416159", "https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=8159%3A416160" ], + "TransferOwnershipAlertPopup": [ + "https://www.figma.com/file/qHfFm7C9LwtXpfdbxssCK3/Kuba%E2%8E%9CDesktop---Communities?type=design&node-id=37206%3A86828&mode=design&t=coHVo1E6fHrKNNhQ-1", + "https://www.figma.com/file/qHfFm7C9LwtXpfdbxssCK3/Kuba%E2%8E%9CDesktop---Communities?type=design&node-id=37206%3A86847&mode=design&t=coHVo1E6fHrKNNhQ-1" + ], "UserAgreementPopup": [ "https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba⎜Desktop?type=design&node-id=31450-560694&t=Q4MOViPCoHsTjhs6-0" ], "UserProfileCard": [ "https://www.figma.com/file/Mr3rqxxgKJ2zMQ06UAKiWL/💬-Chat⎜Desktop?type=design&node-id=21961-655678&mode=design&t=JiMnPfMaLPWlrFK3-0" - ], - "TransferOwnershipAlertPopup": [ - "https://www.figma.com/file/qHfFm7C9LwtXpfdbxssCK3/Kuba%E2%8E%9CDesktop---Communities?type=design&node-id=37206%3A86828&mode=design&t=coHVo1E6fHrKNNhQ-1", - "https://www.figma.com/file/qHfFm7C9LwtXpfdbxssCK3/Kuba%E2%8E%9CDesktop---Communities?type=design&node-id=37206%3A86847&mode=design&t=coHVo1E6fHrKNNhQ-1" ] } diff --git a/storybook/pages/CommunityInfoEditor.qml b/storybook/pages/CommunityInfoEditor.qml index c78422d4f8..266c451d30 100644 --- a/storybook/pages/CommunityInfoEditor.qml +++ b/storybook/pages/CommunityInfoEditor.qml @@ -18,7 +18,7 @@ ColumnLayout { property bool colorVisible: false property url banner: ctrlCommunityBanner.checked ? Style.png("settings/communities@2x") : "" readonly property bool shardingEnabled: ctrlShardingEnabled.checked - readonly property int shardIndex: ctrlShardIndex.value + property alias shardIndex: ctrlShardIndex.value spacing: 24 diff --git a/storybook/pages/EditSettingsPanelPage.qml b/storybook/pages/EditSettingsPanelPage.qml index 8b89d3e781..5191e6900e 100644 --- a/storybook/pages/EditSettingsPanelPage.qml +++ b/storybook/pages/EditSettingsPanelPage.qml @@ -27,6 +27,7 @@ SplitView { communityId: "0xdeadbeef" communityShardingEnabled: communityEditor.shardingEnabled communityShardIndex: communityEditor.shardIndex + onCommunityShardIndexChanged: communityEditor.shardIndex = communityShardIndex } ScrollView { diff --git a/storybook/pages/ManageShardingPopupPage.qml b/storybook/pages/ManageShardingPopupPage.qml new file mode 100644 index 0000000000..d980b1111a --- /dev/null +++ b/storybook/pages/ManageShardingPopupPage.qml @@ -0,0 +1,55 @@ +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 + +import Storybook 1.0 + +import AppLayouts.Communities.popups 1.0 + +SplitView { + orientation: Qt.Vertical + + Logs { id: logs } + + Item { + SplitView.fillWidth: true + SplitView.fillHeight: true + + PopupBackground { + anchors.fill: parent + } + + Button { + anchors.centerIn: parent + text: "Reopen" + + onClicked: dialog.open() + } + + ManageShardingPopup { + id: dialog + + anchors.centerIn: parent + visible: true + modal: false + closePolicy: Popup.NoAutoClose + + communityName: "Foobar" + + shardIndex: 33 + pubSubTopic: '{"pubsubTopic":"/waku/2/rs/16/%1", "publicKey":"%2"}'.arg(shardIndex).arg("0xdeadbeef") + + onDisableShardingRequested: logs.logEvent("ManageShardingPopup::disableShardingRequested") + onEditShardIndexRequested: logs.logEvent("ManageShardingPopup::editShardIndexRequested") + } + } + + LogsAndControlsPanel { + SplitView.minimumHeight: 100 + SplitView.preferredHeight: 200 + + logsView.logText: logs.logText + } +} + +// category: Popups diff --git a/ui/app/AppLayouts/Communities/panels/EditSettingsPanel.qml b/ui/app/AppLayouts/Communities/panels/EditSettingsPanel.qml index f8c9c55f48..3d12004dd9 100644 --- a/ui/app/AppLayouts/Communities/panels/EditSettingsPanel.qml +++ b/ui/app/AppLayouts/Communities/panels/EditSettingsPanel.qml @@ -97,7 +97,7 @@ StatusScrollView { StatusButton { size: StatusBaseButton.Size.Small text: parent.shardingActive ? qsTr("Manage") : qsTr("Make %1 a sharded community").arg(root.name) - onClicked: Global.openPopup(enableShardingPopupCmp) // TODO manage popup + onClicked: parent.shardingActive ? Global.openPopup(manageShardingPopupCmp) : Global.openPopup(enableShardingPopupCmp) } } @@ -111,11 +111,30 @@ StatusScrollView { Component { id: enableShardingPopupCmp EnableShardingPopup { + destroyOnClose: true communityName: root.name publicKey: root.communityId - shardingInProgress: false // TODO community sharding backend: set to "true" when generating the pubSub topic - onEnableSharding: (shardIndex) => console.warn("TODO: enable community sharding for shardIndex:", shardIndex) // TODO community sharding backend - onClosed: destroy() + shardingInProgress: false // TODO community sharding backend: set to "true" when generating the pubSub topic, or migrating + onEnableSharding: { + console.warn("TODO: enable community sharding for shardIndex:", shardIndex) // TODO community sharding backend + root.communityShardIndex = shardIndex + } + } + } + + Component { + id: manageShardingPopupCmp + ManageShardingPopup { + destroyOnClose: true + communityName: root.name + shardIndex: root.communityShardIndex + pubSubTopic: '{"pubsubTopic":"/waku/2/rs/16/%1", "publicKey":"%2"}'.arg(shardIndex).arg(root.communityId) // TODO community sharding backend + onDisableShardingRequested: { + root.communityShardIndex = -1 // TODO community sharding backend + } + onEditShardIndexRequested: { + Global.openPopup(enableShardingPopupCmp, {initialShardIndex: root.communityShardIndex}) + } } } } diff --git a/ui/app/AppLayouts/Communities/popups/ManageShardingPopup.qml b/ui/app/AppLayouts/Communities/popups/ManageShardingPopup.qml new file mode 100644 index 0000000000..3501af0935 --- /dev/null +++ b/ui/app/AppLayouts/Communities/popups/ManageShardingPopup.qml @@ -0,0 +1,90 @@ +import QtQuick 2.15 +import QtQuick.Layouts 1.15 +import QtQuick.Controls 2.15 +import QtQml.Models 2.15 +import QtQml 2.15 + +import StatusQ.Core 0.1 +import StatusQ.Core.Theme 0.1 +import StatusQ.Controls 0.1 +import StatusQ.Components 0.1 +import StatusQ.Popups.Dialog 0.1 + +import shared.controls 1.0 +import shared.popups 1.0 +import utils 1.0 + +StatusDialog { + id: root + + required property string communityName + required property int shardIndex + required property string pubSubTopic + + signal disableShardingRequested() + signal editShardIndexRequested() + + title: qsTr("Manage community sharding for %1").arg(communityName) + width: 640 + + footer: StatusDialogFooter { + rightButtons: ObjectModel { + StatusFlatButton { + type: StatusBaseButton.Type.Danger + text: qsTr("Disable community sharding") + onClicked: confirmationPopup.open() + } + StatusButton { + text: qsTr("Edit shard number") + onClicked: { + root.editShardIndexRequested() + root.close() + } + } + } + } + + contentItem: ColumnLayout { + spacing: Style.current.halfPadding + StatusInput { + Layout.fillWidth: true + label: qsTr("Shard number") + input.edit.readOnly: true + text: root.shardIndex + } + + StatusInput { + Layout.fillWidth: true + minimumHeight: 88 + maximumHeight: 88 + multiline: true + input.edit.readOnly: true + label: qsTr("Pub/Sub topic") + text: root.pubSubTopic + + CopyButton { + anchors.right: parent.right + anchors.top: parent.top + anchors.rightMargin: 12 + anchors.topMargin: (parent.height - parent.input.height) + 12 + textToCopy: parent.text + } + } + } + + ConfirmationDialog { + id: confirmationPopup + anchors.centerIn: parent + headerSettings.title: qsTr("Are you sure you want to disable sharding?") + showCancelButton: true + cancelBtnType: "" + confirmationText: qsTr("Are you sure you want to disable community sharding? Your community will automatically revert to using the general shared Waku network.") + confirmButtonLabel: qsTr("Disable community sharding") + onCancelButtonClicked: close() + onConfirmButtonClicked: { + close() + root.disableShardingRequested() + root.close() + } + } +} diff --git a/ui/app/AppLayouts/Communities/popups/qmldir b/ui/app/AppLayouts/Communities/popups/qmldir index f964ec707f..b414a7571a 100644 --- a/ui/app/AppLayouts/Communities/popups/qmldir +++ b/ui/app/AppLayouts/Communities/popups/qmldir @@ -12,6 +12,7 @@ ImportControlNodePopup 1.0 ImportControlNodePopup.qml InDropdown 1.0 InDropdown.qml InviteFriendsToCommunityPopup 1.0 InviteFriendsToCommunityPopup.qml KickBanPopup 1.0 KickBanPopup.qml +ManageShardingPopup 1.0 ManageShardingPopup.qml MembersDropdown 1.0 MembersDropdown.qml PermissionsDropdown 1.0 PermissionsDropdown.qml RecipientTypeSelectionDropdown 1.0 RecipientTypeSelectionDropdown.qml