mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web.git synced 2024-12-14 09:21:47 +03:00
Code Issues Projects Releases Packages Wiki Activity

fix tab focus issue in MessageComposerInput

Browse source 
onTab was incorrectly implemented causing forceComplete instead of
focusing the editor
This commit is contained in:
Aviral Dasgupta 2017-02-10 02:06:06 +05:30
parent aaac06c6d3
commit 46d30c378d
No known key found for this signature in database
GPG key ID: 5FD1E9F4FFD3DA80
2 changed files with 19 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/views/rooms/Autocomplete.js
View file

@ -149,6 +149,7 @@ export default class Autocomplete extends React.Component {
const done = Q.defer(); const done = Q.defer();
this.setState({ this.setState({
forceComplete: true, forceComplete: true,
hide: false,
}, () => { }, () => {
this.complete(this.props.query, this.props.selection).then(() => { this.complete(this.props.query, this.props.selection).then(() => {
done.resolve(); done.resolve();
@ -185,6 +186,11 @@ export default class Autocomplete extends React.Component {
} }
} }
setState(state, func) {
super.setState(state, func);
console.log(state);
}
render() { render() {
const EmojiText = sdk.getComponent('views.elements.EmojiText'); const EmojiText = sdk.getComponent('views.elements.EmojiText');

21
src/components/views/rooms/MessageComposerInput.js
View file

@ -400,7 +400,8 @@ export default class MessageComposerInput extends React.Component {
*/ */
setState(state, callback) { setState(state, callback) {
if (state.editorState != null) { if (state.editorState != null) {
state.editorState = RichText.attachImmutableEntitiesToEmoji(state.editorState); state.editorState = RichText.attachImmutableEntitiesToEmoji(
state.editorState);
if (state.editorState.getCurrentContent().hasText()) { if (state.editorState.getCurrentContent().hasText()) {
this.onTypingActivity(); this.onTypingActivity();
@ -413,15 +414,17 @@ export default class MessageComposerInput extends React.Component {
} }
} }
super.setState(state, (state, props, context) => { super.setState(state, () => {
if (callback != null) { if (callback != null) {
callback(state, props, context); callback();
} }
if (this.props.onContentChanged) { if (this.props.onContentChanged) {
const textContent = state.editorState.getCurrentContent().getPlainText(); const textContent = this.state.editorState
const selection = RichText.selectionStateToTextOffsets(state.editorState.getSelection(), .getCurrentContent().getPlainText();
state.editorState.getCurrentContent().getBlocksAsArray()); const selection = RichText.selectionStateToTextOffsets(
this.state.editorState.getSelection(),
this.state.editorState.getCurrentContent().getBlocksAsArray());
this.props.onContentChanged(textContent, selection); this.props.onContentChanged(textContent, selection);
} }
@ -616,11 +619,13 @@ export default class MessageComposerInput extends React.Component {
// tab and shift-tab are mapped to down and up arrow respectively // tab and shift-tab are mapped to down and up arrow respectively
onTab = async (e) => { onTab = async (e) => {
console.log('onTab');
e.preventDefault(); // we *never* want tab's default to happen, but we do want up/down sometimes e.preventDefault(); // we *never* want tab's default to happen, but we do want up/down sometimes
const didTab = await (e.shiftKey ? this.onUpArrow : this.onDownArrow)(e); if (this.autocomplete.state.completionList.length === 0) {
if (!didTab && this.autocomplete) {
await this.autocomplete.forceComplete(); await this.autocomplete.forceComplete();
this.onDownArrow(e); this.onDownArrow(e);
} else {
await (e.shiftKey ? this.onUpArrow : this.onDownArrow)(e);
} }
}; };