fix(favorite): fix favorite button on guest account

tfkhdyt · Jul 7, 2024 · e4f9ce1 · e4f9ce1
1 parent bc0a555
commit e4f9ce1
Show file tree

Hide file tree

Showing 3 changed files with 62 additions and 81 deletions.
diff --git a/src/app/(dashboard)/questions/[slug]/detailed-question.tsx b/src/app/(dashboard)/questions/[slug]/detailed-question.tsx
@@ -208,15 +208,7 @@ export function DetailedQuestion({
                 disabled={favoriteMutation.isLoading}
                 onClick={handleFavorite}
               >
-                <>
-                  {questionMetadata.data?.favorites.some(
-                    (favorite) => favorite.userId === session?.user.id,
-                  ) ? (
-                    <Heart className='mr-1' color='red' fill='red' size={18} />
-                  ) : (
-                    <Heart className='mr-1' size={18} />
-                  )}
-                </>
+                <Heart className='mr-1' size={18} />
                 <span className='hidden md:inline'>Favorit</span>
               </Button>
             </PopoverTrigger>

diff --git a/src/app/_components/question/question-post.tsx b/src/app/_components/question/question-post.tsx
@@ -256,19 +256,8 @@ export function QuestionPost({
                   title='Favorit'
                   variant='ghost'
                 >
-                  <>
-                    {question.isFavorited ? (
-                      <Heart
-                        className='mr-1'
-                        color='red'
-                        fill='red'
-                        size={18}
-                      />
-                    ) : (
-                      <Heart className='mr-1' size={18} />
-                    )}
-                    {question.numberOfFavorites}
-                  </>
+                  <Heart className='mr-1' size={18} />
+                  {question.numberOfFavorites}
                 </Button>
               </PopoverTrigger>
               <PopoverContent className='text-[#696984] font-medium rounded-xl'>

diff --git a/src/styles/globals.css b/src/styles/globals.css
@@ -3,71 +3,71 @@
 @tailwind utilities;
 
 @layer base {
-	:root {
-		--background: 0 0% 100%;
-		--foreground: 20 14.3% 4.1%;
-		--card: 0 0% 100%;
-		--card-foreground: 20 14.3% 4.1%;
-		--popover: 0 0% 100%;
-		--popover-foreground: 20 14.3% 4.1%;
-		--primary: 24.6 95% 53.1%;
-		--primary-foreground: 60 9.1% 97.8%;
-		--secondary: 60 4.8% 95.9%;
-		--secondary-foreground: 24 9.8% 10%;
-		--muted: 60 4.8% 95.9%;
-		--muted-foreground: 25 5.3% 44.7%;
-		--accent: 60 4.8% 95.9%;
-		--accent-foreground: 24 9.8% 10%;
-		--destructive: 0 84.2% 60.2%;
-		--destructive-foreground: 60 9.1% 97.8%;
-		--border: 20 5.9% 90%;
-		--input: 20 5.9% 90%;
-		--ring: 24.6 95% 53.1%;
-		--radius: 0.5rem;
-	}
+  :root {
+    --background: 0 0% 100%;
+    --foreground: 20 14.3% 4.1%;
+    --card: 0 0% 100%;
+    --card-foreground: 20 14.3% 4.1%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 20 14.3% 4.1%;
+    --primary: 24.6 95% 53.1%;
+    --primary-foreground: 60 9.1% 97.8%;
+    --secondary: 60 4.8% 95.9%;
+    --secondary-foreground: 24 9.8% 10%;
+    --muted: 60 4.8% 95.9%;
+    --muted-foreground: 25 5.3% 44.7%;
+    --accent: 60 4.8% 95.9%;
+    --accent-foreground: 24 9.8% 10%;
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 60 9.1% 97.8%;
+    --border: 20 5.9% 90%;
+    --input: 20 5.9% 90%;
+    --ring: 24.6 95% 53.1%;
+    --radius: 0.5rem;
+  }
 
-	.dark {
-		--background: 20 14.3% 4.1%;
-		--foreground: 60 9.1% 97.8%;
-		--card: 20 14.3% 4.1%;
-		--card-foreground: 60 9.1% 97.8%;
-		--popover: 20 14.3% 4.1%;
-		--popover-foreground: 60 9.1% 97.8%;
-		--primary: 20.5 90.2% 48.2%;
-		--primary-foreground: 60 9.1% 97.8%;
-		--secondary: 12 6.5% 15.1%;
-		--secondary-foreground: 60 9.1% 97.8%;
-		--muted: 12 6.5% 15.1%;
-		--muted-foreground: 24 5.4% 63.9%;
-		--accent: 12 6.5% 15.1%;
-		--accent-foreground: 60 9.1% 97.8%;
-		--destructive: 0 72.2% 50.6%;
-		--destructive-foreground: 60 9.1% 97.8%;
-		--border: 12 6.5% 15.1%;
-		--input: 12 6.5% 15.1%;
-		--ring: 20.5 90.2% 48.2%;
-	}
+  .dark {
+    --background: 20 14.3% 4.1%;
+    --foreground: 60 9.1% 97.8%;
+    --card: 20 14.3% 4.1%;
+    --card-foreground: 60 9.1% 97.8%;
+    --popover: 20 14.3% 4.1%;
+    --popover-foreground: 60 9.1% 97.8%;
+    --primary: 20.5 90.2% 48.2%;
+    --primary-foreground: 60 9.1% 97.8%;
+    --secondary: 12 6.5% 15.1%;
+    --secondary-foreground: 60 9.1% 97.8%;
+    --muted: 12 6.5% 15.1%;
+    --muted-foreground: 24 5.4% 63.9%;
+    --accent: 12 6.5% 15.1%;
+    --accent-foreground: 60 9.1% 97.8%;
+    --destructive: 0 72.2% 50.6%;
+    --destructive-foreground: 60 9.1% 97.8%;
+    --border: 12 6.5% 15.1%;
+    --input: 12 6.5% 15.1%;
+    --ring: 20.5 90.2% 48.2%;
+  }
 }
 
 @layer base {
-	* {
-		@apply border-border;
-	}
+  * {
+    @apply border-border;
+  }
 
-	body {
-		@apply bg-background text-foreground;
-	}
+  body {
+    @apply bg-background text-foreground;
+  }
 }
 
 mark {
-	background-color: #F97316;
-	/* Background color for highlighting */
-	color: white;
-	/* Text color */
-	padding: 0.2em 0.4em;
-	/* Optional: add some padding */
-	border-radius: 0.3em;
-	/* Optional: add rounded corners */
-	font-weight: 500;
-	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
+  background-color: #f97316;
+  /* Background color for highlighting */
+  color: white;
+  /* Text color */
+  padding: 0.2em 0.4em;
+  /* Optional: add some padding */
+  border-radius: 0.3em;
+  /* Optional: add rounded corners */
+  font-weight: 500;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
 }