RESTfulMC/Frontend/src/app/components/player/player-search.tsx

43 lines
1.2 KiB
TypeScript
Raw Normal View History

2024-04-16 13:40:25 -07:00
import MinecraftButton from "@/components/minecraft-button";
import { Input } from "@/components/ui/input";
2024-04-16 20:10:19 -07:00
import { Label } from "@/components/ui/label";
2024-04-16 13:40:25 -07:00
import { redirect } from "next/navigation";
2024-04-17 16:14:10 -07:00
import { ReactElement } from "react";
2024-04-16 13:40:25 -07:00
/**
* A component for searching for a player.
*
* @param query the query to search for
* @returns the search component jsx
*/
const PlayerSearch = ({
2024-04-17 16:04:15 -07:00
query,
2024-04-16 13:40:25 -07:00
}: {
2024-04-17 16:04:15 -07:00
query: string | undefined;
}): ReactElement => {
2024-04-17 16:14:10 -07:00
const handleRedirect = async (form: FormData): Promise<void> => {
2024-04-17 16:04:15 -07:00
"use server";
redirect(`/player/${form.get("query")}`);
};
return (
<form
className="flex flex-col gap-7 justify-center items-center"
action={handleRedirect}
>
<div className="w-full flex flex-col gap-3">
<Label htmlFor="query">Username or UUID</Label>
<Input
type="search"
name="query"
placeholder="Query..."
defaultValue={query}
maxLength={36}
/>
</div>
<MinecraftButton type="submit">Search</MinecraftButton>
</form>
);
2024-04-16 13:40:25 -07:00
};
export default PlayerSearch;