import { useRouter } from "next/navigation"
import { Button } from "./ui/button"

export const TryAgain = () => {
    const router = useRouter()

    return (
        <div className="flex flex-col items-center p-6 space-y-3">
            <h1 className="text-tertiary text-center">Huh. Couldn&apos;t find what you were looking for.</h1>
            <h1 className="text-tertiary text-center pb-3">Let&apos;s go back to the homepage.</h1>
            <Button size="lg" onClick={() => router.push("/home")}>Home</Button>
        </div>
    )
}