OpenCloud
/
riot-web
mirror of https://github.com/vector-im/riot-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Use the KeyBindingsManager in EditMessageComposer

pull/21833/head
Clemens Zeidler 2021-02-16 19:05:39 +13:00
parent 4a138f3b84
commit 12387b4978
2 changed files with 65 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/KeyBindingsManager.ts
View File

@ -2,16 +2,28 @@ import { isMac, Key } from './Keyboard';
import SettingsStore from './settings/SettingsStore'; import SettingsStore from './settings/SettingsStore';
export enum KeyBindingContext { export enum KeyBindingContext {
SendMessageComposer = 'SendMessageComposer', /** Key bindings for the chat message composer component */
MessageComposer = 'MessageComposer',
} }
export enum KeyAction { export enum KeyAction {
None = 'None', None = 'None',
// SendMessageComposer actions: // SendMessageComposer actions:
/** Send a message */
Send = 'Send', Send = 'Send',
/** Go backwards through the send history and use the message in composer view */
SelectPrevSendHistory = 'SelectPrevSendHistory', SelectPrevSendHistory = 'SelectPrevSendHistory',
/** Go forwards through the send history */
SelectNextSendHistory = 'SelectNextSendHistory', SelectNextSendHistory = 'SelectNextSendHistory',
EditLastMessage = 'EditLastMessage', /** Start editing the user's last sent message */
EditPrevMessage = 'EditPrevMessage',
/** Start editing the user's next sent message */
EditNextMessage = 'EditNextMessage',
/** Cancel editing a message */
CancelEditing = 'CancelEditing',
} }
/** /**
@ -55,10 +67,22 @@ const messageComposerBindings = (): KeyBinding[] => {
}, },
}, },
{ {
action: KeyAction.EditLastMessage, action: KeyAction.EditPrevMessage,
keyCombo: { keyCombo: {
key: Key.ARROW_UP, key: Key.ARROW_UP,
} },
},
{
action: KeyAction.EditNextMessage,
keyCombo: {
key: Key.ARROW_DOWN,
},
},
{
action: KeyAction.CancelEditing,
keyCombo: {
key: Key.ESCAPE,
},
}, },
]; ];
if (SettingsStore.getValue('MessageComposerInput.ctrlEnterToSend')) { if (SettingsStore.getValue('MessageComposerInput.ctrlEnterToSend')) {
@ -135,7 +159,7 @@ export class KeyBindingsManager {
* recalculated. * recalculated.
*/ */
contextBindings: Record<KeyBindingContext, KeyBindingsGetter> = { contextBindings: Record<KeyBindingContext, KeyBindingsGetter> = {
[KeyBindingContext.SendMessageComposer]: messageComposerBindings, [KeyBindingContext.MessageComposer]: messageComposerBindings,
}; };
/** /**

28
src/components/views/rooms/EditMessageComposer.js
View File

@ -29,11 +29,10 @@ import EditorStateTransfer from '../../../utils/EditorStateTransfer';
import classNames from 'classnames'; import classNames from 'classnames';
import {EventStatus} from 'matrix-js-sdk'; import {EventStatus} from 'matrix-js-sdk';
import BasicMessageComposer from "./BasicMessageComposer"; import BasicMessageComposer from "./BasicMessageComposer";
import {Key, isOnlyCtrlOrCmdKeyEvent} from "../../../Keyboard";
import MatrixClientContext from "../../../contexts/MatrixClientContext"; import MatrixClientContext from "../../../contexts/MatrixClientContext";
import {Action} from "../../../dispatcher/actions"; import {Action} from "../../../dispatcher/actions";
import SettingsStore from "../../../settings/SettingsStore";
import CountlyAnalytics from "../../../CountlyAnalytics"; import CountlyAnalytics from "../../../CountlyAnalytics";
import {getKeyBindingsManager, KeyAction, KeyBindingContext} from '../../../KeyBindingsManager';
function _isReply(mxEvent) { function _isReply(mxEvent) {
const relatesTo = mxEvent.getContent()["m.relates_to"]; const relatesTo = mxEvent.getContent()["m.relates_to"];
@ -134,27 +133,28 @@ export default class EditMessageComposer extends React.Component {
if (this._editorRef.isComposing(event)) { if (this._editorRef.isComposing(event)) {
return; return;
} }
if (event.metaKey || event.altKey || event.shiftKey) { const action = getKeyBindingsManager().getAction(KeyBindingContext.MessageComposer, event);
return; switch (action) {
} case KeyAction.Send:
const ctrlEnterToSend = !!SettingsStore.getValue('MessageComposerInput.ctrlEnterToSend');
const send = ctrlEnterToSend ? event.key === Key.ENTER && isOnlyCtrlOrCmdKeyEvent(event)
: event.key === Key.ENTER;
if (send) {
this._sendEdit(); this._sendEdit();
event.preventDefault(); event.preventDefault();
} else if (event.key === Key.ESCAPE) { break;
case KeyAction.CancelEditing:
this._cancelEdit(); this._cancelEdit();
} else if (event.key === Key.ARROW_UP) { break;
case KeyAction.EditPrevMessage: {
if (this._editorRef.isModified() || !this._editorRef.isCaretAtStart()) { if (this._editorRef.isModified() || !this._editorRef.isCaretAtStart()) {
return; return;
} }
const previousEvent = findEditableEvent(this._getRoom(), false, this.props.editState.getEvent().getId()); const previousEvent = findEditableEvent(this._getRoom(), false,
this.props.editState.getEvent().getId());
if (previousEvent) { if (previousEvent) {
dis.dispatch({action: 'edit_event', event: previousEvent}); dis.dispatch({action: 'edit_event', event: previousEvent});
event.preventDefault(); event.preventDefault();
} }
} else if (event.key === Key.ARROW_DOWN) { break;
}
case KeyAction.EditNextMessage: {
if (this._editorRef.isModified() || !this._editorRef.isCaretAtEnd()) { if (this._editorRef.isModified() || !this._editorRef.isCaretAtEnd()) {
return; return;
} }
@ -166,6 +166,8 @@ export default class EditMessageComposer extends React.Component {
dis.fire(Action.FocusComposer); dis.fire(Action.FocusComposer);
} }
event.preventDefault(); event.preventDefault();
break;
}
} }
} }