status-desktop/ui/app/AppLayouts/Chat/controls/community/EnsPanel.qml

114 lines
3.0 KiB
QML
Raw Normal View History

import QtQuick 2.14
import QtQuick.Layouts 1.14
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
import StatusQ.Components 0.1
import StatusQ.Controls.Validators 0.1
ColumnLayout {
id: root
enum EnsType {
Any,
CustomSubdomain
}
property int ensType: EnsPanel.EnsType.Any
property alias domainName: domainNameInput.text
property alias domainNameValid: domainNameInput.valid
spacing: 0
QtObject {
id: d
// values from design
readonly property int pickerHeight: 36
readonly property int pickerFontSize: 13
readonly property int pickerLeftPadding: 12
readonly property int pickerRightPadding: 9
}
// TODO (>=5.15): use inline components to reduce code duplication
StatusListItem {
title: qsTr("Any domain")
Layout.fillWidth: true
Layout.preferredHeight: d.pickerHeight
leftPadding: d.pickerLeftPadding
rightPadding: d.pickerRightPadding
statusListItemTitle.font.pixelSize: d.pickerFontSize
components: [
StatusRadioButton {
checked: root.ensType === EnsPanel.EnsType.Any
size: StatusRadioButton.Size.Small
}
]
// using MouseArea instead of build-in 'clicked' signal to avoid
// intercepting event by the StatusRadioButton
MouseArea {
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onClicked: root.ensType = EnsPanel.EnsType.Any
}
}
StatusListItem {
title: qsTr("Custom subdomain")
Layout.fillWidth: true
Layout.preferredHeight: d.pickerHeight
leftPadding: d.pickerLeftPadding
rightPadding: d.pickerRightPadding
statusListItemTitle.font.pixelSize: d.pickerFontSize
components: [
StatusRadioButton {
checked: root.ensType === EnsPanel.EnsType.CustomSubdomain
size: StatusRadioButton.Size.Small
}
]
MouseArea {
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onClicked: root.ensType = EnsPanel.EnsType.CustomSubdomain
}
}
StatusInput {
id: domainNameInput
Layout.fillWidth: true
Layout.topMargin: 8
minimumHeight: 36
maximumHeight: 36
topPadding: 0
bottomPadding: 0
font.pixelSize: 13
input.placeholderText: "name.eth"
visible: root.ensType === EnsPanel.EnsType.CustomSubdomain
validators: StatusRegularExpressionValidator {
// TODO: check ens domain validator
regularExpression: /^[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)?$/ig
errorMessage: qsTr("Subdomain not recognized")
}
Component.onCompleted: {
if (text) {
input.dirty = true
validate()
}
}
}
}