diff --git a/src/APP/user-pages/Mypage/Mypage.mypage.challenge.tuple.jsx b/src/APP/user-pages/Mypage/Mypage.mypage.challenge.tuple.jsx index daf1b7b..4bf8809 100644 --- a/src/APP/user-pages/Mypage/Mypage.mypage.challenge.tuple.jsx +++ b/src/APP/user-pages/Mypage/Mypage.mypage.challenge.tuple.jsx @@ -1,10 +1,7 @@ -// import React, { useEffect, useContext } from "react"; -// import { useNavigate } from "react-router-dom"; +import React from "react"; import * as itemS from "./Styled/Mypage.mypage.challenge.tuple.styles"; export default function ChallengeTuple({ item }) { - // const navigate = useNavigate(); - const formatDate = (createdTime) => { const date = new Date(createdTime); const year = date.getFullYear(); @@ -13,8 +10,9 @@ export default function ChallengeTuple({ item }) { return `${year}.${month}.${day}`; }; + // content가 너무 길 경우를 대비한 함수 (선택적으로 사용) const truncateTitle = (name) => { - if (name.length > 30) { + if (name && name.length > 30) { return name.slice(0, 29) + "..."; } return name; @@ -26,24 +24,30 @@ export default function ChallengeTuple({ item }) { return ( - {/* */} {item.logType} - - {item.problemList?.map((num, idx) => ( - - moveToDetail(num)} - > - {num} 번 - - {idx !== item.problemList.length - 1 && ( - | - )} - - ))} - + {/* ✅ 수정된 부분: logType에 따라 조건부 렌더링 */} + {item.logType === "사용" ? ( + // '사용'일 경우 content를 표시 + {truncateTitle(item.content)} + ) : ( + // '획득'일 경우 기존 problemList를 표시 + + {item.problemList?.map((num, idx) => ( + + moveToDetail(num)} + > + {num} 번 + + {idx !== item.problemList.length - 1 && ( + | + )} + + ))} + + )} {formatDate(item.logDate)} {item.rewardCount}회