import { aniListData } from "../lib/AniList"; import React, { useState, useEffect } from "react"; import ReactHtmlParser from "kt-react-html-parser"; import Head from "next/head"; import Link from "next/link"; import Footer from "../components/footer"; import Image from "next/image"; import Content from "../components/hero/content"; import { useRouter } from "next/router"; 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 data = detail.data[0]; const greeting = getGreeting(); const handleShowClick = () => { setIsVisible(true); }; const handleHideClick = () => { setIsVisible(false); }; useEffect(() => { function fetchData() { const recent = JSON.parse(localStorage.getItem("recentWatch")); if (recent) { setRecently(recent); } } fetchData(); }, []); return ( <> Moopa {/* NAVBAR */}
{!isVisible && ( )} {/* Mobile Menu */}
{isVisible && ( )} {isVisible && (
)}
{/* PC / TABLET */}

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

{ReactHtmlParser(data.description)}
{data.title.english
{session && (
{greeting}, {session?.user.name}
)} {/* Mobile */}
{recently && ( )} {detail && ( )} {popular && ( )}