import Head from "next/head"; import { Fragment, useEffect, useState } from "react"; import Link from "next/link"; import { ChevronLeftIcon } from "@heroicons/react/24/outline"; import Skeleton from "react-loading-skeleton"; import Footer from "@/components/shared/footer"; import { getServerSession } from "next-auth"; import { authOptions } from "../../api/auth/[...nextauth]"; import Image from "next/image"; import MobileNav from "@/components/shared/MobileNav"; import { truncateImgUrl } from "@/utils/imageUtils"; export async function getServerSideProps(context) { const session = await getServerSession(context.req, context.res, authOptions); return { props: { sessions: session, }, }; } export default function Recent({ sessions }) { const [data, setData] = useState(null); const [page, setPage] = useState(1); const [nextPage, setNextPage] = useState(true); const [loading, setLoading] = useState(true); useEffect(() => { setLoading(true); async function getRecent() { const data = await fetch(`/api/v2/etc/recent/${page}`).then((res) => res.json() ); if (data?.results?.length === 0) { setNextPage(false); } else if (data !== null && page > 1) { setData((prevData) => { return [...(prevData ?? []), ...data?.results]; }); setNextPage(data?.hasNextPage); } else { setData(data?.results); } setNextPage(data?.hasNextPage); setLoading(false); } getRecent(); }, [page]); useEffect(() => { function handleScroll() { if (page > 5 || !nextPage) { window.removeEventListener("scroll", handleScroll); return; } if ( window.innerHeight + window.pageYOffset >= document.body.offsetHeight - 3 ) { setPage((prevPage) => prevPage + 1); } } window.addEventListener("scroll", handleScroll); return () => window.removeEventListener("scroll", handleScroll); }, [page, nextPage]); return ( Moopa - New Episodes

New Episodes

{data?.map((i, index) => (
{i.title.romaji}
episode-badge

Episode{" "} {i?.episodeNumber || i?.currentEpisode}

{i.title.romaji}

))} {loading && ( <> {[1, 2, 4, 5, 6, 7, 8].map((item) => (
))} )}
{!loading && page > 5 && nextPage && ( )}