"use client";

import { ServerPlatform } from "mcutils-library/dist/types/server/platform";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { Button } from "./ui/button";
import { Input } from "./ui/input";

export function LookupServer() {
  const router = useRouter();
  const [hostname, setHostname] = useState("");

  /**
   * Set the hostname value
   *
   * @param event the input event
   */
  const setHostnameValue = (event: React.ChangeEvent<HTMLInputElement>) => {
    setHostname(event.target.value);
  };

  /**
   * Lookup a server based on the platform
   *
   * @param platform the server platform
   */
  const lookupServer = (platform: ServerPlatform) => {
    router.push(`/server/${platform}/${hostname}`);
  };

  return (
    <div className="flex gap-2 justify-center mt-2">
      <Input className="w-fit" placeholder="Server hostname" value={hostname} onChange={setHostnameValue} />
      <Button onClick={() => lookupServer(ServerPlatform.Java)}>Java</Button>
      <Button onClick={() => lookupServer(ServerPlatform.Bedrock)}>Bedrock</Button>
    </div>
  );
}