Update v4.2.1v4.2.1

13 files changed, 57 insertions, 198 deletions

diff --git a/components/anime/mobile/topSection.js b/components/anime/mobile/topSection.js
index e5f58da..6780da5 100644
--- a/components/anime/mobile/topSection.js
+++ b/components/anime/mobile/topSection.js
@@ -56,7 +56,7 @@ export default function DetailTop({
       {/* MAIN */}
       <div className="flex flex-col md:flex-row w-full items-center md:items-end gap-5 pt-12">
         <div className="shrink-0 w-[180px] h-[250px] rounded overflow-hidden">
-          <Image
+          <img
             src={info?.coverImage?.extraLarge || info?.coverImage}
             alt="poster anime"
             width={300}
diff --git a/components/disqus.js b/components/disqus.js
index 724bec3..b814851 100644
--- a/components/disqus.js
+++ b/components/disqus.js
@@ -4,7 +4,7 @@ const DisqusComments = ({ post }) => {
   const disqusShortname = post.name || "your_disqus_shortname";
   const disqusConfig = {
     url: post.url,
-    identifier: post.id, // Single post id
+    identifier: post.url, // Single post id
     title: `${post.title} - Episode ${post.episode}`, // Single post title
   };
 
diff --git a/components/home/content.js b/components/home/content.js
index 678549c..a380e1f 100644
--- a/components/home/content.js
+++ b/components/home/content.js
@@ -8,8 +8,6 @@ import {
   ArrowRightCircleIcon,
 } from "@heroicons/react/24/outline";
 
-import { parseCookies } from "nookies";
-
 import { ChevronLeftIcon } from "@heroicons/react/20/solid";
 import { ExclamationCircleIcon, PlayIcon } from "@heroicons/react/24/solid";
 import { useRouter } from "next/router";
@@ -30,30 +28,15 @@ export default function Content({
 
   const ref = useRef();
   const { events } = useDraggable(ref);
-  const [cookie, setCookie] = useState(null);
 
   const [clicked, setClicked] = useState(false);
 
-  const [lang, setLang] = useState("en");
-
   useEffect(() => {
     const click = localStorage.getItem("clicked");
 
     if (click) {
       setClicked(JSON.parse(click));
     }
-
-    let lang = null;
-    if (!cookie) {
-      const cookie = parseCookies();
-      lang = cookie.lang || null;
-      setCookie(cookie);
-    }
-    if (lang === "en" || lang === null) {
-      setLang("en");
-    } else if (lang === "id") {
-      setLang("id");
-    }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
@@ -109,22 +92,22 @@ export default function Content({
 
   const goToPage = () => {
     if (section === "Recently Watched") {
-      router.push(`/${lang}/anime/recently-watched`);
+      router.push(`/en/anime/recently-watched`);
     }
     if (section === "New Episodes") {
-      router.push(`/${lang}/anime/recent`);
+      router.push(`/en/anime/recent`);
     }
     if (section === "Trending Now") {
-      router.push(`/${lang}/anime/trending`);
+      router.push(`/en/anime/trending`);
     }
     if (section === "Popular Anime") {
-      router.push(`/${lang}/anime/popular`);
+      router.push(`/en/anime/popular`);
     }
     if (section === "Your Plan") {
-      router.push(`/${lang}/profile/${userName}/#planning`);
+      router.push(`/en/profile/${userName}/#planning`);
     }
     if (section === "On-Going Anime" || section === "Your Watch List") {
-      router.push(`/${lang}/profile/${userName}/#current`);
+      router.push(`/en/profile/${userName}/#current`);
     }
   };
 
diff --git a/components/home/genres.js b/components/home/genres.js
index cd247ce..9c80ca6 100644
--- a/components/home/genres.js
+++ b/components/home/genres.js
@@ -1,8 +1,6 @@
 import Image from "next/image";
 import { ChevronRightIcon } from "@heroicons/react/24/outline";
 import Link from "next/link";
-import { useEffect, useState } from "react";
-import { parseCookies } from "nookies";
 
 const g = [
   {
@@ -32,23 +30,6 @@ const g = [
 ];
 
 export default function Genres() {
-  const [lang, setLang] = useState("en");
-  const [cookie, setCookie] = useState(null);
-
-  useEffect(() => {
-    let lang = null;
-    if (!cookie) {
-      const cookie = parseCookies();
-      lang = cookie.lang || null;
-      setCookie(cookie);
-    }
-    if (lang === "en" || lang === null) {
-      setLang("en");
-    } else if (lang === "id") {
-      setLang("id");
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
   return (
     <div className="antialiased">
       <div className="flex items-center justify-between lg:justify-normal lg:gap-3 px-5">
@@ -61,7 +42,7 @@ export default function Genres() {
           <div className="flex lg:gap-10 gap-4">
             {g.map((a, index) => (
               <Link
-                href={`${lang}/search/anime/?genres=${a.name}`}
+                href={`/en/search/anime/?genres=${a.name}`}
                 key={index}
                 className="relative hover:shadow-lg hover:scale-105 duration-200 cursor-pointer ease-out h-[190px] w-[135px] lg:h-[265px] lg:w-[230px] rounded-md shrink-0"
               >
diff --git a/components/shared/footer.js b/components/shared/footer.js
index 0e19f13..a29a3d3 100644
--- a/components/shared/footer.js
+++ b/components/shared/footer.js
@@ -1,45 +1,18 @@
 import Link from "next/link";
-import { useEffect, useState } from "react";
+import { useState } from "react";
 import { useRouter } from "next/router";
-import { parseCookies, setCookie } from "nookies";
-import Image from "next/image";
 
 function Footer() {
   const [year] = useState(new Date().getFullYear());
   const [season] = useState(getCurrentSeason());
 
-  const [lang, setLang] = useState("en");
   const [checked, setChecked] = useState(false);
-  const [cookie, setCookies] = useState(null);
 
   const router = useRouter();
 
-  useEffect(() => {
-    let lang = null;
-    if (!cookie) {
-      const cookie = parseCookies();
-      lang = cookie.lang || null;
-      setCookies(cookie);
-    }
-    if (lang === "en" || lang === null) {
-      setLang("en");
-      setChecked(false);
-    } else if (lang === "id") {
-      setLang("id");
-      setChecked(true);
-    }
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
   function switchLang() {
     setChecked(!checked);
     if (checked) {
-      console.log("switching to en");
-      setCookie(null, "lang", "en", {
-        maxAge: 365 * 24 * 60 * 60,
-        path: "/",
-      });
       router.push("/en");
     } else {
       router.push("/id");
@@ -51,36 +24,25 @@ function Footer() {
       <div className="text-[#dbdcdd] z-40 bg-[#0c0d10] lg:flex lg:h-[12rem] w-full lg:items-center lg:justify-between">
         <div className="mx-auto flex w-[90%] lg:w-[95%] xl:w-[80%] flex-col space-y-10 py-6 lg:flex-row lg:items-center lg:justify-between lg:space-y-0 lg:py-0">
           <div className="flex flex-col gap-2">
-            {/* <div className="flex items-center gap-2"> */}
-            {/* <Image
-                src="/svg/c.svg"
-                alt="Website Logo"
-                width={100}
-                height={100}
-                className="w-10 h-10"
-              /> */}
             <div className="flex gap-2 font-outfit text-4xl">moopa</div>
             <p className="font-karla lg:text-[0.8rem] text-[0.65rem] text-[#9c9c9c]  lg:w-[520px] italic">
               This site does not store any files on our server, we only linked
               to the media which is hosted on 3rd party services.
             </p>
-            {/* </div> */}
           </div>
           <div className="flex flex-col gap-10 lg:flex-row lg:items-end lg:gap-[9.06rem] text-[#a7a7a7] text-sm lg:text-end">
             <div className="flex flex-col gap-10 font-karla font-bold lg:flex-row lg:gap-[5.94rem]">
               <ul className="flex flex-col gap-y-[0.7rem] ">
                 <li className="cursor-pointer hover:text-action">
-                  <Link
-                    href={`/${lang}/search/anime?season=${season}&year=${year}`}
-                  >
+                  <Link href={`/en/search/anime?season=${season}&year=${year}`}>
                     This Season
                   </Link>
                 </li>
                 <li className="cursor-pointer hover:text-action">
-                  <Link href={`/${lang}/search/anime`}>Popular Anime</Link>
+                  <Link href={`/en/search/anime`}>Popular Anime</Link>
                 </li>
                 <li className="cursor-pointer hover:text-action">
-                  <Link href={`/${lang}/search/manga`}>Popular Manga</Link>
+                  <Link href={`/en/search/manga`}>Popular Manga</Link>
                 </li>
                 <li className="cursor-pointer hover:text-action">
                   <Link href={`/donate`}>Donate</Link>
@@ -88,15 +50,13 @@ function Footer() {
               </ul>
               <ul className="flex flex-col gap-y-[0.7rem]">
                 <li className="cursor-pointer hover:text-action">
-                  <Link href={`/${lang}/search/anime?format=MOVIE`}>
-                    Movies
-                  </Link>
+                  <Link href={`/en/search/anime?format=MOVIE`}>Movies</Link>
                 </li>
                 <li className="cursor-pointer hover:text-action">
-                  <Link href={`/${lang}/search/anime?format=TV`}>TV Shows</Link>
+                  <Link href={`/en/search/anime?format=TV`}>TV Shows</Link>
                 </li>
                 <li className="cursor-pointer hover:text-action">
-                  <Link href={`/${lang}/dmca`}>DMCA</Link>
+                  <Link href={`/en/dmca`}>DMCA</Link>
                 </li>
                 <li className="cursor-pointer hover:text-action">
                   <Link href="https://github.com/DevanAbinaya/Ani-Moopa">
diff --git a/components/watch/primary/details.js b/components/watch/primary/details.js
index 32e1391..4af12ac 100644
--- a/components/watch/primary/details.js
+++ b/components/watch/primary/details.js
@@ -26,7 +26,12 @@ export default function Details({
   }
 
   useEffect(() => {
-    setShowComments(false);
+    const isMobile = window.matchMedia("(max-width: 768px)").matches;
+    if (isMobile) {
+      setShowComments(false);
+    } else {
+      setShowComments(true);
+    }
   }, [id]);
 
   return (
@@ -35,12 +40,11 @@ export default function Details({
       <div className="pb-4 h-full flex">
         <div className="aspect-[9/13] h-[240px]">
           {info ? (
-            <Image
+            <img
               src={info.coverImage.extraLarge}
               alt="Anime Cover"
               width={1000}
               height={1000}
-              priority
               className="object-cover aspect-[9/13] h-[240px] rounded-md"
             />
           ) : (
@@ -169,7 +173,7 @@ export default function Details({
       {showComments && (
         <div>
           {info && (
-            <div className="mt-5 px-5">
+            <div className="mt-5">
               <DisqusComments
                 key={id}
                 post={{
diff --git a/package-lock.json b/package-lock.json
index d90eeb3..43faac2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "moopa",
-  "version": "4.2.0",
+  "version": "4.2.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "moopa",
-      "version": "4.2.0",
+      "version": "4.2.1",
       "dependencies": {
         "@apollo/client": "^3.7.3",
         "@headlessui/react": "^1.7.15",
@@ -27,13 +27,11 @@
         "next-auth": "^4.22.0",
         "next-pwa": "^5.6.0",
         "nextjs-progressbar": "^0.0.16",
-        "nookies": "^2.5.2",
         "rate-limiter-flexible": "^3.0.0",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-icons": "^4.7.1",
         "react-loading-skeleton": "^3.2.0",
-        "react-toastify": "^9.1.3",
         "react-use-draggable-scroll": "^0.4.7",
         "sharp": "^0.32.6",
         "sonner": "^1.0.3",
@@ -3666,14 +3664,6 @@
       "resolved": "https://registry.npmjs.org/closest-match/-/closest-match-1.3.3.tgz",
       "integrity": "sha512-RSdHrZwNOvt2uMQgqJDJdM/I+5MlJ1tQJEXYrbRjSMXWiCRo06g2hwObJ7+WKt2J9ySK9/pJ0Q2vbL+BPkofDA=="
     },
-    "node_modules/clsx": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz",
-      "integrity": "sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==",
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/cluster-key-slot": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/cluster-key-slot/-/cluster-key-slot-1.1.2.tgz",
@@ -6988,23 +6978,6 @@
       "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.13.tgz",
       "integrity": "sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ=="
     },
-    "node_modules/nookies": {
-      "version": "2.5.2",
-      "resolved": "https://registry.npmjs.org/nookies/-/nookies-2.5.2.tgz",
-      "integrity": "sha512-x0TRSaosAEonNKyCrShoUaJ5rrT5KHRNZ5DwPCuizjgrnkpE5DRf3VL7AyyQin4htict92X1EQ7ejDbaHDVdYA==",
-      "dependencies": {
-        "cookie": "^0.4.1",
-        "set-cookie-parser": "^2.4.6"
-      }
-    },
-    "node_modules/nookies/node_modules/cookie": {
-      "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz",
-      "integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
     "node_modules/normalize-path": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
@@ -7861,18 +7834,6 @@
         "react": ">=16.8.0"
       }
     },
-    "node_modules/react-toastify": {
-      "version": "9.1.3",
-      "resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-9.1.3.tgz",
-      "integrity": "sha512-fPfb8ghtn/XMxw3LkxQBk3IyagNpF/LIKjOBflbexr2AWxAH1MJgvnESwEwBn9liLFXgTKWgBSdZpw9m4OTHTg==",
-      "dependencies": {
-        "clsx": "^1.1.1"
-      },
-      "peerDependencies": {
-        "react": ">=16",
-        "react-dom": ">=16"
-      }
-    },
     "node_modules/react-use-draggable-scroll": {
       "version": "0.4.7",
       "resolved": "https://registry.npmjs.org/react-use-draggable-scroll/-/react-use-draggable-scroll-0.4.7.tgz",
@@ -8399,11 +8360,6 @@
         "randombytes": "^2.1.0"
       }
     },
-    "node_modules/set-cookie-parser": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.6.0.tgz",
-      "integrity": "sha512-RVnVQxTXuerk653XfuliOxBP81Sf0+qfQE73LIYKcyMYHG94AuH0kgrQpRDuTZnSmjpysHmzxJXKNfa6PjFhyQ=="
-    },
     "node_modules/set-function-name": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.1.tgz",
diff --git a/package.json b/package.json
index a13c9fe..9d63838 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "moopa",
-  "version": "4.2.0",
+  "version": "4.2.1",
   "private": true,
   "founder": "Factiven",
   "scripts": {
@@ -30,13 +30,11 @@
     "next-auth": "^4.22.0",
     "next-pwa": "^5.6.0",
     "nextjs-progressbar": "^0.0.16",
-    "nookies": "^2.5.2",
     "rate-limiter-flexible": "^3.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-icons": "^4.7.1",
     "react-loading-skeleton": "^3.2.0",
-    "react-toastify": "^9.1.3",
     "react-use-draggable-scroll": "^0.4.7",
     "sharp": "^0.32.6",
     "sonner": "^1.0.3",
diff --git a/pages/api/v2/episode/[id].js b/pages/api/v2/episode/[id].js
index b86a198..029d131 100644
--- a/pages/api/v2/episode/[id].js
+++ b/pages/api/v2/episode/[id].js
@@ -1,6 +1,5 @@
 import axios from "axios";
 import { rateLimitStrict, rateLimiterRedis, redis } from "@/lib/redis";
-import appendImagesToEpisodes from "@/utils/combineImages";
 import appendMetaToEpisodes from "@/utils/appendMetaToEpisodes";
 
 let CONSUMET_URI;
@@ -158,8 +157,13 @@ async function fetchCoverImage(id, available = false) {
 export default async function handler(req, res) {
   const { id, releasing = "false", dub = false, refresh = null } = req.query;
 
-  // if releasing is true then cache for 10 minutes, if it false cache for 1 month;
-  const cacheTime = releasing === "true" ? 60 * 10 : 60 * 60 * 24 * 30;
+  // if releasing is true then cache for 1 hour, if it false cache for 1 month;
+  let cacheTime = null;
+  if (releasing === "true") {
+    cacheTime = 60 * 60; // 1 hour
+  } else if (releasing === "false") {
+    cacheTime = 60 * 60 * 24 * 30; // 1 month
+  }
 
   let cached;
   let meta;
diff --git a/pages/en/anime/watch/[...info].js b/pages/en/anime/watch/[...info].js
index a838b7f..2427669 100644
--- a/pages/en/anime/watch/[...info].js
+++ b/pages/en/anime/watch/[...info].js
@@ -354,9 +354,13 @@ export default function Watch({
           {episodeNavigation?.playing?.title ||
             `${info?.title?.romaji} - Episode ${epiNumber}`}
         </title>
-        {/* Write the best SEO for this watch page with data of anime title from info.title.romaji, episode title from episodeNavigation?.playing?.title, description from episodeNavigation?.playing?.description, episode number from epiNumber */}
+        <meta
+          name="title"
+          data-title-romaji={info?.title?.romaji}
+          data-title-english={info?.title?.english}
+          data-title-native={info?.title?.native}
+        />
         <meta name="twitter:card" content="summary_large_image" />
-        {/* Write the best SEO for this homepage */}
         <meta
           name="description"
           content={episodeNavigation?.playing?.description || info?.description}
@@ -486,13 +490,13 @@ export default function Watch({
                           "Loading..."}
                       </Link>
                     </div>
-                    <p className="font-karla">
+                    <h3 className="font-karla">
                       {episodeNavigation?.playing?.number ? (
                         `Episode ${episodeNavigation?.playing?.number}`
                       ) : (
                         <Skeleton width={120} height={16} />
                       )}
-                    </p>
+                    </h3>
                   </div>
                   <div>
                     <div className="flex gap-2 text-sm">
diff --git a/pages/id/index.js b/pages/id/index.js
index b8898e5..5ef870d 100644
--- a/pages/id/index.js
+++ b/pages/id/index.js
@@ -4,6 +4,7 @@ import Image from "next/image";
 import Link from "next/link";
 import Footer from "@/components/shared/footer";
 import { NewNavbar } from "@/components/shared/NavBar";
+import MobileNav from "@/components/shared/MobileNav";
 
 export default function Home() {
   return (
@@ -16,6 +17,7 @@ export default function Home() {
       </Head>
       <main className="flex flex-col h-screen">
         <NewNavbar />
+        <MobileNav hideProfile />
         {/* Create an under construction page with tailwind css */}
         <div className="h-full w-screen flex-center flex-grow flex-col">
           <Image
@@ -26,7 +28,7 @@ export default function Home() {
             className="w-[26vw] md:w-[15vw]"
           />
           <h1 className="text-2xl sm:text-4xl xl:text-6x font-bold my-4">
-            🚧 Work still on progress 🚧
+            🚧 Page Under Construction 🚧
           </h1>
           <p className="text-base sm:text-lg xl:text-x text-gray-300 mb-6 text-center">
             "Please be patient, as we're still working on this page and it will
diff --git a/pages/index.js b/pages/index.js
index 56b2c1f..25d5b20 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -1,5 +1,4 @@
 import Head from "next/head";
-import { parseCookies } from "nookies";
 
 export default function Home() {
   return (
@@ -23,29 +22,11 @@ export default function Home() {
   );
 }
 
-export async function getServerSideProps(context) {
-  const cookie = parseCookies(context);
-
-  if (cookie.lang === "en") {
-    return {
-      redirect: {
-        destination: "/en",
-        permanent: false,
-      },
-    };
-  } else if (cookie.lang === "id") {
-    return {
-      redirect: {
-        destination: "/id",
-        permanent: false,
-      },
-    };
-  } else {
-    return {
-      redirect: {
-        destination: "/en",
-        permanent: false,
-      },
-    };
-  }
+export async function getServerSideProps() {
+  return {
+    redirect: {
+      destination: "/en",
+      permanent: false,
+    },
+  };
 }
diff --git a/release.md b/release.md
index cfb7bd1..3fa2d2a 100644
--- a/release.md
+++ b/release.md
@@ -2,24 +2,10 @@
 
 This document contains a summary of all significant changes made to this release.
 
-## 🎉 Update v4.2.0
+## 🎉 Update v4.2.1
 
-### Added
+### What's Changed
 
-- Added scene search for anime
-- Added next episode button on watch page
-- Added episode selector on watch page
-- Added dub gogoanime from consumet
-
-### Fixed
-
-- Greatly improved search ui/ux
-- Fixed when using search palette it focused on other button instead of search input
-- Resolved issue: home button on error page doesn't work
-- Resolved issue: website showing error when user pressing `pages` button on reader page
-
-### Changed
-
-- Searching manga now using Anify instead of AniList
-- Info page for Manga now has a similar UI as Anime making it more consistent
-- API Key isn't needed anymore
+- fix: disqus showing the same comment on every episodes
+- fix(premid): discord presence not working properly
+- Increased releasing anime episodes cache time to 1 hour