imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Allow pressing Enter to send messages in new composer (#9451)

Browse source 
* Allow pressing Enter to send messages in new composer

* Cypress tests for composer send behaviour
This commit is contained in:
Andy Balaam 2022-10-19 04:07:21 +01:00 • committed by GitHub
parent 26f3d107fd
commit e0ab0ac5c9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 323 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/components/views/rooms/wysiwyg_composer/WysiwygComposer.tsx
View file

@ -16,7 +16,7 @@ limitations under the License.
import React, { useCallback, useEffect } from 'react';
import { IEventRelation, MatrixEvent } from 'matrix-js-sdk/src/models/event';
import { useWysiwyg } from "@matrix-org/matrix-wysiwyg";
import { useWysiwyg, Wysiwyg, WysiwygInputEvent } from "@matrix-org/matrix-wysiwyg";
import { Editor } from './Editor';
import { FormattingButtons } from './FormattingButtons';
@ -25,6 +25,7 @@ import { sendMessage } from './message';
import { useMatrixClientContext } from '../../../../contexts/MatrixClientContext';
import { useRoomContext } from '../../../../contexts/RoomContext';
import { useWysiwygActionHandler } from './useWysiwygActionHandler';
import { useSettingValue } from '../../../../hooks/useSettings';
interface WysiwygProps {
disabled?: boolean;
@ -41,8 +42,27 @@ export function WysiwygComposer(
) {
const roomContext = useRoomContext();
const mxClient = useMatrixClientContext();
const ctrlEnterToSend = useSettingValue("MessageComposerInput.ctrlEnterToSend");
const { ref, isWysiwygReady, content, formattingStates, wysiwyg } = useWysiwyg();
function inputEventProcessor(event: WysiwygInputEvent, wysiwyg: Wysiwyg): WysiwygInputEvent | null {
if (event instanceof ClipboardEvent) {
return event;
}
if (
(event.inputType === 'insertParagraph' && !ctrlEnterToSend) ||
event.inputType === 'sendMessage'
) {
sendMessage(content, { mxClient, roomContext, ...props });
wysiwyg.actions.clear();
ref.current?.focus();
return null;
}
return event;
}
const { ref, isWysiwygReady, content, formattingStates, wysiwyg } = useWysiwyg({ inputEventProcessor });
useEffect(() => {
if (!disabled && content !== null) {