From b6878a038665f20aa29e04f16c50e190c84ad749 Mon Sep 17 00:00:00 2001 From: Kentai Radiquum Date: Tue, 13 Aug 2024 14:20:28 +0500 Subject: [PATCH] feat: add logged in user favorite and owned collection fetching --- app/api/config.ts | 11 ++ app/components/Chip/Chip.tsx | 17 ++- .../CollectionCourusel/CollectionCourusel.tsx | 14 +-- .../CollectionLink/CollectionLink.tsx | 87 +++------------ app/pages/Collections.tsx | 104 ++++++------------ app/store/auth.ts | 2 +- 6 files changed, 84 insertions(+), 151 deletions(-) diff --git a/app/api/config.ts b/app/api/config.ts index d75742e..1640239 100644 --- a/app/api/config.ts +++ b/app/api/config.ts @@ -21,4 +21,15 @@ export const ENDPOINTS = { addHistory: `${API_PREFIX}/history/add`, markWatched: `${API_PREFIX}/episode/watch`, }, + collection: { + base: `${API_PREFIX}/collection`, + list: `${API_PREFIX}/collection/list`, + create: `${API_PREFIX}/collectionMy/create`, + delete: `${API_PREFIX}/collectionMy/delete`, + edit: `${API_PREFIX}/collectionMy/edit`, + editImage: `${API_PREFIX}/collectionMy/editImage`, + releaseInCollections: `${API_PREFIX}/collection/all/release`, + userCollections: `${API_PREFIX}/collection/all/profile`, + favoriteCollections: `${API_PREFIX}/collectionFavorite`, + } }; diff --git a/app/components/Chip/Chip.tsx b/app/components/Chip/Chip.tsx index c3c9e5e..197aa49 100644 --- a/app/components/Chip/Chip.tsx +++ b/app/components/Chip/Chip.tsx @@ -1,12 +1,25 @@ export const Chip = (props: { + icon_name?: string; + icon_color?: string; name?: string; name_2?: string; devider?: string; bg_color?: string; }) => { return ( -
-

+

+ {props.icon_name && ( + + )} +

{props.name} {props.name && props.devider ? props.devider : " "} {props.name_2} diff --git a/app/components/CollectionCourusel/CollectionCourusel.tsx b/app/components/CollectionCourusel/CollectionCourusel.tsx index 8f1651d..c3b920e 100644 --- a/app/components/CollectionCourusel/CollectionCourusel.tsx +++ b/app/components/CollectionCourusel/CollectionCourusel.tsx @@ -57,6 +57,13 @@ export const CollectionCourusel = (props: {

+ {props.isMyCollections && ( +
+
+ +
+
+ )} {props.content.map((collection) => { return (
); })} - {props.isMyCollections && ( -
-
- -
-
- )}
{ - const grade = props.grade.toFixed(1); - const profile_list_status = props.profile_list_status; - let user_list = null; - if (profile_list_status != null || profile_list_status != 0) { - user_list = profile_lists[profile_list_status]; - } return ( - +
-
+ }} + >
- - {user_list && ( - - )} - {props.status ? ( - - ) : ( - props.status_id != 0 && ( - - ) - )} - - {props.last_view_episode && ( - - )} - {props.category && } {props.is_favorite && (
)} + {props.is_private && ( +
+ +
+ )} + +

- {props.title_ru} + {props.title}

diff --git a/app/pages/Collections.tsx b/app/pages/Collections.tsx index 0e85376..07ba00b 100644 --- a/app/pages/Collections.tsx +++ b/app/pages/Collections.tsx @@ -5,96 +5,64 @@ import { Spinner } from "#/components/Spinner/Spinner"; const fetcher = (...args: any) => fetch([...args] as any).then((res) => res.json()); import { useUserStore } from "#/store/auth"; -import { BookmarksList } from "#/api/utils"; import { ENDPOINTS } from "#/api/config"; import { useRouter } from "next/navigation"; import { useEffect } from "react"; export function CollectionsPage() { - const token = useUserStore((state) => state.token); - const authState = useUserStore((state) => state.state); + const userStore = useUserStore(); const router = useRouter(); - // function useFetchReleases(listName: string) { - // let url: string; + function useFetchReleases(section: string) { + let url: string; - // if (token) { - // url = `${ENDPOINTS.user.bookmark}/all/${BookmarksList[listName]}/0?token=${token}`; - // } + if (userStore.token && userStore.user) { + if (section == "userCollections") { + url = `${ENDPOINTS.collection.userCollections}/${userStore.user.id}/0?token=${userStore.token}`; + } else if (section == "userFavoriteCollections") { + url = `${ENDPOINTS.collection.favoriteCollections}/all/0?token=${userStore.token}`; + } + } - // const { data } = useSWR(url, fetcher); - // return [data]; - // } + const { data } = useSWR(url, fetcher); + return [data]; + } - // const [watchingData] = useFetchReleases("watching"); - // const [plannedData] = useFetchReleases("planned"); - // const [watchedData] = useFetchReleases("watched"); - // const [delayedData] = useFetchReleases("delayed"); - // const [abandonedData] = useFetchReleases("abandoned"); + const [userCollections] = useFetchReleases("userCollections"); + const [favoriteCollections] = useFetchReleases("userFavoriteCollections"); useEffect(() => { - if (authState === "finished" && !token) { + if (userStore.state === "finished" && !userStore.token) { router.push("/login?redirect=/collections"); } - }, [authState, token]); + }, [userStore.state, userStore.token]); return (
- - {/* {authState === "loading" && - (!watchingData || - !plannedData || - !watchedData || - !delayedData || - !abandonedData) && ( + {userStore.state === "loading" && + (!userCollections || !favoriteCollections) && (
- )} */} - {/* {watchingData && - watchingData.content && - watchingData.content.length > 0 && ( - + )} + {favoriteCollections && + favoriteCollections.content && + favoriteCollections.content.length > 0 && ( + )} - {plannedData && plannedData.content && plannedData.content.length > 0 && ( - - )} - {watchedData && watchedData.content && watchedData.content.length > 0 && ( - - )} - {delayedData && delayedData.content && delayedData.content.length > 0 && ( - - )} - {abandonedData && - abandonedData.content && - abandonedData.content.length > 0 && ( - - )} */}
); } diff --git a/app/store/auth.ts b/app/store/auth.ts index 2c3ab47..9af7b5b 100644 --- a/app/store/auth.ts +++ b/app/store/auth.ts @@ -5,7 +5,7 @@ import { getJWT, removeJWT, fetchDataViaGet } from "#/api/utils"; interface userState { _hasHydrated: boolean; isAuth: boolean; - user: Object | null; + user: any | null; token: string | null; state: string; login: (user: Object, token: string) => void;