feat(Communities): changes in import popup for private keys

Closes #11245
2023-07-31 18:56:00 +03:00 · 2023-07-31 18:56:00 +03:00 · a36f0d8ce8
parent 8410e36f24
commit a36f0d8ce8
10 changed files with 231 additions and 67 deletions
--- a/ui/StatusQ/doc/src/images/status_warning_box.png
+++ b/ui/StatusQ/doc/src/images/status_warning_box.png
--- a/ui/StatusQ/src/StatusQ/Controls/StatusWarningBox.qml
+++ b/ui/StatusQ/src/StatusQ/Controls/StatusWarningBox.qml
@ -0,0 +1,111 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Controls 2.15
+import StatusQ.Core 0.1
+import StatusQ.Core.Theme 0.1
+
+/*!
+      \qmltype StatusWarningBox
+      \inherits Control
+      \inqmlmodule StatusQ.Controls
+      \since StatusQ.Controls 0.1
+      \brief Displays a customizable WarningBox component.
+      Inherits \l{https://doc.qt.io/qt-5/qml-qtquick-controls2-control.html}{Item}.
+
+      The \c StatusWarningBox displays an customizable WarningBox for users to show an icon and text.
+      For example:
+
+      \qml
+      StatusWarningBox {
+          icon: "caution"
+          text: qsTr("Warning!")
+          bgColor: Theme.palette.warningColor1
+      }
+      \endqml
+
+      \image status_warning_box.png
+
+      For a list of components available see StatusQ.
+*/
+
+Control {
+    id: root
+    implicitWidth: 614
+    implicitHeight: rowContent.height
+
+    /*!
+        \qmlproperty alias StatusWarningBox::text
+        This property holds a reference to the StatusBaseText component's text property and displays the
+        warning text.
+    */
+    property alias text: warningText.text
+    /*!
+        \qmlproperty string StatusWarningBox::icon
+        This property sets the StatusWarningBox icon.
+    */
+    property string icon
+    /*!
+        \qmlproperty string StatusWarningBox::iconColor
+        This property sets the StatusWarningBox icon color.
+    */
+    property string iconColor: "transparent"
+    /*!
+        \qmlproperty string StatusWarningBox::bgColor
+        This property sets the StatusWarningBox background color.
+    */
+    property string bgColor: "transparent"
+    /*!
+        \qmlproperty string StatusWarningBox::borderColor
+        This property sets the StatusWarningBox border color.
+    */
+    property string borderColor: Theme.palette.warningColor1
+    /*!
+        \qmlproperty string StatusWarningBox::textColor
+        This property sets the StatusWarningBox text color.
+    */
+    property string textColor: Theme.palette.warningColor1
+
+    background: Rectangle {
+        radius: 8
+        opacity: 0.5
+        border.color: root.borderColor
+        color: "transparent"
+        Rectangle {
+            anchors.fill: parent
+            color: root.bgColor
+            radius: 8
+            opacity: 0.2
+        }
+    }
+
+    contentItem: Item {
+        id: rowContent
+        width: parent.width
+        height: (row.height+32)//xlPadding
+        RowLayout {
+            id: row
+            anchors.left: parent.left
+            anchors.right: parent.right
+            anchors.leftMargin: 16
+            anchors.rightMargin: 16
+            anchors.verticalCenter: parent.verticalCenter
+            height: warningText.contentHeight
+            spacing: 6
+            StatusIcon {
+                Layout.alignment: Qt.AlignTop
+                icon: root.icon
+                color: root.iconColor
+            }
+            StatusBaseText {
+                id: warningText
+                Layout.fillWidth: true
+                Layout.preferredHeight: contentHeight
+                wrapMode: Text.WordWrap
+                verticalAlignment: Text.AlignVCenter
+                font.pixelSize: Theme.primaryTextFontSize
+                color: root.textColor
+            }
+        }
+    }
+}
+
--- a/ui/StatusQ/src/StatusQ/Controls/qmldir
+++ b/ui/StatusQ/src/StatusQ/Controls/qmldir
@ -57,3 +57,4 @@ StatusLinkText 0.1 StatusLinkText.qml
 StatusImageSelector 0.1 StatusImageSelector.qml
 StatusColorRadioButton 0.1 StatusColorRadioButton.qml
 StatusBlockProgressBar 0.1 StatusBlockProgressBar.qml
+StatusWarningBox 0.1 StatusWarningBox.qml
--- a/ui/StatusQ/src/assets.qrc
+++ b/ui/StatusQ/src/assets.qrc
@ -10405,5 +10405,6 @@
        <file>assets/twemoji/svg/e50a.svg</file>
        <file>assets/twemoji/LICENSE</file>
        <file>assets/twemoji/twemoji.js</file>
+        <file>assets/img/icons/caution.svg</file>
    </qresource>
 </RCC>
--- a/ui/StatusQ/src/assets/img/icons/caution.svg
+++ b/ui/StatusQ/src/assets/img/icons/caution.svg
@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.2932 3.72698L20.4253 19.6542C20.5325 19.864 20.5186 20.0999 20.4194 20.2843C20.322 20.4654 20.2066 20.5 20.1321 20.5H3.86791C3.79335 20.5 3.67802 20.4654 3.58058 20.2843C3.48135 20.0999 3.46751 19.864 3.57466 19.6542L11.7068 3.72698C11.7633 3.61632 11.8243 3.56444 11.8656 3.53902C11.91 3.51174 11.956 3.5 12 3.5C12.044 3.5 12.09 3.51174 12.1344 3.53902C12.1757 3.56444 12.2367 3.61632 12.2932 3.72698ZM10.3708 3.04488C11.0821 1.65171 12.9179 1.65171 13.6292 3.04488L21.7613 18.9721C22.4543 20.3294 21.5555 22 20.1321 22H3.86791C2.44452 22 1.54567 20.3294 2.23872 18.9721L10.3708 3.04488ZM12.75 8.25C12.75 7.5 12.4142 7.5 12 7.5C11.5858 7.5 11.25 7.83579 11.25 8.25V14.25C11.25 14.6642 11.5858 15 12 15C12.4142 15 12.75 14.6642 12.75 14.25V8.25ZM13.25 17.75C13.25 18.4404 12.6904 19 12 19C11.3096 19 10.75 18.4404 10.75 17.75C10.75 17.0596 11.3096 16.5 12 16.5C12.6904 16.5 13.25 17.0596 13.25 17.75Z" fill="#F6793C"/>
+</svg>
--- a/ui/StatusQ/src/statusq.qrc
+++ b/ui/StatusQ/src/statusq.qrc
@ -224,5 +224,6 @@
        <file>StatusQ/Core/Utils/big.min.mjs</file>
        <file>StatusQ/Controls/StatusBlockProgressBar.qml</file>
        <file>StatusQ/Components/StatusInfoBoxPanel.qml</file>
+        <file>StatusQ/Controls/StatusWarningBox.qml</file>
    </qresource>
 </RCC>
--- a/ui/app/AppLayouts/Communities/stores/CommunitiesStore.qml
+++ b/ui/app/AppLayouts/Communities/stores/CommunitiesStore.qml
@ -57,7 +57,7 @@ QtObject {
    property string communityTags: communitiesModuleInst.tags

    signal importingCommunityStateChanged(string communityId, int state, string errorMsg)
-    
+
    signal communityPrivateKeyRemoved(string communityId)

    signal communityInfoAlreadyRequested()
@ -96,6 +96,10 @@ QtObject {
        root.communitiesModuleInst.importCommunity(communityKey);
    }

+    function getCommunityPublicKeyFromPrivateKey(privateKey) {
+        return root.communitiesModuleInst.getCommunityPublicKeyFromPrivateKey(privateKey);
+    }
+
    function requestCommunityInfo(communityKey, importing = false) {
        const publicKey = Utils.isCompressedPubKey(communityKey)
                            ? Utils.changeCommunityKeyCompression(communityKey)
--- a/ui/app/AppLayouts/stores/RootStore.qml
+++ b/ui/app/AppLayouts/stores/RootStore.qml
@ -4,6 +4,7 @@ import utils 1.0

 import SortFilterProxyModel 0.2
 import AppLayouts.Wallet.stores 1.0 as WalletStore
+
 import "../Profile/stores"

 QtObject {
--- a/ui/app/mainui/Popups.qml
+++ b/ui/app/mainui/Popups.qml
@ -18,6 +18,7 @@ import shared.popups 1.0
 import shared.status 1.0

 import utils 1.0
+import AppLayouts.Wallet.stores 1.0 as WalletStore

 QtObject {
    id: root
@ -518,7 +519,7 @@ QtObject {
                id: communityIntroDialog
                property string communityId
                loginType: root.rootStore.loginType
-                walletAccountsModel: root.rootStore.receiveAccounts
+                walletAccountsModel: root.rootStore.walletAccountsModel
                permissionsModel: root.rootStore.permissionsModel
                assetsModel: root.rootStore.assetsModel
                collectiblesModel: root.rootStore.collectiblesModel
--- a/ui/imports/shared/popups/ImportCommunityPopup.qml
+++ b/ui/imports/shared/popups/ImportCommunityPopup.qml
@ -23,13 +23,24 @@ StatusDialog {
    QtObject {
        id: d
        property string importErrorMessage
-        readonly property bool communityFound: (d.isPublicKey && !!d.communityDetails)
-        readonly property var communityDetails: root.store.getCommunityDetails(publicKey)
+
+        readonly property bool communityFound: (d.communityDetails !== null && !!d.communityDetails.name)
+        readonly property var communityDetails: {
+            if (isInputValid) {
+                let key = isPublicKey ? Utils.getCompressedPk(publicKey) :
+                          root.store.getCommunityPublicKeyFromPrivateKey(inputKey);
+                return root.store.getCommunityDetails(key);
+            } else {
+                return null;
+            }
+        }
+
        readonly property string inputErrorMessage: isInputValid ? "" : qsTr("Invalid key")
        readonly property string errorMessage: importErrorMessage || inputErrorMessage
        readonly property string inputKey: keyInput.text.trim()
        readonly property bool isPrivateKey: (Utils.isPrivateKey(inputKey))
        readonly property bool isPublicKey: (publicKey !== "")
+        readonly property string privateKey: inputKey
        readonly property string publicKey: {
            if (!Utils.isStatusDeepLink(inputKey)) {
                const key = Utils.dropCommunityLinkPrefix(inputKey)
@ -49,19 +60,15 @@ StatusDialog {
        rightButtons: ObjectModel {
            StatusButton {
                id: importButton
-                enabled: d.isInputValid
-                loading: (d.isPublicKey && !d.communityFound)
-                text: d.isPrivateKey ? qsTr("Make this an Owner Node")
-                                     : qsTr("Import")
+                enabled: (d.isInputValid && (d.isPrivateKey && d.communityFound ? agreeToKeepOnline.checked : true))
+                loading: (enabled && !d.communityFound)
+                text: !d.publicKey ? qsTr("Make this device the control node for %1").arg((!loading && !!d.communityDetails) ? d.communityDetails.name : "")
+                                   : qsTr("Import")
                onClicked: {
                    if (d.isPrivateKey) {
-                        const communityKey = d.inputKey
-                        if (!communityKey.startsWith("0x")) {
-                            communityKey = "0x" + communityKey;
-                        }
-                        root.store.importCommunity(communityKey);
+                        root.store.importCommunity(d.privateKey);
                        root.close();
-                    } else if (d.communityFound) {
+                    } else if (d.isPublicKey) {
                        root.joinCommunity(d.publicKey, d.communityDetails);
                    }
                }
@ -69,65 +76,99 @@ StatusDialog {
        }
    }

-    ColumnLayout {
+
+    StatusScrollView {
+        id: scrollContent
        anchors.fill: parent
-        spacing: Style.current.padding
+        anchors.leftMargin: Style.current.halfPadding
+        contentWidth: (root.width-Style.current.bigPadding-Style.current.padding)
+        padding: 0

-        StatusBaseText {
-            id: infoText1
-            Layout.fillWidth: true
-            text: qsTr("Enter the public key of the community you wish to access, or enter the private key of a community you own. Remember to always keep any private key safe and never share a private key with anyone else.")
-            wrapMode: Text.WordWrap
-            font.pixelSize: 13
-            color: Theme.palette.baseColor1
-        }
+        ColumnLayout {
+            width: (scrollContent.width-Style.current.padding)
+            spacing: Style.current.halfPadding

-        StatusBaseText {
-            id: inputLabel
-            text: qsTr("Community key")
-            color: Theme.palette.directColor1
-            font.pixelSize: 15
-        }
-
-        StatusTextArea {
-            id: keyInput
-            Layout.fillWidth: true
-            implicitHeight: 110
-            placeholderText: "0x0..."
-            wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
-            onTextChanged: d.importErrorMessage = ""
-        }
-        RowLayout {
-            Layout.fillWidth: true
-            Layout.fillHeight: true
-            StatusChatInfoButton {
-                visible: (d.communityFound && d.isPublicKey)
-                title: !!d.communityDetails.name ? d.communityDetails.name : ""
-                subTitle: !!d.communityDetails.nbMembers ? qsTr("%n member(s)", "", d.communityDetails.nbMembers) : ""
-                asset.emoji: "1f918"
-                asset.emojiSize: "24x24"
-                asset.name: !!d.communityDetails.image ? d.communityDetails.image : ""
-                asset.isImage: (asset.name !== "")
-                asset.color: !!d.communityDetails.color ? d.communityDetails.color : ""
-            }
-            Item { Layout.fillWidth: true }
            StatusBaseText {
-                id: detectionLabel
-                Layout.alignment: Qt.AlignRight
+                id: infoText1
+                Layout.fillWidth: true
+                text: qsTr("Enter the public key of the community you wish to access, or enter the private key of a community you own. Remember to always keep any private key safe and never share a private key with anyone else.")
+                wrapMode: Text.WordWrap
                font.pixelSize: 13
-                visible: keyInput.text.trim() !== ""
-                text: {
-                    if (d.errorMessage !== "") {
-                        return d.errorMessage
-                    }
-                    if (d.isPrivateKey) {
-                        return qsTr("Private key detected")
-                    }
-                    if (d.isPublicKey) {
-                        return qsTr("Public key detected")
-                    }
+                color: Theme.palette.baseColor1
+            }
+
+            StatusBaseText {
+                id: inputLabel
+                text: qsTr("Community key")
+                color: Theme.palette.directColor1
+                font.pixelSize: 15
+            }
+
+            StatusTextArea {
+                id: keyInput
+                Layout.fillWidth: true
+                implicitHeight: 108
+                placeholderText: "0x0..."
+                wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
+                onTextChanged: d.importErrorMessage = ""
+            }
+            RowLayout {
+                Layout.fillWidth: true
+                Layout.minimumHeight: 46
+                Layout.maximumHeight: 46
+                StatusChatInfoButton {
+                    visible: d.communityFound
+                    title: visible ? d.communityDetails.name : ""
+                    subTitle: visible ? qsTr("%n member(s)", "", d.communityDetails.nbMembers) : ""
+                    asset.name: visible ? d.communityDetails.image : ""
+                    asset.isImage: (asset.name !== "")
+                    asset.color: visible ? d.communityDetails.color : ""
+                }
+                Item { Layout.fillWidth: true }
+                StatusBaseText {
+                    id: detectionLabel
+                    Layout.alignment: Qt.AlignRight
+                    font.pixelSize: 13
+                    visible: keyInput.text.trim() !== ""
+                    text: {
+                        if (d.errorMessage !== "") {
+                            return d.errorMessage
+                        }
+                        if (d.isPrivateKey) {
+                            return qsTr("Private key detected")
+                        }
+                        if (d.isPublicKey) {
+                            return qsTr("Public key detected")
+                        }
+                    }
+                    color: d.errorMessage === "" ? Theme.palette.successColor1 : Theme.palette.dangerColor1
+                }
+            }
+            ColumnLayout {
+                Layout.fillWidth: true
+                Layout.fillHeight: true
+                visible: (d.communityFound && d.isPrivateKey)
+                Layout.topMargin: 12
+                spacing: Style.current.padding
+                StatusWarningBox {
+                    Layout.fillWidth: true
+                    icon: "caution"
+                    text: qsTr("Another device might currently have the control node for this Community. Running multiple control nodes will cause unforeseen issues. Make sure you delete the private key in that other device in the community management tab.")
+                    bgColor: borderColor
+                }
+                StatusDialogDivider { Layout.fillWidth: true; Layout.topMargin: Style.current.padding }
+                StatusBaseText {
+                    Layout.topMargin: Style.current.halfPadding
+                    visible: (d.communityFound && d.isPrivateKey)
+                    font.pixelSize: Style.current.primaryTextFontSize
+                    text: qsTr("I acknowledge that...")
+                }
+                StatusCheckBox {
+                    id: agreeToKeepOnline
+                    Layout.fillWidth: true
+                    font.pixelSize: Style.current.primaryTextFontSize
+                    text: qsTr("I must keep this device online and running Status for the Community to function")
                }
-                color: d.errorMessage === "" ? Theme.palette.successColor1 : Theme.palette.dangerColor1
            }
        }
    }