style: the favorites view is over for now

src/assets/assets.ts

@@ -12,6 +12,8 @@ const images = {
     'https://res.cloudinary.com/xbu/image/upload/v1691664467/xbu_assets/page_not_found_rl8gve.svg',
   NoData:
     'https://res.cloudinary.com/xbu/image/upload/v1708539494/xbu_assets/noData_gs71zg.svg',
+  emptyFavorites:
+    'https://res.cloudinary.com/xbu/image/upload/v1725365540/xbu_assets/undraw_with_love_re_1q3m_yxcely.svg',
 };
 
 export const {
@@ -22,4 +24,5 @@ export const {
   PatternPadWhite,
   PageNotFound,
   NoData,
+  emptyFavorites,
 } = images;

src/components/AllBooks.tsx

@@ -20,6 +20,7 @@ import { Aside } from '@components/aside/Aside';
 import { SkeletonAllBooks } from '@components/skeletons/SkeletonABooks';
 import { ResultLength } from '@components/aside/ResultLength';
 import { MostViewed } from '@components/aside/MostViewed';
+import { MyContainer } from '@components/ui/MyContainer';
 
 export function AllBooks() {
   const { ref, inView } = useInView();
@@ -75,13 +76,7 @@ export function AllBooks() {
   return (
     <>
       <ScrollRestoration />
-      <Flex
-        as='article'
-        direction={{ base: 'column', md: 'row' }}
-        maxW={{ base: '1260px', '2xl': '1560px' }}
-        m='0 auto'
-        px={{ base: 5, md: 10, '2xl': 16 }}
-      >
+      <MyContainer>
         <Aside>
           <ResultLength data={data.pages[0].info.totalBooks} />
           <Box mt='5'>
@@ -134,7 +129,7 @@ export function AllBooks() {
             </React.Fragment>
           ))}
         </MySimpleGrid>
-      </Flex>
+      </MyContainer>
       <Box ref={ref}>{fetchingNextPageUI}</Box>
     </>
   );

src/components/ui/MyContainer.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import { Flex } from '@chakra-ui/react';
+
+export function MyContainer({ children }: { children: React.ReactNode }) {
+  return (
+    <>
+      <Flex
+        as='article'
+        direction={{ base: 'column', md: 'row' }}
+        maxW={{ base: '1260px', '2xl': '1560px' }}
+        m='0 auto'
+        px={{ base: 5, md: 10, '2xl': 16 }}
+      >
+        {children}
+      </Flex>
+    </>
+  );
+}

src/hooks/queries.ts

@@ -144,7 +144,7 @@ function useMoreBooks() {
     refetchOnWindowFocus: false,
     gcTime: 3000,
     staleTime: 50000,
-    retry: 1,
+    retry: false,
   });
 }
 
@@ -155,7 +155,7 @@ function useMostViewedBooks(query) {
     refetchOnWindowFocus: false,
     gcTime: 3000,
     staleTime: 50000,
-    retry: 1,
+    retry: false,
   });
 }
 
@@ -166,7 +166,7 @@ function useRelatedBooks(id: string | undefined) {
     refetchOnWindowFocus: false,
     gcTime: 3000,
     staleTime: 50000,
-    retry: 1,
+    retry: false,
   });
 }
 
@@ -177,7 +177,7 @@ function useMoreBooksAuthors(id: string | undefined) {
     refetchOnWindowFocus: false,
     gcTime: 3000,
     staleTime: 50000,
-    retry: 1,
+    retry: false,
   });
 }
 

src/main.tsx

@@ -18,11 +18,10 @@ Sentry.init({
   dsn: import.meta.env.VITE_SENTRY_DNS,
   integrations: [Sentry.browserTracingIntegration(), Sentry.replayIntegration()],
   tracesSampleRate: 1.0,
-  tracePropagationTargets: [
-    API_URL,
-    /^\/api\//,
-    // /^https:\/\/xb-api\.vercel\.app\/api/,
-  ],
+  // tracePropagationTargets: [
+  //   API_URL,
+  //   /^\/api\//,
+  // ],
   replaysSessionSampleRate: 0.1,
   replaysOnErrorSampleRate: 1.0,
 });

src/pages/Book.tsx

@@ -1,5 +1,5 @@
 import React, { lazy, Suspense, useEffect, useState } from 'react';
-import { useParams, useNavigate, NavLink } from 'react-router-dom';
+import { useParams, useNavigate, NavLink, useLocation } from 'react-router-dom';
 import {
   Box,
   Center,
@@ -49,6 +49,7 @@ const MoreBooks = lazy(() => import('@components/cards/MoreBooks'));
 
 export default function Book() {
   const shareUrl = window.location.href;
+  const location = useLocation();
   const getToken = window.localStorage.getItem('app_tk');
   const { pathUrl } = useParams();
   const { currentUser } = useAuth();
@@ -87,7 +88,6 @@ export default function Book() {
 
   if (Array.isArray(bookObject)) {
     const [obj] = data;
-
     bookObject = obj;
   } else {
     bookObject = data;
@@ -102,7 +102,7 @@ export default function Book() {
 
   useEffect(() => {
     setIsFavorite(bookObject.isFavorite);
-  }, [bookObject.isFavorite]);
+  }, [bookObject.isFavorite, location.pathname]);
 
   if (currentUser && isCurrentUserAuthor) {
     btnMoreOptions = (