status-desktop/ui/app/AppLayouts/Profile/popups/RenameAccontModal.qml

139 lines
4.2 KiB
QML

import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick.Layouts 1.13
import QtQuick.Dialogs 1.3
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
import StatusQ.Popups 0.1
import StatusQ.Controls.Validators 0.1
import utils 1.0
import shared.panels 1.0
import shared.controls 1.0
import "../stores"
StatusModal {
id: popup
property WalletStore walletStore
property var currentAccount: walletStore.currentAccount
property var emojiPopup
//% "'%1' would like to connect to"
header.title: qsTr("Rename %1").arg(currentAccount.name)
property int marginBetweenInputs: 30
onOpened: {
accountNameInput.forceActiveFocus(Qt.MouseFocusReason)
}
Connections {
enabled: popup.opened
target: emojiPopup
onEmojiSelected: function (emojiText, atCursor) {
popup.contentItem.accountNameInput.input.icon.emoji = emojiText
}
}
contentItem: Column {
property alias accountNameInput: accountNameInput
width: popup.width
spacing: marginBetweenInputs
topPadding: Style.current.padding
StatusInput {
id: accountNameInput
//% "Enter an account name..."
input.isIconSelectable: true
input.placeholderText: qsTrId("enter-an-account-name...")
input.text: currentAccount.name
input.icon.emoji: currentAccount.emoji
input.icon.color: currentAccount.color
input.icon.name: !currentAccount.emoji ? "filled-account": ""
onIconClicked: {
popup.emojiPopup.open()
popup.emojiPopup.x = popup.x + accountNameInput.x + Style.current.padding
popup.emojiPopup.y = popup.y + contentItem.y + accountNameInput.y + accountNameInput.height + Style.current.halfPadding
}
validators: [
StatusMinLengthValidator {
//% "You need to enter an account name"
errorMessage: qsTrId("you-need-to-enter-an-account-name")
minLength: 1
},
StatusRegularExpressionValidator {
regularExpression: /^[^<>]+$/
errorMessage: qsTr("This is not a valid account name")
}
]
charLimit: 40
}
StatusColorSelectorGrid {
id: accountColorInput
anchors.top: selectedColor.bottom
anchors.topMargin: 10
anchors.horizontalCenter: parent.horizontalCenter
//% "color"
titleText: qsTr("color").toUpperCase()
selectedColor: currentAccount.color
selectedColorIndex: {
for (let i = 0; i < model.length; i++) {
if(model[i] === currentAccount.color)
return i
}
}
onSelectedColorChanged: {
if(selectedColor !== currentAccount.color) {
accountNameInput.input.icon.color = selectedColor
}
}
}
Item {
width: parent.width
height: 8
}
}
rightButtons: [
StatusButton {
id: saveBtn
//% "Change Name"
text: qsTr("Change Name")
enabled: accountNameInput.text !== "" && accountNameInput.valid
MessageDialog {
id: changeError
title: qsTr("Changing settings failed")
icon: StandardIcon.Critical
standardButtons: StandardButton.Ok
}
onClicked : {
if (!accountNameInput.valid) {
return
}
const error = walletStore.updateCurrentAccount(currentAccount.address, accountNameInput.text, accountColorInput.selectedColor, accountNameInput.input.icon.emoji);
if (error) {
Global.playErrorSound();
changeError.text = error
changeError.open()
return
}
popup.close();
}
}
]
}