Improve style

Signed-off-by: Tulir Asokan <tulir@maunium.net>
This commit is contained in:
Tulir Asokan 2019-10-14 20:38:09 +03:00
parent e16d0bfa4d
commit a6e0986bf8
3 changed files with 41 additions and 24 deletions

View file

@ -168,7 +168,6 @@ class EmojiPicker extends React.Component {
}
scrollToCategory(category) {
const index = this.categories.findIndex(cat => cat.id === category);
this.bodyRef.current.querySelector(`[data-category-id="${category}"]`).scrollIntoView();
}
@ -179,7 +178,10 @@ class EmojiPicker extends React.Component {
emojis = id === "recent" ? this.recentlyUsed : DATA_BY_CATEGORY[id];
}
this.memoizedDataByCategory[id] = emojis.filter(emoji => emoji.filterString.includes(filter));
this.categories.find(cat => cat.id === id).enabled = this.memoizedDataByCategory[id].length > 0;
const cat = this.categories.find(cat => cat.id === id);
cat.enabled = this.memoizedDataByCategory[id].length > 0;
// The setState below doesn't re-render the header and we already have the refs for updateVisibility, so...
cat.ref.current.disabled = !cat.enabled;
}
this.setState({ filter });
// Header underlines need to be updated, but updating requires knowing

View file

@ -30,7 +30,8 @@ class Search extends React.PureComponent {
<div className="mx_EmojiPicker_search">
<input type="text" placeholder="Search" value={this.props.query}
onChange={ev => this.props.onChange(ev.target.value)}/>
<button onClick={() => this.props.onChange("")}>
<button onClick={() => this.props.onChange("")}
className={this.props.query ? "mx_EmojiPicker_search_clear" : ""}>
{this.props.query ? icons.search.delete() : icons.search.search()}
</button>
</div>