diff --git a/src/app/(root)/(routes)/(auth)/login/components/RouteCallback.tsx b/src/app/(root)/(routes)/(auth)/login/components/RouteCallback.tsx index de6469f0..276b2b4a 100644 --- a/src/app/(root)/(routes)/(auth)/login/components/RouteCallback.tsx +++ b/src/app/(root)/(routes)/(auth)/login/components/RouteCallback.tsx @@ -26,11 +26,12 @@ const RouteCallback = ({ tokenResponse }: RouteCallbackProps) => { useEffect(() => { if (tokenResponse?.data) { + let inHour = new Date(new Date().getTime() + 60 * 60 * 1000) Cookies.set( Environment.tokenName(), tokenResponse?.data?.token?.accessToken, { - expires: 60 * 60 * 24 * 7, + expires: inHour, }, ) window.location.href = AppPath.home() diff --git a/src/app/(root)/(routes)/(home)/components/CategorySection.tsx b/src/app/(root)/(routes)/(home)/components/CategorySection.tsx index 064732c8..94adc34c 100644 --- a/src/app/(root)/(routes)/(home)/components/CategorySection.tsx +++ b/src/app/(root)/(routes)/(home)/components/CategorySection.tsx @@ -1,35 +1,25 @@ -'use client' - import Image from 'next/image' -import { useRouter } from 'next/navigation' -import Button from '@/components/ui/button' +import Link from 'next/link' import AppPath from '@/config/appPath' import { CATEGORY_BUTTON_LIST } from '@/constants/card' import { TYPOGRAPHY } from '@/styles/sizes' const CategorySection = () => { - const router = useRouter() - - const handleClick = (name: string) => { - if (name === 'ALL_CARD') { - router.push(`${AppPath.cards()}`) - } else { - router.push(`${AppPath.cards()}?category=${name}`) - } - } return (
{CATEGORY_BUTTON_LIST.map((v) => ( - + ))}
) diff --git a/src/components/domain/header/sections/RightSide.tsx b/src/components/domain/header/sections/RightSide.tsx index a2d2b663..f1e859b9 100644 --- a/src/components/domain/header/sections/RightSide.tsx +++ b/src/components/domain/header/sections/RightSide.tsx @@ -1,11 +1,11 @@ +'use client' + import React from 'react' import Link from 'next/link' import Button from '@/components/ui/button' -import ApiEndPoint from '@/config/apiEndPoint' import AppPath from '@/config/appPath' -import apiClient from '@/services/apiClient' +import useNotificationCountQuery from '@/hooks/api/queries/useNotificationCountQuery' import { User } from '@/types/user' -import { getServerCookie } from '@/utils/getServerCookie' import { AvatarWithDropdown, NotificationButton } from '../components' type RightSideProps = { @@ -13,30 +13,30 @@ type RightSideProps = { currentUser: User | null } -const getUserNotificationCount = async () => { - try { - const token = getServerCookie() - const res = await apiClient.get( - ApiEndPoint.getNotificationCount(), - { - next: { revalidate: 60 }, - }, - { - Authorization: `${token}`, - }, - ) - return res.data.unReadCount - } catch (e) { - return 0 - } -} +// const getUserNotificationCount = async () => { +// try { +// const token = getServerCookie() +// const res = await apiClient.get( +// ApiEndPoint.getNotificationCount(), +// { +// cache: 'no-store', +// }, +// { +// Authorization: `${token}`, +// }, +// ) +// return res.data.unReadCount +// } catch (e) { +// return 0 +// } +// } -const RightSide = async ({ isLoggedIn, currentUser }: RightSideProps) => { - const count = await getUserNotificationCount() +const RightSide = ({ isLoggedIn, currentUser }: RightSideProps) => { + const { data } = useNotificationCountQuery({ isLoggedIn }) return isLoggedIn ? ( <> - + ) : ( diff --git a/src/hooks/api/queries/useNotificationCountQuery.ts b/src/hooks/api/queries/useNotificationCountQuery.ts index 6de8c65c..deb9c09b 100644 --- a/src/hooks/api/queries/useNotificationCountQuery.ts +++ b/src/hooks/api/queries/useNotificationCountQuery.ts @@ -1,13 +1,15 @@ import { useQuery } from '@tanstack/react-query' import { getNotificationCount } from '@/services/notification/notification' -const useNotificationCountQuery = () => { +const useNotificationCountQuery = ({ isLoggedIn }: { isLoggedIn: boolean }) => { return useQuery({ queryKey: ['notificationCount'] as const, queryFn: () => { const res = getNotificationCount() return res }, + refetchInterval: 1000 * 60 * 3, + enabled: isLoggedIn, }) } diff --git a/src/hooks/useValidate.ts b/src/hooks/useValidate.ts index 09c59c9f..841fe594 100644 --- a/src/hooks/useValidate.ts +++ b/src/hooks/useValidate.ts @@ -27,19 +27,18 @@ const useValidate = () => { const res = await getValidateUser() return res }, - retry: 3, + retry: 1, enabled: !!token, + throwOnError: false, }) useEffect(() => { if (isError) { Cookies.remove(Environment.tokenName()) - setIsLoggedIn(() => false) - setCurrentUser(() => null) router.push(AppPath.login(), { scroll: false }) toast({ title: '인증 에러', - description: '인증에 실패하였습니다. 다시 시도하거나 로그인해주세요.', + description: '만료되거나 잘못된 토큰입니다. 다시 로그인해주세요.', variant: 'destructive', duration: 3000, })