feat: Implement a way to review/rate anime (#108)

* Make details cover lead back to anime page

* Make 'markProgress' use object instead of param list

* Import Link

* Implement Rate modal

* Pass session into useAniList

Co-authored-by: Factiven <[email protected]>

* Reimplement using markComplete & add toast for failure

* redefined ratemodal

* fix: home page client error

* update version

---------

Co-authored-by: Factiven <[email protected]>

1 files changed, 14 insertions, 7 deletions

diff --git a/components/watch/primary/details.tsx b/components/watch/primary/details.tsx
index f20f8cf..dd739f2 100644
--- a/components/watch/primary/details.tsx
+++ b/components/watch/primary/details.tsx
@@ -4,6 +4,8 @@ import Skeleton from "react-loading-skeleton";
 import DisqusComments from "../../disqus";
 import { AniListInfoTypes } from "types/info/AnilistInfoTypes";
 import { SessionTypes } from "pages/en";
+import Link from "next/link";
+import Image from "next/image";
 
 type DetailsProps = {
   info: AniListInfoTypes;
@@ -61,13 +63,18 @@ export default function Details({
       <div className="pb-4 h-full flex">
         <div className="aspect-[9/13] h-[240px]">
           {info ? (
-            <img
-              src={info.coverImage.extraLarge}
-              alt="Anime Cover"
-              width={1000}
-              height={1000}
-              className="object-cover aspect-[9/13] h-[240px] rounded-md"
-            />
+            <Link
+              className="hover:scale-105 hover:shadow-lg duration-300 ease-out"
+              href={`/en/anime/${id}`}
+            >
+              <Image
+                src={info.coverImage.extraLarge}
+                alt="Anime Cover"
+                width={1000}
+                height={1000}
+                className="object-cover aspect-[9/13] h-[240px] rounded-md"
+              />
+            </Link>
           ) : (
             <Skeleton height={240} />
           )}