From 7a7689e9c52be90466e996d68a37f55e59a095d5 Mon Sep 17 00:00:00 2001 From: Jimmy Domagala-Tang Date: Tue, 12 Sep 2023 11:29:49 -0400 Subject: [PATCH] Merge pull request #14673 from overleaf/jdt-improve-character-selection-chat Jdt improve character selection chat GitOrigin-RevId: 9d9f22aeda5e333e807b710f8ea14bbd47dc7f0c --- .../{message-input.js => message-input.tsx} | 21 ++++++++++++------- 1 file changed, 14 insertions(+), 7 deletions(-) rename services/web/frontend/js/features/chat/components/{message-input.js => message-input.tsx} (61%) diff --git a/services/web/frontend/js/features/chat/components/message-input.js b/services/web/frontend/js/features/chat/components/message-input.tsx similarity index 61% rename from services/web/frontend/js/features/chat/components/message-input.js rename to services/web/frontend/js/features/chat/components/message-input.tsx index 8104a2d448..7762b57a76 100644 --- a/services/web/frontend/js/features/chat/components/message-input.js +++ b/services/web/frontend/js/features/chat/components/message-input.tsx @@ -1,19 +1,26 @@ import PropTypes from 'prop-types' import { useTranslation } from 'react-i18next' -function MessageInput({ resetUnreadMessages, sendMessage }) { +type MessageInputProps = { + resetUnreadMessages: () => void + sendMessage: (message: string) => void +} + +function MessageInput({ resetUnreadMessages, sendMessage }: MessageInputProps) { const { t } = useTranslation() - function handleKeyDown(event) { - if (event.key === 'Enter') { + function handleKeyDown(event: React.KeyboardEvent) { + const selectingCharacter = event.nativeEvent.isComposing + if (event.key === 'Enter' && !selectingCharacter) { event.preventDefault() - sendMessage(event.target.value) + const target = event.target as HTMLInputElement + sendMessage(target.value) // wrap the form reset in setTimeout so input sources have time to finish // https://github.com/overleaf/internal/pull/9206 window.setTimeout(() => { - event.target.blur() - event.target.closest('form').reset() - event.target.focus() + target.blur() + target.closest('form')?.reset() + target.focus() }, 0) } }