feat: add content prop to watchlist and readlist button components

hikka-io · Aug 20, 2024 · 05c7a90 · 05c7a90
1 parent 3addbad
commit 05c7a90
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 8 deletions.
diff --git a/src/components/readlist-button/readlist-button.tsx b/src/components/readlist-button/readlist-button.tsx
@@ -30,6 +30,7 @@ interface Props {
     disabled?: boolean;
     content_type: 'novel' | 'manga';
     read?: API.Read;
+    content?: API.Manga | API.Novel;
     size?: 'sm' | 'md';
 }
 
@@ -63,6 +64,7 @@ const Component = ({
     content_type,
     disabled,
     read: readProp,
+    content: contentProp,
     size,
 }: Props) => {
     const { openModal } = useModalContext();
@@ -79,24 +81,23 @@ const Component = ({
         {
             slug,
         },
-        { enabled: !disabled && content_type === 'manga' },
+        { enabled: !disabled && content_type === 'manga' && !contentProp },
     );
 
     const { data: novel } = useNovelInfo(
         {
             slug,
         },
-        { enabled: !disabled && content_type === 'novel' },
+        { enabled: !disabled && content_type === 'novel' && !contentProp },
     );
 
     const { mutate: addRead } = useAddRead();
 
     const read = readProp || (readQuery && !readError ? readQuery : undefined);
+    const content = contentProp || manga || novel;
 
     const openReadEditModal = () => {
-        if (manga || novel) {
-            const content = manga || novel;
-
+        if (content) {
             openModal({
                 content: (
                     <ReadEditModal

diff --git a/src/components/watchlist-button/watchlist-button.tsx b/src/components/watchlist-button/watchlist-button.tsx
@@ -28,6 +28,7 @@ interface Props {
     additional?: boolean;
     disabled?: boolean;
     watch?: API.Watch;
+    anime?: API.Anime;
     size?: 'sm' | 'md';
 }
 
@@ -56,7 +57,13 @@ const OPTIONS = [
     })),
 ];
 
-const Component = ({ slug, disabled, watch: watchProp, size }: Props) => {
+const Component = ({
+    slug,
+    disabled,
+    watch: watchProp,
+    anime: animeProp,
+    size,
+}: Props) => {
     const { openModal } = useModalContext();
 
     const { data: watchQuery, isError: watchError } = useWatch(
@@ -65,17 +72,19 @@ const Component = ({ slug, disabled, watch: watchProp, size }: Props) => {
         },
         { enabled: !disabled && !watchProp },
     );
-    const { data: anime } = useAnimeInfo(
+    const { data: animeQuery } = useAnimeInfo(
         {
             slug,
         },
-        { enabled: !disabled },
+        { enabled: !disabled && !animeProp },
     );
     const { mutate: addWatch } = useAddWatch();
 
     const watch =
         watchProp || (watchQuery && !watchError ? watchQuery : undefined);
 
+    const anime = animeProp || (animeQuery ? animeQuery : undefined);
+
     const openWatchEditModal = () => {
         if (anime) {
             openModal({

diff --git a/src/features/franchise/franchise-item.tsx b/src/features/franchise/franchise-item.tsx
@@ -51,6 +51,7 @@ const FranchiseItem: FC<Props> = ({ content }) => {
             {content.data_type === 'anime' && (
                 <WatchlistButton
                     slug={content.slug}
+                    anime={content}
                     watch={content.watch && content.watch[0]}
                     size="md"
                 />
@@ -59,6 +60,7 @@ const FranchiseItem: FC<Props> = ({ content }) => {
                 <ReadlistButton
                     content_type={content.data_type}
                     slug={content.slug}
+                    content={content}
                     read={content.read && content.read[0]}
                     size="md"
                 />