diff --git a/src/app/(root)/(routes)/cards/[cardId]/components/trade-section/PokeUnavailableInfo.tsx b/src/app/(root)/(routes)/cards/[cardId]/components/trade-section/PokeUnavailableInfo.tsx
new file mode 100644
index 00000000..6e0cd393
--- /dev/null
+++ b/src/app/(root)/(routes)/cards/[cardId]/components/trade-section/PokeUnavailableInfo.tsx
@@ -0,0 +1,18 @@
+import Image from 'next/image'
+import Assets from '@/config/assets'
+
+const PokeUnavailableInfo = () => {
+ return (
+
+
+
찔러보기가 허용되지 않은 물건입니다
+
+ )
+}
+
+export default PokeUnavailableInfo
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 4e007a82..8b3c6ea2 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,8 +1,9 @@
-import Image from 'next/image'
+import { useRouter } from 'next/navigation'
import SuggestCard from '@/components/domain/card/suggest-card'
+import NoData from '@/components/domain/no-data'
import { Tabs, TabsTrigger, TabsList, TabsContent } from '@/components/ui/tabs'
-import Assets from '@/config/assets'
import { AvailableCardSuggestionListRes } from '@/services/suggestion/suggestion'
+import PokeUnavailableInfo from './PokeUnavailableInfo'
type SuggestListProps = {
suggestionData: AvailableCardSuggestionListRes[]
@@ -10,14 +11,44 @@ type SuggestListProps = {
toCardId: number
}
-/**
- * TODO : 스크롤바 디자인 수정
- */
const SuggestList = ({
suggestionData,
pokeAvailable,
toCardId,
}: SuggestListProps) => {
+ const router = useRouter()
+ const filterData = (type: string) => {
+ const filteredData = suggestionData.filter(
+ (v) => v.suggestionInfo.suggestionType === type,
+ )
+
+ if (filteredData.length === 0) {
+ return (
+
+ router.push('/cards/new')}
+ buttonContent="물건 등록하러 가기"
+ />
+
+ )
+ } else {
+ return filteredData.map((v) => (
+
+ ))
+ }
+ }
+
return (
@@ -31,33 +62,9 @@ const SuggestList = ({
className="flex flex-col data-[state=inactive]:hidden h-[402px] overflow-y-auto"
>
{!pokeAvailable && type === 'POKE' ? (
-
-
-
- 찔러보기가 허용되지 않은 물건입니다
-
-
+
) : (
- suggestionData
- .filter((v) => v.suggestionInfo.suggestionType === type)
- .map((v) => (
-
- ))
+ filterData(type)
)}
))}
diff --git a/src/app/(root)/(routes)/cards/[cardId]/components/trade-section/TradeSection.tsx b/src/app/(root)/(routes)/cards/[cardId]/components/trade-section/TradeSection.tsx
index 8785a5ae..528ee760 100644
--- a/src/app/(root)/(routes)/cards/[cardId]/components/trade-section/TradeSection.tsx
+++ b/src/app/(root)/(routes)/cards/[cardId]/components/trade-section/TradeSection.tsx
@@ -11,6 +11,7 @@ import {
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog'
+import AppPath from '@/config/appPath'
import Assets from '@/config/assets'
import { PRICE_RANGE_OBJS, TRADE_TYPE_OBJS } from '@/constants/card'
import { useAuth } from '@/contexts/AuthProvider'
@@ -77,7 +78,7 @@ const TradeSection = ({
const onClickButton = async () => {
if (isMyItem) {
- router.push(`/mypage/suggestions/${cardId}`)
+ router.push(AppPath.mySuggestions(cardId))
} else {
setOpen(true)
}
diff --git a/src/app/(root)/(routes)/chatrooms/[chatRoomId]/components/CompleteRequestButton.tsx b/src/app/(root)/(routes)/chatrooms/[chatRoomId]/components/CompleteRequestButton.tsx
index 74572313..e35453a7 100644
--- a/src/app/(root)/(routes)/chatrooms/[chatRoomId]/components/CompleteRequestButton.tsx
+++ b/src/app/(root)/(routes)/chatrooms/[chatRoomId]/components/CompleteRequestButton.tsx
@@ -1,5 +1,6 @@
'use client'
+import { useState } from 'react'
import Image from 'next/image'
import Button from '@/components/ui/button'
import {
@@ -22,9 +23,12 @@ const CompleteRequestButton = ({
myCardId,
otherCardId,
}: CompleteRequestButtonProps) => {
+ const [isCompleteRequested, setIsCompleteRequested] = useState(false)
+
const handleRequestButton = async () => {
try {
await postCompleteRequest(myCardId, otherCardId)
+ setIsCompleteRequested(true)
toast({
title: '거래성사를 요청하였습니다',
variant: 'default',
@@ -42,9 +46,11 @@ const CompleteRequestButton = ({
return (
-
+ {!isCompleteRequested && (
+
+ )}
diff --git a/src/app/(root)/(routes)/chatrooms/[chatRoomId]/components/CompleteRequestCard.tsx b/src/app/(root)/(routes)/chatrooms/[chatRoomId]/components/CompleteRequestCard.tsx
index 6e01c133..9a5b2ddc 100644
--- a/src/app/(root)/(routes)/chatrooms/[chatRoomId]/components/CompleteRequestCard.tsx
+++ b/src/app/(root)/(routes)/chatrooms/[chatRoomId]/components/CompleteRequestCard.tsx
@@ -1,4 +1,8 @@
+'use client'
+
+import { useState } from 'react'
import Image from 'next/image'
+import Badge from '@/components/ui/badge'
import Button from '@/components/ui/button'
import { Card, CardFlex, CardImage, CardText } from '@/components/ui/card/Card'
import Assets from '@/config/assets'
@@ -35,6 +39,7 @@ const CompleteRequestCard = ({
myCardData,
otherCardData,
}: CompleteRequestCardProps) => {
+ const [completeRequestStatus, setCompleteRequestStatus] = useState('')
const handleCompleteRequestUpdate = async (isAccepted: boolean) => {
try {
await putCompleteRequest(
@@ -42,7 +47,7 @@ const CompleteRequestCard = ({
myCardData.cardId,
isAccepted,
)
- window.location.reload()
+ setCompleteRequestStatus(isAccepted ? '거래성사 확정' : '거래성사 거절')
toast({
title: `거래성사 요청을 ${isAccepted ? '수락' : '거절'}하였습니다.`,
variant: 'default',
@@ -71,24 +76,30 @@ const CompleteRequestCard = ({
>
거래성사 요청이 왔습니다. 거래를 하셨나요?
-
-
-
-
+ {completeRequestStatus === '' ? (
+
+
+
+
+ ) : (
+
+ {completeRequestStatus}
+
+ )}
{
- //NOTE - 현재 로그인한 사람이 거래성사 요청 받은 사람인경우 + 요청 상태가 waiting인 경우 - 거래성사요청 카드가 보인다.
const isRequestedUser =
toCard.userInfo.userId === currentUser.userId && status === 'WAITING'
return isRequestedUser ? (
) : (
diff --git a/src/hooks/api/mutations/useCardStatusUpdateMutation.ts b/src/hooks/api/mutations/useCardStatusUpdateMutation.ts
index c7d539ad..f7dab328 100644
--- a/src/hooks/api/mutations/useCardStatusUpdateMutation.ts
+++ b/src/hooks/api/mutations/useCardStatusUpdateMutation.ts
@@ -1,6 +1,4 @@
import { useMutation, useQueryClient } from '@tanstack/react-query'
-import Cookies from 'js-cookie'
-import { Environment } from '@/config/environment'
import { toast } from '@/hooks/useToast'
import { putCardStatus } from '@/services/card/card'
import { TradeStatusObjs } from '@/types/card'
@@ -10,9 +8,8 @@ const useCardStatusUpdateMutation = (
status: TradeStatusObjs['key'],
) => {
const queryClient = useQueryClient()
- const token = Cookies.get(Environment.tokenName())
- const queryKey = [cardId, 'cardInfo', token]
+ const queryKey = [cardId, 'cardInfo']
return useMutation({
mutationFn: putCardStatus,
onMutate: async () => {
diff --git a/src/services/complete-request/completeRequest.ts b/src/services/complete-request/completeRequest.ts
index ffe8a1ef..c99f140c 100644
--- a/src/services/complete-request/completeRequest.ts
+++ b/src/services/complete-request/completeRequest.ts
@@ -18,7 +18,7 @@ const putCompleteRequest = async (
toCardId: number,
isAccepted: boolean,
) => {
- const response = await apiClient.post(
+ const response = await apiClient.put(
ApiEndPoint.putCompleteRequest(),
{ fromCardId, toCardId, isAccepted },
{},