From f5086c7c394a9910a31ec80df143f5655cfde501 Mon Sep 17 00:00:00 2001 From: Factiven Date: Sat, 29 Apr 2023 10:41:23 +0700 Subject: Bug Fixes > Fixed loop refresh when failed fetching episode data --- pages/anime/[...id].js | 56 +++++++++++++------ pages/profile/[user].js | 140 +++++++++++++++++++++++++----------------------- styles/globals.css | 27 ++++++++++ 3 files changed, 138 insertions(+), 85 deletions(-) diff --git a/pages/anime/[...id].js b/pages/anime/[...id].js index ef54b1b..63849bc 100644 --- a/pages/anime/[...id].js +++ b/pages/anime/[...id].js @@ -140,15 +140,6 @@ const infoQuery = `query ($id: Int) { } }`; -const stats = [ - "Watching", - "Plan to Watch", - "Completed", - "Dropped", - "Paused", - "Rewatching", -]; - export default function Info() { const { data: session, status } = useSession(); const [data, setData] = useState(null); @@ -166,8 +157,8 @@ export default function Info() { const [time, setTime] = useState(0); const { id } = useRouter().query; - const [aniProgress, setAniProgress] = useState(0); const [epiStatus, setEpiStatus] = useState("ok"); + const [error, setError] = useState(null); const rec = info?.recommendations?.nodes.map( (data) => data.mediaRecommendation @@ -185,6 +176,7 @@ export default function Info() { progress: null, stall: false, EpiStatus: "ok", + error: null, }; // Reset all state variables to their default values @@ -227,12 +219,20 @@ export default function Info() { ]); const data = await res.json(); const infos = await info.json(); + + if (res.status === 500) { + setEpisode(null); + setEpiStatus("error"); + setError(data.message); + } else if (res.status === 404) { + window.location.href("/404"); + } setInfo(infos.data.Media); // setLog(data); const textColor = setTxtColor(infos.data.Media.coverImage?.color); - if (!data || data.episodes.length === 0) { + if (!data || data?.episodes?.length === 0) { const res = await fetch( `https://api.consumet.org/meta/anilist/info/${id[0]}?provider=9anime` ); @@ -240,6 +240,7 @@ export default function Info() { if (res.status === 500) { setEpisode(null); setEpiStatus("error"); + setError(datas.message); } else { setEpisode(datas.episodes); } @@ -285,7 +286,6 @@ export default function Info() { if (gut) { setProgress(gut?.progress); - setAniProgress(parseInt(gut?.progress)); if (gut.status === "CURRENT") { setStatuses({ name: "Watching", value: "CURRENT" }); } else if (gut.status === "PLANNING") { @@ -331,8 +331,6 @@ export default function Info() { document.body.style.overflow = "auto"; } - // console.log(progress); - return ( <> @@ -726,9 +724,19 @@ export default function Info() {

No Episodes Available

) ) : ( -

- Something went wrong, can't retrieve any episodes :/ -

+ //

+ // Something went wrong, can't retrieve any episodes :/ + //

+
+

{epiStatus} while retrieving data

+
+                            {error}
+                          
+
)} ) @@ -799,3 +807,17 @@ function setTxtColor(hexColor) { const brightness = getBrightness(hexColor); return brightness < 150 ? "#fff" : "#000"; } + +const getLanguageClassName = (language) => { + switch (language) { + case "javascript": + return "language-javascript"; + case "html": + return "language-html"; + case "bash": + return "language-bash"; + // add more languages here as needed + default: + return ""; + } +}; diff --git a/pages/profile/[user].js b/pages/profile/[user].js index a27d5b9..e28e1cb 100644 --- a/pages/profile/[user].js +++ b/pages/profile/[user].js @@ -185,75 +185,79 @@ export default function MyList({ media, sessions, user, time }) {
{media.length !== 0 ? ( - filterMedia(listFilter).map((item, index) => ( -
-

{item.name}

- - - - - - - - - - {item.entries.map((item, index) => ( - - - - + filterMedia(listFilter).map((item, index) => { + return ( +
+

{item.name}

+
- Title - ScoreProgress
-
- {item.media.status === "RELEASING" ? ( - - ) : item.media.status === "NOT_YET_RELEASED" ? ( - - ) : ( - - )} - Cover Image -
- {item.media.id} -
- - {item.media.title.romaji} - -
-
- {item.score === 0 ? null : item.score} - - {item.progress === item.media.episodes - ? item.progress - : item.media.episodes === null - ? item.progress - : `${item.progress}/${item.media.episodes}`} -
+ + + + + - ))} - -
+ Title + ScoreProgress
-
- )) + + + {item.entries.map((item) => { + return ( + + +
+ {item.media.status === "RELEASING" ? ( + + ) : item.media.status === "NOT_YET_RELEASED" ? ( + + ) : ( + + )} + Cover Image +
+ {item.media.id} +
+ + {item.media.title.romaji} + +
+ + + {item.score === 0 ? null : item.score} + + + {item.progress === item.media.episodes + ? item.progress + : item.media.episodes === null + ? item.progress + : `${item.progress}/${item.media.episodes}`} + + + ); + })} + + +
+ ); + }) ) : (
{user.name === sessions?.user.name ? ( diff --git a/styles/globals.css b/styles/globals.css index ff7a1bb..810d8b0 100644 --- a/styles/globals.css +++ b/styles/globals.css @@ -203,3 +203,30 @@ button { transform: translate(24px, 0); } } + +/* Add this CSS to your global styles or a component-specific CSS file */ +pre { + color: #f8f8f2; + font-family: "Fira Code", monospace; + font-size: 14px; + line-height: 1.5; + padding: 1rem; + margin: 1rem 0; + @apply bg-[#191c24]; +} + +pre code { + display: block; +} + +.language-javascript { + color: #f8f8f2; +} + +.language-html { + color: #e6db74; +} + +.language-bash { + color: #89b482; +} -- cgit v1.2.3