diff --git a/Frontend/src/app/components/badge/raw-json.tsx b/Frontend/src/app/components/badge/raw-json.tsx
index 08da08b..dcf01bd 100644
--- a/Frontend/src/app/components/badge/raw-json.tsx
+++ b/Frontend/src/app/components/badge/raw-json.tsx
@@ -1,5 +1,6 @@
import { ReactElement } from "react";
import { Badge } from "@/components/ui/badge";
+import SimpleTooltip from "@/components/simple-tooltip";
/**
* A badge for raw json.
@@ -7,8 +8,10 @@ import { Badge } from "@/components/ui/badge";
* @returns the raw json badge jsx
*/
const RawJsonBadge = (): ReactElement => (
-
- Raw Json
-
+
+
+ Raw Json
+
+
);
export default RawJsonBadge;
diff --git a/Frontend/src/app/components/player/player-result.tsx b/Frontend/src/app/components/player/player-result.tsx
index aff48d8..a15855d 100644
--- a/Frontend/src/app/components/player/player-result.tsx
+++ b/Frontend/src/app/components/player/player-result.tsx
@@ -12,6 +12,7 @@ import { ReactElement } from "react";
import { CachedPlayer, SkinPart } from "restfulmc-lib";
import CodeDialog from "@/components/code/code-dialog";
import RawJson from "@/components/badge/raw-json";
+import SimpleTooltip from "@/components/simple-tooltip";
/**
* The props for a player result.
@@ -85,7 +86,9 @@ const PlayerResult = ({ query, player }: PlayerResultProps): ReactElement => (
{/* Skin Parts */}
{/* Header */}
-
Skin Parts
+
+ Skin Parts
+
{/* Skin Parts */}
@@ -101,17 +104,18 @@ const PlayerResult = ({ query, player }: PlayerResultProps): ReactElement => (
[part, url]: [string, string],
index: number
) => (
-
-
-
+
+
+
+
)
)}
diff --git a/Frontend/src/app/components/player/player-search.tsx b/Frontend/src/app/components/player/player-search.tsx
index bd2f792..44d925f 100644
--- a/Frontend/src/app/components/player/player-search.tsx
+++ b/Frontend/src/app/components/player/player-search.tsx
@@ -4,6 +4,7 @@ import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { redirect } from "next/navigation";
import { ReactElement } from "react";
+import SimpleTooltip from "@/components/simple-tooltip";
/**
* Props for a player search.
@@ -18,7 +19,7 @@ type PlayerSearchProps = {
/**
* A component for searching for a player.
*
- * @param query the query to search for
+ * @param query the original query to search for
* @returns the search component jsx
*/
const PlayerSearch = ({ query }: PlayerSearchProps): ReactElement => {
@@ -31,6 +32,7 @@ const PlayerSearch = ({ query }: PlayerSearchProps): ReactElement => {
className="flex flex-col gap-7 justify-center items-center"
action={handleRedirect}
>
+ {/* Input */}
{
autoComplete="off"
/>
-
Search
+
+ {/* Search */}
+
+ Search
+
);
};
diff --git a/Frontend/src/app/components/server/server-search.tsx b/Frontend/src/app/components/server/server-search.tsx
index bb1888b..29732df 100644
--- a/Frontend/src/app/components/server/server-search.tsx
+++ b/Frontend/src/app/components/server/server-search.tsx
@@ -13,6 +13,7 @@ import { capitalize } from "@/app/common/string-utils";
import { redirect } from "next/navigation";
import { ReactElement } from "react";
import { ServerPlatform } from "restfulmc-lib";
+import SimpleTooltip from "@/components/simple-tooltip";
/**
* Props for a server search.
@@ -21,7 +22,7 @@ type ServerSearchProps = {
/**
* The original platform to query for.
*/
- platform: string | undefined;
+ platform: ServerPlatform | undefined;
/**
* The original hostname to query for.
@@ -32,7 +33,8 @@ type ServerSearchProps = {
/**
* A component for searching for a server.
*
- * @param query the query to search for
+ * @param platform the original platform to query for
+ * @param hostname original hostname to query for
* @returns the search component jsx
*/
const ServerSearch = ({
@@ -48,15 +50,12 @@ const ServerSearch = ({
className="flex flex-col gap-7 justify-center items-center"
action={handleRedirect}
>
+ {/* Input */}
{/* Platform Selection */}
-
-
Search
+
+ {/* Search */}
+
+ Search
+
);
};
diff --git a/Frontend/src/app/components/simple-tooltip.tsx b/Frontend/src/app/components/simple-tooltip.tsx
index 5061efb..6c62a27 100644
--- a/Frontend/src/app/components/simple-tooltip.tsx
+++ b/Frontend/src/app/components/simple-tooltip.tsx
@@ -12,7 +12,7 @@ type SimpleTooltipProps = {
/**
* The content to display in the tooltip.
*/
- content: string;
+ content: string | ReactNode;
/**
* The children to render in this tooltip.