From 17e6064b9ea790bd8d8a99fdbcf230ea28bca2de Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Tue, 25 Jul 2017 14:15:52 -0300
Subject: [PATCH] Adding react touch events

---
 .../client/components/Tag.js                  | 28 +++++--------------
 1 file changed, 7 insertions(+), 21 deletions(-)

diff --git a/plugins/talk-plugin-featured-comments/client/components/Tag.js b/plugins/talk-plugin-featured-comments/client/components/Tag.js
index 129e07851..ee2d13b19 100644
--- a/plugins/talk-plugin-featured-comments/client/components/Tag.js
+++ b/plugins/talk-plugin-featured-comments/client/components/Tag.js
@@ -4,7 +4,6 @@ import styles from './Tag.css';
 import Tooltip from './Tooltip';
 import {t} from 'plugin-api/beta/client/services';
 import {isTagged} from 'plugin-api/beta/client/utils';
-import bowser from 'bowser';
 
 export default class Tag extends React.Component {
   constructor() {
@@ -16,27 +15,15 @@ export default class Tag extends React.Component {
 
   }
 
-  componentDidMount() {
-    if (bowser.mobile) {
-      this.tagEl.addEventListener('touchstart', this.showTooltip);
-      this.tagEl.addEventListener('touchend', this.hideTooltip);
-    }
-  }
-
-  componentWillUnmount() {
-    if (bowser.mobile) {
-      this.tagEl.removeEventListener('touchstart', this.showTooltip);
-      this.tagEl.removeEventListener('touchend', this.hideTooltip);
-    }
-  }
-
-  showTooltip = () => {
+  showTooltip = e => {
+    e.preventDefault();
     this.setState({
       tooltip: true
     });
   }
 
-  hideTooltip = () => {
+  hideTooltip = (e) => {
+    e.preventDefault();
     this.setState({
       tooltip: false
     });
@@ -45,10 +32,9 @@ export default class Tag extends React.Component {
   render() {
     const {tooltip} = this.state;
     return(
-      <div ref={(ref) => this.tagEl = ref} 
-          onMouseEnter={this.showTooltip}
-          onMouseLeave={this.hideTooltip}
-          className={styles.noSelect }>
+      <div className={styles.noSelect} onMouseEnter={this.showTooltip}
+          onMouseLeave={this.hideTooltip} onTouchStart={this.showTooltip}
+          onTouchEnd={this.hideTooltip}>
           {
             isTagged(this.props.comment.tags, 'FEATURED') ? (
               <span