From 65e8df76a26f1d25ba474f9639fc7dba2a482de5 Mon Sep 17 00:00:00 2001
From: Liam <liam@fascinated.cc>
Date: Thu, 16 Nov 2023 10:21:08 +0000
Subject: [PATCH] feat(ssr): add tooltip to youtube button

---
 src/components/player/score/Score.tsx | 37 ++++++++++++++++-----------
 1 file changed, 22 insertions(+), 15 deletions(-)

diff --git a/src/components/player/score/Score.tsx b/src/components/player/score/Score.tsx
index 9dc4a42..2af6bfc 100644
--- a/src/components/player/score/Score.tsx
+++ b/src/components/player/score/Score.tsx
@@ -150,21 +150,28 @@ export default function Score({
               <CopyBsrButton mapId={mapId} />
             </div>
             <div className="flex gap-1">
-              <Link
-                href={`${songNameToYouTubeLink(
-                  leaderboard.songName,
-                  leaderboard.songSubName,
-                  leaderboard.songAuthorName,
-                )}`}
-                target="_blank"
-              >
-                <Button
-                  className="h-[30px] w-[30px] bg-neutral-700 p-1"
-                  variant={"secondary"}
-                >
-                  <YouTubeLogo size={20} />
-                </Button>
-              </Link>
+              <Tooltip>
+                <TooltipTrigger>
+                  <Link
+                    href={`${songNameToYouTubeLink(
+                      leaderboard.songName,
+                      leaderboard.songSubName,
+                      leaderboard.songAuthorName,
+                    )}`}
+                    target="_blank"
+                  >
+                    <Button
+                      className="h-[30px] w-[30px] bg-neutral-700 p-1"
+                      variant={"secondary"}
+                    >
+                      <YouTubeLogo size={20} />
+                    </Button>
+                  </Link>
+                </TooltipTrigger>
+                <TooltipContent>
+                  <p>Click to view the song on YouTube</p>
+                </TooltipContent>
+              </Tooltip>
             </div>
           </>
         )}