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

make clicking autocomplete suggestions work again

Browse source 
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2018-07-24 13:48:05 +01:00
parent ef39327073
commit afa19cd60d
No known key found for this signature in database
GPG key ID: 3F879DA5AD802A5E
3 changed files with 15 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

3
res/css/views/rooms/_Autocomplete.scss
View file

@ -69,7 +69,8 @@
flex-flow: wrap; flex-flow: wrap;
} }
.mx_Autocomplete_Completion.selected { .mx_Autocomplete_Completion.selected,
.mx_Autocomplete_Completion:hover {
background: $menu-bg-color; background: $menu-bg-color;
outline: none; outline: none;
} }

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

@ -216,12 +216,12 @@ export default class Autocomplete extends React.Component {
return done.promise; return done.promise;
} }
onCompletionClicked(): boolean { onCompletionClicked(selectionOffset: number): boolean {
if (this.countCompletions() === 0 || this.state.selectionOffset === COMPOSER_SELECTED) { if (this.countCompletions() === 0 || selectionOffset === COMPOSER_SELECTED) {
return false; return false;
} }
this.props.onConfirm(this.state.completionList[this.state.selectionOffset - 1]); this.props.onConfirm(this.state.completionList[selectionOffset - 1]);
this.hide(); this.hide();
return true; return true;
@ -264,8 +264,7 @@ export default class Autocomplete extends React.Component {
position++; position++;
const onClick = () => { const onClick = () => {
this.setSelection(componentPosition); this.onCompletionClicked(componentPosition);
this.onCompletionClicked();
}; };
return React.cloneElement(completion.component, { return React.cloneElement(completion.component, {

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

@ -1301,6 +1301,14 @@ export default class MessageComposerInput extends React.Component {
await this.setDisplayedCompletion(null); // restore originalEditorState await this.setDisplayedCompletion(null); // restore originalEditorState
}; };
onAutocompleteConfirm = (displayedCompletion: ?Completion) => {
this.focusComposer();
// XXX: this fails if the composer isn't focused so focus it and delay the completion until next tick
setImmediate(() => {
this.setDisplayedCompletion(displayedCompletion);
});
};
/* If passed null, restores the original editor content from state.originalEditorState. /* If passed null, restores the original editor content from state.originalEditorState.
* If passed a non-null displayedCompletion, modifies state.originalEditorState to compute new state.editorState. * If passed a non-null displayedCompletion, modifies state.originalEditorState to compute new state.editorState.
*/ */
@ -1563,7 +1571,7 @@ export default class MessageComposerInput extends React.Component {
<Autocomplete <Autocomplete
ref={(e) => this.autocomplete = e} ref={(e) => this.autocomplete = e}
room={this.props.room} room={this.props.room}
onConfirm={this.setDisplayedCompletion} onConfirm={this.onAutocompleteConfirm}
onSelectionChange={this.setDisplayedCompletion} onSelectionChange={this.setDisplayedCompletion}
query={ this.suppressAutoComplete ? '' : this.getAutocompleteQuery(activeEditorState) } query={ this.suppressAutoComplete ? '' : this.getAutocompleteQuery(activeEditorState) }
selection={this.getSelectionRange(activeEditorState)} selection={this.getSelectionRange(activeEditorState)}