From feddb98005049a27a34f4cf553c33245bd641745 Mon Sep 17 00:00:00 2001
From: Oliver <oli@worldbrain.io>
Date: Tue, 27 Feb 2024 22:22:24 +0100
Subject: [PATCH] fix bookmark and spaces addition buttons in the popup

---
 .../components/BookmarkButton.tsx             | 21 +++++++++----------
 .../components/CollectionsButton.tsx          | 12 ++++++-----
 2 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/src/popup/bookmark-button/components/BookmarkButton.tsx b/src/popup/bookmark-button/components/BookmarkButton.tsx
index bdb4340cbe..a4f8066656 100644
--- a/src/popup/bookmark-button/components/BookmarkButton.tsx
+++ b/src/popup/bookmark-button/components/BookmarkButton.tsx
@@ -30,9 +30,8 @@ interface StateProps {
 }
 
 interface DispatchProps {
-    toggleBookmark: ClickHandler<HTMLButtonElement>
+    toggleBookmark: (element: HTMLElement) => void
 }
-
 export type Props = OwnProps & StateProps & DispatchProps
 
 class BookmarkButton extends PureComponent<Props> {
@@ -67,7 +66,11 @@ class BookmarkButton extends PureComponent<Props> {
 
         return (
             <ButtonItem
-                onClick={() => !isPageSaved && this.props.toggleBookmark}
+                onClick={(event) => {
+                    if (!isPageSaved) {
+                        this.props.toggleBookmark(event.currentTarget)
+                    }
+                }}
                 disabled={this.props.isDisabled || isPageSaved}
             >
                 <Icon
@@ -140,15 +143,11 @@ const mapDispatch: (dispatch, props: OwnProps) => DispatchProps = (
     dispatch,
     props,
 ) => ({
-    toggleBookmark: async (e) => {
-        {
-            const allowed = await pageActionAllowed(analyticsBG)
-
-            if (allowed) {
-                e.preventDefault()
+    toggleBookmark: async (element: HTMLElement) => {
+        const allowed = await pageActionAllowed(analyticsBG)
 
-                await dispatch(acts.toggleBookmark())
-            }
+        if (allowed) {
+            await dispatch(acts.toggleBookmark())
         }
     },
 })
diff --git a/src/popup/collections-button/components/CollectionsButton.tsx b/src/popup/collections-button/components/CollectionsButton.tsx
index 97094798f1..58a0b7becb 100644
--- a/src/popup/collections-button/components/CollectionsButton.tsx
+++ b/src/popup/collections-button/components/CollectionsButton.tsx
@@ -20,8 +20,8 @@ interface StateProps {
 }
 
 interface DispatchProps {
-    toggleCollectionsPopup: ClickHandler<HTMLButtonElement>
-    toggleAllTabsPopup: ClickHandler<HTMLButtonElement>
+    toggleCollectionsPopup: ClickHandler<HTMLDivElement>
+    toggleAllTabsPopup: ClickHandler<HTMLDivElement>
 }
 
 export type Props = OwnProps & StateProps & DispatchProps
@@ -55,9 +55,11 @@ class CollectionsButton extends PureComponent<Props> {
     render() {
         return (
             <ButtonItem
-                onClick={() =>
-                    !this.props.isDisabled && this.props.toggleCollectionsPopup
-                }
+                onClick={(event) => {
+                    if (!this.props.isDisabled) {
+                        this.props.toggleCollectionsPopup(event)
+                    }
+                }}
                 disabled={this.props.isDisabled}
             >
                 <Icon