add basic server and player page
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 1m3s
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 1m3s
This commit is contained in:
parent
5b76385caf
commit
3c7cbfd95a
@ -4,6 +4,7 @@ import { Card } from "@/components/ui/card";
|
||||
import { getPlayer } from "mcutils-library";
|
||||
import { Player } from "mcutils-library/dist/types/player/player";
|
||||
import { Metadata } from "next";
|
||||
import Image from "next/image";
|
||||
|
||||
type Params = {
|
||||
params: {
|
||||
@ -53,8 +54,32 @@ export default async function Page({ params }: Params) {
|
||||
<Card>
|
||||
{player == null && <NotFound message="Player not found" />}
|
||||
{player != null && (
|
||||
<div className="flex flex-col items-center gap-2">
|
||||
<p>Username: {player.username}</p>
|
||||
<div className="flex gap-2 flex-col md:flex-row">
|
||||
<div className="flex justify-center md:justify-start">
|
||||
<Image
|
||||
className="w-fit h-fit"
|
||||
src={player.skin.parts.head}
|
||||
width={96}
|
||||
height={96}
|
||||
alt="The player's skin"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-2">
|
||||
<div>
|
||||
<h2 className="text-xl">{player.username}</h2>
|
||||
<p className="text-gray-300">{player.uniqueId}</p>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-2">
|
||||
<p className="text-lg">Skin Parts</p>
|
||||
<div className="flex gap-2">
|
||||
{Object.entries(player.skin.parts).map(([key, value]) => {
|
||||
return <img className="h-[64px]" key={key} src={value} alt={`The player's ${key}`} />;
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</Card>
|
||||
|
@ -8,6 +8,7 @@ import JavaMinecraftServer from "mcutils-library/dist/types/server/javaServer";
|
||||
import { ServerPlatform } from "mcutils-library/dist/types/server/platform";
|
||||
import { MinecraftServer } from "mcutils-library/dist/types/server/server";
|
||||
import { Metadata } from "next";
|
||||
import Image from "next/image";
|
||||
|
||||
type Params = {
|
||||
params: {
|
||||
@ -57,10 +58,18 @@ async function getData(platform: ServerPlatform, id: string): Promise<MinecraftS
|
||||
export default async function Page({ params: { platform, hostname } }: Params) {
|
||||
const server = await getData(platform, hostname);
|
||||
|
||||
let favicon = null; // Server favicon
|
||||
|
||||
if (platform === ServerPlatform.Java) {
|
||||
// Java specific
|
||||
const javaServer = server as JavaMinecraftServer;
|
||||
favicon = javaServer.favicon && javaServer.favicon.url;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="h-full flex flex-col items-center">
|
||||
<div className="mb-4 text-center">
|
||||
<h1 className="text-xl">Lookup a Server</h1>
|
||||
<h1 className="text-xl">Lookup a {capitalizeFirstLetter(platform)} Server</h1>
|
||||
<p>You can enter a server hostname to get information about the server.</p>
|
||||
|
||||
<LookupServer />
|
||||
@ -69,8 +78,21 @@ export default async function Page({ params: { platform, hostname } }: Params) {
|
||||
<Card>
|
||||
{server == null && <NotFound message="Server not found" />}
|
||||
{server != null && (
|
||||
<div className="flex flex-col items-center gap-2">
|
||||
<p>Hostname: {server.hostname}</p>
|
||||
<div className="flex gap-2 flex-col md:flex-row">
|
||||
{favicon && (
|
||||
<div className="flex justify-center md:justify-start">
|
||||
<Image className="w-fit h-fit" src={favicon} width={96} height={96} alt="The server's favicon" />
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="flex flex-col">
|
||||
<h2 className="text-xl">{server.hostname}</h2>
|
||||
<div className="text-gray-300">
|
||||
<p>
|
||||
Players online: {server.players.online}/{server.players.max}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</Card>
|
||||
|
@ -25,6 +25,9 @@ export function LookupServer() {
|
||||
* @param platform the server platform
|
||||
*/
|
||||
const lookupServer = (platform: ServerPlatform) => {
|
||||
if (!hostname || hostname.length === 0) {
|
||||
return;
|
||||
}
|
||||
router.push(`/server/${platform}/${hostname}`);
|
||||
};
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user