chore(Storybook): Add HoldingsDropdown page

storybook/PagesModel.qml

@@ -53,6 +53,10 @@ ListModel {
          title: "CreateChannelPopup"
          section: "Popups"
     }
+    ListElement {
+         title: "HoldingsDropdown"
+         section: "Popups"
+    }
     ListElement {
         title: "MembersSelector"
         section: "Components"

storybook/pages/HoldingsDropdownPage.qml

@@ -0,0 +1,98 @@
+import QtQuick 2.14
+import QtQuick.Controls 2.14
+import QtQuick.Layouts 1.14
+
+import Storybook 1.0
+
+import AppLayouts.Chat.controls.community 1.0
+
+Pane {
+    id: root
+
+    function openFlow(flowType) {
+        holdingsDropdown.close()
+        holdingsDropdown.openFlow(flowType)
+    }
+
+    RowLayout {
+        Label {
+            text: "Open flow:"
+        }
+
+        Button {
+            text: "Add"
+            onClicked: openFlow(HoldingsDropdown.FlowType.Add)
+        }
+
+        Button {
+            text: "AddWithOperators"
+            onClicked: openFlow(HoldingsDropdown.FlowType.AddWithOperators)
+        }
+
+        Button {
+            text: "Update"
+            onClicked: openFlow(HoldingsDropdown.FlowType.Update)
+        }
+    }
+
+    HoldingsDropdown {
+        id: holdingsDropdown
+
+        parent: root
+        anchors.centerIn: root
+
+        store: QtObject {
+            readonly property ListModel collectiblesModel: ListModel {
+
+                Component.onCompleted: {
+                    const collectibles = []
+
+                    for (let i = 0; i < 20; i++) {
+                        collectibles.push({
+                            key: "key " + (i + 1),
+                            iconSource: "",
+                            name: "Collectible " + (i + 1),
+                            category: "Community collectibles, cat "
+                                      + (Math.floor(i / 4) + 1)
+                        })
+                    }
+
+                    const subitems = []
+                    for (let j = 0; j < 20; j++) {
+
+                        subitems.push({
+                            key: "subkey " + (j + 1),
+                            iconSource: "",
+                            name: "Collectible (sub) " + (j + 1)//,
+                        })
+                    }
+
+                    collectibles[1].subItems = subitems;
+
+                    append(collectibles)
+                }
+            }
+
+            readonly property ListModel tokensModel: ListModel {
+                ListElement {
+                    key: "socks"; iconSource: ""; name: "Unisocks"; shortName: "SOCKS"; category: "Community tokens"
+                }
+                ListElement {
+                    key: "zrx"; iconSource: ""; name: "Ox"; shortName: "ZRX"; category: "Listed tokens"
+                }
+                ListElement {
+                    key: "1inch"; iconSource: ""; name: "1inch"; shortName: "ZRX"; category: "Listed tokens"
+                }
+                ListElement {
+                    key: "Aave"; iconSource: ""; name: "Aave"; shortName: "AAVE"; category: "Listed tokens"}
+
+                ListElement {
+                    key: "Amp"; iconSource: ""; name: "Amp"; shortName: "AMP"; category: "Listed tokens"
+                }
+            }
+        }
+
+        onOpened: contentItem.parent.parent = root
+        Component.onCompleted: openFlow(HoldingsDropdown.FlowType.Add)
+    }
+}

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

@@ -7,6 +7,8 @@ import StatusQ.Components 0.1
 import StatusQ.Controls 0.1
 import StatusQ.Core.Utils 0.1
 
+import AppLayouts.Chat.helpers 1.0
+
 
 StatusDropdown {
     id: root
@@ -301,7 +303,8 @@ StatusDropdown {
             readonly property string tokenKey: root.tokenKey
 
             onTokenKeyChanged: {
-                const modelItem = store.getTokenByKey(tokenKey)
+                const modelItem = CommunityPermissionsHelpers.getTokenByKey(
+                                    store.tokensModel, tokenKey)
 
                 if (modelItem) {
                     tokensPanel.tokenName = modelItem.shortName
@@ -376,7 +379,8 @@ StatusDropdown {
             readonly property string collectibleKey: root.collectibleKey
 
             onCollectibleKeyChanged: {
-                const modelItem = store.getCollectibleByKey(collectibleKey)
+                const modelItem = CommunityPermissionsHelpers.getCollectibleByKey(
+                                    store.collectiblesModel, collectibleKey)
 
                 if (modelItem) {
                     collectiblesPanel.collectibleName = modelItem.name

ui/app/AppLayouts/Chat/controls/community/qmldir

@@ -1,2 +1,3 @@
+HoldingsDropdown 1.0 HoldingsDropdown.qml
 HoldingTypes 1.0 HoldingTypes.qml
 PermissionItem 1.0 PermissionItem.qml

ui/app/AppLayouts/Chat/helpers/CommunityPermissionsHelpers.qml

@@ -0,0 +1,39 @@
+pragma Singleton
+
+import QtQml 2.14
+
+QtObject {
+    readonly property QtObject _d: QtObject {
+        id: d
+
+        function getByKey(model, key) {
+            for (let i = 0; i < model.count; i++) {
+                const item = model.get(i)
+                if (item.key === key)
+                    return item
+            }
+
+            return null
+        }
+    }
+
+    function getTokenByKey(tokensModel, key) {
+        return d.getByKey(tokensModel, key)
+    }
+
+    function getCollectibleByKey(collectiblesModel, key) {
+        for (let i = 0; i < collectiblesModel.count; i++) {
+            const item = collectiblesModel.get(i)
+
+            if (!!item.subItems) {
+                const sub = d.getByKey(item.subItems, key)
+                if (sub)
+                    return sub
+            } else if (item.key === key) {
+                return item
+            }
+        }
+
+        return null
+    }
+}

ui/app/AppLayouts/Chat/helpers/qmldir

@@ -0,0 +1 @@
+singleton CommunityPermissionsHelpers 1.0 CommunityPermissionsHelpers.qml

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

@@ -84,40 +84,6 @@ QtObject {
         ListElement { key: "general"; iconSource: "qrc:imports/assets/png/tokens/CUSTOM-TOKEN.png"; name: "#general"}
     }
 
-    readonly property QtObject _d: QtObject {
-        id: d
-
-        function getByKey(model, key) {
-            for (let i = 0; i < model.count; i++) {
-                const item = model.get(i)
-                if (item.key === key)
-                    return item
-            }
-
-            return null
-        }
-    }
-
-    function getTokenByKey(key) {
-        return d.getByKey(tokensModel, key)
-    }
-
-    function getCollectibleByKey(key) {
-        for (let i = 0; i < collectiblesModel.count; i++) {
-            const item = collectiblesModel.get(i)
-
-            if (!!item.subItems) {
-                const sub = d.getByKey(item.subItems, key)
-                if (sub)
-                    return sub
-            } else if (item.key === key) {
-                return item
-            }
-        }
-
-        return null
-    }
-
     function createPermissions(holdings, permissions, isPrivate) {
         console.log("TODO: Create permissions - backend call - Now dummy data shown")
         // TO BE REMOVED: It shold just be a call to the backend sharing `holdings`, `permissions`, `channels` and `isPrivate` properties.

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

@@ -7,11 +7,13 @@ import StatusQ.Components 0.1
 import StatusQ.Controls 0.1
 import StatusQ.Core.Utils 0.1
 
+import AppLayouts.Chat.helpers 1.0
 import utils 1.0
 import shared.panels 1.0
 
 import SortFilterProxyModel 0.2
 
+
 import "../../../Chat/controls/community"
 
 StatusScrollView {
@@ -75,13 +77,15 @@ StatusScrollView {
                 }
 
                 onAddToken: {
-                    const modelItem = store.getTokenByKey(key)
+                    const modelItem = CommunityPermissionsHelpers.getTokenByKey(
+                                        store.tokensModel, key)
                     addItem(HoldingTypes.Type.Token, modelItem, amount, operator)
                     dropdown.close()
                 }
 
                 onAddCollectible: {
-                    const modelItem = store.getCollectibleByKey(key)
+                    const modelItem = CommunityPermissionsHelpers.getCollectibleByKey(
+                                        store.collectiblesModel, key)
                     addItem(HoldingTypes.Type.Collectible, modelItem, amount, operator)
                     dropdown.close()
                 }
@@ -96,7 +100,8 @@ StatusScrollView {
                 }
 
                 onUpdateToken: {
-                    const modelItem = store.getTokenByKey(key)
+                    const modelItem = CommunityPermissionsHelpers.getTokenByKey(
+                                        store.tokensModel, key)
                     const name = modelItem.shortName ? modelItem.shortName : modelItem.name
                     const imageSource = modelItem.iconSource.toString()
 
@@ -105,7 +110,8 @@ StatusScrollView {
                 }
 
                 onUpdateCollectible: {
-                    const modelItem = store.getCollectibleByKey(key)
+                    const modelItem = CommunityPermissionsHelpers.getCollectibleByKey(
+                                        store.collectiblesModel, key)
                     const name = modelItem.name
                     const imageSource = modelItem.iconSource.toString()