diff options
Diffstat (limited to 'pages/test.js')
| -rw-r--r-- | pages/test.js | 236 |
1 files changed, 0 insertions, 236 deletions
diff --git a/pages/test.js b/pages/test.js deleted file mode 100644 index 0db3a17..0000000 --- a/pages/test.js +++ /dev/null @@ -1,236 +0,0 @@ -import { signIn, signOut, useSession } from "next-auth/react"; -import { useEffect, useState } from "react"; -import { useQuery } from "@apollo/client"; -import { GET_MEDIA } from "../queries"; -import StackPlayer from "../components/test/player"; -import Modal from "../components/modal"; - -import { AniData as data } from "../components/test/dataAni"; -import Image from "next/image"; -import { client } from "../lib/apolloClient"; -import Link from "next/link"; -import { useAniList } from "../lib/useAnilist"; - -export default function AniTest() { - const { data: session, status } = useSession(); - const { media, aniAdvanceSearch, markComplete } = useAniList(session); - const [advanceSearch, setAdvanceSearch] = useState(); - - const [search, setSearch] = useState(); - const [type, setType] = useState("ANIME"); - const [seasonYear, setSeasonYear] = useState(); - const [season, setSeason] = useState(); - const [genres, setGenres] = useState(); - const [perPage, setPerPage] = useState(25); - const [sort, setSort] = useState(["POPULARITY_DESC"]); - - // async function handleUpdateMediaEntry(entryId, status, progress, score) { - // try { - // const updatedEntry = await updateMediaEntry( - // entryId, - // status, - // progress, - // score - // ); - // console.log(updatedEntry); - // } catch (error) { - // console.error(error); - // } - // } - - // const userId = session?.user?.id; - // const MediaList = ({ userId }) => { - // const { data, loading, error } = useQuery(GET_MEDIA, { - // variables: { page: 1, userId, type: "ANIME", status: "COMPLETED" }, - // }); - - // if (loading) return <p>Loading...</p>; - // if (error) return <p>Error :(</p>; - - // const { mediaList } = data.Page; - // console.log(mediaList); - // }; - - // const [open, setOpen] = useState(false); - - async function markAsComplete(id) { - const response = await markComplete(id); - console.log(response); - } - - async function advance() { - const data = await aniAdvanceSearch( - search, - type, - seasonYear, - season, - genres, - perPage, - sort - ); - setAdvanceSearch(data); - } - - useEffect(() => { - advance(); - }, [search, type, seasonYear, season, genres, perPage, sort]); - - if (status === "loading") { - return <div>Loading...</div>; - } - - const astatus = "COMPLETED"; - - // const { data } = aniAdvanceSearch({ - // search: "naruto", - // }); - - // console.log(advanceSearch); - - return ( - // <div className="h-[720px] w-[1280px]"> - // <StackPlayer /> - // </div> - <> - {/* <button - className="bg-[#30c168] p-2 rounded-lg m-5 text-black font-semibold font-karla" - onClick={() => setOpen(true)} - > - Start Watching - </button> - <Modal open={open} onClose={() => setOpen(false)}> - <div className="bg-white rounded-md text-black"> - <div className=""> - <Image - src={data.episodes[0].image} - alt="iamge" - width={1000} - height={1000} - className="object-cover rounded-t-md w-[420px] h-[100px]" - /> - </div> - <div>Episode 6</div> - <div>test</div> - </div> - </Modal> */} - {!session && ( - <button onClick={() => signIn("AniListProvider")}> - Sign in with Anilist - </button> - )} - {session && ( - <div> - <button onClick={() => signOut()}> - Sign out ({session.user?.name}) - </button> - <img - src={session.user?.image.large} - className="w-[100px] h-[100px]" - /> - </div> - )} - {media?.length > 0 && ( - <div className="flex-center flex-col gap-5"> - {media.map((item, index) => { - return ( - <div key={index} className="flex-center flex-col gap-5"> - <h2 className="font-bold text-xl font-karla">{item.name}</h2> - <div className="grid grid-cols-4 gap-5"> - {item.entries.map((items, index) => { - return ( - <div key={index}> - <div className="bg-secondary flex h-[120px] w-[420px]"> - <div className="w-[20%] shrink-0"> - <Image - src={items.media.coverImage.large} - alt="image deez nuts" - height={1000} - width={1000} - className="object-cover h-[120px] shrink-0" - /> - </div> - <div className="p-3"> - <h1 className="text-semibold font-karla text-lg line-clamp-3"> - {items.media.title.romaji} - </h1> - <h3 className="text-sm font-karla text-light"> - Episodes {items.progress} - {items.media.episodes} - </h3> - {item.name === "Watching" && ( - <button - onClick={() => markAsComplete(items.media.id)} - > - Mark as Complete - </button> - )} - </div> - </div> - </div> - ); - })} - </div> - </div> - ); - })} - {/* <h2 className="font-bold text-xl font-karla">Paused</h2> - <div className="grid grid-cols-4 gap-5"> - {media[1].entries.map((item, index) => { - return ( - <div key={index} className=""> - <div className="bg-secondary flex h-[120px] w-[420px]"> - <div className="w-[20%] shrink-0"> - <Image - src={item.media.coverImage.large} - alt="image deez nuts" - height={1000} - width={1000} - className="object-cover h-[120px]" - /> - </div> - <div className="p-3"> - <h1 className="text-semibold font-karla text-lg line-clamp-3"> - {item.media.title.romaji} - </h1> - <h3 className="text-sm font-karla text-light"> - Episodes {item.progress} - {item.media.episodes} - </h3> - </div> - </div> - </div> - ); - })} - </div> - <h2 className="font-bold text-xl font-karla">Dropped</h2> - <div className="grid grid-cols-4 gap-5"> - {media[2].entries.map((item, index) => { - return ( - <div key={index} className=""> - <div className="bg-secondary flex h-[120px] w-[420px]"> - <div className="w-[20%] shrink-0"> - <Image - src={item.media.coverImage.large} - alt="image deez nuts" - height={1000} - width={1000} - className="object-cover h-[120px]" - /> - </div> - <div className="p-3"> - <h1 className="text-semibold font-karla text-lg line-clamp-3"> - {item.media.title.romaji} - </h1> - <h3 className="text-sm font-karla text-light"> - Episodes {item.progress} - {item.media.episodes} - </h3> - </div> - </div> - </div> - ); - })} - </div> */} - </div> - )} - <Link href="/">Home</Link> - </> - ); -} |