feat(@esktop/wallet): Implemented filter by similar option (#12232)

src/app/modules/shared_models/collectibles_model.nim

@@ -340,4 +340,22 @@ QtObject:
         if tokenId > 0:
           result.tokenId = some(backend_activity.TokenId("0x" & stint.toHex(tokenId)))
         return result
+    
+    # Fallback, use data from id
+    var parts = id.split("+")
+    if len(parts) == 3:
+      result.chainId = backend_activity.ChainId(parseInt(parts[0]))
+      result.address = some(eth.fromHex(eth.Address, parts[1]))
+      var tokenIdInt = u256(parseInt(parts[2]))
+      result.tokenId = some(backend_activity.TokenId("0x" & stint.toHex(tokenIdInt)))
+
     return result
+
+  proc getUidForData*(self: Model, tokenId: string, tokenAddress: string, chainId: int): string {.slot.} =
+    for item in self.items:
+      if(cmpIgnoreCase(item.getTokenId().toString(), tokenId) == 0 and cmpIgnoreCase(item.getContractAddress(), tokenAddress) == 0):
+        return item.getId()
+    # Fallback, create uid from data, because it still might not be fetched
+    if chainId > 0 and len(tokenAddress) > 0 and len(tokenId) > 0:
+      return $chainId & "+" & tokenAddress & "+" & tokenId
+    return ""

ui/app/AppLayouts/Wallet/panels/ActivityFilterPanel.qml

@@ -163,8 +163,17 @@ Column {
             delegate: ActivityFilterTagItem {
                 id: collectibleTag
                 property string uid: modelData
-                readonly property bool isValid: tagPrimaryLabel.text.length > 0
+                readonly property string name: activityFilterStore.collectiblesList.getName(uid)
-                tagPrimaryLabel.text: activityFilterStore.collectiblesList.getName(uid)
+                readonly property bool isValid: name.length > 0
+                tagPrimaryLabel.text: {
+                    if (!!name)
+                        return name
+                    // Fallback, get tokenId from uid
+                    const data = uid.split("+")
+                    if (data.length === 3)
+                        return "#" + data[2]
+                    return ""
+                }
                 iconAsset.icon: activityFilterStore.collectiblesList.getImageUrl(uid)
                 iconAsset.color: "transparent"
                 onClosed: activityFilterStore.toggleCollectibles(uid)
@@ -174,7 +183,7 @@ Column {
                     target: activityFilterStore.collectiblesList
                     enabled: !collectibleTag.isValid
                     function onIsFetchingChanged() {
-                        if (activityFilterStore.collectiblesList.isFetching)
+                        if (activityFilterStore.collectiblesList.isFetching || !activityFilterStore.collectiblesList.hasMore)
                             return
                         collectibleTag.uid = ""
                         collectibleTag.uid = modelData

ui/app/AppLayouts/Wallet/stores/ActivityFiltersStore.qml

@@ -10,6 +10,7 @@ QtObject {
 
     property var transactionsList: walletSection.activityController.model
 
+    property bool autoUpdateFilter: true
     property var activityController: walletSection.activityController
     property bool filtersSet: selectedTime !== Constants.TransactionTimePeriod.All ||
                                 typeFilters.length !== 0 ||
@@ -153,17 +154,19 @@ QtObject {
                             ? activityController.noLimitTimestamp
                             : toTimestamp/1000
         activityController.setFilterTime(startTimestamp, endTimestamp)
-        activityController.updateFilter()
+        if (autoUpdateFilter)
+            activityController.updateFilter()
     }
 
     // Type Filters
     property var typeFilters: []
-    function toggleType(type, allFiltersCount) {
+    function toggleType(type, allFiltersCount = 0) {
         // update filters
         typeFilters = d.toggleFilterState(typeFilters, type, allFiltersCount)
         // Set backend values
         activityController.setFilterType(JSON.stringify(typeFilters))
-        activityController.updateFilter()
+        if (autoUpdateFilter)
+            activityController.updateFilter()
     }
 
     // Status Filters
@@ -173,7 +176,8 @@ QtObject {
         statusFilters = d.toggleFilterState(statusFilters, status, allFiltersCount)
         // Set backend values
         activityController.setFilterStatus(JSON.stringify(statusFilters))
-        activityController.updateFilter()
+        if (autoUpdateFilter)
+            activityController.updateFilter()
     }
 
     // Tokens Filters
@@ -184,18 +188,20 @@ QtObject {
         tokensFilter = d.toggleFilterState(tokensFilter, symbol, tokensList.count)
         // Set backend values
         activityController.setFilterAssets(JSON.stringify(tokensFilter), false)
-        activityController.updateFilter()
+        if (autoUpdateFilter)
+            activityController.updateFilter()
     }
 
     // Collectibles Filters
-    // To-do: Get list of collectibles with activity from backend
     property var collectiblesList: walletSection.collectiblesController.model
     property var collectiblesFilter: []
     function toggleCollectibles(uid) {
         // update filters
         collectiblesFilter = d.toggleFilterState(collectiblesFilter, uid, collectiblesList.count)
+        // set backend values
         activityController.setFilterCollectibles(JSON.stringify(collectiblesFilter))
-        activityController.updateFilter()
+        if (autoUpdateFilter)
+            activityController.updateFilter()
     }
 
     property var recentsList: activityController.recipientsModel
@@ -208,7 +214,8 @@ QtObject {
         // update filters
         recentsFilters = d.toggleFilterState(recentsFilters, address, recentsList.count)
         activityController.setFilterToAddresses(JSON.stringify(recentsFilters.concat(savedAddressFilters)))
-        activityController.updateFilter()
+        if (autoUpdateFilter)
+            activityController.updateFilter()
     }
 
     function getChainShortNamesForSavedWalletAddress(address) {
@@ -236,7 +243,8 @@ QtObject {
         savedAddressFilters = d.toggleFilterState(savedAddressFilters, address, savedAddressList.count)
         // Set backend values
         activityController.setFilterToAddresses(JSON.stringify(recentsFilters.concat(savedAddressFilters)))
-        activityController.updateFilter()
+        if (autoUpdateFilter)
+            activityController.updateFilter()
     }
 
     function updateFilterBase() {
@@ -251,7 +259,8 @@ QtObject {
         activityController.setFilterToAddresses(JSON.stringify(recentsFilters.concat(savedAddressFilters)))
         activityController.setFilterCollectibles(JSON.stringify(collectiblesFilter))
 
-        activityController.updateFilter()
+        if (autoUpdateFilter)
+            activityController.updateFilter()
     }
 
     function resetAllFilters() {

ui/imports/shared/views/HistoryView.qml

@@ -297,12 +297,12 @@ ColumnLayout {
         property var transaction
         property var transactionDelegate
 
-        function openMenu(delegate, mouse) {
+        function openMenu(delegate, mouse, data) {
-            if (!delegate || !delegate.modelData)
+            if (!delegate || !data)
                 return
 
             delegateMenu.transactionDelegate = delegate
-            delegateMenu.transaction = delegate.modelData
+            delegateMenu.transaction = data
             repeatTransactionAction.enabled = !overview.isWatchOnlyAccount && delegate.modelData.txType === TransactionDelegate.Send
             popup(delegate, mouse.x, mouse.y)
         }
@@ -338,11 +338,40 @@ ColumnLayout {
         }
         StatusAction {
             id: filterAction
-            enabled: false
             text: qsTr("Filter by similar")
             icon.name: "filter"
             onTriggered: {
-                // TODO apply filter
+                const store = WalletStores.RootStore.currentActivityFiltersStore
+                const tx = delegateMenu.transaction
+
+                store.autoUpdateFilter = false
+                store.resetAllFilters()
+
+                const currentAddress = overview.mixedcaseAddress.toUpperCase()
+
+                store.toggleType(tx.txType)
+                // Contract deployment has always ETH symbol. Symbol doesn't affect this type
+                if (tx.txType !== Constants.TransactionType.ContractDeployment) {
+                    const symbol = tx.symbol
+                    if (!!symbol)
+                        store.toggleToken(symbol)
+                    const inSymbol = tx.inSymbol
+                    if (!!inSymbol && inSymbol !== symbol)
+                        store.toggleToken(inSymbol)
+                }
+                if (showAllAccounts || tx.txType !== Constants.TransactionType.Bridge) {
+                    const recipient = tx.recipient.toUpperCase()
+                    if (!!recipient && recipient !== currentAddress && !/0X0+$/.test(recipient))
+                        store.toggleRecents(recipient)
+                }
+                if (tx.isNFT) {
+                    const uid = store.collectiblesList.getUidForData(tx.tokenID, tx.tokenAddress, tx.chainId)
+                    if (!!uid)
+                        store.toggleCollectibles(uid)
+                }
+
+                store.autoUpdateFilter = true
+                store.applyAllFilters()
             }
         }
     }