From c63416fd7b222cd9d63e6e2ace96a4ef9cd4deeb Mon Sep 17 00:00:00 2001
From: Ajay <dev@ajay.app>
Date: Thu, 6 Jan 2022 02:10:28 -0500
Subject: [PATCH] Fix voting on category pill on mobile

---
 src/components/CategoryPillComponent.tsx | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/components/CategoryPillComponent.tsx b/src/components/CategoryPillComponent.tsx
index abe6aaf0..c22bbbb9 100644
--- a/src/components/CategoryPillComponent.tsx
+++ b/src/components/CategoryPillComponent.tsx
@@ -41,7 +41,7 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP
             <span style={style}
                 className={"sponsorBlockCategoryPill"} 
                 title={chrome.i18n.getMessage("categoryPillTitleText")}
-                onClick={() => this.state.show && this.setState({ open: !this.state.open })}>
+                onClick={(e) => this.toggleOpen(e)}>
                 <span className="sponsorBlockCategoryPillTitleSection">
                     <img className="sponsorSkipLogo sponsorSkipObject"
                         src={chrome.extension.getURL("icons/IconSponsorBlocker256px.png")}>
@@ -58,7 +58,7 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP
                                 className="voteButton"
                                 style={{marginLeft: "5px"}}
                                 title={chrome.i18n.getMessage("upvoteButtonInfo")}
-                                onClick={(event) => this.vote(event, 1)}>
+                                onClick={(e) => this.vote(e, 1)}>
                             <ThumbsUpSvg fill={Config.config.colorPalette.white} />
                         </div>
 
@@ -75,6 +75,14 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP
         );
     }
 
+    private toggleOpen(event: React.MouseEvent): void {
+        event.stopPropagation();
+
+        if (this.state.show) {
+            this.setState({ open: !this.state.open });
+        }
+    }
+
     private async vote(event: React.MouseEvent, type: number): Promise<void> {
         event.stopPropagation();
         if (this.state.segment) {