feat(CommunityPermissions): Switch to enable/disable 'Who holds' section

storybook/pages/CommunityNewPermissionViewPage.qml

@@ -28,6 +28,8 @@ SplitView {
             permissionDuplicated: isPermissionDuplicatedCheckBox.checked
             permissionTypeLimitReached: isLimitReachedCheckBox.checked
 
+            showWhoHoldsSwitch: true
+
             assetsModel: AssetsModel {}
             collectiblesModel: CollectiblesModel {}
             channelsModel: ChannelsModel {}

storybook/pages/CommunityPermissionsSettingsPanelPage.qml

@@ -79,6 +79,8 @@ SplitView {
 
             isOwner: isOwnerCheckBox.checked
 
+            showWhoHoldsSwitch: true
+
             onCreatePermissionRequested: {
                 permissionsStoreMock.createPermission(holdings, permissionType,
                                                       isPrivate, channels)

storybook/pages/StatusGroupBoxPage.qml

@@ -44,6 +44,8 @@ SplitView {
             icon: Style.png("tokens/SNT")
             iconSize: iconSizeSlider.value
 
+            label.enabled: labelEnabledCheckBox.checked
+
             width: undefinedSizeCheckBox.checked ? undefined
                                                  : widthSlider.value
             height: undefinedSizeCheckBox.checked ? undefined
@@ -110,10 +112,19 @@ SplitView {
                     text: "iconSize:"
                 }
 
-                TextField {
-                    id: titleTextEdit
+                RowLayout {
+                    TextField {
+                        id: titleTextEdit
+
+                        text: "Some title goes here"
+                    }
+
+                    CheckBox {
+                        id: labelEnabledCheckBox
 
-                    text: "Some title goes here"
+                        checked: true
+                        text: "label enabled"
+                    }
                 }
             }
         }

ui/StatusQ/src/StatusQ/Components/StatusGroupBox.qml

@@ -41,23 +41,23 @@ GroupBox {
         contentItem: RowLayout {
             spacing: 8
 
-            Image {
+            StatusIcon {
                 sourceSize.width: width || undefined
                 sourceSize.height: height || undefined
-                fillMode: Image.PreserveAspectFit
                 mipmap: true
                 antialiasing: true
                 width: root.iconSize
                 height: width
                 source: root.icon
+                color: enabled ? "transparent" : Theme.palette.baseColor1
             }
 
             StatusBaseText {
                 Layout.alignment: Qt.AlignVCenter
                 Layout.fillWidth: true
 
                 text: root.title
-                color: Theme.palette.directColor1
+                color: enabled ? Theme.palette.directColor1 : Theme.palette.baseColor1
                 font.pixelSize: 17
 
                 elide: Text.ElideRight

ui/StatusQ/src/StatusQ/Components/StatusItemSelector.qml

@@ -105,6 +105,8 @@ StatusFlowSelector {
     */
     property bool itemsClickable: true
 
+    readonly property alias count: repeater.count
+
     /*!
        \qmlsignal StatusItemSelector::itemClicked
        This signal is emitted when the item is clicked.

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

@@ -89,11 +89,14 @@ Control{
             StatusBaseText {
                 font.pixelSize: d.itemTextPixelSize
                 height: d.flowRowHeight
-                text: qsTr("Anyone who holds")
+                text: holdingsRepeater.count > 0 ? qsTr("Anyone who holds")
+                                                 : qsTr("Anyone")
                 verticalAlignment: Text.AlignVCenter
             }
 
             Repeater {
+                id: holdingsRepeater
+
                 model: root.holdingsListModel
 
                 StatusListItemTag {

ui/app/AppLayouts/Chat/panels/communities/CommunityPermissionsSettingsPanel.qml

@@ -23,6 +23,10 @@ SettingsPageLayout {
 
     property int viewWidth: 560 // by design
 
+    // TODO: temporary property, to be removed when no need to hide the switch
+    // in the app
+    property bool showWhoHoldsSwitch: false
+
     signal createPermissionRequested(
         int permissionType, var holdings, var channels, bool isPrivate)
 
@@ -182,6 +186,10 @@ SettingsPageLayout {
 
             permissionType: d.permissionTypeToEdit
             isPrivate: d.isPrivateToEditValue
+            holdingsRequired: selectedHoldingsModel ? selectedHoldingsModel.count > 0
+                                                    : false
+
+            showWhoHoldsSwitch: root.showWhoHoldsSwitch
 
             permissionDuplicated: {
                 // dependencies
@@ -205,6 +213,12 @@ SettingsPageLayout {
 
                     const same = (a, b) => ModelUtils.checkEqualitySet(a, b, ["key"])
 
+                    if (holdings.rowCount() === 0 && dirtyValues.holdingsRequired)
+                        continue
+
+                    if (holdings.rowCount() !== 0 && !dirtyValues.holdingsRequired)
+                        continue
+
                     if (same(dirtyValues.selectedHoldingsModel, holdings)
                             && same(dirtyValues.selectedChannelsModel, channels)
                             && dirtyValues.permissionType === permissionType)
@@ -233,9 +247,11 @@ SettingsPageLayout {
             }
 
             onCreatePermissionClicked: {
-                const holdings = ModelUtils.modelToArray(
-                                   dirtyValues.selectedHoldingsModel,
-                                   ["key", "type", "amount"])
+                const holdings = dirtyValues.holdingsRequired ?
+                                   ModelUtils.modelToArray(
+                                       dirtyValues.selectedHoldingsModel,
+                                       ["key", "type", "amount"])
+                                 : []
 
                 const channels = ModelUtils.modelToArray(
                                    dirtyValues.selectedChannelsModel, ["key"])

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

@@ -1,5 +1,6 @@
-import QtQuick 2.14
-import QtQuick.Layouts 1.14
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQml 2.15
 
 import StatusQ.Core 0.1
 import StatusQ.Core.Theme 0.1
@@ -30,21 +31,27 @@ StatusScrollView {
     property int viewWidth: 560 // by design
     property bool isEditState: false
 
+    // TODO: temporary property, to be removed when no need to hide the switch
+    // in the app
+    property bool showWhoHoldsSwitch: false
+
     readonly property bool dirty:
-        !holdingsModelComparator.equal ||
+        root.holdingsRequired !== d.dirtyValues.holdingsRequired ||
+        (d.dirtyValues.holdingsRequired && !holdingsModelComparator.equal) ||
         !channelsModelComparator.equal ||
         root.isPrivate !== d.dirtyValues.isPrivate ||
         root.permissionType !== d.dirtyValues.permissionType
 
     readonly property alias dirtyValues: d.dirtyValues
 
     readonly property bool isFullyFilled:
-        dirtyValues.selectedHoldingsModel.count > 0 &&
+        (dirtyValues.selectedHoldingsModel.count > 0 || !whoHoldsSwitch.checked) &&
         dirtyValues.permissionType !== PermissionTypes.Type.None &&
         (d.isCommunityPermission || dirtyValues.selectedChannelsModel.count > 0)
 
     property int permissionType: PermissionTypes.Type.None
     property bool isPrivate: false
+    property bool holdingsRequired: true
 
     // roles: type, key, name, amount, imageSource
     property var selectedHoldingsModel: ListModel {}
@@ -111,6 +118,7 @@ StatusScrollView {
 
             property int permissionType: PermissionTypes.Type.None
             property bool isPrivate: false
+            property bool holdingsRequired: true
 
             Binding on isPrivate {
                 value: (d.dirtyValues.permissionType === PermissionTypes.Type.Admin) ||
@@ -161,6 +169,9 @@ StatusScrollView {
 
             // Is private permission
             d.dirtyValues.isPrivate = root.isPrivate
+
+            // Are holdings required
+            d.dirtyValues.holdingsRequired = root.holdingsRequired
         }
     }
 
@@ -192,7 +203,8 @@ StatusScrollView {
             tagLeftPadding: 2
             asset.height: 28
             asset.width: asset.height
-            addButton.visible: model.count < d.maxHoldingsItems
+            addButton.visible: count < d.maxHoldingsItems &&
+                               whoHoldsSwitch.checked
 
             model: HoldingsSelectionModel {
                 sourceModel: d.dirtyValues.selectedHoldingsModel
@@ -201,6 +213,36 @@ StatusScrollView {
                 collectiblesModel: root.collectiblesModel
             }
 
+            label.enabled: whoHoldsSwitch.checked
+            placeholderItem.visible: count === 0 && whoHoldsSwitch.checked
+
+            Binding on model {
+                when: !whoHoldsSwitch.checked
+                value: 0
+                restoreMode: Binding.RestoreBindingOrValue
+            }
+
+            Binding on bottomPadding {
+                when: !whoHoldsSwitch.checked
+                value: 0
+                restoreMode: Binding.RestoreBindingOrValue
+            }
+
+            children: StatusSwitch {
+                id: whoHoldsSwitch
+
+                visible: root.showWhoHoldsSwitch
+
+                padding: 0
+                anchors.right: parent.right
+                anchors.top: parent.top
+                anchors.rightMargin: 12
+                anchors.topMargin: 10
+
+                checked: d.dirtyValues.holdingsRequired
+                onToggled: d.dirtyValues.holdingsRequired = checked
+            }
+
             HoldingsDropdown {
                 id: dropdown