status-desktop/ui/imports/shared/popups/RenameGroupPopup.qml

136 lines
4.3 KiB
QML

import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import QtQml.Models 2.15
import shared.controls 1.0
import shared.panels 1.0
import utils 1.0
import StatusQ.Components 0.1
import StatusQ.Controls 0.1
import StatusQ.Controls.Validators 0.1
import StatusQ.Core 0.1
import StatusQ.Popups 0.1
import StatusQ.Popups.Dialog 0.1
StatusDialog {
id: root
objectName: "groupChatEdit_main"
property string activeGroupImageData
property string activeGroupColor
property string activeGroupName
signal updateGroupChatDetails(string groupName, string groupColor, string groupImage)
title: qsTr("Edit group name and image")
width: 480
padding: 0
QtObject {
id: d
readonly property int nameCharLimit: 30 // cf spec: https://github.com/status-im/feature-specs/blob/d66c586f13cb1fa0486544030148df68e06928f0/content/raw/chat/group_chat.md
}
onOpened: {
groupName.input.edit.forceActiveFocus()
groupName.text = root.activeGroupName.substring(0, d.nameCharLimit)
colorSelectionGrid.selectedColor = activeGroupColor
for (let i = 0; i < colorSelectionGrid.model.length; i++) {
if(colorSelectionGrid.model[i].toString().toUpperCase() === root.activeGroupColor.toUpperCase())
colorSelectionGrid.selectedColorIndex = i
}
imageEditor.dataImage = activeGroupImageData
}
StatusScrollView {
id: scrollView
anchors.fill: parent
contentWidth: availableWidth
ColumnLayout {
width: scrollView.availableWidth
spacing: 20
StatusInput {
id: groupName
input.edit.objectName: "groupChatEdit_name"
Layout.alignment: Qt.AlignHCenter
label: qsTr("Name the group")
charLimit: d.nameCharLimit
validators: [
StatusMinLengthValidator {
minLength: 1
errorMessage: Utils.getErrorMessage(groupName.errors, qsTr("group name"))
},
StatusRegularExpressionValidator {
regularExpression: Constants.regularExpressions.alphanumericalExpanded2
errorMessage: Constants.errorMessages.alphanumericalExpandedRegExp
}
]
}
StatusBaseText {
id: imgText
text: qsTr("Group image")
}
EditCroppedImagePanel {
id: imageEditor
objectName: "groupChatEdit_image"
Layout.preferredWidth: 128
Layout.preferredHeight: Layout.preferredWidth / aspectRatio
Layout.alignment: Qt.AlignHCenter
imageFileDialogTitle: qsTr("Choose an image as logo")
title: qsTr("Edit group name and image")
acceptButtonText: qsTr("Use as an icon for this group chat")
}
StatusBaseText {
id: colorText
text: qsTr("Standard colours")
}
StatusColorSelectorGrid {
id: colorSelectionGrid
objectName: "groupChatEdit_color"
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: -(parent.spacing / 3)
diameter: 40
selectorDiameter: 16
columns: 6
selectedColorIndex: -1
}
Item {
id: spacerItem
height: 10
}
}
}
footer: StatusDialogFooter {
rightButtons: ObjectModel {
StatusButton {
id: saveBtn
objectName: "groupChatEdit_save"
text: qsTr("Save changes")
enabled: groupName.text.trim().length > 0 &&
((groupName.text != root.activeGroupName) ||
(root.activeGroupColor != colorSelectionGrid.selectedColor) ||
(String(imageEditor.source).length > 0))
onClicked : {
updateGroupChatDetails(groupName.text, colorSelectionGrid.selectedColor,
Utils.getImageAndCropInfoJson(imageEditor.source, imageEditor.cropRect))
}
}
}
}
}