mirror of
https://github.com/tulir/gomuks.git
synced 2025-04-19 18:13:41 -05:00
web/composer: add enter and esc keybinds to autocompleter
This commit is contained in:
parent
e0189a2651
commit
bb52f1cfa9
2 changed files with 17 additions and 6 deletions
|
@ -31,6 +31,7 @@ export interface AutocompleteQuery {
|
|||
endPos: number
|
||||
frozenQuery?: string
|
||||
selected?: number
|
||||
close?: boolean
|
||||
}
|
||||
|
||||
export interface AutocompleterProps {
|
||||
|
@ -80,6 +81,9 @@ function useAutocompleter<T>({
|
|||
useEffect(() => {
|
||||
if (params.selected !== undefined) {
|
||||
onSelect(params.selected)
|
||||
if (params.close) {
|
||||
setAutocomplete(null)
|
||||
}
|
||||
}
|
||||
}, [onSelect, params.selected])
|
||||
const selected = params.selected !== undefined ? positiveMod(params.selected, items.length) : -1
|
||||
|
|
|
@ -199,16 +199,23 @@ const MessageComposer = () => {
|
|||
const onComposerKeyDown = useEvent((evt: React.KeyboardEvent<HTMLTextAreaElement>) => {
|
||||
const inp = evt.currentTarget
|
||||
const fullKey = keyToString(evt)
|
||||
if (fullKey === "Enter") {
|
||||
sendMessage(evt)
|
||||
} else if (autocomplete) {
|
||||
if (autocomplete) {
|
||||
let autocompleteUpdate: Partial<AutocompleteQuery> | null | undefined
|
||||
if (fullKey === "Tab" || fullKey === "ArrowDown") {
|
||||
setAutocomplete({ ...autocomplete, selected: (autocomplete.selected ?? -1) + 1 })
|
||||
evt.preventDefault()
|
||||
autocompleteUpdate = { selected: (autocomplete.selected ?? -1) + 1 }
|
||||
} else if (fullKey === "Shift+Tab" || fullKey === "ArrowUp") {
|
||||
setAutocomplete({ ...autocomplete, selected: (autocomplete.selected ?? 0) - 1 })
|
||||
autocompleteUpdate = { selected: (autocomplete.selected ?? 0) - 1 }
|
||||
} else if (fullKey === "Enter") {
|
||||
autocompleteUpdate = autocomplete.selected !== undefined ? null : { selected: 0, close: true }
|
||||
} else if (fullKey === "Escape") {
|
||||
autocompleteUpdate = null
|
||||
}
|
||||
if (autocompleteUpdate !== undefined) {
|
||||
setAutocomplete(autocompleteUpdate && { ...autocomplete, ...autocompleteUpdate })
|
||||
evt.preventDefault()
|
||||
}
|
||||
} else if (fullKey === "Enter") {
|
||||
sendMessage(evt)
|
||||
} else if (fullKey === "ArrowUp" && inp.selectionStart === 0 && inp.selectionEnd === 0) {
|
||||
const currentlyEditing = editing
|
||||
? roomCtx.ownMessages.indexOf(editing.rowid)
|
||||
|
|
Loading…
Add table
Reference in a new issue