page.tsx

import { GameUnityLogo } from "@/components/logo"
import { SiteFooter } from "@/components/site-footer"
import { buttonVariants } from "@/components/ui/button"
import { getCurrentUser } from "@/lib/session"
import { cn } from "@/lib/utils"
import Link from "next/link"

export default async function IndexPage() {
    const user = await getCurrentUser()

    return (
        <div className="flex flex-col h-screen justify-between">
            <section className="space-y-6 pb-8 pt-6 md:pb-12 md:pt-10 lg:py-32">
                <div className="container flex max-w-[64rem] flex-col items-center gap-4 text-center">
                    <div className="flex items-center">
                        <Link href="/home" className={cn("rounded-full p-3 hover:bg-accent")}>
                            <GameUnityLogo className="h-10 w-10" />
                        </Link>
                    </div>
                    <h1 className="font-heading text-3xl sm:text-5xl md:text-6xl lg:text-7xl">
                        The ultimate gaming hub
                    </h1>
                    <p className="max-w-[42rem] leading-normal text-muted-foreground sm:text-xl sm:leading-8">
                        Step into a gaming world beyond imagination. Experience unparalleled features, connect with a vibrant community, and unlock your true gaming potential. Elevate your gameplay, discover new horizons, and make every gaming moment count. Join us and embark on an extraordinary gaming adventure like no other.
                    </p>
                    {!user && <div className="align-middle mb-12">
                        <Link href="/login" className={cn(buttonVariants({ size: "lg" }), "mr-6")}>
                            Login
                        </Link>
                        <span className="text-muted-foreground">or</span>
                        <Link href="/signup" className={cn(buttonVariants({ size: "lg" }), "ml-6")}>
                            Sign-Up
                        </Link>
                    </div>}
                    <Link href="/home" className={cn(buttonVariants({ size: "lg" }))}>
                        Home Feed
                    </Link>
                    <Link href="/games" className={cn(buttonVariants({ size: "lg" }))}>
                        Games List
                    </Link>
                </div>
            </section>
            <section
                id="features"
                className="container space-y-6 bg-slate-50 py-8 dark:bg-transparent md:py-12 lg:py-24"
            >
                <div className="mx-auto flex max-w-[58rem] flex-col items-center space-y-4 text-center">
                    <h2 className="font-heading text-3xl leading-[1.1] sm:text-3xl md:text-6xl">
                        Features
                    </h2>
                    <p className="max-w-[85%] leading-normal text-muted-foreground sm:text-lg sm:leading-7">
                        Create your Profile, find New Games, Rate & Review them, Add your Favorite Games to your List, Help and socialize with other Players,
                        show of your skills with hightscores and clips
                    </p>
                </div>
                <div className="mx-auto grid justify-center gap-4 sm:grid-cols-2 md:max-w-[64rem] md:grid-cols-3">
                    <div className="relative overflow-hidden rounded-lg border bg-background p-2">
                        <div className="flex h-[180px] flex-col justify-between rounded-md p-6">
                            <div className="space-y-2">
                                <h3 className="font-bold">Discover new games </h3>
                                <p className="text-sm text-muted-foreground">
                                    The platform offers a way to discover and try new games. Through recommendations and ratings from other users, gamers gain inspiration for new games and can broaden their horizons.
                                </p>
                            </div>
                        </div>
                    </div>
                    <div className="relative overflow-hidden rounded-lg border bg-background p-2">
                        <div className="flex h-[180px] flex-col justify-between rounded-md p-6">
                            <div className="space-y-2">
                                <h3 className="font-bold">Community-Interaction</h3>
                                <p className="text-sm text-muted-foreground">
                                    Users can connect with other players, ask and answer questions, chat with other gamers, and make friends. The platform promotes interaction among gamers and creates a sense of community and belonging.
                                </p>
                            </div>
                        </div>
                    </div>
                    <div className="relative overflow-hidden rounded-lg border bg-background p-2">
                        <div className="flex h-[180px] flex-col justify-between rounded-md p-6">
                            <div className="space-y-2">
                                <h3 className="font-bold">Manage your Game collection</h3>
                                <p className="text-sm text-muted-foreground">
                                    The platform provides an easy way to search, collect, and organize games. With various filtering and sorting options, users always have an overview of their game collection.
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
                <div className="mx-auto text-center md:max-w-[58rem]">
                    <p className="leading-normal sm:text-lg sm:leading-7">
                        Level up your gaming experience with us
                    </p>
                </div>
            </section>
            <SiteFooter className="border-t" />
        </div>
    )
}