diff --git a/src/components/ui/PaymentReceiver/index.tsx b/src/components/ui/PaymentReceiver/index.tsx index 9f70997f..034b1388 100644 --- a/src/components/ui/PaymentReceiver/index.tsx +++ b/src/components/ui/PaymentReceiver/index.tsx @@ -6,27 +6,27 @@ import styles from './index.module.scss'; type PaymentReceiverProps = { paymentType: 'gift' | 'funding'; - receivers: Receiver[]; + receiver: Receiver; }; -const PaymentReceiver = ({ paymentType, receivers }: PaymentReceiverProps) => { - const TEXT_RECEIVERS = - receivers.length === 1 ? '님에게' : `님 외 ${receivers.length - 1}명에게`; +const PaymentReceiver = ({ paymentType, receiver }: PaymentReceiverProps) => { + const RECEIVER_NAME = receiver.self ? '나' : receiver.name; + const RECEIVER_SUFFIX = receiver.self ? '에게' : '님에게'; - const TEXT_ACTION = + const MESSAGE = paymentType === 'gift' ? '선물을 보냈습니다.' : '펀딩했습니다.'; return (
프로필사진 꾸밈용 컨페티 - +
- {receivers[0].name} - {TEXT_RECEIVERS} + {RECEIVER_NAME} + {RECEIVER_SUFFIX}
- {TEXT_ACTION} + {MESSAGE}
); diff --git a/src/layouts/MyPage/FundingHistory/ContributedFunding/ContributedFundingItem/index.tsx b/src/layouts/MyPage/FundingHistory/ContributedFunding/ContributedFundingItem/index.tsx index 7752e336..611ff554 100644 --- a/src/layouts/MyPage/FundingHistory/ContributedFunding/ContributedFundingItem/index.tsx +++ b/src/layouts/MyPage/FundingHistory/ContributedFunding/ContributedFundingItem/index.tsx @@ -10,9 +10,9 @@ import styles from './index.module.scss'; type ContributedFundingItemProps = { item: ContributedFundingItemType }; const ContributedFundingItem = ({ item }: ContributedFundingItemProps) => { - const { product, fundingDetail } = item; + const { product, ...fundingDetail } = item; const { productId, name, photo, brandName } = product; - const { contributedAt, creatorName, contributedAmount, status } = + const { contributedAt, creatorName, contributedAmount, status, self } = fundingDetail; return ( @@ -31,7 +31,7 @@ const ContributedFundingItem = ({ item }: ContributedFundingItemProps) => {
- {creatorName} + {self ? '나' : creatorName} 상세보기 diff --git a/src/layouts/MyPage/FundingHistory/ContributedFunding/index.tsx b/src/layouts/MyPage/FundingHistory/ContributedFunding/index.tsx index 3a4f1747..50eddcd8 100644 --- a/src/layouts/MyPage/FundingHistory/ContributedFunding/index.tsx +++ b/src/layouts/MyPage/FundingHistory/ContributedFunding/index.tsx @@ -55,7 +55,7 @@ const ContributedFunding = () => { ) : (
    {fundingItems.map((item) => ( -
  • +
  • ))} diff --git a/src/layouts/MyPage/GiftBox/GiftItem/index.tsx b/src/layouts/MyPage/GiftBox/GiftItem/index.tsx index dc010c3b..618572d7 100644 --- a/src/layouts/MyPage/GiftBox/GiftItem/index.tsx +++ b/src/layouts/MyPage/GiftBox/GiftItem/index.tsx @@ -13,6 +13,7 @@ const GiftItem = ({ gift, status }: GiftItemProps) => { brandName, productName, productThumbnail, + self, senderName, expiredAt, receivedAt, @@ -41,7 +42,7 @@ const GiftItem = ({ gift, status }: GiftItemProps) => {
    from. - {senderName} + {self ? '나' : senderName} {new Date(receivedAt).toLocaleString()} diff --git a/src/layouts/MyPage/OrderHistory/OrderItem/index.tsx b/src/layouts/MyPage/OrderHistory/OrderItem/index.tsx index 3331bd07..16130e24 100644 --- a/src/layouts/MyPage/OrderHistory/OrderItem/index.tsx +++ b/src/layouts/MyPage/OrderHistory/OrderItem/index.tsx @@ -21,7 +21,7 @@ const OrderItem = ({ item }: OrderItemProps) => {
    - {item.receiverName} + {item.self ? '나' : item.receiverName} 상세보기 diff --git a/src/mocks/giftHandler.ts b/src/mocks/giftHandler.ts index 77b20b8a..1c3c3b2c 100644 --- a/src/mocks/giftHandler.ts +++ b/src/mocks/giftHandler.ts @@ -9,6 +9,7 @@ const gifts: Gift[] = Array.from({ length: 50 }).map((_, i) => ({ productName: `사용가능 상품${i}`, productThumbnail: 'https://img1.kakaocdn.net/thumb/C300x300@2x.fwebp.q82/?fname=https%3A%2F%2Fst.kakaocdn.net%2Fproduct%2Fgift%2Fproduct%2F20201230180133_cd30cb29560f4f1f8c7f380eb94e3cf1.png', + self: false, senderName: '홍길동', receivedAt: '2022-05-23T23:59:59', expiredAt: '2024-12-31T23:59:59', diff --git a/src/mocks/paymentHandler.ts b/src/mocks/paymentHandler.ts index adf6a960..68e5c419 100644 --- a/src/mocks/paymentHandler.ts +++ b/src/mocks/paymentHandler.ts @@ -14,6 +14,7 @@ import { } from 'types/payment'; const receiver = { + self: false, name: '김펀딩', photoUrl: 'https://gift-s.kakaocdn.net/dn/gift/images/m640/bg_profile_default.png', diff --git a/src/pages/FundingComplete/index.tsx b/src/pages/FundingComplete/index.tsx index 6eaeb688..00e37f11 100644 --- a/src/pages/FundingComplete/index.tsx +++ b/src/pages/FundingComplete/index.tsx @@ -27,7 +27,7 @@ const FundingComplete = () => { return (
    - +
    기여한 펀딩
    diff --git a/src/pages/GiftComplete/index.tsx b/src/pages/GiftComplete/index.tsx index 758b056b..b7fe7c04 100644 --- a/src/pages/GiftComplete/index.tsx +++ b/src/pages/GiftComplete/index.tsx @@ -27,7 +27,7 @@ const GiftComplete = () => { return (
    - +
    보낸 선물
    diff --git a/src/stories/GiftItem.stories.tsx b/src/stories/GiftItem.stories.tsx index 9e3c63c9..4b7bfacc 100644 --- a/src/stories/GiftItem.stories.tsx +++ b/src/stories/GiftItem.stories.tsx @@ -29,6 +29,7 @@ const giftData: Gift = { productName: '상품', productThumbnail: 'https://img1.kakaocdn.net/thumb/C300x300@2x.fwebp.q82/?fname=https%3A%2F%2Fst.kakaocdn.net%2Fproduct%2Fgift%2Fproduct%2F20201230180133_cd30cb29560f4f1f8c7f380eb94e3cf1.png', + self: false, senderName: '홍길동', receivedAt: '2022-05-23T23:59:59', expiredAt: '2024-12-31T23:59:59', diff --git a/src/types/Gift.ts b/src/types/Gift.ts index ad70f5b2..5c1df892 100644 --- a/src/types/Gift.ts +++ b/src/types/Gift.ts @@ -10,6 +10,7 @@ export type Gift = { brandName: string; productName: string; productThumbnail: string; + self: boolean; senderName: string; receivedAt: string; expiredAt: string; diff --git a/src/types/fundingHistory.ts b/src/types/fundingHistory.ts index 1cb4f25d..eda3b625 100644 --- a/src/types/fundingHistory.ts +++ b/src/types/fundingHistory.ts @@ -8,14 +8,13 @@ export type ContributedFundingItemType = { price: number; brandName: string; }; - fundingDetail: { - fundingId: number; - fundingDetailId: number; - contributedAmount: number; - contributedAt: string; - creatorName: string; - status: ContributedFundingItemStatus; - }; + fundingId: number; + fundingDetailId: number; + contributedAmount: number; + contributedAt: string; + creatorName: string; + self: boolean; + status: ContributedFundingItemStatus; }; export const REGISTERED_ITEM_STATUS = { diff --git a/src/types/order.ts b/src/types/order.ts index 047b5e7f..4300cff2 100644 --- a/src/types/order.ts +++ b/src/types/order.ts @@ -3,6 +3,7 @@ import { ProductItem } from 'types/productItem'; export type OrderItemType = { id: number; orderNumber: string; + self: boolean; receiverName: string; product: Pick< ProductItem, diff --git a/src/types/payment.ts b/src/types/payment.ts index f87e043a..eb80bc1b 100644 --- a/src/types/payment.ts +++ b/src/types/payment.ts @@ -1,6 +1,7 @@ import { ProductItem } from './productItem'; export type Receiver = { + self: boolean; name: string; photoUrl: string; };