import Sort from "@/components/filter-sort-games";
import { InfiniteScrollGames } from "@/components/infinity-scroll";
import ScrollToTop from "@/components/scroll-to-top";
import SearchInput from "@/components/search-input";

// renders a list of games infinitely (presumably)
export default async function GamesPage() {
    return (
        <>
            <main className="relative lg:gap-10 xl:grid xl:grid-cols-[1fr_240px]">
                <div className="grid">
                    <div className="flex flex-col gap-10 items-center w-full">
                        <SearchInput className="p-3 lg:w-2/3 2xl:w-1/3" />
                    </div>
                    <InfiniteScrollGames />
                </div>
                <div className="hidden xl:block flex-col md:flex">
                    <Sort />
                </div>
            </main>
            <div className="fixed top-6 left-1/2 -ml-7">
                <ScrollToTop />
            </div>
        </>
    )
}