From c4b86e9d63cf6d5135b7a250e8307a9fe7cbe402 Mon Sep 17 00:00:00 2001
From: Igor Carvalho <igorsilvabhz6@gmail.com>
Date: Tue, 16 Jul 2024 11:41:28 -0300
Subject: [PATCH] Fix: Clicking tags on share modal updates store immediately
 (#2720)

* Fix: Click tags on share modal share component to the store immediately

* [autofix.ci] apply automated fixes

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
Co-authored-by: anovazzi1 <otavio2204@gmail.com>
---
 .../tagsSelectorComponent/index.tsx           | 57 ++++++++++---------
 1 file changed, 30 insertions(+), 27 deletions(-)

diff --git a/src/frontend/src/components/tagsSelectorComponent/index.tsx b/src/frontend/src/components/tagsSelectorComponent/index.tsx
index 95bcc1101..b3a79a86e 100644
--- a/src/frontend/src/components/tagsSelectorComponent/index.tsx
+++ b/src/frontend/src/components/tagsSelectorComponent/index.tsx
@@ -26,35 +26,38 @@ export function TagsSelector({
 
   return (
     <HorizontalScrollFadeComponent isFolder={false}>
-      {!loadingTags &&
-        tags.map((tag, idx) => (
-          <button
-            disabled={disabled}
-            className={
-              disabled
-                ? "cursor-not-allowed"
-                : "overflow-hidden whitespace-nowrap"
-            }
-            onClick={() => {
-              updateTags(tag.name);
-            }}
-            key={idx}
-            data-testid={`tag-selector-${tag.name}`}
-          >
-            <Badge
+      {!loadingTags
+        ? tags.map((tag, idx) => (
+            <button
+              disabled={disabled}
+              className={
+                disabled
+                  ? "cursor-not-allowed"
+                  : "overflow-hidden whitespace-nowrap"
+              }
+              onClick={(e) => {
+                e.preventDefault();
+                e.stopPropagation();
+                updateTags(tag.name);
+              }}
               key={idx}
-              variant="outline"
-              size="sq"
-              className={cn(
-                selectedTags.some((category) => category === tag.name)
-                  ? "min-w-min bg-beta-foreground text-background hover:bg-beta-foreground"
-                  : "",
-              )}
+              data-testid={`tag-selector-${tag.name}`}
             >
-              {tag.name}
-            </Badge>
-          </button>
-        ))}
+              <Badge
+                key={idx}
+                variant="outline"
+                size="sq"
+                className={cn(
+                  selectedTags.some((category) => category === tag.name)
+                    ? "min-w-min bg-beta-foreground text-background hover:bg-beta-foreground"
+                    : "",
+                )}
+              >
+                {tag.name}
+              </Badge>
+            </button>
+          ))
+        : []}
     </HorizontalScrollFadeComponent>
   );
 }