From cbd0e877299c8e0f1431df75711142bb6696eee9 Mon Sep 17 00:00:00 2001
From: Tim <tymmesyde@gmail.com>
Date: Thu, 12 Jun 2025 15:22:22 +0200
Subject: [PATCH] refactor: rating logic

---
 src/components/MetaPreview/MetaPreview.js     |  8 +++---
 .../MetaPreview/Ratings/Ratings.tsx           |  8 +++---
 .../MetaPreview/Ratings/useRating.ts          | 25 +++++++++++--------
 src/routes/MetaDetails/MetaDetails.js         |  2 +-
 src/types/models/MetaDetails.d.ts             |  3 +--
 src/types/types.d.ts                          |  8 +++---
 6 files changed, 30 insertions(+), 24 deletions(-)

diff --git a/src/components/MetaPreview/MetaPreview.js b/src/components/MetaPreview/MetaPreview.js
index 3b422dff7..13717919a 100644
--- a/src/components/MetaPreview/MetaPreview.js
+++ b/src/components/MetaPreview/MetaPreview.js
@@ -25,7 +25,7 @@ const ALLOWED_LINK_REDIRECTS = [
     routesRegexp.metadetails.regexp
 ];
 
-const MetaPreview = React.forwardRef(({ className, compact, name, logo, background, runtime, releaseInfo, released, description, deepLinks, links, trailerStreams, inLibrary, toggleInLibrary, rating }, ref) => {
+const MetaPreview = React.forwardRef(({ className, compact, name, logo, background, runtime, releaseInfo, released, description, deepLinks, links, trailerStreams, inLibrary, toggleInLibrary, ratingInfo }, ref) => {
     const { t } = useTranslation();
     const [shareModalOpen, openShareModal, closeShareModal] = useBinaryState(false);
     const linksGroups = React.useMemo(() => {
@@ -234,9 +234,9 @@ const MetaPreview = React.forwardRef(({ className, compact, name, logo, backgrou
                         null
                 }
                 {
-                    !compact && rating !== null ?
+                    !compact && ratingInfo !== null ?
                         <Ratings
-                            rating={rating}
+                            ratingInfo={ratingInfo}
                             className={styles['ratings']}
                         />
                         :
@@ -298,7 +298,7 @@ MetaPreview.propTypes = {
     trailerStreams: PropTypes.array,
     inLibrary: PropTypes.bool,
     toggleInLibrary: PropTypes.func,
-    rating: PropTypes.object,
+    ratingInfo: PropTypes.object,
 };
 
 module.exports = MetaPreview;
diff --git a/src/components/MetaPreview/Ratings/Ratings.tsx b/src/components/MetaPreview/Ratings/Ratings.tsx
index 9012735af..6bef0cc6d 100644
--- a/src/components/MetaPreview/Ratings/Ratings.tsx
+++ b/src/components/MetaPreview/Ratings/Ratings.tsx
@@ -8,13 +8,13 @@ import classNames from 'classnames';
 
 type Props = {
     metaId?: string;
-    rating?: Rating;
+    ratingInfo?: Loadable<RatingInfo>;
     className?: string;
 };
 
-const Ratings = ({ rating, className }: Props) => {
-    const { onLiked, onLoved, liked, loved } = useRating(rating);
-    const disabled = useMemo(() => rating?.type !== 'Ready', [rating]);
+const Ratings = ({ ratingInfo, className }: Props) => {
+    const { onLiked, onLoved, liked, loved } = useRating(ratingInfo);
+    const disabled = useMemo(() => ratingInfo?.type !== 'Ready', [ratingInfo]);
 
     return (
         <div className={classNames(styles['ratings-container'], className)}>
diff --git a/src/components/MetaPreview/Ratings/useRating.ts b/src/components/MetaPreview/Ratings/useRating.ts
index 7df8bc925..fdf53f551 100644
--- a/src/components/MetaPreview/Ratings/useRating.ts
+++ b/src/components/MetaPreview/Ratings/useRating.ts
@@ -3,10 +3,10 @@
 import { useMemo, useCallback } from 'react';
 import { useServices } from 'stremio/services';
 
-const useRating = (rating?: Rating) => {
+const useRating = (ratingInfo?: Loadable<RatingInfo>) => {
     const { core } = useServices();
 
-    const setRating = useCallback((status: 'liked' | 'loved' | null) => {
+    const setRating = useCallback((status: RatingStatus) => {
         core.transport.dispatch({
             action: 'MetaDetails',
             args: {
@@ -16,21 +16,26 @@ const useRating = (rating?: Rating) => {
         });
     }, []);
 
+    const status = useMemo(() => {
+        const content = ratingInfo?.type === 'Ready' ? ratingInfo.content as RatingInfo : null;
+        return content?.status;
+    }, [ratingInfo]);
+
     const liked = useMemo(() => {
-        return rating?.content === 'liked';
-    }, [rating]);
+        return status === 'liked';
+    }, [status]);
 
     const loved = useMemo(() => {
-        return rating?.content === 'loved';
-    }, [rating]);
+        return status === 'loved';
+    }, [status]);
 
     const onLiked = useCallback(() => {
-        setRating(rating?.content === 'liked' ? null : 'liked');
-    }, [rating]);
+        setRating(status === 'liked' ? null : 'liked');
+    }, [status]);
 
     const onLoved = useCallback(() => {
-        setRating(rating?.content === 'loved' ? null : 'loved');
-    }, [rating]);
+        setRating(status === 'loved' ? null : 'loved');
+    }, [status]);
 
     return {
         onLiked,
diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index 1b84eacdb..0150734cf 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -167,7 +167,7 @@ const MetaDetails = ({ urlParams, queryParams }) => {
                                             inLibrary={metaDetails.metaItem.content.content.inLibrary}
                                             toggleInLibrary={metaDetails.metaItem.content.content.inLibrary ? removeFromLibrary : addToLibrary}
                                             metaId={metaDetails.metaItem.content.content.id}
-                                            rating={metaDetails.rating}
+                                            ratingInfo={metaDetails.ratingInfo}
                                         />
                                     </React.Fragment>
                 }
diff --git a/src/types/models/MetaDetails.d.ts b/src/types/models/MetaDetails.d.ts
index df615da3e..570ca5e88 100644
--- a/src/types/models/MetaDetails.d.ts
+++ b/src/types/models/MetaDetails.d.ts
@@ -24,6 +24,5 @@ type MetaDetails = {
         content: Loadable<Stream[]>
     }[],
     title: string | null,
-    like: Loadable<string | null> | null,
-    sentLike: Loadable<string | null> | null
+    ratingInfo: Loadable<RatingInfo> | null,
 };
diff --git a/src/types/types.d.ts b/src/types/types.d.ts
index ba921e306..5a881f9e0 100644
--- a/src/types/types.d.ts
+++ b/src/types/types.d.ts
@@ -69,7 +69,9 @@ type AudioTrack = {
     origin: string,
 };
 
-type Rating = {
-    content: 'liked' | 'loved' | null,
-    type: 'Ready' | 'Loading' | 'Error',
+type RatingStatus = 'liked' | 'loved' | null;
+
+type RatingInfo = {
+    metaId: string,
+    status: RatingStatus,
 };