refactor(@wallet/desktop): bind new token list to qml

src/app/modules/main/wallet_section/all_tokens/item.nim

@@ -8,14 +8,16 @@ type
     address: string
     decimals: int
     isCustom: bool
+    isVisible: bool
 
-proc initItem*(name, symbol: string, hasIcon: bool, address: string, decimals: int, isCustom: bool): Item =
+proc initItem*(name, symbol: string, hasIcon: bool, address: string, decimals: int, isCustom: bool, isVisible: bool): Item =
   result.name = name
   result.symbol = symbol
   result.hasIcon = hasIcon
   result.address = address
   result.decimals = decimals
   result.isCustom = isCustom
+  result.isVisible = isVisible
 
 proc `$`*(self: Item): string =
   result = fmt"""AllTokensItem(
@@ -23,8 +25,9 @@ proc `$`*(self: Item): string =
     symbol: {self.symbol},
     hasIcon: {self.hasIcon},
     address: {self.address}, 
-    decimals: {self.decimals}, 
-    isCustom:{self.isCustom}
+    decimals: {self.decimals},
+    isCustom:{self.isCustom},
+    isVisible:{self.isVisible}
     ]"""
 
 proc getName*(self: Item): string = 
@@ -43,4 +46,7 @@ proc getDecimals*(self: Item): int =
   return self.decimals
 
 proc getIsCustom*(self: Item): bool = 
-  return self.isCustom
+  return self.isCustom
+
+proc getIsVisible*(self: Item): bool = 
+  return self.isVisible

src/app/modules/main/wallet_section/all_tokens/model.nim

@@ -10,6 +10,7 @@ type
     Address
     Decimals
     IsCustom
+    IsVisible
 
 QtObject:
   type
@@ -50,7 +51,8 @@ QtObject:
       ModelRole.HasIcon.int:"hasIcon",
       ModelRole.Address.int:"address",
       ModelRole.Decimals.int:"decimals",
-      ModelRole.IsCustom.int:"isCustom"
+      ModelRole.IsCustom.int:"isCustom",
+      ModelRole.IsVisible.int:"isVisible"
     }.toTable
 
   method data(self: Model, index: QModelIndex, role: int): QVariant =
@@ -76,6 +78,8 @@ QtObject:
       result = newQVariant(item.getDecimals())
     of ModelRole.IsCustom: 
       result = newQVariant(item.getIsCustom())
+    of ModelRole.IsVisible: 
+      result = newQVariant(item.getIsVisible())
 
   proc setItems*(self: Model, items: seq[Item]) =
     self.beginResetModel()

src/app/modules/main/wallet_section/all_tokens/module.nim

@@ -1,8 +1,9 @@
-import sequtils, sugar
+import NimQml, sequtils, sugar
 
 import eventemitter
 
 import ./io_interface, ./view, ./controller, ./item
+import ../../../../core/global_singleton
 import ../../../../../app_service/service/token/service as token_service
 
 export io_interface
@@ -30,6 +31,8 @@ method delete*[T](self: Module[T]) =
   self.controller.delete
 
 method load*[T](self: Module[T]) =
+  singletonInstance.engine.setRootContextProperty("walletSectionAllTokens", newQVariant(self.view))
+
   let tokens = self.controller.getTokens()
   self.view.setItems(
     tokens.map(t => initItem(
@@ -38,7 +41,8 @@ method load*[T](self: Module[T]) =
       t.hasIcon,
       t.addressAsString(),
       t.decimals,
-      t.isCustom
+      t.isCustom,
+      t.isVisible
     ))
   )
 

src/app/modules/main/wallet_section/all_tokens/view.nim

@@ -1,4 +1,4 @@
-import NimQml
+import NimQml, sequtils, sugar
 
 import ./model
 import ./item
@@ -8,29 +8,53 @@ QtObject:
   type
     View* = ref object of QObject
       delegate: io_interface.AccessInterface
-      model: Model
-      modelVariant: QVariant
+      default: Model
+      custom: Model
+      all: Model
 
   proc delete*(self: View) =
-    self.model.delete
-    self.modelVariant.delete
+    self.default.delete
+    self.default.delete
+    self.custom.delete
+    self.all.delete
     self.QObject.delete
 
   proc newView*(delegate: io_interface.AccessInterface): View =
     new(result, delete)
     result.QObject.setup
     result.delegate = delegate
-    result.model = newModel()
-    result.modelVariant = newQVariant(result.model)
+    result.default = newModel()
+    result.custom = newModel()
+    result.all = newModel()
 
-  proc modelChanged*(self: View) {.signal.}
+  proc allChanged*(self: View) {.signal.}
 
-  proc getModel(self: View): QVariant {.slot.} =
-    return self.modelVariant
+  proc getAll(self: View): QVariant {.slot.} =
+    return newQVariant(self.all)
 
-  QtProperty[QVariant] model:
-    read = getModel
-    notify = modelChanged
+  QtProperty[QVariant] all:
+    read = getAll
+    notify = allChanged
+
+  proc defaultChanged*(self: View) {.signal.}
+
+  proc getDefault(self: View): QVariant {.slot.} =
+    return newQVariant(self.default)
+
+  QtProperty[QVariant] default:
+    read = getDefault
+    notify = defaultChanged
+
+  proc customChanged*(self: View) {.signal.}
+
+  proc getCustom(self: View): QVariant {.slot.} =
+    return newQVariant(self.custom)
+
+  QtProperty[QVariant] custom:
+    read = getCustom
+    notify = customChanged
 
   proc setItems*(self: View, items: seq[Item]) =
-    self.model.setItems(items)
+    self.all.setItems(items)
+    self.custom.setItems(items.filter(i => i.getIsCustom()))
+    self.default.setItems(items.filter(i => not i.getIsCustom()))

src/app/modules/main/wallet_section/module.nim

@@ -1,7 +1,6 @@
 import eventemitter
 
 import ./io_interface as io_ingerface
-import ./view
 
 import ./account_tokens/module as account_tokens_module
 import ./accounts/module as accountsModule
@@ -23,7 +22,6 @@ export io_interface
 type 
   Module* [T: io_ingerface.DelegateInterface] = ref object of io_ingerface.AccessInterface
     delegate: T
-    view: View
     moduleLoaded: bool
 
     accountTokensModule: account_tokens_module.AccessInterface
@@ -44,7 +42,6 @@ proc newModule*[T](
 ): Module[T] =
   result = Module[T]()
   result.delegate = delegate
-  result.view = newView()
   result.moduleLoaded = false
   
   result.accountTokensModule = account_tokens_module.newModule(result, events)
@@ -61,7 +58,6 @@ method delete*[T](self: Module[T]) =
   self.collectiblesModule.delete
   self.mainAccountModule.delete
   self.transactionsModule.delete
-  self.view.delete
 
 method load*[T](self: Module[T]) =
   self.accountTokensModule.load()

src/app/modules/main/wallet_section/view.nim

@@ -1,15 +0,0 @@
-import NimQml
-
-QtObject:
-  type
-    View* = ref object of QObject
-      
-  proc setup(self: View) = 
-    self.QObject.setup
-
-  proc delete*(self: View) =
-    self.QObject.delete
-
-  proc newView*(): View =
-    new(result, delete)
-    result.setup()

src/app_service/service/token/dto.nim

@@ -16,7 +16,7 @@ type
     hasIcon* {.dontSerialize.}: bool
     color*: string
     isCustom* {.dontSerialize.}: bool
-    visible* {.dontSerialize.}: bool
+    isVisible* {.dontSerialize.}: bool
 
 proc newDto*(
   name: string, chainId: int, address: Address, symbol: string, decimals: int, hasIcon: bool, isCustom: bool = false
@@ -28,7 +28,7 @@ proc newDto*(
 proc toTokenDto*(jsonObj: JsonNode, activeTokenSymbols: seq[string]): TokenDto =
   result = TokenDto()
   result.isCustom = true
-  result.visible = false
+  result.isVisible = false
   discard jsonObj.getProp("name", result.name)
   discard jsonObj.getProp("chainId", result.chainId)
   discard jsonObj.getProp("address", result.address)
@@ -37,7 +37,7 @@ proc toTokenDto*(jsonObj: JsonNode, activeTokenSymbols: seq[string]): TokenDto =
   discard jsonObj.getProp("color", result.color)
 
   if activeTokenSymbols.contains(result.symbol):
-    result.visible = true
+    result.isVisible = true
 
 
   

src/app_service/service/token/service.nim

@@ -32,7 +32,7 @@ method init*(self: Service) =
 
     let static_tokens = static_token.all().map(
       proc(x: TokenDto): TokenDto = 
-        x.visible = activeTokenSymbols.contains(x.symbol)
+        x.isVisible = activeTokenSymbols.contains(x.symbol)
         return x
     )
 

src/app_service/service/wallet_account/service.nim

@@ -103,7 +103,7 @@ method init*(self: Service) =
       proc(x: JsonNode): WalletAccountDto = x.toWalletAccountDto()
     )
     let currency = self.settingService.getSetting().currency
-    let tokens = self.tokenService.getTokens().filter(t => t.visible)
+    let tokens = self.tokenService.getTokens().filter(t => t.isVisible)
     var prices = {"ETH": parsefloat(getPrice("ETH", currency))}.toTable
     for token in tokens:
       prices[token.symbol] = parsefloat(getPrice(token.symbol, currency))

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

@@ -15,7 +15,6 @@ Item {
 
     property var defaultTokenList
     property var customTokenList
-    property var hasAsset: function(symbol) {}
     signal toggleAssetClicked(string symbol)
     signal removeCustomTokenTriggered(string address)
 
@@ -70,7 +69,7 @@ Item {
             }
             StatusCheckBox  {
                 id: assetCheck
-                checked:modalBody.hasAsset(symbol)
+                checked: model.isVisible
                 anchors.right: parent.right
                 anchors.rightMargin: Style.current.smallPadding
                 onClicked: toggleAssetClicked(symbol)
@@ -139,6 +138,7 @@ Item {
             Column {
                 id: customTokens
                 spacing: Style.current.halfPadding
+                visible: { modalBody.customTokenList.count > 0 }
 
                 StyledText {
                     id: customLbl
@@ -156,13 +156,6 @@ Item {
                     anchors.top: customLbl.bottom
                     anchors.topMargin: Style.current.smallPadding
                 }
-
-                Connections {
-                    target: modalBody.customTokenList
-                    onTokensLoaded: {
-                        customLbl.visible = cnt > 0
-                    }
-                }
             }
 
             Column {

ui/app/AppLayouts/Wallet/popups/TokenSettingsModal.qml

@@ -14,10 +14,6 @@ ModalPopup {
     id: popup
     //% "Manage Assets"
     title: qsTrId("manage-assets")
-
-    onOpened: {
-        RootStore.loadCustomTokens()
-    }
     
     TokenSettingsModalContent {
         id: settingsModalContent
@@ -29,7 +25,6 @@ ModalPopup {
         anchors.rightMargin: Style.current.padding
         defaultTokenList: RootStore.defaultTokenList
         customTokenList: RootStore.customTokenList
-        hasAsset: function(symbol) { return RootStore.hasAsset(symbol) }
 
         onToggleAssetClicked: {
             RootStore.toggleAsset(symbol)

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

@@ -13,8 +13,10 @@ QtObject {
 
     property var transactions: walletModel.transactionsView.transactions
 
-    property var defaultTokenList: walletModel.tokensView.defaultTokenList
-    property var customTokenList: walletModel.tokensView.customTokenList
+    property var defaultTokenList: walletSectionAllTokens.default
+    property var customTokenList: walletSectionAllTokens.custom
+    property var tokens: walletSectionAllTokens.all
+
     property var assets: walletModel.tokensView.assets
 
     property string signingPhrase: walletModel.utilsView.signingPhrase
@@ -34,25 +36,6 @@ QtObject {
 
     //property bool firstTimeLogin: onboardingModel.isFirstTimeLogin
 
-    property var tokens: {
-        let count = walletModel.tokensView.defaultTokenList.rowCount()
-        const toks = []
-        for (let i = 0; i < count; i++) {
-            toks.push({
-                          "address": walletModel.tokensView.defaultTokenList.rowData(i, 'address'),
-                          "symbol": walletModel.tokensView.defaultTokenList.rowData(i, 'symbol')
-                      })
-        }
-        count = walletModel.tokensView.customTokenList.rowCount()
-        for (let j = 0; j < count; j++) {
-            toks.push({
-                          "address": walletModel.tokensView.customTokenList.rowData(j, 'address'),
-                          "symbol": walletModel.tokensView.customTokenList.rowData(j, 'symbol')
-                      })
-        }
-        return toks
-    }
-
     // example wallet model
     property ListModel exampleWalletModel: ListModel {
         ListElement {
@@ -134,10 +117,6 @@ QtObject {
         return walletModel.tokensView.addCustomToken(address, name, symbol, decimals)
     }
 
-    function loadCustomTokens() {
-        walletModel.tokensView.loadCustomTokens()
-    }
-
     function toggleAsset(symbol) {
         walletModel.tokensView.toggleAsset(symbol)
     }
@@ -146,10 +125,6 @@ QtObject {
         walletModel.tokensView.removeCustomToken(address)
     }
 
-    function hasAsset(symbol) {
-        return walletModel.tokensView.hasAsset(symbol)
-    }
-
     function getQrCode(address) {
         return profileModel.qrCode(address)
     }