status-desktop/ui/app/AppLayouts/Profile/views/SyncView.qml

195 lines
6.3 KiB
QML

import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick.Layouts 1.13
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
import utils 1.0
import shared.popups 1.0
import shared.controls 1.0
import "../stores"
Item {
id: root
property SyncStore syncStore
property int profileContentWidth
Layout.fillHeight: true
Layout.fillWidth: true
Item {
width: profileContentWidth
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.horizontalCenter: parent.horizontalCenter
Component {
id: mailserversList
// TODO: Replace with StatusQ component
StatusRadioButton {
id: rbSetMailsever
text: name
checked: nodeAddress === root.syncStore.activeMailserver
onClicked: {
if (checked) {
root.syncStore.setActiveMailserver(nodeAddress)
}
}
}
}
Item {
id: addMailserver
width: parent.width
height: addButton.height
anchors.top: parent.top
anchors.topMargin: 24
anchors.left: parent.left
anchors.leftMargin: 24
StatusFlatRoundButton {
id: addButton
icon.name: "add"
anchors.verticalCenter: parent.verticalCenter
}
StatusBaseText {
id: usernameText
//% "Add mailserver"
text: qsTrId("add-mailserver")
color: Theme.palette.primaryColor1
anchors.left: addButton.right
anchors.leftMargin: Style.current.padding
anchors.verticalCenter: addButton.verticalCenter
font.pixelSize: 15
}
MouseArea {
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onClicked: addMailserverPopup.open()
}
// TODO: replace with StatusModal
ModalPopup {
id: addMailserverPopup
//% "Add mailserver"
title: qsTrId("add-mailserver")
property string nameValidationError: ""
property string enodeValidationError: ""
function validate() {
nameValidationError = ""
enodeValidationError = ""
if (nameInput.text === "") {
//% "You need to enter a name"
nameValidationError = qsTrId("you-need-to-enter-a-name")
}
if (enodeInput.text === "") {
//% "You need to enter the enode address"
enodeValidationError = qsTrId("you-need-to-enter-the-enode-address")
}
return !nameValidationError && !enodeValidationError
}
onOpened: {
nameInput.text = "";
enodeInput.text = "";
nameValidationError = "";
enodeValidationError = "";
}
footer: StatusButton {
anchors.right: parent.right
anchors.rightMargin: Style.current.smallPadding
//% "Save"
text: qsTrId("save")
anchors.bottom: parent.bottom
enabled: nameInput.text !== "" && enodeInput.text !== ""
onClicked: {
if (!addMailserverPopup.validate()) {
return;
}
root.syncStore.saveNewMailserver(nameInput.text, enodeInput.text)
addMailserverPopup.close()
}
}
Input {
id: nameInput
//% "Name"
label: qsTrId("name")
//% "Specify a name"
placeholderText: qsTrId("specify-name")
validationError: addMailserverPopup.nameValidationError
}
Input {
id: enodeInput
//% "History node address"
label: qsTrId("history-node-address")
//% "enode://{enode-id}:{password}@{ip-address}:{port-number}"
placeholderText: qsTrId("enode----enode-id---password---ip-address---port-number-")
validationError: addMailserverPopup.enodeValidationError
anchors.top: nameInput.bottom
anchors.topMargin: Style.current.bigPadding
}
}
}
StatusBaseText {
id: switchLbl
//% "Automatic mailserver selection"
text: qsTrId("automatic-mailserver-selection")
anchors.left: parent.left
anchors.leftMargin: 24
anchors.top: addMailserver.bottom
anchors.topMargin: 24
color: Theme.palette.directColor1
}
StatusSwitch {
id: automaticSelectionSwitch
checked: root.syncStore.automaticMailserverSelection
onCheckedChanged: root.syncStore.enableAutomaticMailserverSelection(checked)
anchors.top: addMailserver.bottom
anchors.topMargin: Style.current.padding
anchors.left: switchLbl.right
anchors.leftMargin: Style.current.padding
}
StatusBaseText {
//% "..."
text: qsTr("Active mailserver: %1").arg(root.syncStore.getMailserverNameForNodeAddress(root.syncStore.activeMailserver))
anchors.left: parent.left
anchors.leftMargin: 24
anchors.top: switchLbl.bottom
anchors.topMargin: 24
visible: automaticSelectionSwitch.checked
color: Theme.palette.directColor1
}
ListView {
id: mailServersListView
anchors.topMargin: 20
anchors.top: automaticSelectionSwitch.bottom
anchors.bottom: parent.bottom
model: root.syncStore.mailservers
delegate: mailserversList
visible: !automaticSelectionSwitch.checked
}
}
}