diff --git a/src/autocomplete/AutocompleteProvider.js b/src/autocomplete/AutocompleteProvider.js
index e3332d014e..87d7987856 100644
--- a/src/autocomplete/AutocompleteProvider.js
+++ b/src/autocomplete/AutocompleteProvider.js
@@ -54,10 +54,7 @@ export default class AutocompleteProvider {
}
renderCompletions(completions: [React.Component]): ?React.Component {
- return (
-
- {completions}
-
- );
+ console.error('stub; should be implemented in subclasses');
+ return null;
}
}
diff --git a/src/autocomplete/CommandProvider.js b/src/autocomplete/CommandProvider.js
index 8fb7a75aed..4652e69ddf 100644
--- a/src/autocomplete/CommandProvider.js
+++ b/src/autocomplete/CommandProvider.js
@@ -85,8 +85,8 @@ export default class CommandProvider extends AutocompleteProvider {
}
renderCompletions(completions: [React.Component]): ?React.Component {
- return React.cloneElement(super.renderCompletions(completions), {
- className: 'mx_Autocomplete_Completion_container_block',
- });
+ return
+ {completions}
+
;
}
}
diff --git a/src/autocomplete/Components.js b/src/autocomplete/Components.js
index f0dbc64d65..4595f7456d 100644
--- a/src/autocomplete/Components.js
+++ b/src/autocomplete/Components.js
@@ -19,9 +19,9 @@ export class TextualCompletion extends React.Component {
} = this.props;
return (
- {title}
- {subtitle}
- {description}
+ {title}
+ {subtitle}
+ {description}
);
}
@@ -46,9 +46,9 @@ export class PillCompletion extends React.Component {
return (
{initialComponent}
- {title}
- {subtitle}
- {description}
+ {title}
+ {subtitle}
+ {description}
);
}
diff --git a/src/autocomplete/DuckDuckGoProvider.js b/src/autocomplete/DuckDuckGoProvider.js
index c74ffa0473..c85eb8a10b 100644
--- a/src/autocomplete/DuckDuckGoProvider.js
+++ b/src/autocomplete/DuckDuckGoProvider.js
@@ -87,4 +87,10 @@ export default class DuckDuckGoProvider extends AutocompleteProvider {
}
return instance;
}
+
+ renderCompletions(completions: [React.Component]): ?React.Component {
+ return
+ {completions}
+
;
+ }
}
diff --git a/src/autocomplete/EmojiProvider.js b/src/autocomplete/EmojiProvider.js
index 8763d90749..e292808787 100644
--- a/src/autocomplete/EmojiProvider.js
+++ b/src/autocomplete/EmojiProvider.js
@@ -49,8 +49,8 @@ export default class EmojiProvider extends AutocompleteProvider {
}
renderCompletions(completions: [React.Component]): ?React.Component {
- return React.cloneElement(super.renderCompletions(completions), {
- className: 'mx_Autocomplete_Completion_container_pill',
- });
+ return
+ {completions}
+
;
}
}
diff --git a/src/autocomplete/RoomProvider.js b/src/autocomplete/RoomProvider.js
index f27d450266..39cf1179d7 100644
--- a/src/autocomplete/RoomProvider.js
+++ b/src/autocomplete/RoomProvider.js
@@ -64,8 +64,8 @@ export default class RoomProvider extends AutocompleteProvider {
}
renderCompletions(completions: [React.Component]): ?React.Component {
- return React.cloneElement(super.renderCompletions(completions), {
- className: 'mx_Autocomplete_Completion_container_pill',
- });
+ return
+ {completions}
+
;
}
}
diff --git a/src/autocomplete/UserProvider.js b/src/autocomplete/UserProvider.js
index e772d62b23..7485d76484 100644
--- a/src/autocomplete/UserProvider.js
+++ b/src/autocomplete/UserProvider.js
@@ -60,8 +60,8 @@ export default class UserProvider extends AutocompleteProvider {
}
renderCompletions(completions: [React.Component]): ?React.Component {
- return React.cloneElement(super.renderCompletions(completions), {
- className: 'mx_Autocomplete_Completion_container_pill',
- });
+ return
+ {completions}
+
;
}
}
diff --git a/src/components/views/rooms/Autocomplete.js b/src/components/views/rooms/Autocomplete.js
index 1f62ce852c..4b2e23a8b8 100644
--- a/src/components/views/rooms/Autocomplete.js
+++ b/src/components/views/rooms/Autocomplete.js
@@ -105,7 +105,8 @@ export default class Autocomplete extends React.Component {
// this is the selected completion, so scroll it into view if needed
const selectedCompletion = this.refs[`completion${this.state.selectionOffset}`];
if (selectedCompletion && this.container) {
- const {offsetTop} = ReactDOM.findDOMNode(selectedCompletion);
+ const domNode = ReactDOM.findDOMNode(selectedCompletion);
+ const offsetTop = domNode && domNode.offsetTop;
if (offsetTop > this.container.scrollTop + this.container.offsetHeight ||
offsetTop < this.container.scrollTop) {
this.container.scrollTop = offsetTop - this.container.offsetTop;