aboutsummaryrefslogtreecommitdiff
path: root/pages/en/index.js
diff options
context:
space:
mode:
Diffstat (limited to 'pages/en/index.js')
-rw-r--r--pages/en/index.js199
1 files changed, 6 insertions, 193 deletions
diff --git a/pages/en/index.js b/pages/en/index.js
index 9cb516c..cbf96cd 100644
--- a/pages/en/index.js
+++ b/pages/en/index.js
@@ -8,7 +8,7 @@ import Content from "../../components/home/content";
import { motion } from "framer-motion";
-import { signIn, signOut } from "next-auth/react";
+import { signOut } from "next-auth/react";
import { useAniList } from "../../lib/anilist/useAnilist";
import { getServerSession } from "next-auth/next";
import { authOptions } from "../api/auth/[...nextauth]";
@@ -19,6 +19,7 @@ import getUpcomingAnime from "../../lib/anilist/getUpcomingAnime";
import { useCountdown } from "../../lib/useCountdownSeconds";
import Navigasi from "../../components/home/staticNav";
+import MobileNav from "../../components/home/mobileNav";
// Filter schedules for each day
// const filterByCountryOfOrigin = (schedule, country) => {
@@ -85,7 +86,6 @@ export default function Home({ detail, populars, sessions, upComing }) {
getRelease();
}, [release]);
- const [isVisible, setIsVisible] = useState(false);
const [list, setList] = useState(null);
const [planned, setPlanned] = useState(null);
const [greeting, setGreeting] = useState("");
@@ -95,14 +95,6 @@ export default function Home({ detail, populars, sessions, upComing }) {
const popular = populars?.data;
const data = detail.data[0];
- const handleShowClick = () => {
- setIsVisible(true);
- };
-
- const handleHideClick = () => {
- setIsVisible(false);
- };
-
useEffect(() => {
const time = new Date().getHours();
let greeting = "";
@@ -162,189 +154,7 @@ export default function Home({ detail, populars, sessions, upComing }) {
<link rel="icon" href="/c.svg" />
</Head>
- {/* NAVBAR */}
- <div className="z-50">
- {!isVisible && (
- <button
- onClick={handleShowClick}
- className="fixed bottom-[30px] right-[20px] z-[100] flex h-[51px] w-[50px] cursor-pointer items-center justify-center rounded-[8px] bg-[#17171f] shadow-lg lg:hidden"
- id="bars"
- >
- <svg
- xmlns="http://www.w3.org/2000/svg"
- className="h-[42px] w-[61.5px] text-[#8BA0B2] fill-orange-500"
- viewBox="0 0 20 20"
- fill="currentColor"
- >
- <path
- fillRule="evenodd"
- d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
- clipRule="evenodd"
- />
- </svg>
- </button>
- )}
- </div>
-
- {/* Mobile Menu */}
- <div className={`transition-all duration-150 subpixel-antialiased z-50`}>
- {isVisible && sessions && (
- <Link
- href={`/en/profile/${sessions?.user.name}`}
- className="fixed lg:hidden bottom-[100px] w-[60px] h-[60px] flex items-center justify-center right-[20px] rounded-full z-50 bg-[#17171f]"
- >
- <img
- src={sessions?.user.image.large}
- alt="user avatar"
- className="object-cover w-[60px] h-[60px] rounded-full"
- />
- </Link>
- )}
- {isVisible && (
- <div className="fixed bottom-[30px] right-[20px] z-50 flex h-[51px] w-[300px] items-center justify-center gap-8 rounded-[8px] text-[11px] bg-[#17171f] shadow-lg lg:hidden">
- <div className="grid grid-cols-4 place-items-center gap-6">
- <button className="group flex flex-col items-center">
- <Link href="/en/" className="">
- <svg
- xmlns="http://www.w3.org/2000/svg"
- fill="none"
- viewBox="0 0 24 24"
- strokeWidth={1.5}
- stroke="currentColor"
- className="w-6 h-6 group-hover:stroke-action"
- >
- <path
- strokeLinecap="round"
- strokeLinejoin="round"
- d="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25"
- />
- </svg>
- </Link>
- <Link
- href="/en/"
- className="font-karla font-bold text-[#8BA0B2] group-hover:text-action"
- >
- home
- </Link>
- </button>
- <button className="group flex flex-col items-center">
- <Link href="/en/about">
- <svg
- xmlns="http://www.w3.org/2000/svg"
- fill="none"
- viewBox="0 0 24 24"
- strokeWidth={1.5}
- stroke="currentColor"
- className="w-6 h-6 group-hover:stroke-action"
- >
- <path
- strokeLinecap="round"
- strokeLinejoin="round"
- d="M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z"
- />
- </svg>
- </Link>
- <Link
- href="/en/about"
- className="font-karla font-bold text-[#8BA0B2] group-hover:text-action"
- >
- about
- </Link>
- </button>
- <button className="group flex gap-[1.5px] flex-col items-center ">
- <div>
- <Link href="/en/search/anime">
- <svg
- xmlns="http://www.w3.org/2000/svg"
- fill="none"
- viewBox="0 0 24 24"
- strokeWidth={1.5}
- stroke="currentColor"
- className="w-6 h-6 group-hover:stroke-action"
- >
- <path
- strokeLinecap="round"
- strokeLinejoin="round"
- d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z"
- />
- </svg>
- </Link>
- </div>
- <Link
- href="/en/search/anime"
- className="font-karla font-bold text-[#8BA0B2] group-hover:text-action"
- >
- search
- </Link>
- </button>
- {sessions ? (
- <button
- onClick={() => signOut("AniListProvider")}
- className="group flex gap-[1.5px] flex-col items-center "
- >
- <div>
- <svg
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 96 960 960"
- className="group-hover:fill-action w-6 h-6 fill-txt"
- >
- <path d="M186.666 936q-27 0-46.833-19.833T120 869.334V282.666q0-27 19.833-46.833T186.666 216H474v66.666H186.666v586.668H474V936H186.666zm470.668-176.667l-47-48 102-102H370v-66.666h341.001l-102-102 46.999-48 184 184-182.666 182.666z"></path>
- </svg>
- </div>
- <h1 className="font-karla font-bold text-[#8BA0B2] group-hover:text-action">
- logout
- </h1>
- </button>
- ) : (
- <button
- onClick={() => signIn("AniListProvider")}
- className="group flex gap-[1.5px] flex-col items-center "
- >
- <div>
- <svg
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 96 960 960"
- className="group-hover:fill-action w-6 h-6 fill-txt mr-2"
- >
- <path d="M486 936v-66.666h287.334V282.666H486V216h287.334q27 0 46.833 19.833T840 282.666v586.668q0 27-19.833 46.833T773.334 936H486zm-78.666-176.667l-47-48 102-102H120v-66.666h341l-102-102 47-48 184 184-182.666 182.666z"></path>
- </svg>
- </div>
- <h1 className="font-karla font-bold text-[#8BA0B2] group-hover:text-action">
- login
- </h1>
- </button>
- )}
- </div>
- <button onClick={handleHideClick}>
- <svg
- width="20"
- height="21"
- className="fill-orange-500"
- viewBox="0 0 20 21"
- fill="none"
- xmlns="http://www.w3.org/2000/svg"
- >
- <rect
- x="2.44043"
- y="0.941467"
- width="23.5842"
- height="3.45134"
- rx="1.72567"
- transform="rotate(45 2.44043 0.941467)"
- />
- <rect
- x="19.1172"
- y="3.38196"
- width="23.5842"
- height="3.45134"
- rx="1.72567"
- transform="rotate(135 19.1172 3.38196)"
- />
- </svg>
- </button>
- </div>
- )}
- </div>
+ <MobileNav sessions={sessions} />
<div className="h-auto w-screen bg-[#141519] text-[#dbdcdd] ">
<Navigasi />
@@ -432,6 +242,7 @@ export default function Home({ detail, populars, sessions, upComing }) {
section="On-Going Anime"
data={releaseData}
og={prog}
+ userName={sessions?.user?.name}
/>
</motion.div>
)}
@@ -449,6 +260,7 @@ export default function Home({ detail, populars, sessions, upComing }) {
section="Your Watch List"
data={list}
og={prog}
+ userName={sessions?.user?.name}
/>
</motion.div>
)}
@@ -466,6 +278,7 @@ export default function Home({ detail, populars, sessions, upComing }) {
ids="plannedAnime"
section="Your Plan"
data={planned}
+ userName={sessions?.user?.name}
/>
</motion.div>
)}
generated by cgit v1.2.3 (git 2.25.1) at 2026-04-28 21:43:03 +0000