diff --git a/src/app/wallet/v2/core.nim b/src/app/wallet/v2/core.nim index 6b952fc62e..5352f85924 100644 --- a/src/app/wallet/v2/core.nim +++ b/src/app/wallet/v2/core.nim @@ -1,7 +1,7 @@ import NimQml, strformat, strutils, chronicles, sugar, sequtils import view -import views/[account_list, account_item] +import views/[account_list, account_item, networks] import status/[status, wallet2, settings] import status/wallet2/account as WalletTypes @@ -32,6 +32,10 @@ proc delete*(self: WalletController) = proc init*(self: WalletController) = self.status.wallet2.init() + self.view.networksView.updateNetworks(self.status.wallet2.networks) + self.view.setSigningPhrase(self.status.settings.getSetting[:string](Setting.SigningPhrase)) + self.view.setEtherscanLink(self.status.settings.getCurrentNetworkDetails().etherscanLink) + var accounts = self.status.wallet2.getAccounts() for account in accounts: self.view.addAccountToList(account) @@ -44,13 +48,11 @@ proc init*(self: WalletController) = self.view.addAccountToList(account.account) self.view.updateView() + self.status.events.on("cryptoServicesFetched") do(e: Args): + var args = CryptoServicesArg(e) + self.view.onCryptoServicesFetched(args.services) + self.status.events.on(SignalType.Wallet.event) do(e:Args): var data = WalletSignal(e) debug "TODO: handle wallet signal", signalType=data.eventType - - self.view.setSigningPhrase(self.status.settings.getSetting[:string](Setting.SigningPhrase)) - self.view.setEtherscanLink(self.status.settings.getCurrentNetworkDetails().etherscanLink) - self.status.events.on("cryptoServicesFetched") do(e: Args): - var args = CryptoServicesArg(e) - self.view.onCryptoServicesFetched(args.services) \ No newline at end of file diff --git a/src/app/wallet/v2/view.nim b/src/app/wallet/v2/view.nim index 98f01828d1..4ee454aa2e 100644 --- a/src/app/wallet/v2/view.nim +++ b/src/app/wallet/v2/view.nim @@ -2,7 +2,7 @@ import atomics, strformat, strutils, sequtils, json, std/wrapnils, parseUtils, t import NimQml, chronicles, stint import status/[status, wallet2] -import views/[accounts, account_list, collectibles, settings] +import views/[accounts, account_list, collectibles, settings, networks] import views/buy_sell_crypto/[service_controller] import ../../../app_service/[main] @@ -14,6 +14,7 @@ QtObject: accountsView: AccountsView collectiblesView: CollectiblesView settingsView*: SettingsView + networksView*: NetworksView cryptoServiceController: CryptoServiceController proc delete(self: WalletView) = @@ -22,6 +23,7 @@ QtObject: self.cryptoServiceController.delete self.QAbstractListModel.delete self.settingsView.delete + self.networksView.delete proc setup(self: WalletView) = self.QAbstractListModel.setup @@ -33,24 +35,27 @@ QtObject: result.accountsView = newAccountsView(status) result.collectiblesView = newCollectiblesView(status, appService) result.settingsView = newSettingsView() + result.networksView = newNetworksView() result.cryptoServiceController = newCryptoServiceController(status, appService) result.setup proc getAccounts(self: WalletView): QVariant {.slot.} = newQVariant(self.accountsView) - QtProperty[QVariant] accountsView: read = getAccounts proc getCollectibles(self: WalletView): QVariant {.slot.} = return newQVariant(self.collectiblesView) + QtProperty[QVariant] collectiblesView: + read = getCollectibles proc getSettings(self: WalletView): QVariant {.slot.} = newQVariant(self.settingsView) QtProperty[QVariant] settingsView: read = getSettings - QtProperty[QVariant] collectiblesView: - read = getCollectibles + proc getNetworks(self: WalletView): QVariant {.slot.} = newQVariant(self.networksView) + QtProperty[QVariant] networksView: + read = getNetworks proc updateView*(self: WalletView) = # TODO: diff --git a/src/app/wallet/v2/views/network_list.nim b/src/app/wallet/v2/views/network_list.nim new file mode 100644 index 0000000000..150506210b --- /dev/null +++ b/src/app/wallet/v2/views/network_list.nim @@ -0,0 +1,68 @@ +import NimQml, Tables, chronicles +from status/wallet2/network import Network + +logScope: + topics = "networks-view" + +type + NetworkRoles {.pure.} = enum + ChainId = UserRole + 1, + ChainName = UserRole + 2, + Enabled = UserRole + 3, + +QtObject: + type NetworkList* = ref object of QAbstractListModel + networks*: seq[Network] + + proc setup(self: NetworkList) = self.QAbstractListModel.setup + + proc delete(self: NetworkList) = + self.networks = @[] + self.QAbstractListModel.delete + + proc newNetworkList*(): NetworkList = + new(result, delete) + result.networks = @[] + result.setup + + proc networksChanged*(self: NetworkList) {.signal.} + + proc getNetwork*(self: NetworkList, index: int): Network = self.networks[index] + + proc rowData(self: NetworkList, index: int, column: string): string {.slot.} = + if (index >= self.networks.len): + return + + let network = self.networks[index] + case column: + of "chainId": result = $network.chainId + of "chainName": result = network.chainName + of "enabled": result = $network.enabled + + method rowCount*(self: NetworkList, index: QModelIndex = nil): int = + return self.networks.len + + method data(self: NetworkList, index: QModelIndex, role: int): QVariant = + if not index.isValid: + return + + if index.row < 0 or index.row >= self.networks.len: + return + + let network = self.networks[index.row] + let networkRole = role.NetworkRoles + case networkRole: + of NetworkRoles.ChainId: result = newQVariant(network.chainId) + of NetworkRoles.ChainName: result = newQVariant(network.chainName) + of NetworkRoles.Enabled: result = newQVariant(network.enabled) + + method roleNames(self: NetworkList): Table[int, string] = + { NetworkRoles.ChainId.int:"chainId", + NetworkRoles.ChainName.int:"chainName", + NetworkRoles.Enabled.int:"enabled"}.toTable + + proc setData*(self: NetworkList, networks: seq[Network]) = + self.beginResetModel() + self.networks = networks + self.endResetModel() + self.networksChanged() \ No newline at end of file diff --git a/src/app/wallet/v2/views/networks.nim b/src/app/wallet/v2/views/networks.nim new file mode 100644 index 0000000000..5fb1d923cf --- /dev/null +++ b/src/app/wallet/v2/views/networks.nim @@ -0,0 +1,37 @@ +import NimQml, chronicles, sequtils, sugar +from status/wallet2/network import Network, `$` + +import ./network_list + +logScope: + topics = "networks-view" + +QtObject: + type NetworksView* = ref object of QObject + allNetworks: NetworkList + enabledNetworks: NetworkList + + proc setup(self: NetworksView) = self.QObject.setup + proc delete(self: NetworksView) = self.QObject.delete + + proc newNetworksView*(): NetworksView = + new(result, delete) + result.allNetworks = newNetworkList() + result.enabledNetworks = newNetworkList() + result.setup + + proc updateNetworks*(self: NetworksView, networks: seq[Network]) = + self.allNetworks.setData(networks) + self.enabledNetworks.setData(networks.filter(network => network.enabled)) + + proc getAllNetworks(self: NetworksView): QVariant {.slot.} = + return newQVariant(self.allNetworks) + + QtProperty[QVariant] allNetworks: + read = getAllNetworks + + proc getEnabledNetworks(self: NetworksView): QVariant {.slot.} = + return newQVariant(self.enabledNetworks) + + QtProperty[QVariant] enabledNetworks: + read = getEnabledNetworks \ No newline at end of file diff --git a/ui/app/AppLayouts/WalletV2/WalletHeader.qml b/ui/app/AppLayouts/WalletV2/WalletHeader.qml index b328633947..e1405a7701 100644 --- a/ui/app/AppLayouts/WalletV2/WalletHeader.qml +++ b/ui/app/AppLayouts/WalletV2/WalletHeader.qml @@ -5,6 +5,7 @@ import "../../../imports" import "../../../shared" import "../../../shared/status" import "./components" +import "./components/network" Item { property var currentAccount: walletV2Model.accountsView.currentAccount @@ -24,7 +25,7 @@ Item { Row { id: accountRow anchors.top: parent.top - anchors.topMargin: 56 + anchors.topMargin: 24 anchors.left: parent.left anchors.leftMargin: 24 @@ -54,6 +55,7 @@ Item { text: currentAccount.balance.toUpperCase() font.pixelSize: 22 } + } MouseArea { @@ -74,82 +76,12 @@ Item { anchors.topMargin: 0 } - Item { - property int btnMargin: 8 - property int btnOuterMargin: Style.current.bigPadding - id: walletMenu - width: sendBtn.width + receiveBtn.width + settingsBtn.width - + walletMenu.btnOuterMargin * 2 + NetworkSelect { + id: networkSelect anchors.top: parent.top - anchors.topMargin: 16 + anchors.topMargin: 30 anchors.right: parent.right - anchors.rightMargin: 16 - - HeaderButton { - id: sendBtn - imageSource: "../../img/send.svg" - //% "Send" - text: qsTrId("command-button-send") - onClicked: () => console.log("TODO"); - } - - HeaderButton { - id: receiveBtn - imageSource: "../../img/send.svg" - flipImage: true - //% "Receive" - text: qsTrId("receive") - onClicked: () => console.log("TODO") - anchors.left: sendBtn.right - anchors.leftMargin: walletMenu.btnOuterMargin - } - - HeaderButton { - id: settingsBtn - imageSource: "../../img/settings.svg" - flipImage: true - text: "" - onClicked: function () { - if (newSettingsMenu.opened) { - newSettingsMenu.close() - } else { - let x = settingsBtn.x + settingsBtn.width / 2 - newSettingsMenu.width / 2 - newSettingsMenu.popup(x, settingsBtn.height) - } - } - anchors.left: receiveBtn.right - anchors.leftMargin: walletMenu.btnOuterMargin - - PopupMenu { - id: newSettingsMenu - closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent - width: 176 - Action { - //% "Account Settings" - text: qsTrId("account-settings") - icon.source: "../../img/manage-wallet.svg" - icon.width: 16 - icon.height: 16 - onTriggered: console.log("TODO") - } - Action { - //% "Manage Assets" - text: qsTrId("manage-assets") - icon.source: "../../img/add_remove_token.svg" - icon.width: 16 - icon.height: 16 - onTriggered: console.log("TODO") - } - Action { - //% "Set Currency" - text: qsTrId("set-currency") - icon.source: "../../img/currency.svg" - icon.width: 16 - icon.height: 16 - onTriggered: console.log("TODO") - } - } - } + anchors.rightMargin: 90 } Component { diff --git a/ui/app/AppLayouts/WalletV2/components/network/NetworkFilter.qml b/ui/app/AppLayouts/WalletV2/components/network/NetworkFilter.qml new file mode 100644 index 0000000000..05cea17431 --- /dev/null +++ b/ui/app/AppLayouts/WalletV2/components/network/NetworkFilter.qml @@ -0,0 +1,32 @@ +import QtQuick 2.13 +import "../../../../../shared" +import "../../../../../imports" + +Grid { + id: root + columns: 2 + spacing: 2 + + Repeater { + id: chainRepeater + model: walletV2Model.networksView.enabledNetworks + width: parent.width + height: parent.height + + Rectangle { + color: Utils.setColorAlpha(Style.current.blue, 0.1) + width: text.width + Style.current.halfPadding + height: text.height + Style.current.halfPadding + radius: Style.current.radius + + StyledText { + id: text + text: model.chainName + color: Style.current.blue + font.pixelSize: Style.current.secondaryTextFontSize + anchors.verticalCenter: parent.verticalCenter + anchors.horizontalCenter: parent.horizontalCenter + } + } + } +} \ No newline at end of file diff --git a/ui/app/AppLayouts/WalletV2/components/network/NetworkSelect.qml b/ui/app/AppLayouts/WalletV2/components/network/NetworkSelect.qml new file mode 100644 index 0000000000..812b39f2cf --- /dev/null +++ b/ui/app/AppLayouts/WalletV2/components/network/NetworkSelect.qml @@ -0,0 +1,62 @@ +import QtQuick 2.13 +import "../../../../../shared" +import "../../../../../imports" + +Item { + id: root + + width: selectRectangle.width + Style.current.padding + + Rectangle { + id: selectRectangle + border.width: 1 + border.color: Style.current.border + radius: Style.current.radius + width: text.width + Style.current.padding * 4 + height: text.height + Style.current.padding + + StyledText { + id: text + text: qsTr("All networks") + anchors.left: parent.left + anchors.leftMargin: Style.current.padding + anchors.verticalCenter: parent.verticalCenter + font.pixelSize: Style.current.primaryTextFontSize + } + + SVGImage { + id: caretImg + width: 10 + height: 6 + source: "../../../../../app/img/caret.svg" + anchors.right: parent.right + anchors.rightMargin: Style.current.padding + anchors.verticalCenter: parent.verticalCenter + fillMode: Image.PreserveAspectFit + } + } + + MouseArea { + anchors.fill: selectRectangle + cursorShape: Qt.PointingHandCursor + onClicked: { + if (selectPopup.opened) { + selectPopup.close() + return + } + selectPopup.open() + } + } + + NetworkFilter { + anchors.topMargin: Style.current.halfPadding + anchors.top: selectRectangle.bottom + width: root.width + } + + NetworkSelectPopup { + id: selectPopup + y: root.height + root.anchors.topMargin + Style.current.padding + x: parent.width - width - Style.current.padding + } +} \ No newline at end of file diff --git a/ui/app/AppLayouts/WalletV2/components/network/NetworkSelectPopup.qml b/ui/app/AppLayouts/WalletV2/components/network/NetworkSelectPopup.qml new file mode 100644 index 0000000000..756d82b43a --- /dev/null +++ b/ui/app/AppLayouts/WalletV2/components/network/NetworkSelectPopup.qml @@ -0,0 +1,74 @@ +import QtQuick 2.13 +import QtQuick.Controls 2.13 +import QtQuick.Layouts 1.3 +import QtGraphicalEffects 1.0 +import StatusQ.Components 0.1 +import StatusQ.Controls 0.1 +import "../../../../../imports" +import "../../../../../shared" + +Popup { + id: popup + modal: false + width: 360 + height: 432 + closePolicy: Popup.CloseOnEscape + + background: Rectangle { + radius: Style.current.radius + color: Style.current.background + border.color: Style.current.border + layer.enabled: true + layer.effect: DropShadow{ + verticalOffset: 3 + radius: 8 + samples: 15 + fast: true + cached: true + color: "#22000000" + } + } + + contentItem: ScrollView { + id: scrollView + contentHeight: content.height + width: popup.width + height: popup.height + + ScrollBar.horizontal.policy: ScrollBar.AlwaysOff + clip: true + + Column { + id: content + width: popup.width + spacing: Style.current.padding + + Repeater { + id: chainRepeater + model: walletV2Model.networksView.allNetworks + + Item { + width: content.width + height: 40 + StyledText { + anchors.left: parent.left + anchors.leftMargin: Style.current.bigPadding + anchors.verticalCenter: parent.verticalCenter + font.pixelSize: Style.current.primaryTextFontSize + text: model.chainName + } + + StatusCheckBox { + anchors.right: parent.right + anchors.rightMargin: Style.current.bigPadding + anchors.verticalCenter: parent.verticalCenter + checked: model.enabled + onCheckedChanged: { + console.log("TODO: Not yet implemented") + } + } + } + } + } + } +} diff --git a/ui/app/AppLayouts/WalletV2/components/network/qmldir b/ui/app/AppLayouts/WalletV2/components/network/qmldir new file mode 100644 index 0000000000..4a2a401ff1 --- /dev/null +++ b/ui/app/AppLayouts/WalletV2/components/network/qmldir @@ -0,0 +1 @@ +NetworkSelect 1.0 NetworkSelect.qml \ No newline at end of file