chore(CommunityPermissions): ENS tab simplified according to updated design

Closes: #8818

ui/app/AppLayouts/Chat/controls/community/EnsPanel.qml

@@ -4,90 +4,20 @@ import QtQuick.Layouts 1.14
 import StatusQ.Core 0.1
 import StatusQ.Core.Theme 0.1
 import StatusQ.Controls 0.1
-import StatusQ.Components 0.1
 import StatusQ.Controls.Validators 0.1
 
+
 ColumnLayout {
-    id: root
-
-    enum EnsType {
-        Any,
-        CustomSubdomain
-    }
-
-    property int ensType: EnsPanel.EnsType.Any
     property alias domainName: domainNameInput.text
     property alias domainNameValid: domainNameInput.valid
 
     spacing: 0
 
-    QtObject {
-        id: d
-
-        // values from design
-        readonly property int pickerHeight: 36
-        readonly property int pickerFontSize: 13
-        readonly property int pickerLeftPadding: 12
-        readonly property int pickerRightPadding: 9
-    }
-
-    // TODO (>=5.15): use inline components to reduce code duplication
-    StatusListItem {
-        title: qsTr("Any domain")
-
-        Layout.fillWidth: true
-        Layout.preferredHeight: d.pickerHeight
-
-        leftPadding: d.pickerLeftPadding
-        rightPadding: d.pickerRightPadding
-        statusListItemTitle.font.pixelSize: d.pickerFontSize
-
-        components: [
-            StatusRadioButton {
-                checked: root.ensType === EnsPanel.EnsType.Any
-                size: StatusRadioButton.Size.Small
-            }
-        ]
-
-        // using MouseArea instead of build-in 'clicked' signal to avoid
-        // intercepting event by the StatusRadioButton
-        MouseArea {
-            anchors.fill: parent
-            cursorShape: Qt.PointingHandCursor
-            onClicked: root.ensType = EnsPanel.EnsType.Any
-        }
-    }
-
-    StatusListItem {
-        title: qsTr("Custom subdomain")
-
-        Layout.fillWidth: true
-        Layout.preferredHeight: d.pickerHeight
-
-        leftPadding: d.pickerLeftPadding
-        rightPadding: d.pickerRightPadding
-        statusListItemTitle.font.pixelSize: d.pickerFontSize
-
-        components: [
-            StatusRadioButton {
-                checked: root.ensType === EnsPanel.EnsType.CustomSubdomain
-                size: StatusRadioButton.Size.Small
-            }
-        ]
-
-        MouseArea {
-            anchors.fill: parent
-            cursorShape: Qt.PointingHandCursor
-            onClicked: root.ensType = EnsPanel.EnsType.CustomSubdomain
-        }
-    }
-
-
     StatusInput {
         id: domainNameInput
 
         Layout.fillWidth: true
-        Layout.topMargin: 8
+        Layout.topMargin: 23
 
         minimumHeight: 36
         maximumHeight: 36
@@ -95,12 +25,15 @@ ColumnLayout {
         bottomPadding: 0
         font.pixelSize: 13
         input.placeholderText: "name.eth"
-        visible: root.ensType === EnsPanel.EnsType.CustomSubdomain
 
         validators: StatusRegularExpressionValidator {
             // TODO: check ens domain validator
-            regularExpression: /^[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)?$/ig
+            regularExpression: /^(\*\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)?$/i
             errorMessage: qsTr("Subdomain not recognized")
+
+            validate: function (value) {
+                return value === "*.eth" || regularExpression.test(value)
+            }
         }
 
         Component.onCompleted: {
@@ -110,4 +43,17 @@ ColumnLayout {
             }
         }
     }
+
+    StatusBaseText {
+        Layout.fillWidth: true
+        Layout.topMargin: 17
+
+        text: qsTr("Put *. before ENS name to include all subdomains in permission")
+
+        wrapMode: Text.Wrap
+        color: Theme.palette.baseColor1
+        font.pixelSize: 13
+        lineHeight: 18
+        lineHeightMode: Text.FixedHeight
+    }
 }

ui/app/AppLayouts/Chat/controls/community/HoldingsDropdown.qml

@@ -22,16 +22,15 @@ StatusDropdown {
     property real collectibleAmount: 1
     property bool collectiblesSpecificAmount: false
 
-    property int ensType: EnsPanel.EnsType.Any
     property string ensDomainName: ""
 
     signal addAsset(string key, real amount)
     signal addCollectible(string key, real amount)
-    signal addEns(bool any, string customDomain)
+    signal addEns(string domain)
 
     signal updateAsset(string key, real amount)
     signal updateCollectible(string key, real amount)
-    signal updateEns(bool any, string customDomain)
+    signal updateEns(string domain)
 
     signal removeClicked
 
@@ -45,7 +44,6 @@ StatusDropdown {
         root.assetAmount = 0
         root.collectibleAmount = 1
         root.collectiblesSpecificAmount = false
-        root.ensType = EnsPanel.EnsType.Any
         root.ensDomainName = ""
 
         statesStack.clear()
@@ -89,7 +87,7 @@ StatusDropdown {
         // Internal management properties and signals:
         readonly property bool assetsReady: root.assetAmount > 0 && root.assetKey
         readonly property bool collectiblesReady: root.collectibleAmount > 0 && root.collectibleKey
-        readonly property bool ensReady: root.ensType === EnsPanel.EnsType.Any || d.ensDomainNameValid
+        readonly property bool ensReady: d.ensDomainNameValid
 
         readonly property string addState: "ADD"
         readonly property string updateState: "UPDATE"
@@ -215,7 +213,7 @@ StatusDropdown {
 
             readonly property bool extendedHeight:
                 d.currentHoldingType === HoldingTypes.Type.Collectible && collectiblesSpecificAmount ||
-                d.currentHoldingType === HoldingTypes.Type.Ens && root.ensType === EnsPanel.EnsType.CustomSubdomain
+                d.currentHoldingType === HoldingTypes.Type.Ens
 
             implicitHeight: extendedHeight
                             ? (mode === HoldingsTabs.Mode.Add ? d.tabsAddModeExtendedHeight : d.tabsUpdateModeExtendedHeight)
@@ -372,9 +370,6 @@ StatusDropdown {
         id: ensLayout
 
         EnsPanel {
-            ensType: root.ensType
-            onEnsTypeChanged: root.ensType = ensType
-
             domainName: root.ensDomainName
             onDomainNameChanged: root.ensDomainName = domainName
             onDomainNameValidChanged: d.ensDomainNameValid = domainNameValid
@@ -383,11 +378,11 @@ StatusDropdown {
                 target: d
 
                 function onAddClicked() {
-                    root.addEns(root.ensType === EnsPanel.EnsType.Any, root.ensDomainName)
+                    root.addEns(root.ensDomainName)
                 }
 
                 function onUpdateClicked() {
-                    root.updateEns(root.ensType === EnsPanel.EnsType.Any, root.ensDomainName)
+                    root.updateEns(root.ensDomainName)
                 }
             }
         }

ui/app/AppLayouts/Chat/stores/CommunitiesStore.qml

@@ -140,10 +140,12 @@ QtObject {
             case HoldingTypes.Type.Collectible:
                 return `${LocaleUtils.numberToLocaleString(amount)} ${name}`
             case HoldingTypes.Type.Ens:
-                if (name)
-                    return qsTr("ENS username on '%1' domain").arg(name)
-                else
+                if (name === "*.eth")
                     return qsTr("Any ENS username")
+                if (name.startsWith("*."))
+                    return qsTr("ENS username on '%1' domain").arg(name.substring(2))
+
+                return qsTr("ENS username '%1'").arg(name)
             default:
                 return ""
         }

ui/app/AppLayouts/Chat/views/communities/CommunityNewPermissionView.qml

@@ -233,11 +233,10 @@ StatusScrollView {
                 }
 
                 onAddEns: {
-                    const key = any ? "EnsAny" : "EnsCustom"
-                    const name = any ? "" : customDomain
+                    const key = "ENS"
                     const icon = Style.svg("profile/ensUsernames")
 
-                    d.dirtyValues.holdingsModel.append({type: HoldingTypes.Type.Ens, key, name, amount: 1, imageSource: icon })
+                    d.dirtyValues.holdingsModel.append({type: HoldingTypes.Type.Ens, key, name: domain, amount: 1, imageSource: icon })
                     dropdown.close()
                 }
 
@@ -264,11 +263,10 @@ StatusScrollView {
                 }
 
                 onUpdateEns: {
-                    const key = any ? "EnsAny" : "EnsCustom"
-                    const name = any ? "" : customDomain
+                    const key = "ENS"
                     const icon = Style.svg("profile/ensUsernames")
 
-                    d.dirtyValues.holdingsModel.set(tokensSelector.editedIndex, { type: HoldingTypes.Type.Ens, key, name: name, amount: 1, imageSource: icon })
+                    d.dirtyValues.holdingsModel.set(tokensSelector.editedIndex, { type: HoldingTypes.Type.Ens, key, name: domain, amount: 1, imageSource: icon })
                     d.triggerDirtyTool = !d.triggerDirtyTool
                     dropdown.close()
                 }
@@ -307,8 +305,6 @@ StatusScrollView {
                         dropdown.collectiblesSpecificAmount = modelItem.amount !== 1
                         break
                     case HoldingTypes.Type.Ens:
-                        dropdown.ensType = modelItem.name ? EnsPanel.EnsType.CustomSubdomain
-                                                          : EnsPanel.EnsType.Any
                         dropdown.ensDomainName = modelItem.name
                         break
                     default: