Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Caution Review failedThe pull request is closed. ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: ⛔ Files ignored due to path filters (46)
📒 Files selected for processing (6)
📝 WalkthroughWalkthroughThis PR adds support for a new wellness clinic (WOOJOOYON) to the company detail system. Changes include localized content in three languages, CSS styles for story elements, extended component logic to conditionally render WooJooYon content, and utility functions to identify WooJooYon companies alongside existing TheGateSpa matching. ChangesWooJooYon Clinic Integration
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Poem
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request introduces a new "WooJooYon Clinic" story section to the company detail page, featuring localized content in English, Japanese, and Korean. The changes include new styled components and a refactoring of the existing "The Gate Spa" story into a reusable CompanyStory component. Additionally, utility functions were updated to support the identification of the new clinic. Feedback was provided regarding the risk of mapping program items to images by index, suggesting a key-based approach to ensure data integrity if the order in translation files changes.
|
|
||
| <ol css={storyProgramList}> | ||
| {programItems.map((program, index) => { | ||
| const programImages = WOO_JOO_YON_PROGRAM_IMAGES[index] ?? []; |
There was a problem hiding this comment.
programItems 배열과 WOO_JOO_YON_PROGRAM_IMAGES 배열을 index를 사용하여 매핑하는 방식은 잠재적인 위험을 가지고 있습니다. i18n JSON 파일에서 프로그램 순서가 변경되면 이미지와 프로그램 내용이 잘못 연결될 수 있습니다.
더 안정적인 방법은 각 프로그램에 고유한 key를 부여하고, 이 key를 기반으로 이미지를 매핑하는 것입니다.
예를 들어, messages/.../company-detail.json 파일의 items에 key를 추가합니다.
"items": [
{
"key": "face",
"name": "1. FACE",
...
},
...
]그리고 WOO_JOO_YON_PROGRAM_IMAGES를 배열 대신 객체로 변경하여 key로 이미지를 찾도록 할 수 있습니다.
const WOO_JOO_YON_PROGRAM_IMAGES = {
face: [
{ src: WOO_JOO_YON_IMAGES.consultation, altKey: 'consultation' },
...
],
immune: [ ... ],
stress: [ ... ],
};
// 사용시
const programImages = WOO_JOO_YON_PROGRAM_IMAGES[program.key] ?? [];이렇게 변경하면 데이터 순서가 바뀌어도 항상 올바른 이미지를 보여줄 수 있어 유지보수성이 향상됩니다.
1 participant
📝 관련 문서 레퍼런스
💻 주요 변경 사항은 무엇인가요?
📚 추가된 라이브러리
📱 결과 화면 (선택)
🙇 코드 리뷰 중점사항, 예상되는 문제점 (선택)
Summary by CodeRabbit