2024-04-16 19:03:11 +01:00
|
|
|
"use client";
|
|
|
|
|
2024-04-17 18:26:53 +01:00
|
|
|
import { useToast } from "@/common/use-toast";
|
|
|
|
import { getPlayer } from "mcutils-library";
|
2024-04-16 19:03:11 +01:00
|
|
|
import { useRouter } from "next/navigation";
|
2024-04-18 05:18:25 +01:00
|
|
|
import { ReactElement } from "react";
|
2024-04-16 19:12:26 +01:00
|
|
|
import { Button } from "../ui/button";
|
|
|
|
import { Input } from "../ui/input";
|
2024-04-18 05:18:25 +01:00
|
|
|
import { Label } from "../ui/label";
|
2024-04-16 19:03:11 +01:00
|
|
|
|
2024-04-18 03:51:41 +01:00
|
|
|
export function LookupPlayer(): ReactElement {
|
2024-04-16 19:03:11 +01:00
|
|
|
const router = useRouter();
|
2024-04-17 18:26:53 +01:00
|
|
|
const { toast } = useToast();
|
2024-04-16 19:03:11 +01:00
|
|
|
|
|
|
|
/**
|
2024-04-18 05:18:25 +01:00
|
|
|
* Lookup a server based on the platform
|
|
|
|
*
|
|
|
|
* @param platform the server platform
|
|
|
|
* @param query the query to lookup
|
2024-04-16 19:03:11 +01:00
|
|
|
*/
|
2024-04-18 05:18:25 +01:00
|
|
|
const lookupPlayer = async (query: string) => {
|
|
|
|
if (!query || query.length === 0) {
|
2024-04-16 19:03:11 +01:00
|
|
|
return;
|
|
|
|
}
|
2024-04-17 18:26:53 +01:00
|
|
|
|
|
|
|
try {
|
2024-04-18 05:18:25 +01:00
|
|
|
await getPlayer(query);
|
2024-04-17 18:26:53 +01:00
|
|
|
} catch (err) {
|
|
|
|
toast({
|
|
|
|
title: "Error",
|
|
|
|
variant: "destructive",
|
|
|
|
description: (err as Error).message,
|
|
|
|
duration: 5000,
|
|
|
|
});
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2024-04-18 05:18:25 +01:00
|
|
|
router.push(`/player/${query}`);
|
2024-04-16 19:03:11 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
return (
|
2024-04-18 05:18:25 +01:00
|
|
|
<form
|
2024-04-18 05:48:13 +01:00
|
|
|
className="flex flex-col gap-2 justify-center items-center mt-4 flex-wrap"
|
2024-04-18 05:18:25 +01:00
|
|
|
action={(form: FormData) => {
|
|
|
|
lookupPlayer(form.get("query") as string);
|
|
|
|
}}
|
|
|
|
>
|
|
|
|
<div className="flex gap-2 justify-center">
|
|
|
|
<div className="flex flex-col gap-2 items-start">
|
|
|
|
<Label htmlFor="query">Player</Label>
|
|
|
|
<Input className="w-fit" type="search" name="query" placeholder="Query..." maxLength={128} />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<Button type="submit">Search</Button>
|
2024-04-16 19:35:07 +01:00
|
|
|
</form>
|
2024-04-16 19:03:11 +01:00
|
|
|
);
|
|
|
|
}
|