From bcdb37b0c58e8205081d50cbb2dcc48e7feb4edd Mon Sep 17 00:00:00 2001 From: Khushboo Mehta Date: Mon, 30 Oct 2023 23:18:58 +0100 Subject: [PATCH] fix(@desktop/wallet): Use LeftJoinodel to link networks with chainId in various models such collectibles model, assets models. fixes #8923 --- storybook/pages/TokenListViewPage.qml | 5 +--- .../shared/stores/send/TransactionStore.qml | 5 +--- .../Wallet/views/AssetsDetailView.qml | 7 +---- .../shared/controls/AssetsDetailsHeader.qml | 14 +++++---- ui/imports/shared/popups/send/SendModal.qml | 10 ++----- .../controls/CollectibleNestedDelegate.qml | 5 +--- .../controls/TokenBalancePerChainDelegate.qml | 12 ++++---- .../popups/send/panels/HoldingSelector.qml | 30 ++++++++++++++----- .../popups/send/views/TokenListView.qml | 27 ++++++++++++++--- ui/imports/shared/stores/RootStore.qml | 3 ++ .../shared/stores/send/TransactionStore.qml | 5 +--- 11 files changed, 71 insertions(+), 52 deletions(-) diff --git a/storybook/pages/TokenListViewPage.qml b/storybook/pages/TokenListViewPage.qml index e68730c01e1..d4c67c211e6 100644 --- a/storybook/pages/TokenListViewPage.qml +++ b/storybook/pages/TokenListViewPage.qml @@ -23,12 +23,9 @@ SplitView { width: 400 - getNetworkIcon: function(chainId) { - return "network/Network=Optimism" - } - assets: WalletAssetsModel {} collectibles: WalletNestedCollectiblesModel {} + networksModel: NetworksModel.allNetworks } } diff --git a/storybook/stubs/shared/stores/send/TransactionStore.qml b/storybook/stubs/shared/stores/send/TransactionStore.qml index ccf15b1f332..c117873b7f2 100644 --- a/storybook/stubs/shared/stores/send/TransactionStore.qml +++ b/storybook/stubs/shared/stores/send/TransactionStore.qml @@ -17,6 +17,7 @@ QtObject { property ListModel model: ListModel{} } + property var allNetworksModel: NetworksModel.allNetworks property var fromNetworksModel: NetworksModel.sendFromNetworks property var toNetworksModel: NetworksModel.sendToNetworks property var selectedSenderAccount: senderAccounts.get(0) @@ -237,10 +238,6 @@ QtObject { } } - function getNetworkIcon(chainId) { - return ModelUtils.getByKey(NetworksModel.allNetworks, "chainId", Number(chainId), "iconUrl") - } - function resetStoredProperties() { root.amountToSend = "" root.sendType = Constants.SendType.Transfer diff --git a/ui/app/AppLayouts/Wallet/views/AssetsDetailView.qml b/ui/app/AppLayouts/Wallet/views/AssetsDetailView.qml index 73b00a5e03d..3cf199ea9ce 100644 --- a/ui/app/AppLayouts/Wallet/views/AssetsDetailView.qml +++ b/ui/app/AppLayouts/Wallet/views/AssetsDetailView.qml @@ -57,14 +57,9 @@ Item { secondaryText: token ? LocaleUtils.currencyAmountToLocaleString(token.enabledNetworkBalance) : Constants.dummyText tertiaryText: token ? LocaleUtils.currencyAmountToLocaleString(token.enabledNetworkCurrencyBalance) : Constants.dummyText balances: token && token.balances ? token.balances : null + networksModel: RootStore.allNetworks isLoading: root.assetsLoading errorTooltipText: token && token.balances ? networkConnectionStore.getBlockchainNetworkDownTextForToken(token.balances): "" - getNetworkColor: function(chainId){ - return RootStore.getNetworkColor(chainId) - } - getNetworkIcon: function(chainId){ - return RootStore.getNetworkIcon(chainId) - } formatBalance: function(balance){ return LocaleUtils.currencyAmountToLocaleString(balance) } diff --git a/ui/imports/shared/controls/AssetsDetailsHeader.qml b/ui/imports/shared/controls/AssetsDetailsHeader.qml index efd219fe075..48257ee1be8 100644 --- a/ui/imports/shared/controls/AssetsDetailsHeader.qml +++ b/ui/imports/shared/controls/AssetsDetailsHeader.qml @@ -4,6 +4,7 @@ import QtQuick.Controls 2.14 import utils 1.0 import shared.controls 1.0 +import StatusQ 0.1 import StatusQ.Components 0.1 import StatusQ.Core.Theme 0.1 import StatusQ.Core 0.1 @@ -16,14 +17,13 @@ Control { property alias secondaryText: cryptoBalance.text property alias tertiaryText: fiatBalance.text property var balances + property var networksModel property bool isLoading: false property string errorTooltipText property StatusAssetSettings asset: StatusAssetSettings { width: 40 height: 40 } - property var getNetworkColor: function(chainId){} - property var getNetworkIcon: function(chainId){} property var formatBalance: function(balance){} topPadding: Style.current.padding @@ -82,11 +82,15 @@ Control { anchors.leftMargin: identiconLoader.width Repeater { id: chainRepeater - model: balances ? balances : null + model: LeftJoinModel { + leftModel: root.balances + rightModel: root.networksModel + joinRole: "chainId" + } delegate: InformationTag { tagPrimaryLabel.text: root.formatBalance(model.balance) - tagPrimaryLabel.color: root.getNetworkColor(model.chainId) - image.source: Style.svg("tiny/%1".arg(root.getNetworkIcon(model.chainId))) + tagPrimaryLabel.color: model.chainColor + image.source: Style.svg("tiny/%1".arg(model.iconUrl)) loading: root.isLoading rightComponent: StatusFlatRoundButton { width: 14 diff --git a/ui/imports/shared/popups/send/SendModal.qml b/ui/imports/shared/popups/send/SendModal.qml index 537d430aa1a..8ffac2a890c 100644 --- a/ui/imports/shared/popups/send/SendModal.qml +++ b/ui/imports/shared/popups/send/SendModal.qml @@ -39,7 +39,6 @@ StatusDialog { property alias modalHeader: modalHeader.text property TransactionStore store: TransactionStore {} - property var collectiblesModel: store.collectiblesModel property var nestedCollectiblesModel: store.nestedCollectiblesModel property var bestRoutes property bool isLoading: false @@ -247,12 +246,10 @@ StatusDialog { Layout.fillHeight: true assetsModel: popup.preSelectedAccount && popup.preSelectedAccount.assets ? popup.preSelectedAccount.assets : null collectiblesModel: popup.preSelectedAccount ? popup.nestedCollectiblesModel : null + networksModel: popup.store.allNetworksModel currentCurrencySymbol: d.currencyStore.currentCurrencySymbol visible: (!!d.selectedHolding && d.selectedHoldingType !== Constants.HoldingType.Unknown) || (!!d.hoveredHolding && d.hoveredHoldingType !== Constants.HoldingType.Unknown) - getNetworkIcon: function(chainId){ - return popup.store.getNetworkIcon(chainId) - } onItemSelected: { d.setSelectedHoldingId(holdingId, holdingType) } @@ -376,13 +373,12 @@ StatusDialog { visible: !d.selectedHolding assets: popup.preSelectedAccount && popup.preSelectedAccount.assets ? popup.preSelectedAccount.assets : null collectibles: popup.preSelectedAccount ? popup.nestedCollectiblesModel : null + networksModel: popup.store.allNetworksModel onlyAssets: holdingSelector.onlyAssets + // TODO remove this as address should be found directly in model itself searchTokenSymbolByAddressFn: function (address) { return store.findTokenSymbolByAddress(address) } - getNetworkIcon: function(chainId){ - return popup.store.getNetworkIcon(chainId) - } onTokenSelected: { d.setSelectedHoldingId(symbol, holdingType) } diff --git a/ui/imports/shared/popups/send/controls/CollectibleNestedDelegate.qml b/ui/imports/shared/popups/send/controls/CollectibleNestedDelegate.qml index 0477de06b55..74255548363 100644 --- a/ui/imports/shared/popups/send/controls/CollectibleNestedDelegate.qml +++ b/ui/imports/shared/popups/send/controls/CollectibleNestedDelegate.qml @@ -9,9 +9,6 @@ import utils 1.0 StatusListItem { id: root - property var getNetworkIcon: function(chainId) { - return "" - } signal itemSelected(var selectedItem) signal itemHovered(var selectedItem, bool hovered) @@ -48,7 +45,7 @@ StatusListItem { StatusRoundedImage { width: 20 height: 20 - image.source: Style.svg("tiny/%1".arg(root.getNetworkIcon(chainId))) + image.source: Style.svg("tiny/%1".arg(networkIconUrl)) visible: !isCollection && root.sensor.containsMouse }, StatusIcon { diff --git a/ui/imports/shared/popups/send/controls/TokenBalancePerChainDelegate.qml b/ui/imports/shared/popups/send/controls/TokenBalancePerChainDelegate.qml index eb85585b447..04848a6a7f3 100644 --- a/ui/imports/shared/popups/send/controls/TokenBalancePerChainDelegate.qml +++ b/ui/imports/shared/popups/send/controls/TokenBalancePerChainDelegate.qml @@ -9,9 +9,7 @@ import utils 1.0 StatusListItem { id: root - property var getNetworkIcon: function(chainId){ - return "" - } + property var balancesModel signal tokenSelected(var selectedToken) signal tokenHovered(var selectedToken, bool hovered) @@ -50,13 +48,13 @@ StatusListItem { statusListItemLabel.anchors.verticalCenterOffset: -12 statusListItemLabel.color: Theme.palette.directColor1 statusListItemInlineTagsSlot.spacing: 0 - tagsModel: balances.count > 0 ? balances : [] + tagsModel: root.balancesModel tagsDelegate: expandedItem statusListItemInlineTagsSlot.children: Row { id: compactRow spacing: -6 Repeater { - model: balances.count > 0 ? balances : [] + model: root.balancesModel delegate: compactItem } } @@ -72,7 +70,7 @@ StatusListItem { z: index + 1 width: 16 height: 16 - image.source: Style.svg("tiny/%1".arg(root.getNetworkIcon(chainId))) + image.source: Style.svg("tiny/%1".arg(iconUrl)) visible: !root.sensor.containsMouse || index > d.indexesThatCanBeShown } } @@ -88,7 +86,7 @@ StatusListItem { asset.width: 16 asset.height: 16 asset.isImage: true - asset.name: Style.svg("tiny/%1".arg(root.getNetworkIcon(chainId))) + asset.name: Style.svg("tiny/%1".arg(iconUrl)) visible: root.sensor.containsMouse && index <= d.indexesThatCanBeShown } } diff --git a/ui/imports/shared/popups/send/panels/HoldingSelector.qml b/ui/imports/shared/popups/send/panels/HoldingSelector.qml index 4b63e2ac4f8..dde8780d54a 100644 --- a/ui/imports/shared/popups/send/panels/HoldingSelector.qml +++ b/ui/imports/shared/popups/send/panels/HoldingSelector.qml @@ -8,6 +8,7 @@ import utils 1.0 import SortFilterProxyModel 0.2 +import StatusQ 0.1 import StatusQ.Controls 0.1 import StatusQ.Core 0.1 import StatusQ.Core.Theme 0.1 @@ -18,6 +19,7 @@ Item { id: root property var assetsModel property var collectiblesModel + property var networksModel property string currentCurrencySymbol property bool onlyAssets: true @@ -28,10 +30,6 @@ Item { return "" } - property var getNetworkIcon: function(chainId){ - return "" - } - signal itemHovered(string holdingId, var holdingType) signal itemSelected(string holdingId, var holdingType) @@ -118,8 +116,22 @@ Item { return !!item && item.iconUrl ? item.iconUrl : "" } + readonly property RolesRenamingModel renamedAllNetworksModel: RolesRenamingModel { + sourceModel: root.networksModel + mapping: RoleRename { + from: "iconUrl" + to: "networkIconUrl" + } + } + + readonly property LeftJoinModel collectibleNetworksJointModel: LeftJoinModel { + leftModel: root.collectiblesModel + rightModel: d.renamedAllNetworksModel + joinRole: "chainId" + } + property var collectibleComboBoxModel: SortFilterProxyModel { - sourceModel: root.collectiblesModel + sourceModel: d.collectibleNetworksJointModel filters: [ ExpressionFilter { expression: { @@ -183,6 +195,7 @@ Item { // collectible property var uid: model.uid property var iconUrl: model.iconUrl + property var networkIconUrl: model.networkIconUrl property var collectionUid: model.collectionUid property var collectionName: model.collectionName property var isCollection: model.isCollection @@ -278,7 +291,11 @@ Item { TokenBalancePerChainDelegate { objectName: "AssetSelector_ItemDelegate_" + symbol width: holdingItemSelector.comboBoxControl.popup.width - getNetworkIcon: root.getNetworkIcon + balancesModel: LeftJoinModel { + leftModel: balances + rightModel: root.networksModel + joinRole: "chainId" + } onTokenSelected: { holdingItemSelector.selectedItem = selectedToken d.currentHoldingType = Constants.HoldingType.Asset @@ -293,7 +310,6 @@ Item { CollectibleNestedDelegate { objectName: "CollectibleSelector_ItemDelegate_" + collectionUid width: holdingItemSelector.comboBoxControl.popup.width - getNetworkIcon: root.getNetworkIcon onItemSelected: { if (isCollection) { d.currentBrowsingCollectionName = collectionName diff --git a/ui/imports/shared/popups/send/views/TokenListView.qml b/ui/imports/shared/popups/send/views/TokenListView.qml index 7fd05ee15d1..e18cb356dc8 100644 --- a/ui/imports/shared/popups/send/views/TokenListView.qml +++ b/ui/imports/shared/popups/send/views/TokenListView.qml @@ -3,6 +3,7 @@ import QtQuick.Layouts 1.14 import SortFilterProxyModel 0.2 +import StatusQ 0.1 import StatusQ.Controls 0.1 import StatusQ.Core 0.1 import StatusQ.Core.Theme 0.1 @@ -17,12 +18,12 @@ Item { property var assets: null property var collectibles: null + property var networksModel signal tokenSelected(string symbol, var holdingType) signal tokenHovered(string symbol, var holdingType, bool hovered) property var searchTokenSymbolByAddressFn: function (address) { return "" } - property var getNetworkIcon: function(chainId){} property bool onlyAssets: false property int browsingHoldingType: Constants.HoldingType.Asset @@ -53,6 +54,20 @@ Item { [qsTr("Assets"), qsTr("Collectibles")] property string currentBrowsingCollectionName + + readonly property RolesRenamingModel renamedAllNetworksModel: RolesRenamingModel { + sourceModel: root.networksModel + mapping: RoleRename { + from: "iconUrl" + to: "networkIconUrl" + } + } + + readonly property LeftJoinModel collectiblesNetworksJointModel: LeftJoinModel { + leftModel: root.collectibles + rightModel: d.renamedAllNetworksModel + joinRole: "chainId" + } } implicitWidth: contentLayout.implicitWidth @@ -135,8 +150,9 @@ Item { } ] } + property var collectiblesModel: SortFilterProxyModel { - sourceModel: root.collectibles + sourceModel: d.collectiblesNetworksJointModel filters: [ ExpressionFilter { expression: { @@ -154,7 +170,11 @@ Item { id: tokenDelegate TokenBalancePerChainDelegate { width: ListView.view.width - getNetworkIcon: root.getNetworkIcon + balancesModel: LeftJoinModel { + leftModel: balances + rightModel: root.networksModel + joinRole: "chainId" + } onTokenSelected: root.tokenSelected(symbol, Constants.HoldingType.Asset) onTokenHovered: root.tokenHovered(symbol, Constants.HoldingType.Asset, hovered) } @@ -172,7 +192,6 @@ Item { id: collectiblesDelegate CollectibleNestedDelegate { width: ListView.view.width - getNetworkIcon: root.getNetworkIcon onItemHovered: root.tokenHovered(selectedItem.uid, Constants.HoldingType.Collectible, hovered) onItemSelected: { if (isCollection) { diff --git a/ui/imports/shared/stores/RootStore.qml b/ui/imports/shared/stores/RootStore.qml index c965f73be3f..200ca065cd7 100644 --- a/ui/imports/shared/stores/RootStore.qml +++ b/ui/imports/shared/stores/RootStore.qml @@ -30,11 +30,14 @@ QtObject { property bool isNonArchivalNode: Global.appIsReady && walletSectionInst.isNonArchivalNode property var marketValueStore: TokenMarketValuesStore{} + property var allNetworks: networksModule.all function resetFilter() { walletSectionInst.activityController.updateFilter() } + // TODO remove all these by linking chainId for networks and activity using LeftJoinModel + // not possible currently due to the current structure of the activity model function getNetworkColor(chainId) { return networksModule.all.getChainColor(chainId) } diff --git a/ui/imports/shared/stores/send/TransactionStore.qml b/ui/imports/shared/stores/send/TransactionStore.qml index b5fbdef112c..b1048b4a172 100644 --- a/ui/imports/shared/stores/send/TransactionStore.qml +++ b/ui/imports/shared/stores/send/TransactionStore.qml @@ -19,6 +19,7 @@ QtObject { property var assets: walletSectionAssets.assets property var fromNetworksModel: walletSectionSendInst.fromNetworksModel property var toNetworksModel: walletSectionSendInst.toNetworksModel + property var allNetworksModel: networksModule.all property var senderAccounts: walletSectionSendInst.senderAccounts property var selectedSenderAccount: walletSectionSendInst.selectedSenderAccount property var accounts: walletSectionSendInst.accounts @@ -247,8 +248,4 @@ QtObject { function getShortChainIds(chainShortNames) { return walletSectionSendInst.getShortChainIds(chainShortNames) } - - function getNetworkIcon(chainId) { - return walletSectionSendInst.getIconUrl(chainId) - } }