status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: make sure the mention and emoji pickers close when pressing escape

This commit is contained in:
Jonathan Rainville 2020-11-18 12:14:29 -05:00
parent 89b45146fc
commit 537ae7991b
2 changed files with 23 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
ui/app/AppLayouts/Chat/ChatColumn/SuggestionBox.qml
View File

@ -35,13 +35,24 @@ Rectangle {
property int cursorPosition property int cursorPosition
signal itemSelected(var item, int lastAtPosition, int lastCursorPosition) signal itemSelected(var item, int lastAtPosition, int lastCursorPosition)
property alias listView: listView property alias listView: listView
property bool shouldHide: false
onCursorPositionChanged: {
if (shouldHide) {
shouldHide = false
}
}
function hide() {
shouldHide = true
}
function selectCurrentItem() { function selectCurrentItem() {
container.itemSelected(listView.model.get(listView.currentIndex), filterItem.lastAtPosition, filterItem.cursorPosition) container.itemSelected(listView.model.get(listView.currentIndex), filterItem.lastAtPosition, filterItem.cursorPosition)
} }
z: parent.z + 100 z: parent.z + 100
visible: filter.length > 0 && suggestionsModel.count > 0 visible: !shouldHide && filter.length > 0 && suggestionsModel.count > 0
height: Math.min(400, listView.contentHeight + Style.current.smallPadding) height: Math.min(400, listView.contentHeight + Style.current.smallPadding)
opacity: visible ? 1.0 : 0 opacity: visible ? 1.0 : 0
@ -49,7 +60,7 @@ Rectangle {
NumberAnimation { } NumberAnimation { }
} }
color:Style.current.background color: Style.current.background
radius: Style.current.radius radius: Style.current.radius
border.width: 0 border.width: 0
layer.enabled: true layer.enabled: true

9
ui/shared/status/StatusChatInput.qml
View File

@ -79,7 +79,7 @@ Rectangle {
return msg return msg
} }
function onEnter(event){ function onKeyPress(event){
if (event.modifiers === Qt.NoModifier && (event.key === Qt.Key_Enter || event.key === Qt.Key_Return)) { if (event.modifiers === Qt.NoModifier && (event.key === Qt.Key_Enter || event.key === Qt.Key_Return)) {
if (emojiSuggestions.visible) { if (emojiSuggestions.visible) {
emojiSuggestions.addEmoji(); emojiSuggestions.addEmoji();
@ -111,6 +111,9 @@ Rectangle {
suggestionsBox.listView.decrementCurrentIndex() suggestionsBox.listView.decrementCurrentIndex()
return emojiSuggestions.listView.decrementCurrentIndex() return emojiSuggestions.listView.decrementCurrentIndex()
} }
if (event.key === Qt.Key_Escape) {
suggestionsBox.hide()
}
isColonPressed = (event.key === Qt.Key_Colon) && (event.modifiers & Qt.ShiftModifier); isColonPressed = (event.key === Qt.Key_Colon) && (event.modifiers & Qt.ShiftModifier);
} }
@ -124,11 +127,13 @@ Rectangle {
interrogateMessage(); interrogateMessage();
} }
if (event.key !== Qt.Key_Escape) {
emojiEvent = emojiHandler(event); emojiEvent = emojiHandler(event);
if (!emojiEvent) { if (!emojiEvent) {
emojiSuggestions.close() emojiSuggestions.close()
} }
} }
}
function interrogateMessage() { function interrogateMessage() {
const text = chatsModel.plainText(Emoji.deparse(messageInputField.text)); const text = chatsModel.plainText(Emoji.deparse(messageInputField.text));
@ -579,7 +584,7 @@ Rectangle {
color: Style.current.textColor color: Style.current.textColor
topPadding: Style.current.smallPadding topPadding: Style.current.smallPadding
bottomPadding: 12 bottomPadding: 12
Keys.onPressed: onEnter(event) Keys.onPressed: onKeyPress(event)
Keys.onReleased: onRelease(event) // gives much more up to date cursorPosition Keys.onReleased: onRelease(event) // gives much more up to date cursorPosition
leftPadding: 0 leftPadding: 0
background: Rectangle { background: Rectangle {