wikipedia-game-solver/apps/website/app/[locale]/page.tsx
Théo LUDWIG 3ae6d2fac3
Some checks failed
Chromatic / chromatic (push) Failing after 42s
CI / ci (push) Successful in 2m44s
CI / commitlint (push) Successful in 14s
chore: initial commit
2024-07-24 12:35:33 +02:00

69 lines
1.9 KiB
TypeScript

import type { LocaleProps } from "@repo/i18n/config"
import { Button } from "@repo/ui/design/Button"
import { Link } from "@repo/ui/design/Link"
import { Typography } from "@repo/ui/design/Typography"
import { MainLayout } from "@repo/ui/MainLayout"
import { WikipediaClient } from "@repo/wikipedia-game-solver/WikipediaClient"
import { useTranslations } from "next-intl"
import { unstable_setRequestLocale } from "next-intl/server"
import Image from "next/image"
import { FaRocket } from "react-icons/fa6"
import WikipediaLogo from "#public/images/Wikipedia-Logo.png"
interface HomePageProps extends LocaleProps {}
const HomePage: React.FC<HomePageProps> = (props) => {
const { params } = props
// Enable static rendering
unstable_setRequestLocale(params.locale)
const t = useTranslations()
return (
<MainLayout>
<section className="text-center">
<Typography as="h1" variant="h1">
{t("home.title")}
</Typography>
<Typography as="p" variant="text1" className="mt-3">
{t.rich("home.description", {
wikipedia: (children) => {
return (
<Link href="https://en.wikipedia.org/" target="_blank">
{children}
</Link>
)
},
})}
</Typography>
</section>
<section className="my-6 flex items-center justify-center">
<Image src={WikipediaLogo} alt="Wikipedia" className="w-72" />
</section>
<section className="my-6 flex items-center space-x-6">
<Button leftIcon={<FaRocket size={18} />} href="/about">
About
</Button>
<Button
leftIcon={<FaRocket size={18} />}
variant="outline"
href="/"
target="_blank"
>
Get Started
</Button>
</section>
<WikipediaClient />
</MainLayout>
)
}
export default HomePage