Skip to content

Conversation

@suuuuya
Copy link
Contributor

@suuuuya suuuuya commented Sep 28, 2025

📄 PR 내용 요약

공통으로 사용되는 리뷰 평점(별점) 컴포넌트 구현

✅ 작업 내용 상세

별점을 표시하는 컴포넌트로 다양한 크기와 옵션을 지원합니다.
스토리북 문서 참고해주세요!

name description control
rating 평점 값 (0-5) number
maxRating 최대 평점 number
size 별의 크기 xs, sm, md, md2, lg, xl, 2xl
score 점수 표시 여부 score
totalScore 총점 표시 여부 (점수/총점) totalScore

📸 스크린샷 (선택사항)

기본

스크린샷 2025-09-29 오전 3 10 59

세부 평점(반응형)

pc tb m
스크린샷 2025-09-29 오전 3 11 37 스크린샷 2025-09-29 오전 3 11 12 스크린샷 2025-09-29 오전 3 11 29

💬 참고 사항

테일윈드 컨피그 파일에 아이콘 사이즈 이름 수정하면서 아이콘 컴포넌트도 같이 수정되었습니다. 참고 부탁드립니다!
"2md": "ic-2md", -> md2: "ic-md2"

@suuuuya suuuuya self-assigned this Sep 28, 2025
@suuuuya suuuuya added the 🎨 Design UI/UX, 디자인 변경 label Sep 28, 2025
@suuuuya suuuuya added this to WHYNE Sep 28, 2025
@vercel
Copy link

vercel bot commented Sep 28, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Comments Updated (UTC)
wine Ready Ready Preview Comment Sep 29, 2025 8:06am

Copy link
Contributor

@huuitae huuitae left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

고생하셨습니다 코멘트 확인 부탁드립니다!

Comment on lines 40 to 50
{[...Array(maxRating)].map((_, i) => {
const score = maxRating - i;
const count = distribution[score] ?? 0;
return (
<ScoreBar
key={score}
score={score}
reviewCount={count}
totalCount={totalReviews}
/>
);
Copy link
Contributor

@huuitae huuitae Sep 29, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

이 부분은 Array.from({length: 5})new Array(maxRating).fill(0)로 배열을 만들어 사용하는 것이 나을 것 같습니다!

Array(maxRating)으로 배열을 만들면 아무것도 들어있지 않은 빈 배열을 사용하기 때문에 map() 함수가 의도대로 동작하지 않을 수 있다고 합니다.
실제로 배열을 만들면 [ <5 empty items> ]이 출력되고, index를 사용하려해도 undefined가 출력됩니다.

따라서 스프레드 연산자를 통해 사용하신 것 같은데, 이러면 배열을 두 번 만드는셈이 되니 한 번에 생성해서 사용하는게 나아보입니다!

@suuuuya suuuuya merged commit 04d4e60 into develop Sep 29, 2025
3 checks passed
@suuuuya suuuuya deleted the design/star-rating-component branch September 29, 2025 08:07
@github-project-automation github-project-automation bot moved this to 완료 in WHYNE Sep 29, 2025
@suuuuya suuuuya linked an issue Oct 16, 2025 that may be closed by this pull request
5 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

🎨 Design UI/UX, 디자인 변경

Projects

Status: 완료

Development

Successfully merging this pull request may close these issues.

[Feature] 리뷰 평점(별점) 컴포넌트 개발

3 participants