mirror of
https://github.com/status-im/status-desktop.git
synced 2025-01-20 19:39:22 +00:00
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:
parent
662ff98f6a
commit
6379b17d95
@ -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 {
|
||||||
|
19
ui/app/AppLayouts/Node/stores/RootStore.qml
Normal file
19
ui/app/AppLayouts/Node/stores/RootStore.qml
Normal 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)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -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
|
Loading…
x
Reference in New Issue
Block a user