From eda3045cf4fe0f65fd800686cfbb15fcb39e81f2 Mon Sep 17 00:00:00 2001
From: Rainnny7 <braydonrainnny@gmail.com>
Date: Mon, 22 Apr 2024 01:47:03 -0400
Subject: [PATCH] Mojang page tooltips

---
 Frontend/src/app/(pages)/mojang/page.tsx | 26 ++++++++++++++++--------
 1 file changed, 18 insertions(+), 8 deletions(-)

diff --git a/Frontend/src/app/(pages)/mojang/page.tsx b/Frontend/src/app/(pages)/mojang/page.tsx
index 773fe6d..c47bb25 100644
--- a/Frontend/src/app/(pages)/mojang/page.tsx
+++ b/Frontend/src/app/(pages)/mojang/page.tsx
@@ -9,6 +9,8 @@ import {
     MojangServerStatus,
     MojangServerStatusResponse,
 } from "restfulmc-lib";
+import { ArrowTopRightOnSquareIcon } from "@heroicons/react/24/outline";
+import SimpleTooltip from "@/components/simple-tooltip";
 
 /**
  * Page metadata.
@@ -62,14 +64,22 @@ const MojangStatusPage = async (): Promise<ReactElement> => {
                                     <h1 className="pointer-events-none">
                                         {server.name}
                                     </h1>
-                                    <Link
-                                        href={server.endpoint}
-                                        className="text-xs text-minecraft-green-3 hover:opacity-85 transition-all transform-gpu"
-                                        rel="noopener noreferrer"
-                                        target="_blank"
-                                    >
-                                        <code>{server.endpoint}</code>
-                                    </Link>
+                                    <SimpleTooltip content="Click to open">
+                                        <Link
+                                            href={server.endpoint}
+                                            className="text-xs text-minecraft-green-3 hover:opacity-85 transition-all transform-gpu"
+                                            rel="noopener noreferrer"
+                                            target="_blank"
+                                        >
+                                            <code className="flex gap-1 items-center">
+                                                <span>{server.endpoint}</span>
+                                                <ArrowTopRightOnSquareIcon
+                                                    width={16}
+                                                    height={16}
+                                                />
+                                            </code>
+                                        </Link>
+                                    </SimpleTooltip>
                                 </div>
 
                                 {/* Status */}