feat: add confirmation dialog on experimental features enabling

ui/app/AppLayouts/Profile/Sections/AdvancedContainer.qml

@@ -69,8 +69,13 @@ Item {
             text: qsTrId("wallet")
             isSwitch: true
             switchChecked: appSettings.walletEnabled
-            onClicked: function (checked) {
-                appSettings.walletEnabled = checked
+            onClicked: {
+                if (!appSettings.walletEnabled) {
+                    confirmationPopup.settingsProp = "walletEnabled"
+                    confirmationPopup.open()
+                } else {
+                    appSettings.walletEnabled = false
+                }
             }
         }
 
@@ -79,8 +84,13 @@ Item {
             text: qsTrId("dapp-browser")
             isSwitch: true
             switchChecked: appSettings.browserEnabled
-            onClicked: function (checked) {
-                appSettings.browserEnabled = checked
+            onClicked: {
+                if (!appSettings.browserEnabled) {
+                    confirmationPopup.settingsProp = "browserEnabled"
+                    confirmationPopup.open()
+                } else {
+                    appSettings.browserEnabled = false
+                }
             }
         }
 
@@ -89,8 +99,13 @@ Item {
             text: qsTrId("communities")
             isSwitch: true
             switchChecked: appSettings.communitiesEnabled
-            onClicked: function (checked) {
-                appSettings.communitiesEnabled = checked
+            onClicked: {
+                if (!appSettings.communitiesEnabled) {
+                    confirmationPopup.settingsProp = "communitiesEnabled"
+                    confirmationPopup.open()
+                } else {
+                    appSettings.communitiesEnabled = false
+                }
             }
         }
 
@@ -99,8 +114,13 @@ Item {
             text: qsTrId("node-management")
             isSwitch: true
             switchChecked: appSettings.nodeManagementEnabled
-            onClicked: function (checked) {
-                appSettings.nodeManagementEnabled = checked
+            onClicked: {
+                if (!appSettings.nodeManagementEnabled) {
+                    confirmationPopup.settingsProp = "nodeManagementEnabled"
+                    confirmationPopup.open()
+                } else {
+                    appSettings.nodeManagementEnabled = false
+                }
             }
         }
     }
@@ -113,7 +133,23 @@ Item {
         id: fleetModal
     }
 
+    ConfirmationDialog {
+        id: confirmationPopup
+        property string settingsProp: ""
+        height: 310
+        showCancelButton: true
+        confirmationText: qsTr("This feature is experimental and is meant for testing purposes by core contributors and the community. It's not meant for real use and makes no claims of security or integrity of funds or data. Use at your own risk.")
+        confirmButtonLabel: qsTr("I understand")
+        onConfirmButtonClicked: {
+            appSettings[settingsProp] = true
+            settingsProp = ""
+            close()
+        }
 
+        onCancelButtonClicked: {
+            close()
+        }
+    }
 }
 
 /*##^##

ui/shared/ConfirmationDialog.qml

@@ -10,6 +10,7 @@ ModalPopup {
 
     property Popup parentPopup
     property string btnType: "warn"
+    property bool showCancelButton: false
 
 
     height: 186
@@ -19,14 +20,18 @@ ModalPopup {
 
     //% "Confirm"
     property string confirmButtonLabel: qsTrId("close-app-button")
+    //% "Cancel"
+    property string cancelButtonLabel: qsTr("Cancel")
     //% "Are you sure you want to this?"
     property string confirmationText: qsTrId("are-you-sure-you-want-to-this-")
 
     property var value
 
     signal confirmButtonClicked()
+    signal cancelButtonClicked()
 
     StyledText {
+        id: innerText
         text: confirmationDialog.confirmationText
         font.pixelSize: 15
         anchors.left: parent.left
@@ -37,16 +42,27 @@ ModalPopup {
     footer: Item {
         id: footerContainer
         width: parent.width
-        height: children[0].height
+        height: confirmButton.height//children[0].height
 
         StatusButton {
+            id: confirmButton
             type: confirmationDialog.btnType
-            anchors.right: parent.right
+            anchors.right: cancelButton.left
             anchors.rightMargin: Style.current.smallPadding
             text: confirmationDialog.confirmButtonLabel
             anchors.bottom: parent.bottom
             onClicked: confirmationDialog.confirmButtonClicked()
         }
+
+        StatusButton {
+            id: cancelButton
+            anchors.right: parent.right
+            visible: showCancelButton
+            anchors.rightMargin: Style.current.smallPadding
+            text: confirmationDialog.cancelButtonLabel
+            anchors.bottom: parent.bottom
+            onClicked: confirmationDialog.cancelButtonClicked()
+        }
     }
 }