From 32285bf5748c56901d9613aa2a7dd99da24d15d1 Mon Sep 17 00:00:00 2001 From: juyeon-park Date: Wed, 29 Nov 2023 03:06:16 +0900 Subject: [PATCH] =?UTF-8?q?:tada:=20=EB=A6=AC=EB=8B=A4=EC=9D=B4=EB=9E=99?= =?UTF-8?q?=ED=8A=B8=20=EB=B0=8F=20=EB=9D=BC=EC=9A=B0=ED=8C=85=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80=20+=20=EB=B2=84=EA=B7=B8=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DescriptionSection.tsx | 12 +++++++- .../components/trade-section/SuggestList.tsx | 30 +++++++++++-------- .../chatrooms/[chatRoomId]/loading.tsx | 25 ++++++++++++++++ .../notification-card/NotificationCard.tsx | 9 +++++- src/app/loading.tsx | 2 +- .../domain/card/suggest-card/SuggestCard.tsx | 7 +++-- src/hooks/useDibs.ts | 7 ++++- 7 files changed, 73 insertions(+), 19 deletions(-) create mode 100644 src/app/(root)/(routes)/chatrooms/[chatRoomId]/loading.tsx diff --git a/src/app/(root)/(routes)/cards/[cardId]/components/description-section/DescriptionSection.tsx b/src/app/(root)/(routes)/cards/[cardId]/components/description-section/DescriptionSection.tsx index 574ef132..6a3e6292 100644 --- a/src/app/(root)/(routes)/cards/[cardId]/components/description-section/DescriptionSection.tsx +++ b/src/app/(root)/(routes)/cards/[cardId]/components/description-section/DescriptionSection.tsx @@ -1,6 +1,8 @@ import formatDistanceToNow from 'date-fns/formatDistanceToNow' import koLocale from 'date-fns/locale/ko' +import { useRouter } from 'next/navigation' import Badge from '@/components/ui/badge' +import AppPath from '@/config/appPath' import { CATEGORY_OBJS, TRADE_STATUS_OBJS } from '@/constants/card' import { useAuth } from '@/contexts/AuthProvider' import { TYPOGRAPHY } from '@/styles/sizes' @@ -36,6 +38,7 @@ const DescriptionSection = ({ }: DescriptionSectionProps) => { const { isLoggedIn } = useAuth() const { currentUser } = useAuth() + const router = useRouter() const isMyItem = currentUser?.userId === authorId @@ -68,7 +71,14 @@ const DescriptionSection = ({ TYPOGRAPHY.description, )} > - {getValueByKey(CATEGORY_OBJS, category)} + + router.push(`${AppPath.cards()}?category=${category}`) + } + > + {getValueByKey(CATEGORY_OBJS, category)} +

{formatDistanceToNow(new Date(createdAt), { diff --git a/src/app/(root)/(routes)/cards/[cardId]/components/trade-section/SuggestList.tsx b/src/app/(root)/(routes)/cards/[cardId]/components/trade-section/SuggestList.tsx index 192b496b..9e1b5cfb 100644 --- a/src/app/(root)/(routes)/cards/[cardId]/components/trade-section/SuggestList.tsx +++ b/src/app/(root)/(routes)/cards/[cardId]/components/trade-section/SuggestList.tsx @@ -1,4 +1,6 @@ +import { Suspense } from 'react' import { useRouter } from 'next/navigation' +import Loading from '@/app/loading' import SuggestCard from '@/components/domain/card/suggest-card' import NoData from '@/components/domain/no-data' import { Tabs, TabsTrigger, TabsList, TabsContent } from '@/components/ui/tabs' @@ -51,19 +53,21 @@ const SuggestList = ({ pokeAvailable, toCardId }: SuggestListProps) => { 오퍼하기 찔러보기 - {['OFFER', 'POKE'].map((type) => ( - - {!pokeAvailable && type === 'POKE' ? ( - - ) : ( - filterData(type) - )} - - ))} + }> + {['OFFER', 'POKE'].map((type) => ( + + {!pokeAvailable && type === 'POKE' ? ( + + ) : ( + filterData(type) + )} + + ))} + ) } diff --git a/src/app/(root)/(routes)/chatrooms/[chatRoomId]/loading.tsx b/src/app/(root)/(routes)/chatrooms/[chatRoomId]/loading.tsx new file mode 100644 index 00000000..29a08a58 --- /dev/null +++ b/src/app/(root)/(routes)/chatrooms/[chatRoomId]/loading.tsx @@ -0,0 +1,25 @@ +'use client' + +import Lottie from 'react-lottie-player' +import lottieJson from '../../../../../../public/loading.json' + +const Loading = () => { + return ( +

+
+ +

채팅방을 불러오는 중입니다.

+
+
+ ) +} + +export default Loading diff --git a/src/app/(root)/(routes)/notifications/components/notification-card/NotificationCard.tsx b/src/app/(root)/(routes)/notifications/components/notification-card/NotificationCard.tsx index edd4e071..48847c21 100644 --- a/src/app/(root)/(routes)/notifications/components/notification-card/NotificationCard.tsx +++ b/src/app/(root)/(routes)/notifications/components/notification-card/NotificationCard.tsx @@ -11,8 +11,15 @@ type NotificationCardProps = { const NotificationCard = ({ notification: { content, cardId, read }, }: NotificationCardProps) => { + const isCompleteRequestNotification = content.includes('성사') return ( - + diff --git a/src/app/loading.tsx b/src/app/loading.tsx index 37426efe..a1c7446a 100644 --- a/src/app/loading.tsx +++ b/src/app/loading.tsx @@ -5,7 +5,7 @@ import lottieJson from '../../public/loading.json' const Loading = () => { return ( -
+
{ const { mutate } = useSuggestionCreateMutation(toCardId, fromCardId) - + const router = useRouter() const onClickSuggest = async (suggestionType: SuggestionType) => { mutate({ suggestionType, fromCardId, toCardId }) } @@ -44,12 +46,13 @@ const SuggestCard = ({ gap={'space'} className="h-full" > -
+
router.push(AppPath.card(String(fromCardId)))} />
diff --git a/src/hooks/useDibs.ts b/src/hooks/useDibs.ts index 3d0004eb..ab8c1e69 100644 --- a/src/hooks/useDibs.ts +++ b/src/hooks/useDibs.ts @@ -1,10 +1,15 @@ 'use client' -import { useState } from 'react' +import { useEffect, useState } from 'react' import { deleteCardDibs, postCardDibs } from '@/services/card/card' import { toast } from './useToast' const useDibs = (isMyDib: boolean, count: number) => { + useEffect(() => { + setIsDibsActive(isMyDib) + setDibsCount(count) + }, [count, isMyDib]) + const [isDibsActive, setIsDibsActive] = useState(isMyDib) const [dibsCount, setDibsCount] = useState(count)