refactor(@desktop/node-management): move to stores architecture

This refactors the node management module to use the stores/views/popups
architecture.

Closes #3711
This commit is contained in:
Pascal Precht 2021-10-06 12:23:01 +02:00 committed by Iuri Matias
parent 662ff98f6a
commit 6379b17d95
3 changed files with 73 additions and 42 deletions

View File

@ -2,31 +2,35 @@ import QtQuick 2.13
import QtQuick.Controls 2.13 import QtQuick.Controls 2.13
import QtQuick.Layouts 1.13 import QtQuick.Layouts 1.13
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import utils 1.0 import utils 1.0
import "../../../shared" import "../../../shared"
import "../../../shared/status"
import "stores"
import "views"
Item { Item {
id: nodeView id: root
Layout.fillHeight: true Layout.fillHeight: true
Layout.fillWidth: true Layout.fillWidth: true
property var store: RootStore {}
ColumnLayout { ColumnLayout {
id: rpcColumn id: rpcColumn
spacing: 0 spacing: 0
anchors.fill: parent anchors.fill: parent
Rate { RateView {}
}
RowLayout { RowLayout {
id: peerContainer2 id: peerContainer2
Layout.fillWidth: true Layout.fillWidth: true
StyledText { StatusBaseText {
id: peerDescription id: peerDescription
color: Style.current.lightBlueText color: Theme.palette.primaryColor1
text: "Peers" text: "Peers"
Layout.rightMargin: Style.current.padding Layout.rightMargin: Style.current.padding
Layout.leftMargin: Style.current.padding Layout.leftMargin: Style.current.padding
@ -34,10 +38,10 @@ Item {
font.weight: Font.Medium font.weight: Font.Medium
font.pixelSize: 20 font.pixelSize: 20
} }
StyledText { StatusBaseText {
id: peerNumber id: peerNumber
color: Style.current.lightBlueText color: Theme.palette.primaryColor1
text: nodeModel.peerSize text: root.store.nodeModelInst.peerSize
Layout.rightMargin: Style.current.padding Layout.rightMargin: Style.current.padding
Layout.leftMargin: Style.current.padding Layout.leftMargin: Style.current.padding
Layout.fillWidth: true Layout.fillWidth: true
@ -49,8 +53,8 @@ Item {
RowLayout { RowLayout {
id: bloomF id: bloomF
Layout.fillWidth: true Layout.fillWidth: true
StyledText { StatusBaseText {
color: Style.current.lightBlueText color: Theme.palette.primaryColor1
text: qsTr("Bloom Filter Usage") text: qsTr("Bloom Filter Usage")
Layout.rightMargin: Style.current.padding Layout.rightMargin: Style.current.padding
Layout.leftMargin: Style.current.padding Layout.leftMargin: Style.current.padding
@ -58,10 +62,10 @@ Item {
font.weight: Font.Medium font.weight: Font.Medium
font.pixelSize: 20 font.pixelSize: 20
} }
StyledText { StatusBaseText {
id: bloomPerc id: bloomPerc
color: Style.current.lightBlueText color: Theme.palette.primaryColor1
text: ((nodeModel.bloomBits / 512) * 100).toFixed(2) + "%" text: ((root.store.nodeModelInst.bloomBits / 512) * 100).toFixed(2) + "%"
Layout.rightMargin: Style.current.padding Layout.rightMargin: Style.current.padding
Layout.leftMargin: Style.current.padding Layout.leftMargin: Style.current.padding
Layout.fillWidth: true Layout.fillWidth: true
@ -72,8 +76,8 @@ Item {
RowLayout { RowLayout {
Layout.fillWidth: true Layout.fillWidth: true
StyledText { StatusBaseText {
color: Style.current.lightBlueText color: Theme.palette.primaryColor1
text: qsTr("Active Mailserver") text: qsTr("Active Mailserver")
Layout.rightMargin: Style.current.padding Layout.rightMargin: Style.current.padding
Layout.leftMargin: Style.current.padding Layout.leftMargin: Style.current.padding
@ -81,9 +85,9 @@ Item {
font.weight: Font.Medium font.weight: Font.Medium
font.pixelSize: 20 font.pixelSize: 20
} }
StyledText { StatusBaseText {
id: activeMailserverTxt id: activeMailserverTxt
color: Style.current.textColor color: Theme.palette.directColor1
text: "..." text: "..."
Layout.rightMargin: Style.current.padding Layout.rightMargin: Style.current.padding
Layout.leftMargin: Style.current.padding Layout.leftMargin: Style.current.padding
@ -95,17 +99,17 @@ Item {
} }
Connections { Connections {
target: profileModel.mailservers target: root.store.profileModelInst.mailservers
onActiveMailserverChanged: (activeMailserver) => { onActiveMailserverChanged: (activeMailserver) => {
activeMailserverTxt.text = profileModel.mailservers.list.getMailserverName(activeMailserver) + "\n" + activeMailserver activeMailserverTxt.text = root.store.getMailserverName(activeMailserver) + "\n" + activeMailserver
} }
} }
ColumnLayout { ColumnLayout {
id: mailserverLogsContainer id: mailserverLogsContainer
height: 300 height: 300
StyledText { StatusBaseText {
color: Style.current.lightBlueText color: Theme.palette.primaryColor1
text: "Mailserver Interactions:" text: "Mailserver Interactions:"
Layout.rightMargin: Style.current.padding Layout.rightMargin: Style.current.padding
Layout.leftMargin: Style.current.padding Layout.leftMargin: Style.current.padding
@ -113,6 +117,7 @@ Item {
font.weight: Font.Medium font.weight: Font.Medium
font.pixelSize: 20 font.pixelSize: 20
} }
// TODO: replace with StatusTextArea once it lives in StatusQ.
StyledTextArea { StyledTextArea {
id: mailserverLogTxt id: mailserverLogTxt
text: "" text: ""
@ -124,9 +129,9 @@ Item {
ColumnLayout { ColumnLayout {
id: logContainer id: logContainer
height: 300 height: 300
StyledText { StatusBaseText {
id: logHeaderDesc id: logHeaderDesc
color: Style.current.lightBlueText color: Theme.palette.primaryColor1
text: "Logs:" text: "Logs:"
Layout.rightMargin: Style.current.padding Layout.rightMargin: Style.current.padding
Layout.leftMargin: Style.current.padding Layout.leftMargin: Style.current.padding
@ -134,6 +139,7 @@ Item {
font.weight: Font.Medium font.weight: Font.Medium
font.pixelSize: 20 font.pixelSize: 20
} }
// TODO: replace with StatusTextArea once it lives in StatusQ.
StyledTextArea { StyledTextArea {
id: logsTxt id: logsTxt
text: "" text: ""
@ -143,7 +149,7 @@ Item {
} }
Connections { Connections {
target: nodeModel target: root.store.nodeModelInst
function onLog(logContent) { function onLog(logContent) {
// TODO: this is ugly, but there's not even a design for this section // TODO: this is ugly, but there's not even a design for this section
if(logContent.indexOf("mailserver") > 0){ if(logContent.indexOf("mailserver") > 0){
@ -167,9 +173,9 @@ Item {
ColumnLayout { ColumnLayout {
id: messageContainer id: messageContainer
Layout.fillHeight: true Layout.fillHeight: true
StyledText { StatusBaseText {
id: testDescription id: testDescription
color: Style.current.lightBlueText color: Theme.palette.primaryColor1
text: "latest block (auto updates):" text: "latest block (auto updates):"
Layout.rightMargin: Style.current.padding Layout.rightMargin: Style.current.padding
Layout.leftMargin: Style.current.padding Layout.leftMargin: Style.current.padding
@ -177,10 +183,10 @@ Item {
font.weight: Font.Medium font.weight: Font.Medium
font.pixelSize: 20 font.pixelSize: 20
} }
StyledText { StatusBaseText {
id: test id: test
color: Style.current.lightBlueText color: Theme.palette.primaryColor1
text: nodeModel.lastMessage text: root.store.nodeModelInst.lastMessage
Layout.rightMargin: Style.current.padding Layout.rightMargin: Style.current.padding
Layout.leftMargin: Style.current.padding Layout.leftMargin: Style.current.padding
Layout.fillWidth: true Layout.fillWidth: true
@ -194,6 +200,7 @@ Item {
Layout.fillHeight: true Layout.fillHeight: true
Layout.rightMargin: Style.current.padding Layout.rightMargin: Style.current.padding
Layout.leftMargin: Style.current.padding Layout.leftMargin: Style.current.padding
// TODO: replace with StatusTextArea once it lives in StatusQ.
TextArea { id: callResult; Layout.fillWidth: true; text: nodeModel.callResult; readOnly: true } TextArea { id: callResult; Layout.fillWidth: true; text: nodeModel.callResult; readOnly: true }
} }
@ -255,11 +262,11 @@ Item {
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: 24 anchors.leftMargin: 24
Keys.onEnterPressed: { Keys.onEnterPressed: {
nodeModel.onSend(txtData.text) root.store.onSend(txtData.text)
txtData.text = "" txtData.text = ""
} }
Keys.onReturnPressed: { Keys.onReturnPressed: {
nodeModel.onSend(txtData.text) root.store.onSend(txtData.text)
txtData.text = "" txtData.text = ""
} }
background: Rectangle { background: Rectangle {

View File

@ -0,0 +1,19 @@
import QtQuick 2.13
import utils 1.0
QtObject {
id: root
property var nodeModelInst: nodeModel
property var profileModelInst: profileModel
function getMailserverName(activeMailServer) {
return profileModelInst.mailservers.list.getMailserverName(activeMailServer)
}
function onSend(text) {
nodeModelInst.onSend(text)
}
}

View File

@ -2,9 +2,12 @@ import QtQuick 2.13
import QtQuick.Controls 2.13 import QtQuick.Controls 2.13
import QtQuick.Layouts 1.13 import QtQuick.Layouts 1.13
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import utils 1.0 import utils 1.0
import "../../../shared" import "../../../../shared"
import "../../../shared/status" import "../../../../shared/status"
Column { Column {
@ -18,7 +21,7 @@ Column {
Row { Row {
width: parent.width width: parent.width
spacing: 10 spacing: 10
StyledText { StatusBaseText {
text: qsTr("Upload") text: qsTr("Upload")
width: 250 width: 250
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
@ -27,6 +30,7 @@ Column {
Item { Item {
width: 140 width: 140
height: 44 height: 44
// TODO: replace with StatusInput from StatusQ at some point
Input { Input {
id: uploadRate id: uploadRate
text: Math.round(parseInt(nodeModel.uploadRate, 10) / 1024 * 100) / 100 text: Math.round(parseInt(nodeModel.uploadRate, 10) / 1024 * 100) / 100
@ -37,8 +41,8 @@ Column {
anchors.top: parent.top anchors.top: parent.top
} }
StyledText { StatusBaseText {
color: Style.current.secondaryText color: Theme.palette.directColor7
text: qsTr("Kb/s") text: qsTr("Kb/s")
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.right: uploadRate.right anchors.right: uploadRate.right
@ -47,7 +51,7 @@ Column {
} }
} }
StyledText { StatusBaseText {
text: qsTr("Download") text: qsTr("Download")
width: 273 width: 273
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
@ -56,6 +60,7 @@ Column {
Item { Item {
width: 140 width: 140
height: 44 height: 44
// TODO: replace with StatusInput from StatusQ at some point
Input { Input {
id: downloadRate id: downloadRate
text: Math.round(parseInt(nodeModel.downloadRate, 10) / 1024 * 100) / 100 text: Math.round(parseInt(nodeModel.downloadRate, 10) / 1024 * 100) / 100
@ -66,8 +71,8 @@ Column {
anchors.top: parent.top anchors.top: parent.top
} }
StyledText { StatusBaseText {
color: Style.current.secondaryText color: Theme.palette.directColor7
text: qsTr("Kb/s") text: qsTr("Kb/s")
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.right: downloadRate.right anchors.right: downloadRate.right