From 2597c51863a15f6492feee79ecef16ab26d0aefc Mon Sep 17 00:00:00 2001 From: Liam Date: Sun, 14 Apr 2024 21:56:07 +0100 Subject: [PATCH] add server page and update player page --- package.json | 2 +- pnpm-lock.yaml | 8 ++-- public/next.svg | 1 - public/vercel.svg | 1 - src/app/player/page.tsx | 2 +- src/app/server/page.tsx | 13 ++++++ src/components/navbar.tsx | 1 + src/components/player-search.tsx | 50 +++++++++++---------- src/components/server-search.tsx | 74 ++++++++++++++++++++++++++++++++ 9 files changed, 118 insertions(+), 34 deletions(-) delete mode 100644 public/next.svg delete mode 100644 public/vercel.svg create mode 100644 src/app/server/page.tsx create mode 100644 src/components/server-search.tsx diff --git a/package.json b/package.json index 2ef4c2f..1f8bb00 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,7 @@ "class-variance-authority": "^0.7.0", "clsx": "^2.1.0", "lucide-react": "^0.368.0", - "mcutils-library": "^1.0.1", + "mcutils-library": "^1.0.2", "next": "14.2.1", "next-themes": "^0.3.0", "react": "^18", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 4be2242..6791213 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -21,8 +21,8 @@ dependencies: specifier: ^0.368.0 version: 0.368.0(react@18.2.0) mcutils-library: - specifier: ^1.0.1 - version: 1.0.1(@babel/core@7.24.4)(@types/node@20.12.7) + specifier: ^1.0.2 + version: 1.0.2(@babel/core@7.24.4)(@types/node@20.12.7) next: specifier: 14.2.1 version: 14.2.1(@babel/core@7.24.4)(react-dom@18.2.0)(react@18.2.0) @@ -3516,8 +3516,8 @@ packages: tmpl: 1.0.5 dev: false - /mcutils-library@1.0.1(@babel/core@7.24.4)(@types/node@20.12.7): - resolution: {integrity: sha512-ar1nlplgGjIk+b69wxVYNmHs7NIU/pJtDGiHIAH9sCE2Tn/twzpPWlFYASh/jejYkhf6/FZQSAJP1WytUnR6lw==} + /mcutils-library@1.0.2(@babel/core@7.24.4)(@types/node@20.12.7): + resolution: {integrity: sha512-Yl9w3H4FqDmhki32HGvR1jDLzhSJqaWuBiUqYom+5IZk6sLh5j6yfRVFvwHTOLfx/Ee43FWFBXeM+9TQoTUC4Q==} dependencies: axios: 1.6.8 jest: 29.7.0(@types/node@20.12.7)(ts-node@10.9.2) diff --git a/public/next.svg b/public/next.svg deleted file mode 100644 index 5174b28..0000000 --- a/public/next.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/vercel.svg b/public/vercel.svg deleted file mode 100644 index d2f8422..0000000 --- a/public/vercel.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/app/player/page.tsx b/src/app/player/page.tsx index d379801..9f1d6d0 100644 --- a/src/app/player/page.tsx +++ b/src/app/player/page.tsx @@ -4,7 +4,7 @@ export default function Player() { return (
-

Search for a Player

+

Lookup a Player

You can enter a players uuid or username to get information about the player.

diff --git a/src/app/server/page.tsx b/src/app/server/page.tsx new file mode 100644 index 0000000..a572a69 --- /dev/null +++ b/src/app/server/page.tsx @@ -0,0 +1,13 @@ +import ServerSearch from "@/components/server-search"; + +export default function Player() { + return ( +
+
+

Lookup a Server

+

You can enter a server ip or domain to get information about the server.

+
+ +
+ ); +} diff --git a/src/components/navbar.tsx b/src/components/navbar.tsx index f55da08..7caea27 100644 --- a/src/components/navbar.tsx +++ b/src/components/navbar.tsx @@ -9,6 +9,7 @@ type Page = { const pages: Page[] = [ { title: "Home", url: "/" }, { title: "Player", url: "/player" }, + { title: "Server", url: "/server" }, ]; export default function NavBar() { diff --git a/src/components/player-search.tsx b/src/components/player-search.tsx index 52094e1..5aca3ad 100644 --- a/src/components/player-search.tsx +++ b/src/components/player-search.tsx @@ -12,7 +12,7 @@ export default function PlayerSearch() { const [playerId, setPlayerId] = useState(null); const [player, setPlayer] = useState(null); - const handleSearch = () => { + const handleLookup = () => { if (playerId === null || playerId.length <= 0) { toast.error("Please enter a player ID"); return; @@ -29,7 +29,7 @@ export default function PlayerSearch() { const handleKeyDown = (e: any) => { if (e.key === "Enter") { - handleSearch(); + handleLookup(); } }; @@ -42,33 +42,31 @@ export default function PlayerSearch() { onChange={(e) => setPlayerId(e.target.value)} onKeyDown={handleKeyDown} /> - +
{player && ( -
-
- The player's Head -
-

- Unique ID: {player.uniqueId} -

-

- Name: {player.username} -

-
-

Skin Parts

-
- {Object.keys(player.skin.parts).map((part: any, index: number) => { - return ( -

- - {part} - -

- ); - })} -
+
+ The player's Head +
+

+ Unique ID: {player.uniqueId} +

+

+ Name: {player.username} +

+
+

Skin Parts

+
+ {Object.keys(player.skin.parts).map((part: any, index: number) => { + return ( +

+ + {part} + +

+ ); + })}
diff --git a/src/components/server-search.tsx b/src/components/server-search.tsx new file mode 100644 index 0000000..3804dd5 --- /dev/null +++ b/src/components/server-search.tsx @@ -0,0 +1,74 @@ +"use client"; + +import { cn } from "@/common/utils"; +import mcUtils from "mcutils-library"; +import JavaMinecraftServer from "mcutils-library/dist/types/server/javaServer"; +import { ServerPlatform } from "mcutils-library/dist/types/server/platform"; +import Image from "next/image"; +import { useState } from "react"; +import { toast } from "react-toastify"; +import { Button } from "./ui/button"; +import { Input } from "./ui/input"; + +export default function ServerSearch() { + const [serverHostname, setServerHostname] = useState(null); + const [server, setServer] = useState(null); + + const handleLookup = () => { + if (serverHostname === null || serverHostname.length <= 0) { + toast.error("Please enter a server hostname"); + return; + } + mcUtils.server + .getServer(ServerPlatform.Java, serverHostname) + .then((response) => { + setServer(response.server as JavaMinecraftServer); + }) + .catch(() => { + toast.error("Server not found"); + }); + }; + + const handleKeyDown = (e: any) => { + if (e.key === "Enter") { + handleLookup(); + } + }; + + return ( +
+
+ setServerHostname(e.target.value)} + onKeyDown={handleKeyDown} + /> + +
+ + {server && ( +
+
+ The server's Icon + +
+ {server.motd.html.map((line, index) => { + return
; + })} +
+
+ +
+
+ Host: {server.hostname} +
+
+ Players: {server.players.online}/{server.players.max} +
+
+
+ )} +
+ ); +}