From 742d807b59855ca6f9ace0da90192f8e3eed4f2c Mon Sep 17 00:00:00 2001 From: Factiven Date: Thu, 20 Jul 2023 17:54:58 +0700 Subject: Update v3.6.7 > Fixed Schedule --- components/home/schedule.js | 167 ++--- pages/en/anime/[...id].js | 1247 ++++++++++++++++++------------------- pages/en/anime/watch/[...info].js | 711 +++++++++++---------- pages/en/search/[param].js | 24 +- pages/id/anime/[...id].js | 804 ++++++++++++------------ pages/id/anime/watch/[...info].js | 469 +++++++------- pages/id/search/[param].js | 24 +- 7 files changed, 1695 insertions(+), 1751 deletions(-) diff --git a/components/home/schedule.js b/components/home/schedule.js index f5aa44f..4a85143 100644 --- a/components/home/schedule.js +++ b/components/home/schedule.js @@ -12,50 +12,30 @@ export default function Schedule({ data, scheduleData, time }) { "Schedule"; currentDay = currentDay.replace("Schedule", ""); - const [activeSection, setActiveSection] = useState(currentDay); - - const scrollRef = useRef(null); + const [currentPage, setCurrentPage] = useState(0); + const [days, setDay] = useState(); useEffect(() => { if (scheduleData) { - const index = Object?.keys(scheduleData).indexOf( - activeSection + "Schedule" - ); - if (scrollRef.current) { - scrollRef.current.scrollLeft = scrollRef.current.clientWidth * index; - } + const days = Object.keys(scheduleData); + setDay(days); } - }, [activeSection, scheduleData]); + }, [scheduleData]); - const handleScroll = (e) => { - const { scrollLeft, clientWidth } = e.target; - const index = Math.floor(scrollLeft / clientWidth); - let day = Object?.keys(scheduleData)[index]; - day = day.replace("Schedule", ""); - setActiveSection(day); + const handleNextPage = () => { + setCurrentPage((prevPage) => (prevPage + 1) % days.length); }; - // buttons to scroll horizontally - const scrollLeft = () => { - if (scrollRef.current.scrollLeft === 0) { - scrollRef.current.scrollLeft = scrollRef.current.scrollWidth; - } else { - scrollRef.current.scrollLeft -= scrollRef.current.offsetWidth; - } + const handlePreviousPage = () => { + setCurrentPage((prevPage) => (prevPage - 1 + days.length) % days.length); }; - const scrollRight = () => { - const difference = - scrollRef.current.scrollWidth - - scrollRef.current.offsetWidth - - scrollRef.current.scrollLeft; - if (difference < 5) { - // adjust the threshold as needed - scrollRef.current.scrollLeft = 0; - } else { - scrollRef.current.scrollLeft += scrollRef.current.offsetWidth; - } - }; + useEffect(() => { + const todayIndex = days?.findIndex((day) => + day.toLowerCase().includes(currentDay) + ); + setCurrentPage(todayIndex >= 0 ? todayIndex : 0); + }, [currentDay, days]); return (
@@ -126,84 +106,75 @@ export default function Schedule({ data, scheduleData, time }) {
- {scheduleData && ( + + {scheduleData && days && (
- {Object.entries(scheduleData).map(([section, data], index) => { - const uniqueArray = data.reduce((accumulator, current) => { - if (!accumulator.find((item) => item.id === current.id)) { - accumulator.push(current); - } - return accumulator; - }, []); - - return ( -
-
- {uniqueArray.map((i, index) => { - const currentTime = Date.now(); - const hasAired = i.airingAt < currentTime; +
+ {scheduleData[days[currentPage]] + .filter((show, index, self) => { + return index === self.findIndex((s) => s.id === show.id); + }) + .map((i, index) => { + const currentTime = Date.now(); + const hasAired = i.airingAt < currentTime; - return ( - -
- coverSchedule -
-
-
-

- {i.title.romaji} -

-

- {convertUnixToTime(i.airingAt)} - Episode{" "} - {i.airingEpisode} -

-
-
- -
-
- - ); - })} -
-
- ); - })} + return ( + +
+ {i.coverImage && ( + {`${i.title.romaji} + )} +
+
+
+

+ {i.title.romaji} +

+

+ {convertUnixToTime(i.airingAt)} - Episode{" "} + {i.airingEpisode} +

+
+
+ +
+
+ + ); + })} +
-
{activeSection}
+
+ {days[currentPage]?.replace("Schedule", "")} +
diff --git a/pages/en/anime/[...id].js b/pages/en/anime/[...id].js index 298058a..86396e3 100644 --- a/pages/en/anime/[...id].js +++ b/pages/en/anime/[...id].js @@ -1,5 +1,4 @@ -import Skeleton, { SkeletonTheme } from "react-loading-skeleton"; -import "react-loading-skeleton/dist/skeleton.css"; +import Skeleton from "react-loading-skeleton"; import { ChevronDownIcon, @@ -352,123 +351,60 @@ export default function Info({ info, color, api }) { )}
- - -
-
-
- {info ? ( - banner anime - ) : ( -
- )} -
-
- {/* Mobile */} + +
+
+
+ {info ? ( + banner anime + ) : ( +
+ )} +
+
+ {/* Mobile */} -
-
-

- {info?.title?.romaji || info?.title?.english} -

-

-

- {info?.genres - ?.slice( - 0, - info?.genres?.length > 3 ? info?.genres?.length : 3 - ) - .map((item, index) => ( - - {item} - - ))} -
- {info && ( -
-
- -
- -
-
-
- )} -
-
-
- {info && info.status !== "NOT_YET_RELEASED" ? ( - <> -
- -

{info?.type}

-
-
- -

{info?.averageScore}%

-
-
- - {info?.episodes ? ( -

{info?.episodes} Episodes

- ) : ( -

TBA

- )} -
- - ) : ( -
{info && "Not Yet Released"}
- )} -
+
+
+

+ {info?.title?.romaji || info?.title?.english} +

+

+

+ {info?.genres + ?.slice( + 0, + info?.genres?.length > 3 ? info?.genres?.length : 3 + ) + .map((item, index) => ( + + {item} + + ))}
-
- - {/* PC */} -
-
- {info ? ( - <> -
- poster anime + {info && ( +
+
+
+ +
+
+
+ )} +
+
+
+ {info && info.status !== "NOT_YET_RELEASED" ? ( + <> +
+ +

{info?.type}

+
+
+ +

{info?.averageScore}%

+
+
+ + {info?.episodes ? ( +

{info?.episodes} Episodes

+ ) : ( +

TBA

+ )} +
) : ( - +
{info && "Not Yet Released"}
)}
+
+
- {/* PC */} -
-
-

- {info ? ( - info?.title?.romaji || info?.title?.english - ) : ( - - )} -

+ {/* PC */} +
+
+ {info ? ( + <> +
+ poster anime + + + ) : ( + + )} +
+ + {/* PC */} +
+
+

{info ? ( -
- {info?.episodes && ( -
- {info?.episodes} Episodes -
- )} - {info?.startDate?.year && ( -
- {info?.startDate?.year} -
- )} - {info?.averageScore && ( -
- {info?.averageScore}% -
- )} - {info?.type && ( -
- {info?.type} -
- )} - {info?.status && ( -
- {info?.status} -
- )} + info?.title?.romaji || info?.title?.english + ) : ( + + )} +

+ {info ? ( +
+ {info?.episodes && ( +
+ {info?.episodes} Episodes +
+ )} + {info?.startDate?.year && ( +
+ {info?.startDate?.year} +
+ )} + {info?.averageScore && (
- Sub | EN + {info?.averageScore}%
+ )} + {info?.type && ( +
+ {info?.type} +
+ )} + {info?.status && ( +
+ {info?.status} +
+ )} +
+ Sub | EN
- ) : ( - - )} -
- {info ? ( -

+

) : ( - + )}
+ {info ? ( +

+ ) : ( + + )}

+
-
-
- {info?.relations?.edges?.length > 0 && ( -
- Relations -
- )} - {info?.relations?.edges?.length > 3 && ( -
setShowAll(!showAll)} - > - {showAll ? "show less" : "show more"} -
- )} -
-
- {info?.relations?.edges ? ( - info?.relations?.edges - .slice(0, showAll ? info?.relations?.edges.length : 3) - .map((r, index) => { - const rel = r.node; - return ( - +
+ {info?.relations?.edges?.length > 0 && ( +
+ Relations +
+ )} + {info?.relations?.edges?.length > 3 && ( +
setShowAll(!showAll)} + > + {showAll ? "show less" : "show more"} +
+ )} +
+
+ {info?.relations?.edges ? ( + info?.relations?.edges + .slice(0, showAll ? info?.relations?.edges.length : 3) + .map((r, index) => { + const rel = r.node; + return ( + +
-
-
- {rel.id} +
+ {rel.id} +
+
+
+ {r.relationType}
-
-
- {r.relationType} -
-
- {rel.title.userPreferred || rel.title.romaji} -
-
{rel.type}
+
+ {rel.title.userPreferred || rel.title.romaji}
+
{rel.type}
- - ); - }) - ) : ( - <> - {[1, 2, 3].map((item) => ( -
- -
- ))} -
+
+ + ); + }) + ) : ( + <> + {[1, 2, 3].map((item) => ( +
- - )} -
+ ))} +
+ +
+ + )}
-
-
-
-
- {info && ( -

- Episodes -

- )} - {info?.nextAiringEpisode && ( -
-
-

Next :

-
- {time} -
-
-
- +
+
+
+
+
+ {info && ( +

+ Episodes +

+ )} + {info?.nextAiringEpisode && ( +
+
+

Next :

+
+ {time}
- )} -
+
+ +
+
+ )} +
+
setVisible(!visible)} + > + + + +
+
+
+
+ {filterProviders?.length > 0 && ( +
+

Provider

+ + +
+ )} + {episode?.length > 50 && ( +
+

Episodes

+ + +
+ )} +
+
setVisible(!visible)} + className={ + episode?.length > 0 + ? episode?.some((item) => item?.title === null) + ? "pointer-events-none" + : "cursor-pointer" + : "pointer-events-none" + } + onClick={() => { + setEpiView("1"); + localStorage.setItem("epiView", "1"); + }} > - - -
-
-
-
- {filterProviders?.length > 0 && ( -
-

Provider

- - -
- )} - {episode?.length > 50 && ( -
-

Episodes

- - -
- )} -
-
-
0 - ? episode?.some((item) => item?.title === null) - ? "pointer-events-none" - : "cursor-pointer" - : "pointer-events-none" - } - onClick={() => { - setEpiView("1"); - localStorage.setItem("epiView", "1"); - }} - > - - 0 - ? episode?.some((item) => item?.title === null) - ? "fill-[#1c1c22]" - : epiView === "1" - ? "fill-action" - : "fill-[#3A3A44]" - : "fill-[#1c1c22]" - }`} - rx="3" - > - -
-
0 - ? episode?.some((item) => item?.title === null) - ? "pointer-events-none" - : "cursor-pointer" - : "pointer-events-none" - } - onClick={() => { - setEpiView("2"); - localStorage.setItem("epiView", "2"); - }} - > - 0 ? episode?.some((item) => item?.title === null) ? "fill-[#1c1c22]" - : epiView === "2" + : epiView === "1" ? "fill-action" : "fill-[#3A3A44]" : "fill-[#1c1c22]" }`} - viewBox="0 0 33 20" - > - - - -
-
+ +
+
0 + ? episode?.some((item) => item?.title === null) + ? "pointer-events-none" + : "cursor-pointer" + : "pointer-events-none" + } + onClick={() => { + setEpiView("2"); + localStorage.setItem("epiView", "2"); + }} + > + 0 - ? `cursor-pointer` - : "pointer-events-none" - } - onClick={() => { - setEpiView("3"); - localStorage.setItem("epiView", "3"); - }} + ? episode?.some((item) => item?.title === null) + ? "fill-[#1c1c22]" + : epiView === "2" + ? "fill-action" + : "fill-[#3A3A44]" + : "fill-[#1c1c22]" + }`} + viewBox="0 0 33 20" > - 0 - ? epiView === "3" - ? "fill-action" - : "fill-[#3A3A44]" - : "fill-[#1c1c22]" - }`} - viewBox="0 0 33 20" - > - - - - -
+ + +
-
-
- {!loading ? ( - Array.isArray(episode) ? ( - episode && ( -
0 + ? `cursor-pointer` + : "pointer-events-none" + } + onClick={() => { + setEpiView("3"); + localStorage.setItem("epiView", "3"); + }} + > + 0 + ? epiView === "3" + ? "fill-action" + : "fill-[#3A3A44]" + : "fill-[#1c1c22]" }`} + viewBox="0 0 33 20" > - {episode?.length !== 0 && episode ? ( -
- {epiView === "1" - ? episode - .slice(firstEpisodeIndex, lastEpisodeIndex) - ?.map((epi, index) => { - const time = artStorage?.[epi?.id]?.time; - const duration = - artStorage?.[epi?.id]?.duration; - let prog = (time / duration) * 100; - if (prog > 90) prog = 100; - return ( - - - Episode {epi?.number} - - -
- epi image - - ); - }) - : ""} - {epiView === "2" && - episode + + + + +
+
+
+
+ {!loading ? ( + Array.isArray(episode) ? ( + episode && ( +
+ {episode?.length !== 0 && episode ? ( +
+ {epiView === "1" + ? episode .slice(firstEpisodeIndex, lastEpisodeIndex) - .map((epi, index) => { + ?.map((epi, index) => { const time = artStorage?.[epi?.id]?.time; const duration = artStorage?.[epi?.id]?.duration; @@ -930,140 +877,182 @@ export default function Info({ info, color, api }) { -
-
- Anime Cover - - - Episode {epi?.number} - -
- - - -
+ + Episode {epi?.number} + + +
+ epi image + + ); + }) + : ""} + {epiView === "2" && + episode + .slice(firstEpisodeIndex, lastEpisodeIndex) + .map((epi, index) => { + const time = artStorage?.[epi?.id]?.time; + const duration = + artStorage?.[epi?.id]?.duration; + let prog = (time / duration) * 100; + if (prog > 90) prog = 100; + return ( + +
+
+ Anime Cover + + + Episode {epi?.number} + +
+ + +
+
-
-

- {epi?.title} -

- {epi?.description && ( -

- {epi?.description} -

- )} -
- - ); - })} - {epiView === "3" && - episode - .slice(firstEpisodeIndex, lastEpisodeIndex) - .map((epi, index) => { - return (
- -

Episode {epi.number}

- {epi.title && ( -

- "{epi.title}" -

- )} - - {index !== episode?.length - 1 && ( - +

+ {epi?.title} +

+ {epi?.description && ( +

+ {epi?.description} +

)}
- ); - })} -
- ) : ( -

No Episodes Available

- )} -
- ) - ) : ( -
-
-                        {episode?.message}
-                      
+ + ); + })} + {epiView === "3" && + episode + .slice(firstEpisodeIndex, lastEpisodeIndex) + .map((epi, index) => { + return ( +
+ +

Episode {epi.number}

+ {epi.title && ( +

+ "{epi.title}" +

+ )} + + {index !== episode?.length - 1 && ( + + )} +
+ ); + })} +
+ ) : ( +

No Episodes Available

+ )}
) ) : ( -
-
-
-
-
-
-
+
+
+                      {episode?.message}
+                    
- )} -
+ ) + ) : ( +
+
+
+
+
+
+
+
+ )}
- {info && rec?.length !== 0 && ( -
- -
- )}
- - + {info && rec?.length !== 0 && ( +
+ +
+ )} +
+ ); } diff --git a/pages/en/anime/watch/[...info].js b/pages/en/anime/watch/[...info].js index d6e40e1..17ec5f7 100644 --- a/pages/en/anime/watch/[...info].js +++ b/pages/en/anime/watch/[...info].js @@ -7,7 +7,7 @@ import dynamic from "next/dynamic"; import { getServerSession } from "next-auth/next"; import { authOptions } from "../../../api/auth/[...nextauth]"; -import Skeleton, { SkeletonTheme } from "react-loading-skeleton"; +import Skeleton from "react-loading-skeleton"; import { ChevronDownIcon, ForwardIcon } from "@heroicons/react/24/solid"; import { useRouter } from "next/router"; @@ -222,389 +222,384 @@ export default function Info({ sessions, id, aniId, provider, proxy, api }) { {playingTitle || "Loading..."} - -
- -
-
- {loading ? ( - Array.isArray(epiData?.sources) ? ( -
- -
- ) : ( -
-

- Whoops! Something went wrong. Please reload the page or - try other sources. {`:(`} -

-
- ) +
+ +
+
+ {loading ? ( + Array.isArray(epiData?.sources) ? ( +
+ +
) : ( -
- )} -
- {data && data?.episodes.length > 0 ? ( - data.episodes - .filter((items) => items.id == id) - .map((item, index) => ( -
-
-
- - {item.title || - data.title.romaji || - data.title.english} - -
-

- Episode {item.number} -

-
-
-
- - -
- + {item.title || + data.title.romaji || + data.title.english} +
+

+ Episode {item.number} +

- )) - ) : ( -
-
-
- -
-
-

- -

-
- )} -
- -
-
- {data ? ( - Anime Cover - ) : ( - - )} -
-
-
-

- Studios -

-
- {data ? data.studios : } -
-
-
- +
+ +
+
-
-

- Status -

-
{data ? data.status : }
-
-
-

- Titles -

-
- {data ? ( - <> -
- {data.title.romaji || ""} -
-
- {data.title.english || ""} -
-
- {data.title.native || ""} -
- - ) : ( - - )} -
+ )) + ) : ( +
+
+
+
+

+ +

-
- {data && - data.genres.map((item, index) => ( -
- {item} -
- ))} -
-
- {data && ( -

+ +

+
+ {data ? ( + Anime Cover + ) : ( + )}
- {!showComments && loading && ( -
- -
- )} - {showComments && ( -
- {data && url && playing && ( -
- +
+
+

+ Studios +

+
+ {data ? data.studios : } +
+
+
+ + +
- )} +
+
+
+

+ Status +

+
{data ? data.status : }
+
+

+ Titles +

+
+ {data ? ( + <> +
+ {data.title.romaji || ""} +
+
+ {data.title.english || ""} +
+
+ {data.title.native || ""} +
+ + ) : ( + + )} +
+
+
+
+
+ {data && + data.genres.map((item, index) => ( +
+ {item} +
+ ))} +
+
+ {data && ( +

)}

+ {!showComments && loading && ( +
+ +
+ )} + {showComments && ( +
+ {data && url && playing && ( +
+ +
+ )} +
+ )}
-
-

- Up Next -

-
- {data && data?.episodes.length > 0 ? ( - data.episodes.some( - (item) => item.title && item.description - ) ? ( - episodes.map((item) => { - const time = artStorage?.[item.id]?.time; - const duration = artStorage?.[item.id]?.duration; - let prog = (time / duration) * 100; - if (prog > 90) prog = 100; - return ( - -
-
- Anime Cover - - - Episode {item.number} - - {item.id == id && ( -
- - - -
- )} -
-
-
-

- {item.title} -

-

- {item.description} -

+
+
+

+ Up Next +

+
+ {data && data?.episodes.length > 0 ? ( + data.episodes.some((item) => item.title && item.description) ? ( + episodes.map((item) => { + const time = artStorage?.[item.id]?.time; + const duration = artStorage?.[item.id]?.duration; + let prog = (time / duration) * 100; + if (prog > 90) prog = 100; + return ( + +
+
+ Anime Cover + + + Episode {item.number} + + {item.id == id && ( +
+ + + +
+ )}
- - ); - }) - ) : ( - data.episodes.map((item) => { - return ( - +
- Episode {item.number} - - ); - }) - ) +

+ {item.title} +

+

+ {item.description} +

+
+ + ); + }) ) : ( - <> - {[1].map((item) => ( - - ))} - - )} -
+ data.episodes.map((item) => { + return ( + + Episode {item.number} + + ); + }) + ) + ) : ( + <> + {[1].map((item) => ( + + ))} + + )}
- +
); } diff --git a/pages/en/search/[param].js b/pages/en/search/[param].js index 190002d..cacc2b8 100644 --- a/pages/en/search/[param].js +++ b/pages/en/search/[param].js @@ -1,6 +1,6 @@ import { useEffect, useRef, useState } from "react"; import { AnimatePresence, motion as m } from "framer-motion"; -import Skeleton, { SkeletonTheme } from "react-loading-skeleton"; +import Skeleton from "react-loading-skeleton"; import { useRouter } from "next/router"; import Link from "next/link"; import Navbar from "../../../components/navbar"; @@ -462,18 +462,16 @@ export default function Card() { {loading && ( <> - - {[1, 2, 4, 5, 6, 7, 8].map((item) => ( -
- - -
- ))} -
+ {[1, 2, 4, 5, 6, 7, 8].map((item) => ( +
+ + +
+ ))} )}
diff --git a/pages/id/anime/[...id].js b/pages/id/anime/[...id].js index 8a52e4b..e5a26f8 100644 --- a/pages/id/anime/[...id].js +++ b/pages/id/anime/[...id].js @@ -1,4 +1,4 @@ -import Skeleton, { SkeletonTheme } from "react-loading-skeleton"; +import Skeleton from "react-loading-skeleton"; import { ChevronDownIcon, @@ -291,123 +291,60 @@ export default function Info({ info, color, api }) { )}
- - -
-
-
- {info ? ( - banner anime - ) : ( -
- )} -
-
- {/* Mobile */} + +
+
+
+ {info ? ( + banner anime + ) : ( +
+ )} +
+
+ {/* Mobile */} -
-
-

- {info?.title?.romaji || info?.title?.english} -

-

-

- {info?.genres - ?.slice( - 0, - info?.genres?.length > 3 ? info?.genres?.length : 3 - ) - .map((item, index) => ( - - {item} - - ))} -
- {info && ( -
-
- -
- -
-
-
- )} -
-
-
- {info && info.status !== "NOT_YET_RELEASED" ? ( - <> -
- -

{info?.type}

-
-
- -

{info?.averageScore}%

-
-
- - {info?.episodes ? ( -

{info?.episodes} Episodes

- ) : ( -

TBA

- )} -
- - ) : ( -
{info && "Not Yet Released"}
- )} -
+
+
+

+ {info?.title?.romaji || info?.title?.english} +

+

+

+ {info?.genres + ?.slice( + 0, + info?.genres?.length > 3 ? info?.genres?.length : 3 + ) + .map((item, index) => ( + + {item} + + ))}
-
- - {/* PC */} -
-
- {info ? ( - <> -
- poster anime + {info && ( +
+
+
+ +
+
+
+ )} +
+
+
+ {info && info.status !== "NOT_YET_RELEASED" ? ( + <> +
+ +

{info?.type}

+
+
+ +

{info?.averageScore}%

+
+
+ + {info?.episodes ? ( +

{info?.episodes} Episodes

+ ) : ( +

TBA

+ )} +
) : ( - +
{info && "Not Yet Released"}
)}
+
+
- {/* PC */} -
-
-

- {info ? ( - info?.title?.romaji || info?.title?.english - ) : ( - - )} -

+ {/* PC */} +
+
+ {info ? ( + <> +
+ poster anime + + + ) : ( + + )} +
+ + {/* PC */} +
+
+

{info ? ( -
- {info?.episodes && ( -
- {info?.episodes} Episodes -
- )} - {info?.startDate?.year && ( -
- {info?.startDate?.year} -
- )} - {info?.averageScore && ( -
- {info?.averageScore}% -
- )} - {info?.type && ( -
- {info?.type} -
- )} - {info?.status && ( -
- {info?.status} -
- )} + info?.title?.romaji || info?.title?.english + ) : ( + + )} +

+ {info ? ( +
+ {info?.episodes && (
- Sub | EN + {info?.episodes} Episodes
+ )} + {info?.startDate?.year && ( +
+ {info?.startDate?.year} +
+ )} + {info?.averageScore && ( +
+ {info?.averageScore}% +
+ )} + {info?.type && ( +
+ {info?.type} +
+ )} + {info?.status && ( +
+ {info?.status} +
+ )} +
+ Sub | EN
- ) : ( - - )} -
- {info ? ( -

+

) : ( - + )}
+ {info ? ( +

+ ) : ( + + )}

+
-
-
- {info?.relations?.edges?.length > 0 && ( -
- Relations -
- )} - {info?.relations?.edges?.length > 3 && ( -
setShowAll(!showAll)} - > - {showAll ? "show less" : "show more"} -
- )} -
-
- {info?.relations?.edges ? ( - info?.relations?.edges - .slice(0, showAll ? info?.relations?.edges.length : 3) - .map((r, index) => { - const rel = r.node; - return ( - +
+ {info?.relations?.edges?.length > 0 && ( +
+ Relations +
+ )} + {info?.relations?.edges?.length > 3 && ( +
setShowAll(!showAll)} + > + {showAll ? "show less" : "show more"} +
+ )} +
+
+ {info?.relations?.edges ? ( + info?.relations?.edges + .slice(0, showAll ? info?.relations?.edges.length : 3) + .map((r, index) => { + const rel = r.node; + return ( + +
-
-
- {rel.id} +
+ {rel.id} +
+
+
+ {r.relationType}
-
-
- {r.relationType} -
-
- {rel.title.userPreferred || rel.title.romaji} -
-
{rel.type}
+
+ {rel.title.userPreferred || rel.title.romaji}
+
{rel.type}
- - ); - }) - ) : ( - <> - {[1, 2, 3].map((item) => ( -
- -
- ))} -
+
+ + ); + }) + ) : ( + <> + {[1, 2, 3].map((item) => ( +
- - )} -
+ ))} +
+ +
+ + )}
-
-
-
-
- {info && ( -

- Episodes -

- )} - {info?.nextAiringEpisode && ( -
-
-

Next :

-
- {time} -
-
-
- +
+
+
+
+
+ {info && ( +

+ Episodes +

+ )} + {info?.nextAiringEpisode && ( +
+
+

Next :

+
+ {time}
- )} -
- {episode?.length > 50 && ( -
setVisible(!visible)} - > - - - +
+ +
)}
{episode?.length > 50 && (
setVisible(!visible)} > -
- {episode?.length > 50 && ( -
-

Episodes

- - -
- )} -
+ + +
)}
- {!loading ? ( - Array.isArray(episode) ? ( - episode && ( -
- {episode?.length !== 0 && episode ? ( -
50 && ( +
+
+ {episode?.length > 50 && ( +
+

Episodes

+ + +
+ )}
)}
+ {!loading ? ( + Array.isArray(episode) ? ( + episode && ( +
+ {episode?.length !== 0 && episode ? ( +
+ {episode + .slice(firstEpisodeIndex, lastEpisodeIndex) + .map((epi, index) => { + return ( +
+ +

{epi.epsTitle}

+ + {index !== episode?.length - 1 && ( + + )} +
+ ); + })} +
+ ) : ( +

No Episodes Available

+ )} +
+ ) + ) : ( +
+
+                      
+                        {episode?.message || "Anime tidak tersedia :/"}
+                      
+                    
+
+ ) + ) : ( +
+
+
+
+
+
+
+
+ )}
- {info && rec?.length !== 0 && ( -
- -
- )}
- - + {info && rec?.length !== 0 && ( +
+ +
+ )} +
+ ); } diff --git a/pages/id/anime/watch/[...info].js b/pages/id/anime/watch/[...info].js index 89fd3a6..06269ab 100644 --- a/pages/id/anime/watch/[...info].js +++ b/pages/id/anime/watch/[...info].js @@ -7,7 +7,7 @@ import dynamic from "next/dynamic"; import { getServerSession } from "next-auth/next"; import { authOptions } from "../../../api/auth/[...nextauth]"; -import Skeleton, { SkeletonTheme } from "react-loading-skeleton"; +import Skeleton from "react-loading-skeleton"; import { Navigasi } from "../.."; import { ChevronDownIcon, ForwardIcon } from "@heroicons/react/24/solid"; @@ -198,261 +198,258 @@ export default function Info({ sessions, id, aniId, provider, api, proxy }) { {playingTitle || "Loading..."} - -
- -
-
- {loading ? ( - Array.isArray(epiData) ? ( -
- -
- ) : ( -
-

- Whoops! Something went wrong. Please reload the page or - try other sources. {`:(`} -

-
- ) +
+ +
+
+ {loading ? ( + Array.isArray(epiData) ? ( +
+ +
) : ( -
- )} -
- {data && data?.episodes.length > 0 ? ( - data.episodes - .filter((items) => items.number == currentNumber) - .map((item, index) => ( -
-
-
- - {item.title || - data.title.romaji || - data.title.english} - -
-

- Episode {item.number} -

-
-
-
- - -
- + {item.title || + data.title.romaji || + data.title.english} +
+

+ Episode {item.number} +

- )) - ) : ( -
-
-
- -
-
-

- -

-
- )} -
- -
-
- {data ? ( - Anime Cover - ) : ( - - )} -
-
-
-

- Studios -

-
- {data ? data.studios : } -
-
-
- +
+ +
+
-
-

- Status -

-
{data ? data.status : }
-
-
-

- Titles -

-
- {data ? ( - <> -
- {data.title.romaji || ""} -
-
- {data.title.english || ""} -
-
- {data.title.native || ""} -
- - ) : ( - - )} -
+ )) + ) : ( +
+
+
+
+

+ +

-
- {data && - data.genres.map((item, index) => ( -
- {item} -
- ))} -
-
- {data && ( -

+ +

+
+ {data ? ( + Anime Cover + ) : ( + )}
+
+
+

+ Studios +

+
+ {data ? data.studios : } +
+
+
+ + + +
+
+
+
+

+ Status +

+
{data ? data.status : }
+
+
+

+ Titles +

+
+ {data ? ( + <> +
+ {data.title.romaji || ""} +
+
+ {data.title.english || ""} +
+
+ {data.title.native || ""} +
+ + ) : ( + + )} +
+
+
-
-
-

- Up Next -

-
- {data && data?.episodes.length > 0 ? ( - episode.map((item, index) => { - return ( - - Episode {index + 1} - - ); - }) - ) : ( - <> - {[1].map((item) => ( - - ))} - +
+ {data && + data.genres.map((item, index) => ( +
+ {item} +
+ ))} +
+
+ {data && ( +

)}

+
+

+ Up Next +

+
+ {data && data?.episodes.length > 0 ? ( + episode.map((item, index) => { + return ( + + Episode {index + 1} + + ); + }) + ) : ( + <> + {[1].map((item) => ( + + ))} + + )} +
+
- +
); } diff --git a/pages/id/search/[param].js b/pages/id/search/[param].js index 00fab64..43f419c 100644 --- a/pages/id/search/[param].js +++ b/pages/id/search/[param].js @@ -1,6 +1,6 @@ import { useEffect, useRef, useState } from "react"; import { AnimatePresence, motion as m } from "framer-motion"; -import Skeleton, { SkeletonTheme } from "react-loading-skeleton"; +import Skeleton from "react-loading-skeleton"; import { useRouter } from "next/router"; import Link from "next/link"; import Navbar from "../../../components/navbar"; @@ -460,18 +460,16 @@ export default function Card() { {loading && ( <> - - {[1, 2, 4, 5, 6, 7, 8].map((item) => ( -
- - -
- ))} -
+ {[1, 2, 4, 5, 6, 7, 8].map((item) => ( +
+ + +
+ ))} )}
-- cgit v1.2.3