diff --git a/src/pages/reward-page/reward-product-detail-page.tsx b/src/pages/reward-page/reward-product-detail-page.tsx index d50a941..76ce60c 100644 --- a/src/pages/reward-page/reward-product-detail-page.tsx +++ b/src/pages/reward-page/reward-product-detail-page.tsx @@ -25,6 +25,18 @@ export default function RewardProductDetailPage() { !product || product.stockQuantity === 0 || product.status !== 'ACTIVE'; + const descriptionItems = product + ? product.description + .split(/\r?\n/) + .map((content) => content.trim()) + .filter(Boolean) + : []; + const gifticonUsageItems = product + ? [product.description, product.usageGuide] + .flatMap((content) => content.split(/\r?\n/)) + .map((content) => content.trim()) + .filter(Boolean) + : []; return (
@@ -77,23 +89,46 @@ export default function RewardProductDetailPage() {

제품 설명

-

{product.description ?? '제품 설명이 준비 중입니다.'}

+ {descriptionItems.length > 0 ? ( + + ) : ( +

제품 설명이 준비 중입니다.

+ )} ) : ( -
-

- 사용 안내 -

-
-
+
+
+

+ 사용 안내 +

+ {gifticonUsageItems.length > 0 ? ( +
    + {gifticonUsageItems.map((item, index) => ( +
  • +
  • + ))} +
+ ) : ( +

사용 안내가 준비 중입니다.

+ )} +
-
-
유효기간
-
발급일로부터 {product.validityDays}일
-
-
+ {product.validityDays != null && ( +
+
유효기간
+
발급일로부터 {product.validityDays}일
+
+ )} +
)}
diff --git a/src/types/reward.ts b/src/types/reward.ts index 71f3c8c..89f658b 100644 --- a/src/types/reward.ts +++ b/src/types/reward.ts @@ -51,7 +51,7 @@ export interface RewardProductPreviewResult { export interface RewardProductDetail extends RewardProductListItem { description: string; usageGuide: string; - validityDays: number; + validityDays: number | null; } export interface RewardHistory {