feat(storybook): Added support to change tokenModel and update `dep…

…loyState` property Added support to change `tokenModel` and update `deployState` property
status-im · Mar 29, 2023 · 7d3b0a5 · 7d3b0a5
1 parent 6752d27
commit 7d3b0a5
Show file tree

Hide file tree

Showing 4 changed files with 119 additions and 28 deletions.
diff --git a/storybook/pages/CommunityMintTokensSettingsPanelPage.qml b/storybook/pages/CommunityMintTokensSettingsPanelPage.qml
@@ -1,5 +1,6 @@
 import QtQuick 2.14
 import QtQuick.Controls 2.14
+import QtQuick.Layouts 1.14
 
 import AppLayouts.Chat.panels.communities 1.0
 import AppLayouts.Chat.stores 1.0
@@ -15,6 +16,10 @@ SplitView {
 
     Logs { id: logs }
 
+    ListModel {
+        id: emptyModel
+    }
+
     Rectangle {
         SplitView.fillWidth: true
         SplitView.fillHeight: true
@@ -23,17 +28,17 @@ SplitView {
         CommunityMintTokensSettingsPanel {
             anchors.fill: parent
             anchors.topMargin: 50
-            tokensModel: ListModel {}
+            tokensModel: editorModelChecked.checked ? emptyModel : MintedCollectiblesModel.mintedCollectibleModel
             holdersModel: TokenHoldersModel {}
             layer1Networks: NetworksModel.layer1Networks
             layer2Networks: NetworksModel.layer2Networks
             testNetworks: NetworksModel.testNetworks
             enabledNetworks: NetworksModel.enabledNetworks
-            allNetworks: enabledNetworks            
+            allNetworks: enabledNetworks
             accounts: WalletAccountsModel {}
 
             onMintCollectible: logs.logEvent("CommunityMintTokensSettingsPanel::mintCollectible")
-       }
+        }
     }
 
     LogsAndControlsPanel {
@@ -43,5 +48,37 @@ SplitView {
         SplitView.preferredHeight: 150
 
         logsView.logText: logs.logText
+
+        RowLayout {
+            ColumnLayout {
+                Label {
+                    Layout.fillWidth: true
+                    text: "Is empty model?"
+                }
+
+                CheckBox {
+                    id: editorModelChecked
+                    checked: true
+                }
+            }
+            ColumnLayout {
+                Label {
+                    Layout.fillWidth: true
+                    text: "Is minting in progress?"
+                }
+
+                CheckBox {
+                    id: editorMintingChecked
+                    checked: true
+                    onCheckedChanged:{
+                        if(checked)
+                            MintedCollectiblesModel.changeAllMintingStates(1/*In progress*/)
+                        else
+                            MintedCollectiblesModel.changeAllMintingStates(2/*Deployed*/)
+                    }
+
+                }
+            }
+        }
     }
 }
diff --git a/storybook/pages/CommunityMintedTokensViewPage.qml b/storybook/pages/CommunityMintedTokensViewPage.qml
@@ -27,7 +27,7 @@ SplitView {
             CommunityMintedTokensView {
                 anchors.fill: parent
                 anchors.margins: 50
-                model: MintedCollectiblesModel {}
+                model: MintedCollectiblesModel.mintedCollectibleModel
                 onItemClicked: logs.logEvent("CommunityMintedTokensView::itemClicked")
             }
         }

diff --git a/storybook/src/Models/MintedCollectiblesModel.qml b/storybook/src/Models/MintedCollectiblesModel.qml
@@ -1,29 +1,83 @@
+pragma Singleton
 import QtQuick 2.15
 
-ListModel {
+QtObject {
+    id: root
 
-    readonly property var data: [
-        {
-            name: "SuperRare artwork",
-            image: ModelsData.banners.superRare,
-            deployState: 1
-        },
-        {
-            name: "Kitty artwork",
-            image: ModelsData.collectibles.kitty1Big,
-            deployState: 2
-        },
-        {
-            name: "More artwork",
-            image: ModelsData.banners.status,
-            deployState: 2
-        },
-        {
-            name: "Crypto Punks artwork",
-            image: ModelsData.banners.cryptPunks,
-            deployState: 1
+    function changeMintingState(index, deployState) {
+        model.get(index).deployState = deployState
+    }
+
+    function changeAllMintingStates(deployState) {
+        for(var i = 0; i < model.count; i++) {
+            changeMintingState(i, deployState)
         }
-    ]
+    }
+
+    readonly property ListModel mintedCollectibleModel: ListModel {
+        id: model
 
-    Component.onCompleted: append(data)
+        Component.onCompleted: append([
+                                          {
+                                              name: "SuperRare artwork",
+                                              image: ModelsData.banners.superRare,
+                                              deployState: 1,
+                                              symbol: "SRW",
+                                              description: "Desc",
+                                              supply: 1,
+                                              infiniteSupply: true,
+                                              transferable: false,
+                                              remoteSelfDestruct: true,
+                                              chainId: 1,
+                                              chainName: "Testnet",
+                                              chainIcon: ModelsData.networks.testnet,
+                                              accountName: "Status Account"
+                                          },
+                                          {
+                                              name: "Kitty artwork",
+                                              image: ModelsData.collectibles.kitty1Big,
+                                              deployState: 1,
+                                              symbol: "KAT",
+                                              description: "Desc",
+                                              supply: 10,
+                                              infiniteSupply: false,
+                                              transferable: false,
+                                              remoteSelfDestruct: true,
+                                              chainId: 2,
+                                              chainName: "Optimism",
+                                              chainIcon: ModelsData.networks.optimism,
+                                              accountName: "Status New Account"
+                                          },
+                                          {
+                                              name: "More artwork",
+                                              image: ModelsData.banners.status,
+                                              deployState: 1,
+                                              symbol: "MMM",
+                                              description: "Desc",
+                                              supply: 1,
+                                              infiniteSupply: true,
+                                              transferable: false,
+                                              remoteSelfDestruct: true,
+                                              chainId: 5,
+                                              chainName: "Curstom",
+                                              chainIcon: ModelsData.networks.custom,
+                                              accountName: "Other Account"
+                                          },
+                                          {
+                                              name: "Crypto Punks artwork",
+                                              image: ModelsData.banners.cryptPunks,
+                                              deployState: 1,
+                                              symbol: "CPA",
+                                              description: "Desc",
+                                              supply: 5000,
+                                              infiniteSupply: false,
+                                              transferable: false,
+                                              remoteSelfDestruct: false,
+                                              chainId: 1,
+                                              chainName: "Hermez",
+                                              chainIcon: ModelsData.networks.hermez,
+                                              accountName: "Account"
+                                          }
+                                      ])
+    }
 }
diff --git a/storybook/src/Models/qmldir b/storybook/src/Models/qmldir
@@ -1,13 +1,13 @@
 singleton ModelsData 1.0 ModelsData.qml
 singleton PermissionsModel 1.0 PermissionsModel.qml
 singleton NetworksModel 1.0 NetworksModel.qml
+singleton MintedCollectiblesModel 1.0 MintedCollectiblesModel.qml
 IconModel 1.0 IconModel.qml
 BannerModel 1.0 BannerModel.qml
 UsersModel 1.0 UsersModel.qml
 AssetsModel 1.0 AssetsModel.qml
 CollectiblesModel 1.0 CollectiblesModel.qml
 ChannelsModel 1.0 ChannelsModel.qml
 AssetsCollectiblesIconsModel 1.0 AssetsCollectiblesIconsModel.qml
-MintedCollectiblesModel 1.0 MintedCollectiblesModel.qml
 TokenHoldersModel 1.0 TokenHoldersModel.qml
 WalletAccountsModel 1.0 WalletAccountsModel.qml