Attach composition keyboard handlers only when quill has focus

This commit is contained in:
Josh Perez 2023-07-06 15:17:06 -04:00 committed by GitHub
parent b292568604
commit cc6b299ab6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 37 additions and 2 deletions

View file

@ -54,7 +54,7 @@ import { countStickers } from './stickers/lib';
import {
useAttachFileShortcut,
useEditLastMessageSent,
useKeyboardShortcuts,
useKeyboardShortcutsConditionally,
} from '../hooks/useKeyboardShortcuts';
import { MediaEditor } from './MediaEditor';
import { isImageTypeSupported } from '../util/GoogleChrome';
@ -416,9 +416,15 @@ export function CompositionArea({
setMessageToEdit,
]);
const [hasFocus, setHasFocus] = useState(false);
const attachFileShortcut = useAttachFileShortcut(launchAttachmentPicker);
const editLastMessageSent = useEditLastMessageSent(maybeEditMessage);
useKeyboardShortcuts(attachFileShortcut, editLastMessageSent);
useKeyboardShortcutsConditionally(
hasFocus,
attachFileShortcut,
editLastMessageSent
);
// Focus input on first mount
const previousFocusCounter = usePrevious<number | undefined>(
@ -954,6 +960,8 @@ export function CompositionArea({
large={large}
linkPreviewLoading={linkPreviewLoading}
linkPreviewResult={linkPreviewResult}
onBlur={() => setHasFocus(false)}
onFocus={() => setHasFocus(true)}
onCloseLinkPreview={onCloseLinkPreview}
onDirtyChange={setDirty}
onEditorStateChange={onEditorStateChange}