From c526d560a3e8ed9b2dc9a23825b8979c00a152ba Mon Sep 17 00:00:00 2001 From: Factiven Date: Mon, 1 May 2023 01:09:33 +0700 Subject: Update v3.5 > Bug Fixes > Editor List Update v0.8 > Display adjustment on search page --- pages/categories/[id].js | 125 +++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 125 insertions(+) create mode 100644 pages/categories/[id].js (limited to 'pages/categories') diff --git a/pages/categories/[id].js b/pages/categories/[id].js new file mode 100644 index 0000000..1395a33 --- /dev/null +++ b/pages/categories/[id].js @@ -0,0 +1,125 @@ +import Head from "next/head"; +import Footer from "../../components/footer"; +import { useRouter } from "next/router"; +import { useEffect, useState } from "react"; +import { useAniList } from "../../lib/useAnilist"; +import Image from "next/image"; + +export default function Categories() { + const router = useRouter(); + const { id } = router.query; + const tags = id?.replace(/-/g, " "); + const { aniAdvanceSearch } = useAniList(); + + const [data, setData] = useState(); + + const [season, setSeason] = useState(""); + const [loading, setLoading] = useState(false); + + useEffect(() => { + setLoading(true); + if (tags === "This Season") { + seasonNow(); + setLoading(false); + } else if (tags === "Popular Anime") { + PopularAnime(); + setLoading(false); + } else if (tags === "Popular Manga") { + PopularManga(); + setLoading(false); + } else { + setData(null); + setLoading(false); + } + }, [id]); + + async function seasonNow() { + const data = await aniAdvanceSearch({ + perPage: 25, + seasonYear: 2023, + season: getCurrentSeason(), + // type: "MANGA", + }); + setData(data); + } + + async function PopularAnime() { + const data = await aniAdvanceSearch({ + perPage: 25, + sort: ["POPULARITY_DESC"], + }); + setData(data); + } + + async function PopularManga() { + const data = await aniAdvanceSearch({ + perPage: 25, + sort: ["POPULARITY_DESC"], + type: "MANGA", + }); + setData(data); + } + + console.log(data); + return ( + <> + + Categories - {tags} + +
+
+ {loading ? ( +

Loading...

+ ) : ( + data && + data?.media.map((m) => { + return ( +
+ image +
+ ); + }) + )} +
+
+