From b365d89a11adf40d37b78292f121b890e960d0e8 Mon Sep 17 00:00:00 2001 From: Factiven Date: Thu, 13 Apr 2023 16:03:57 +0700 Subject: update 2nd --- pages/anime/[...id].js | 38 ++++-- pages/anime/watch/[...info].js | 131 +++++++++++++++++-- pages/api/getUser.js | 20 +++ pages/api/update-user.js | 21 +++ pages/dmca.js | 2 +- pages/index.js | 281 +++++++++++++++++++++++------------------ pages/search.js | 9 -- pages/test.js | 21 ++- pages/testing.js | 34 +++++ 9 files changed, 382 insertions(+), 175 deletions(-) create mode 100644 pages/api/getUser.js create mode 100644 pages/api/update-user.js create mode 100644 pages/testing.js (limited to 'pages') diff --git a/pages/anime/[...id].js b/pages/anime/[...id].js index d42a394..c2e69e1 100644 --- a/pages/anime/[...id].js +++ b/pages/anime/[...id].js @@ -75,7 +75,9 @@ export default function Himitsu({ if (!Array.isArray(existingData)) { existingData = []; } - const index = existingData.findIndex((item) => item.title === props.title); + const index = existingData.findIndex( + (item) => item.title.romaji === props.title.romaji + ); if (index !== -1) { existingData.splice(index, 1); } @@ -176,13 +178,17 @@ export default function Himitsu({ href={`/anime/watch/${epi1[0].id}/${info.id}`} onClick={() => handleStore({ - title: - info.title?.english || - info.title.romaji || - info.title.native, + title: { + romaji: + info.title.romaji || + info.title.english || + info.title.native, + }, description: info.description, - image: info.image, - id: info.id, + coverImage: { + extraLarge: info.image, + }, + id: parseInt(info.id), }) } > @@ -358,7 +364,7 @@ export default function Himitsu({ className="object-cover h-full w-full shrink-0 rounded-l-md" /> -
+
{relation.relationType}
@@ -415,13 +421,17 @@ export default function Himitsu({ handleStore({ - title: - info.title?.english || - info.title.romaji || - info.title.native, + title: { + romaji: + info.title.romaji || + info.title.english || + info.title.native, + }, description: info.description, - image: info.image, - id: info.id, + coverImage: { + extraLarge: info.image, + }, + id: parseInt(info.id), }) } href={`/anime/watch/${episode.id}/${info.id}/${ diff --git a/pages/anime/watch/[...info].js b/pages/anime/watch/[...info].js index 73e04f5..ed1a50b 100644 --- a/pages/anime/watch/[...info].js +++ b/pages/anime/watch/[...info].js @@ -9,17 +9,59 @@ import Head from "next/head"; import { useEffect, useState } from "react"; import Modal from "../../../components/modal"; +import { useNotification } from "../../../lib/useNotify"; + +import { useSession, signIn, signOut } from "next-auth/react"; +import AniList from "../../../components/media/aniList"; + +import { AnimatePresence, motion as m } from "framer-motion"; +import Navbar from "../../../components/navbar"; +import { Navigasi } from "../.."; + export default function Info({ info }) { + const { data: session, status } = useSession(); const title = info.aniData.title.romaji || info.aniData.title.english; const data = info.aniData; const fallback = info.epiFallback; + const { Notification: NotificationComponent, show } = useNotification(); + + // console.log(session); + + const playingEpisode = data.episodes + .filter((item) => item.id == info.id) + .map((item) => item.number); const [open, setOpen] = useState(false); + const [aniStatus, setAniStatus] = useState(""); + const [aniProgress, setAniProgress] = useState(parseInt(playingEpisode)); + + const handleStatus = (e) => { + setAniStatus(e.target.value); + }; + + const handleProgress = (e) => { + const value = parseFloat(e.target.value); + if (!isNaN(value) && value >= 0 && value <= data.totalEpisodes) { + setAniProgress(value); + } + }; + + const handleSubmit = (e) => { + e.preventDefault(); + const formData = { status: aniStatus, progress: aniProgress }; + console.log(formData); + }; const playingTitle = data.episodes .filter((item) => item.id == info.id) .map((item) => item.title); + if (status === "loading") { + return

Loading...

; + } + + console.log(parseInt(playingEpisode)); + return ( <> @@ -27,29 +69,91 @@ export default function Info({ info }) { {fallback ? data.title.romaji || data.title.english : playingTitle} + + + setOpen(false)}> -
+

Save this Anime to Your List

-

- Are you sure you want to save this anime to your list? -

-
- + {!session && ( -
+ )} + {session && ( + <> +
+
+ + +
+
+ + +
+
+ +
+
+ + )}
+
@@ -59,6 +163,9 @@ export default function Info({ info }) { seek={info.seek} titles={title} id={info.id} + progress={parseInt(playingEpisode)} + session={session} + aniId={parseInt(data.id)} />
diff --git a/pages/api/getUser.js b/pages/api/getUser.js new file mode 100644 index 0000000..7df10a6 --- /dev/null +++ b/pages/api/getUser.js @@ -0,0 +1,20 @@ +import clientPromise from "../../lib/mongodb"; + +export async function getUser(userName) { + const client = await clientPromise; + const db = client.db("authbase"); + + const collection = db.collection("users"); + const user = await collection.findOne({ name: userName }); + + user._id = String(user._id); + + return user; +} + +export default async function handler(req, res) { + const { userName } = req.query; + const user = await getUser(userName); + + res.status(200).json(user); +} diff --git a/pages/api/update-user.js b/pages/api/update-user.js new file mode 100644 index 0000000..9f652ac --- /dev/null +++ b/pages/api/update-user.js @@ -0,0 +1,21 @@ +// pages/api/update-user.js +import clientPromise from "../../lib/mongodb"; + +export default async function handler(req, res) { + const client = await clientPromise; + const db = client.db("authbase"); + const collection = db.collection("users"); + + const { name, newData } = req.body; // id is the user ID and newData is the new data you want to set + + try { + const result = await collection.updateOne( + { name: name }, + { $set: newData } + ); + + res.status(200).json(result); + } catch (error) { + res.status(500).json({ error: "Unable to update user data" }); + } +} diff --git a/pages/dmca.js b/pages/dmca.js index 7244bf7..c94781b 100644 --- a/pages/dmca.js +++ b/pages/dmca.js @@ -22,7 +22,7 @@ export default function DMCA() { -
+

diff --git a/pages/index.js b/pages/index.js index 7c26f0b..d75cb0f 100644 --- a/pages/index.js +++ b/pages/index.js @@ -1,4 +1,3 @@ -import { MdChevronLeft, MdChevronRight } from "react-icons/md"; import { aniListData } from "../lib/AniList"; import React, { useState, useEffect } from "react"; import ReactHtmlParser from "kt-react-html-parser"; @@ -9,12 +8,90 @@ import Image from "next/image"; import Content from "../components/hero/content"; import { useRouter } from "next/router"; -export default function Home({ detail, populars, topDesc }) { +import { useSession, signIn } from "next-auth/react"; + +export function Navigasi() { + const { data: session, status } = useSession(); + + const router = useRouter(); + + const handleFormSubmission = (inputValue) => { + router.push(`/search?hasil=${encodeURIComponent(inputValue)}`); + }; + + const handleKeyDown = async (event) => { + if (event.key === "Enter") { + event.preventDefault(); + const inputValue = event.target.value; + handleFormSubmission(inputValue); + } + }; + return ( + <> + {/* NAVBAR PC */} +
+
+
+ + moopa + +
    + +
  • AniList Index
    • + + +
  • Manga
    • + +
  • Anime
    • + {status === "loading" &&
  • Loading...
    • } + {!session && ( +
  • + +
    • + )} + {session && ( +
  • + {/*
    imagine
    */} + My List +
    • + )} +
+
+
+
+ + + + +
+
+
+
+ + ); +} + +export default function Home({ detail, populars }) { + const { data: session, status } = useSession(); const [isVisible, setIsVisible] = useState(false); const [recently, setRecently] = useState(null); - const popular = populars.data; + const popular = populars?.data; const data = detail.data[0]; - const router = useRouter(); + + const greeting = getGreeting(); const handleShowClick = () => { setIsVisible(true); @@ -34,32 +111,6 @@ export default function Home({ detail, populars, topDesc }) { fetchData(); }, []); - function handleRemove() { - localStorage.removeItem("recentWatch"); - setRecently(null); - } - - const slideLeft = () => { - var slider = document.getElementById("recentslider"); - slider.scrollLeft = slider.scrollLeft - 500; - }; - const slideRight = () => { - var slider = document.getElementById("recentslider"); - slider.scrollLeft = slider.scrollLeft + 500; - }; - - const handleFormSubmission = (inputValue) => { - router.push(`/search?hasil=${encodeURIComponent(inputValue)}`); - }; - - const handleKeyDown = async (event) => { - if (event.key === "Enter") { - event.preventDefault(); - const inputValue = event.target.value; - handleFormSubmission(inputValue); - } - }; - return ( <> @@ -80,6 +131,8 @@ export default function Home({ detail, populars, topDesc }) { /> + + {/* NAVBAR */}
{!isVisible && ( + )} {isVisible && (
@@ -227,47 +311,17 @@ export default function Home({ detail, populars, topDesc }) { )}
-
-
-
-
-

- moopa -

-
    - -
  • AniList Index
    • - - -
  • Manga
    • - -
  • Anime
    • -
-
-
-
- - - - -
-
-
-
+
+ {/* PC / TABLET */} -
-
+
+
-

+

{data.title.english || data.title.romaji || data.title.native}

-
+
{ReactHtmlParser(data.description)}
@@ -277,84 +331,48 @@ export default function Home({ detail, populars, topDesc }) { legacyBehavior className="flex" > - + START WATCHING
-
-
+
+
{data.title.english
+ {session && ( +
+
+ {greeting}, {session?.user.name} +
+
+ )} + {/* Mobile */} -
+
{recently && ( -
-
-

- Recently Watched -

-
handleRemove()} - > - Clear all -
-
-
- -
- {recently.map((anime, index) => { - const url = encodeURIComponent(anime.title); - - return ( - - {anime.title - - ); - })} -
- -
-
+ )} {detail && ( @@ -390,16 +408,27 @@ export async function getServerSideProps({ req, res }) { page: 1, }); const genreDetail = await aniListData({ sort: "TYPE", page: 1 }); - const newTrend = await trendingDetail.props; - const trends = newTrend.data[0]; - const topDesc = trends.description.slice(0, 350) + "..."; return { props: { - topDesc: topDesc, genre: genreDetail.props, detail: trendingDetail.props, populars: popularDetail.props, }, }; } + +function getGreeting() { + const time = new Date().getHours(); + let greeting = ""; + + if (time >= 5 && time < 12) { + greeting = "Good morning"; + } else if (time >= 12 && time < 18) { + greeting = "Good afternoon"; + } else { + greeting = "Good evening"; + } + + return greeting; +} diff --git a/pages/search.js b/pages/search.js index 87f9cdc..4bb32af 100644 --- a/pages/search.js +++ b/pages/search.js @@ -107,8 +107,6 @@ export default function Card() { advance(); }, [search, type, seasonYear, season, genres, perPage, sort]); - console.log(data); - // useEffect(() => { // async function fetchData() { // setLoading(true); @@ -421,10 +419,3 @@ export default function Card() { ); } - -{ - /*
-
-

Anime Title

-
*/ -} diff --git a/pages/test.js b/pages/test.js index 57db350..0db3a17 100644 --- a/pages/test.js +++ b/pages/test.js @@ -13,7 +13,7 @@ import { useAniList } from "../lib/useAnilist"; export default function AniTest() { const { data: session, status } = useSession(); - const { media, aniAdvanceSearch } = useAniList(session); + const { media, aniAdvanceSearch, markComplete } = useAniList(session); const [advanceSearch, setAdvanceSearch] = useState(); const [search, setSearch] = useState(); @@ -53,6 +53,11 @@ export default function AniTest() { // 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, @@ -80,7 +85,7 @@ export default function AniTest() { // search: "naruto", // }); - console.log(advanceSearch); + // console.log(advanceSearch); return ( //
@@ -124,9 +129,6 @@ export default function AniTest() { />
)} - {advanceSearch?.media.map((item) => { - return
{item.title.userPreferred}
; - })} {media?.length > 0 && (
{media.map((item, index) => { @@ -156,14 +158,7 @@ export default function AniTest() {

{item.name === "Watching" && ( diff --git a/pages/testing.js b/pages/testing.js new file mode 100644 index 0000000..ffa8080 --- /dev/null +++ b/pages/testing.js @@ -0,0 +1,34 @@ +import { getUser } from "./api/getUser"; + +export default function Testing({ user }) { + async function handleUpdate() { + const res = await fetch("/api/update-user", { + method: "POST", + body: JSON.stringify({ + name: "Factiven", + newData: { + settings: { + tracking: false, + }, + }, + }), + headers: { + "Content-Type": "application/json", + }, + }); + console.log(res.status); + } + + console.log(user.settings); + return ; +} + +export async function getServerSideProps(context) { + const user = await getUser("Factiven"); + console.log(user); + return { + props: { + user: user, + }, + }; +} -- cgit v1.2.3