diff --git a/src/assets/assets.ts b/src/assets/assets.ts
index ce2441c..8b1c3ad 100644
--- a/src/assets/assets.ts
+++ b/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;
diff --git a/src/assets/emptyFavorites.svg b/src/assets/emptyFavorites.svg
new file mode 100644
index 0000000..4502996
--- /dev/null
+++ b/src/assets/emptyFavorites.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/components/AllBooks.tsx b/src/components/AllBooks.tsx
index 5c31c37..befd7be 100644
--- a/src/components/AllBooks.tsx
+++ b/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 (
<>
-
+
+
{fetchingNextPageUI}
);
diff --git a/src/components/ui/MyContainer.tsx b/src/components/ui/MyContainer.tsx
new file mode 100644
index 0000000..476f4eb
--- /dev/null
+++ b/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 (
+ <>
+
+ {children}
+
+
+ );
+}
diff --git a/src/hooks/queries.ts b/src/hooks/queries.ts
index 17774b9..8c2bdbe 100644
--- a/src/hooks/queries.ts
+++ b/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,
});
}
diff --git a/src/main.tsx b/src/main.tsx
index cdfd8f6..ad48d14 100644
--- a/src/main.tsx
+++ b/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,
});
diff --git a/src/pages/Book.tsx b/src/pages/Book.tsx
index 2965e08..4f34243 100644
--- a/src/pages/Book.tsx
+++ b/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 = (
diff --git a/src/pages/Favorites.tsx b/src/pages/Favorites.tsx
index a5cf071..789f9c8 100644
--- a/src/pages/Favorites.tsx
+++ b/src/pages/Favorites.tsx
@@ -1,5 +1,8 @@
-import React from 'react';
-import { Flex } from '@chakra-ui/react';
+import React, { useEffect } from 'react';
+import { NavLink } from 'react-router-dom';
+import { Box, Flex, Icon, Image, Link, Spinner } from '@chakra-ui/react';
+import { useInView } from 'react-intersection-observer';
+import { MdOutlineExplore } from 'react-icons/md';
import { useAllFavoriteByUser } from '@hooks/queries';
import { useAuth } from '@contexts/AuthContext';
@@ -11,63 +14,132 @@ import { ContainerTitle } from '@components/layout/ContainerTitle';
import { Aside } from '@components/aside/Aside';
import { ResultLength } from '@components/aside/ResultLength';
import { MySliderCategories } from '@components/ui/MySliderCategories';
+import { MyContainer } from '@components/ui/MyContainer';
+import { SkeletonAllBooks } from '@components/skeletons/SkeletonABooks';
+import { emptyFavorites } from '@assets/assets';
export default function Favorites() {
+ const { ref, inView } = useInView();
const { currentUser } = useAuth();
const uid = currentUser?.uid;
- const { data, fetchNextPage, isFetchingNextPage } = useAllFavoriteByUser(uid);
+ const { data, isPending, fetchNextPage, isFetchingNextPage } =
+ useAllFavoriteByUser(uid);
+ let fetchingNextPageUI;
+ let asideAndCardsUI;
- return (
- <>
-
-
-
-
+ useEffect(() => {
+ if (inView) fetchNextPage();
+ }, [inView]);
+
+ if (isPending) {
+ return ;
+ }
+
+ if (data?.pages[0].info.totalBooks > 0) {
+ asideAndCardsUI = (
+ <>
{data?.pages.map((page, index) => (
- {page.results.map(
- ({
- id,
- category,
- language,
- title,
- authors,
- synopsis,
- sourceLink,
- pathUrl,
- image,
- }: CardType) => (
-
-
-
- ),
- )}
+ {page.results
+ // .slice()
+ // .reverse()
+ .map(
+ ({
+ id,
+ category,
+ language,
+ title,
+ authors,
+ synopsis,
+ sourceLink,
+ pathUrl,
+ image,
+ }: CardType) => (
+
+
+
+ ),
+ )}
))}
+
+ );
+ } else {
+ asideAndCardsUI = (
+
+
+
+ Todavía no has añadido libros a tus favoritos.
+
+
+
+
+ ¡Explora!
+
+
+ );
+ }
+
+ if (isFetchingNextPage) {
+ fetchingNextPageUI = (
+
+
+
+ );
+ }
+
+ return (
+ <>
+
+
+
+ {asideAndCardsUI}
+ {fetchingNextPageUI}
);
}
diff --git a/src/pages/Search.tsx b/src/pages/Search.tsx
index d9f0cc6..4dfe529 100644
--- a/src/pages/Search.tsx
+++ b/src/pages/Search.tsx
@@ -33,6 +33,7 @@ import { AboutCategories } from '@components/aside/AboutCategories';
import { Lost } from '@assets/assets';
import { aboutCategories } from '../constant/constants';
import { SkeletonAllBooks } from '@components/skeletons/SkeletonABooks';
+import { MyContainer } from '@components/ui/MyContainer';
export default function Search() {
const { ref, inView } = useInView();
@@ -268,12 +269,7 @@ export default function Search() {
) : (
<>
-
+
)}
-
+
)}
{!isFiltering && {fetchingNextPageUI}}
diff --git a/src/pages/profile/Profile.tsx b/src/pages/profile/Profile.tsx
index 2483c46..cd2fb56 100644
--- a/src/pages/profile/Profile.tsx
+++ b/src/pages/profile/Profile.tsx
@@ -26,6 +26,7 @@ import { ResultLength } from '@components/aside/ResultLength';
import { useAuth } from '@contexts/AuthContext';
import { NoData } from '@assets/assets';
import { SkeletonAllBooks } from '@components/skeletons/SkeletonABooks';
+import { MyContainer } from '@components/ui/MyContainer';
// import { logOut } from '../../services/firebase/auth';
export function Profile() {
@@ -216,15 +217,7 @@ export function Profile() {
PUBLICACIONES
-
- {asideAndCardsUI}
-
+ {asideAndCardsUI}
{fetchingNextPageUI}
);