This commit is contained in:
parent
cb91880caf
commit
08739a2e3d
@ -6,10 +6,13 @@ import Link from "next/link";
|
||||
import { useState } from "react";
|
||||
import { toast } from "react-toastify";
|
||||
import { Button } from "./ui/button";
|
||||
import { Card } from "./ui/card";
|
||||
import { Input } from "./ui/input";
|
||||
|
||||
const defaultPlayerId = "Notch";
|
||||
|
||||
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 handleLookup = async () => {
|
||||
@ -40,6 +43,7 @@ export default function PlayerSearch() {
|
||||
<Input
|
||||
className="w-[200px]"
|
||||
placeholder="Player ID"
|
||||
defaultValue={defaultPlayerId}
|
||||
onChange={(e) => setPlayerId(e.target.value)}
|
||||
onKeyDown={handleKeyDown}
|
||||
/>
|
||||
@ -47,7 +51,7 @@ export default function PlayerSearch() {
|
||||
</div>
|
||||
|
||||
{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} />
|
||||
<div className="flex flex-col gap-1 mt-2">
|
||||
<p>
|
||||
@ -71,7 +75,7 @@ export default function PlayerSearch() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
|
@ -8,10 +8,13 @@ import Image from "next/image";
|
||||
import { useState } from "react";
|
||||
import { toast } from "react-toastify";
|
||||
import { Button } from "./ui/button";
|
||||
import { Card } from "./ui/card";
|
||||
import { Input } from "./ui/input";
|
||||
|
||||
const defaultServerHostname = "play.hypixel.net";
|
||||
|
||||
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 handleLookup = async () => {
|
||||
@ -41,6 +44,7 @@ export default function ServerSearch() {
|
||||
<Input
|
||||
className="w-[200px]"
|
||||
placeholder="Server Domain or IP"
|
||||
defaultValue={defaultServerHostname}
|
||||
onChange={(e) => setServerHostname(e.target.value)}
|
||||
onKeyDown={handleKeyDown}
|
||||
/>
|
||||
@ -48,7 +52,7 @@ export default function ServerSearch() {
|
||||
</div>
|
||||
|
||||
{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">
|
||||
<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}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
|
7
src/components/ui/card.tsx
Normal file
7
src/components/ui/card.tsx
Normal file
@ -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>;
|
||||
}
|
Loading…
Reference in New Issue
Block a user