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

Fix click to insert completion 

And remedy weird API in the process. Autocomplete now exposes `onSelectionChange` to indicate that the user has selected another completion, rather than returning the chosen completion via onUpArrow etc.

Fixes vector-im/riot-web#4835
pull/21833/head
Luke Barnard 2017-08-23 16:22:14 +01:00
parent c203f417bc
commit 8ed5422a45
2 changed files with 5 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/views/rooms/Autocomplete.js
View File

@ -143,7 +143,6 @@ export default class Autocomplete extends React.Component {
return null; return null;
} }
this.setSelection(selectionOffset); this.setSelection(selectionOffset);
return selectionOffset === COMPOSER_SELECTED ? null : this.state.completionList[selectionOffset - 1];
} }
// called from MessageComposerInput // called from MessageComposerInput
@ -155,7 +154,6 @@ export default class Autocomplete extends React.Component {
return null; return null;
} }
this.setSelection(selectionOffset); this.setSelection(selectionOffset);
return selectionOffset === COMPOSER_SELECTED ? null : this.state.completionList[selectionOffset - 1];
} }
onEscape(e): boolean { onEscape(e): boolean {
@ -201,6 +199,9 @@ export default class Autocomplete extends React.Component {
setSelection(selectionOffset: number) { setSelection(selectionOffset: number) {
this.setState({selectionOffset, hide: false}); this.setState({selectionOffset, hide: false});
if (this.props.onSelectionChange) {
this.props.onSelectionChange(this.state.completionList[selectionOffset - 1]);
}
} }
componentDidUpdate() { componentDidUpdate() {

4
src/components/views/rooms/MessageComposerInput.js
View File

@ -949,8 +949,7 @@ export default class MessageComposerInput extends React.Component {
}; };
moveAutocompleteSelection = (up) => { moveAutocompleteSelection = (up) => {
const completion = up ? this.autocomplete.onUpArrow() : this.autocomplete.onDownArrow(); up ? this.autocomplete.onUpArrow() : this.autocomplete.onDownArrow();
return this.setDisplayedCompletion(completion);
}; };
onEscape = async (e) => { onEscape = async (e) => {
@ -1133,6 +1132,7 @@ export default class MessageComposerInput extends React.Component {
<Autocomplete <Autocomplete
ref={(e) => this.autocomplete = e} ref={(e) => this.autocomplete = e}
onConfirm={this.setDisplayedCompletion} onConfirm={this.setDisplayedCompletion}
onSelectionChange={this.setDisplayedCompletion}
query={this.getAutocompleteQuery(content)} query={this.getAutocompleteQuery(content)}
selection={selection}/> selection={selection}/>
</div> </div>