import { useTranslation } from "react-i18next";
import { useLocation } from "react-router-dom";
import ThemeButton from "../components/organisms/ThemeButton";
import HomeButton from "../components/organisms/HomeButton";

const NotFound_404 = () => {
	const location = useLocation();
	const { t } = useTranslation();
	return (
		<div className="flex items-center justify-center h-screen bg-base-200">
			<div className="absolute top-4 right-4">
				<ThemeButton />
			</div>
			<div className="absolute top-4 left-4">
				<HomeButton />
			</div>
			<div className="text-center">
				<h1 className="text-5xl font-bold mb-4">{t("Page404.notFoundTitle")}</h1>
				<p className="text-xl">
					{t("Page404.notFoundDescription")}{" "}
					<code className="text-info">{location.pathname}</code>{" "}
					{t("Page404.wasNotFound")}
				</p>
			</div>
		</div>
	);
};

export default NotFound_404;
