Conform to new react and typescript eslint rules

src/components/views/emojipicker/Category.tsx

@@ -98,7 +98,7 @@ class Category extends React.PureComponent<IProps> {
                 aria-label={name}
             >
                 <h2 className="mx_EmojiPicker_category_label">
-                    {name}
+                    { name }
                 </h2>
                 <LazyRenderList
                     element="ul" className="mx_EmojiPicker_list"

src/components/views/emojipicker/Emoji.tsx

@@ -44,7 +44,7 @@ class Emoji extends React.PureComponent<IProps> {
                 label={emoji.unicode}
             >
                 <div className={`mx_EmojiPicker_item ${isSelected ? 'mx_EmojiPicker_item_selected' : ''}`}>
-                    {emoji.unicode}
+                    { emoji.unicode }
                 </div>
             </MenuItem>
         );

src/components/views/emojipicker/EmojiPicker.tsx

@@ -238,7 +238,7 @@ class EmojiPicker extends React.Component<IProps, IState> {
                     }}
                     onScroll={this.onScroll}
                 >
-                    {this.categories.map(category => {
+                    { this.categories.map(category => {
                         const emojis = this.memoizedDataByCategory[category.id];
                         const categoryElement = ((
                             <Category
@@ -258,9 +258,9 @@ class EmojiPicker extends React.Component<IProps, IState> {
                         const height = EmojiPicker.categoryHeightForEmojiCount(emojis.length);
                         heightBefore += height;
                         return categoryElement;
-                    })}
+                    }) }
                 </AutoHideScrollbar>
-                {this.state.previewEmoji || !this.props.showQuickReactions
+                { this.state.previewEmoji || !this.props.showQuickReactions
                     ? <Preview emoji={this.state.previewEmoji} />
                     : <QuickReactions onClick={this.onClickEmoji} selectedEmojis={this.props.selectedEmojis} /> }
             </div>

src/components/views/emojipicker/Header.tsx

@@ -89,7 +89,7 @@ class Header extends React.PureComponent<IProps> {
                 aria-label={_t("Categories")}
                 onKeyDown={this.onKeyDown}
             >
-                {this.props.categories.map(category => {
+                { this.props.categories.map(category => {
                     const classes = classNames(`mx_EmojiPicker_anchor mx_EmojiPicker_anchor_${category.id}`, {
                         mx_EmojiPicker_anchor_visible: category.visible,
                     });
@@ -106,7 +106,7 @@ class Header extends React.PureComponent<IProps> {
                         aria-selected={category.visible}
                         aria-controls={`mx_EmojiPicker_category_${category.id}`}
                     />;
-                })}
+                }) }
             </nav>
         );
     }

src/components/views/emojipicker/Preview.tsx

@@ -36,14 +36,14 @@ class Preview extends React.PureComponent<IProps> {
         return (
             <div className="mx_EmojiPicker_footer mx_EmojiPicker_preview">
                 <div className="mx_EmojiPicker_preview_emoji">
-                    {unicode}
+                    { unicode }
                 </div>
                 <div className="mx_EmojiPicker_preview_text">
                     <div className="mx_EmojiPicker_name mx_EmojiPicker_preview_name">
-                        {annotation}
+                        { annotation }
                     </div>
                     <div className="mx_EmojiPicker_shortcode">
-                        {shortcode}
+                        { shortcode }
                     </div>
                 </div>
             </div>

src/components/views/emojipicker/QuickReactions.tsx

@@ -65,16 +65,16 @@ class QuickReactions extends React.Component<IProps, IState> {
         return (
             <section className="mx_EmojiPicker_footer mx_EmojiPicker_quick mx_EmojiPicker_category">
                 <h2 className="mx_EmojiPicker_quick_header mx_EmojiPicker_category_label">
-                    {!this.state.hover
+                    { !this.state.hover
                         ? _t("Quick Reactions")
                         : <React.Fragment>
-                            <span className="mx_EmojiPicker_name">{this.state.hover.annotation}</span>
-                            <span className="mx_EmojiPicker_shortcode">{this.state.hover.shortcodes[0]}</span>
+                            <span className="mx_EmojiPicker_name">{ this.state.hover.annotation }</span>
+                            <span className="mx_EmojiPicker_shortcode">{ this.state.hover.shortcodes[0] }</span>
                         </React.Fragment>
                     }
                 </h2>
                 <ul className="mx_EmojiPicker_list" aria-label={_t("Quick Reactions")}>
-                    {QUICK_REACTIONS.map(emoji => ((
+                    { QUICK_REACTIONS.map(emoji => ((
                         <Emoji
                             key={emoji.hexcode}
                             emoji={emoji}
@@ -83,7 +83,7 @@ class QuickReactions extends React.Component<IProps, IState> {
                             onMouseLeave={this.onMouseLeave}
                             selectedEmojis={this.props.selectedEmojis}
                         />
-                    )))}
+                    ))) }
                 </ul>
             </section>
         );

src/components/views/emojipicker/Search.tsx

@@ -69,7 +69,7 @@ class Search extends React.PureComponent<IProps> {
                     onKeyDown={this.onKeyDown}
                     ref={this.inputRef}
                 />
-                {rightButton}
+                { rightButton }
             </div>
         );
     }