cleanup
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 55s

This commit is contained in:
Lee 2024-04-15 09:09:45 +01:00
parent cb91880caf
commit 08739a2e3d
3 changed files with 21 additions and 6 deletions

@ -6,10 +6,13 @@ import Link from "next/link";
import { useState } from "react"; import { useState } from "react";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
import { Button } from "./ui/button"; import { Button } from "./ui/button";
import { Card } from "./ui/card";
import { Input } from "./ui/input"; import { Input } from "./ui/input";
const defaultPlayerId = "Notch";
export default function PlayerSearch() { export default function PlayerSearch() {
const [playerId, setPlayerId] = useState<string | null>(null); const [playerId, setPlayerId] = useState<string>(defaultPlayerId);
const [player, setPlayer] = useState<any | null>(null); const [player, setPlayer] = useState<any | null>(null);
const handleLookup = async () => { const handleLookup = async () => {
@ -40,6 +43,7 @@ export default function PlayerSearch() {
<Input <Input
className="w-[200px]" className="w-[200px]"
placeholder="Player ID" placeholder="Player ID"
defaultValue={defaultPlayerId}
onChange={(e) => setPlayerId(e.target.value)} onChange={(e) => setPlayerId(e.target.value)}
onKeyDown={handleKeyDown} onKeyDown={handleKeyDown}
/> />
@ -47,7 +51,7 @@ export default function PlayerSearch() {
</div> </div>
{player && ( {player && (
<div className="bg-secondary rounded-lg p-4 min-w-[600px] max-w-full flex flex-row gap-2"> <Card>
<Image src={player.skin.parts.head} alt="The player's Head" width={150} height={150} /> <Image src={player.skin.parts.head} alt="The player's Head" width={150} height={150} />
<div className="flex flex-col gap-1 mt-2"> <div className="flex flex-col gap-1 mt-2">
<p> <p>
@ -71,7 +75,7 @@ export default function PlayerSearch() {
</div> </div>
</div> </div>
</div> </div>
</div> </Card>
)} )}
</div> </div>
); );

@ -8,10 +8,13 @@ import Image from "next/image";
import { useState } from "react"; import { useState } from "react";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
import { Button } from "./ui/button"; import { Button } from "./ui/button";
import { Card } from "./ui/card";
import { Input } from "./ui/input"; import { Input } from "./ui/input";
const defaultServerHostname = "play.hypixel.net";
export default function ServerSearch() { export default function ServerSearch() {
const [serverHostname, setServerHostname] = useState<string | null>(null); const [serverHostname, setServerHostname] = useState<string>(defaultServerHostname);
const [server, setServer] = useState<JavaMinecraftServer | null>(null); const [server, setServer] = useState<JavaMinecraftServer | null>(null);
const handleLookup = async () => { const handleLookup = async () => {
@ -41,6 +44,7 @@ export default function ServerSearch() {
<Input <Input
className="w-[200px]" className="w-[200px]"
placeholder="Server Domain or IP" placeholder="Server Domain or IP"
defaultValue={defaultServerHostname}
onChange={(e) => setServerHostname(e.target.value)} onChange={(e) => setServerHostname(e.target.value)}
onKeyDown={handleKeyDown} onKeyDown={handleKeyDown}
/> />
@ -48,7 +52,7 @@ export default function ServerSearch() {
</div> </div>
{server && ( {server && (
<div className="bg-secondary rounded-lg p-4 min-w-[460px] max-w-full flex flex-col gap-2"> <Card>
<div className="flex flex-row gap-3 items-center"> <div className="flex flex-row gap-3 items-center">
<Image src={server.favicon.url} alt="The server's Icon" width={64} height={64} /> <Image src={server.favicon.url} alt="The server's Icon" width={64} height={64} />
@ -67,7 +71,7 @@ export default function ServerSearch() {
<span className="font-bold">Players:</span> {server.players.online}/{server.players.max} <span className="font-bold">Players:</span> {server.players.online}/{server.players.max}
</div> </div>
</div> </div>
</div> </Card>
)} )}
</div> </div>
); );

@ -0,0 +1,7 @@
export function Card({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return <div className="bg-secondary rounded-lg p-4 min-w-[600px] max-w-full flex flex-row gap-2">{children}</div>;
}