remove clarity and added search page

Dovakiin0 · Feb 27, 2024 · 3cc16e9 · 3cc16e9
1 parent 3c5a1c5
commit 3cc16e9
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 48 deletions.
diff --git a/public/sw.js.map b/public/sw.js.map
diff --git a/src/app/anime/[slug]/watch/partial/EpisodeFrame.tsx b/src/app/anime/[slug]/watch/partial/EpisodeFrame.tsx
@@ -14,14 +14,14 @@ type Props = {
 function EpisodeFrame({ episode, animeInfo }: Props) {
   const onNext = () => {
     if (animeInfo.episodes.at(-1)?.number === episode.number) return;
-    window.location.href = `/anime/${animeInfo.id}/watch?ep=${animeInfo
-      .episodes[episode.number - 1 + 1]?.id}`;
+    window.location.href = `/anime/${animeInfo.id}/watch?ep=${animeInfo.episodes[episode.number - 1 + 1]?.id
+      }`;
   };
 
   const onPrev = () => {
     if (episode.number === 1) return;
-    window.location.href = `/anime/${animeInfo.id}/watch?ep=${animeInfo
-      .episodes[episode.number - 1 - 1]?.id}`;
+    window.location.href = `/anime/${animeInfo.id}/watch?ep=${animeInfo.episodes[episode.number - 1 - 1]?.id
+      }`;
   };
 
   return (

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -55,15 +55,6 @@ export default function RootLayout({
   gtag('js', new Date());
 
   gtag('config', 'G-X9RZ58XPH1');`}
-      </Script>
-      <Script id="clarity-script" defer type="text/javascript">
-        {`
-    (function(c,l,a,r,i,t,y){
-        c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
-        t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
-        y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
-    })(window, document, "clarity", "script", "l3pnvnd7wb");
-    `}
       </Script>
       <body>
         <Header />

diff --git a/src/app/search/page.tsx b/src/app/search/page.tsx
@@ -1,39 +1,41 @@
+"use client";
 import React from "react";
-import { redirect } from "next/navigation";
+import { redirect, useSearchParams } from "next/navigation";
 import useAnime from "@/hooks/useAnime";
 import AnimeCard from "@/components/AnimeCard";
 import { ISearchAnime } from "@/@types/AnimeType";
+import Loading from "../loading";
 
-async function page({ searchParams }: any) {
+async function page() {
+  const query = useSearchParams();
   const { getSearch } = useAnime();
 
-  if (!searchParams.q) {
+  if (!query.get("q")) {
     redirect("/");
   }
 
-  // const animeInfo: {
-  //   data: ISearchAnime[];
-  // } = await getSearch(searchParams.q);
-  //
-  return (
+  const animeInfo: ISearchAnime[] = await getSearch(query.get("q")!);
+
+  return animeInfo ? (
     <div className="m-2 lg:m-10 flex flex-col items-center">
-      {/* <p className="text-2xl lg:text-3xl mt-20"> */}
-      {/*   Search Result for{" "} */}
-      {/*   <span className="font-extrabold">{searchParams.q}</span> */}
-      {/* </p> */}
-      {/* <div className="mt-10 flex flex-wrap justify-between lg:justify-start xl:gap-8 lg:gap-6 gap-3"> */}
-      {/*   {animeInfo.data.map((anime: ISearchAnime, index: number) => ( */}
-      {/*     <AnimeCard */}
-      {/*       id={anime.id} */}
-      {/*       key={index} */}
-      {/*       title={anime.title} */}
-      {/*       src={anime.image} */}
-      {/*       additional={`${anime.subOrDub}`} */}
-      {/*     /> */}
-      {/*   ))} */}
-      {/* </div> */}
-      Under Maintenance
+      <p className="text-2xl lg:text-3xl mt-20">
+        Search Result for{" "}
+        <span className="font-extrabold">{query.get("q")}</span>
+      </p>
+      <div className="container mx-auto gap-10 w-full mt-10 flex flex-wrap justify-between lg:justify-start">
+        {animeInfo.map((anime: ISearchAnime, index: number) => (
+          <AnimeCard
+            id={anime.id}
+            key={index}
+            title={anime.title}
+            src={anime.image}
+            additional={`${anime.subOrDub}`}
+          />
+        ))}
+      </div>
     </div>
+  ) : (
+    <Loading />
   );
 }
 

diff --git a/src/hooks/useAnime.ts b/src/hooks/useAnime.ts
@@ -38,9 +38,7 @@ export default function useAnime() {
         return KV;
       }
     }
-    const data = await fetch(
-      location.protocol + "//" + location.host + "/api/anime/zoro" + id,
-    );
+    const data = await fetch(location.origin + "/api/anime/zoro" + id);
     let json = await data.json();
 
     if (KV) {
@@ -57,9 +55,7 @@ export default function useAnime() {
         return KV;
       }
     }
-    const data = await fetch(
-      location.protocol + "//" + location.host + "/api/anime/gogo/watch/" + id,
-    );
+    const data = await fetch(location.origin + "/api/anime/gogo/watch/" + id);
     let json = await data.json();
 
     if (KV) {
@@ -69,9 +65,7 @@ export default function useAnime() {
   }
 
   async function getSearch(query: string) {
-    const data = await fetch(
-      location.protocol + "//" + location.host + "/api/anime/search/" + query,
-    );
+    const data = await fetch(location.origin + "/api/anime/search/" + query);
     return data.json();
   }
 

diff --git a/src/partials/SearchAnime.tsx b/src/partials/SearchAnime.tsx
@@ -75,7 +75,7 @@ function Search() {
                 ))}
                 <Link
                   className="btn btn-outline w-full"
-                  href={`/search?q=${encodeURIComponent(search)}`}
+                  href={`/search?q=${search}`}
                   onClick={handleSearchCallback}
                 >
                   See More