-
Notifications
You must be signed in to change notification settings - Fork 1
스켈레톤 수정 및 인기체험 양쪽 여백문제 해결 #237
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
📝 WalkthroughWalkthrough이 변경사항은 인기 체험 캐러셀의 카드 수를 반응형으로 계산하는 새로운 함수와 상태를 추가합니다. 또한 캐러셀 컴포넌트와 내비게이션 버튼의 레이아웃을 수정하고, 카드 및 스켈레톤 컴포넌트의 스타일과 구조를 조정합니다. 각 컴포넌트의 스타일링과 반응형 동작이 개선되었습니다. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant MainPage
participant Carousel
User->>MainPage: 페이지 진입/리사이즈
MainPage->>MainPage: getPopularPerPage()로 popularPerPage 계산
MainPage->>Carousel: popularPerPage를 props로 전달
Carousel->>User: popularPerPage 만큼의 카드 렌더링
User->>Carousel: 내비게이션 버튼 클릭
Carousel->>Carousel: 카드 슬라이드/이동
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: .coderabbit.yaml 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
✨ Finishing Touches
🧪 Generate unit tests
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
Documentation and Community
|
|
🚀 오늘뭐해 Preview Deploy 완료! |
HarrySeop
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
남은 기간도 화이팅! 화이팅!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 2
🧹 Nitpick comments (1)
packages/design-system/src/components/Carousel/Carousel.tsx (1)
58-83: 모바일 스크롤바 숨김 처리 개선 권장인라인 스타일 태그를 사용한 스크롤바 숨김 처리가 구현되어 있습니다. 하지만 이 방식은 전역 CSS에 영향을 줄 수 있습니다.
CSS 모듈이나 styled-components를 사용하여 스타일을 격리하는 것을 권장합니다:
- <div - className='flex w-full gap-6 overflow-x-auto px-4 md:hidden' - style={{ - scrollbarWidth: 'none', - msOverflowStyle: 'none', - }} - > - <style>{`div::-webkit-scrollbar { display: none; }`}</style> + <div className='flex w-full gap-6 overflow-x-auto px-4 scrollbar-hide md:hidden'>그리고 전역 CSS에 다음을 추가:
.scrollbar-hide { scrollbar-width: none; -ms-overflow-style: none; } .scrollbar-hide::-webkit-scrollbar { display: none; }
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
apps/what-today/src/pages/main/index.tsx(3 hunks)packages/design-system/src/components/Carousel/Carousel.tsx(1 hunks)packages/design-system/src/components/Carousel/NavigationButton.tsx(1 hunks)packages/design-system/src/components/MainCard/Content.tsx(1 hunks)packages/design-system/src/components/MainCard/Image.tsx(1 hunks)packages/design-system/src/components/MainPageSkeleton/MainPageSkeleton.tsx(3 hunks)
🧰 Additional context used
🧠 Learnings (12)
📓 Common learnings
Learnt from: kjhyun0830
PR: What-Today-FE/What-Today#77
File: apps/what-today/src/pages/mypage/manage-activities/index.tsx:50-63
Timestamp: 2025-07-19T01:23:56.149Z
Learning: User kjhyun0830 follows an incremental development approach in What-Today project, implementing UI first and adding functionality in later iterations, as confirmed in PR #77 for the experience management page.
Learnt from: HarrySeop
PR: What-Today-FE/What-Today#89
File: packages/design-system/src/components/bottomsheet/hooks/index.ts:44-51
Timestamp: 2025-07-21T04:36:28.477Z
Learning: HarrySeop encountered a scroll restoration issue in the useBodyScrollLock hook where the base page jumps to the top during mount/unmount of the bottom sheet component. They tried adding isLocked check in cleanup function and ref-based approaches but both failed to resolve the issue. They decided to defer this fix to a later refactoring.
Learnt from: Taeil08
PR: What-Today-FE/What-Today#150
File: apps/what-today/src/pages/main/index.tsx:45-50
Timestamp: 2025-07-28T00:26:02.960Z
Learning: Taeil08은 What-Today 프로젝트에서 로딩 및 에러 상태 처리와 같은 UX 관련 사항은 팀원들과 회의를 통해 결정한 후 구현하는 접근 방식을 선호한다.
Learnt from: Taeil08
PR: What-Today-FE/What-Today#107
File: apps/what-today/src/pages/main/index.tsx:13-158
Timestamp: 2025-07-24T04:47:25.214Z
Learning: Taeil08은 What-Today 프로젝트에서 API 연결 예정인 임시 더미 데이터의 경우, 나중에 삭제될 예정이므로 데이터 품질 개선을 하지 않는 접근법을 선호한다.
📚 Learning: the mainpage component in apps/what-today/src/pages/main/index.tsx contains placeholder/example code...
Learnt from: MyungJiwoo
PR: What-Today-FE/What-Today#43
File: apps/what-today/src/pages/main/index.tsx:7-7
Timestamp: 2025-07-14T13:36:17.941Z
Learning: The MainPage component in apps/what-today/src/pages/main/index.tsx contains placeholder/example code that will be modified later, including the fixed height class 'h-1400' which the user indicated is temporary.
Applied to files:
packages/design-system/src/components/MainCard/Content.tsxpackages/design-system/src/components/MainCard/Image.tsxapps/what-today/src/pages/main/index.tsxpackages/design-system/src/components/Carousel/Carousel.tsxpackages/design-system/src/components/MainPageSkeleton/MainPageSkeleton.tsx
📚 Learning: packages/design-system/src/components/datepicker.tsx에서 taeil08은 sr-only 클래스를 가진 div 요소가 달력 트리거 버튼의 세...
Learnt from: Taeil08
PR: What-Today-FE/What-Today#125
File: packages/design-system/src/components/DatePicker.tsx:25-28
Timestamp: 2025-07-24T13:33:33.202Z
Learning: packages/design-system/src/components/DatePicker.tsx에서 Taeil08은 sr-only 클래스를 가진 div 요소가 달력 트리거 버튼의 세로 정렬에 필요하다고 설명했음. 이 요소를 제거하면 버튼 정렬이 깨지는 레이아웃 의존성이 있음.
Applied to files:
packages/design-system/src/components/MainCard/Content.tsxpackages/design-system/src/components/MainCard/Image.tsxpackages/design-system/src/components/Carousel/NavigationButton.tsxpackages/design-system/src/components/Carousel/Carousel.tsxpackages/design-system/src/components/MainPageSkeleton/MainPageSkeleton.tsx
📚 Learning: in packages/design-system/src/components/button/index.tsx, harryseop uses handleclick wrapper for se...
Learnt from: HarrySeop
PR: What-Today-FE/What-Today#53
File: packages/design-system/src/components/button/index.tsx:32-41
Timestamp: 2025-07-16T06:51:15.152Z
Learning: In packages/design-system/src/components/button/index.tsx, HarrySeop uses handleClick wrapper for security purposes to prevent execution when users remove disabled attributes via developer tools. The onClick handler should be extracted from rest props before spreading to avoid being overwritten.
Applied to files:
packages/design-system/src/components/Carousel/NavigationButton.tsxpackages/design-system/src/components/Carousel/Carousel.tsx
📚 Learning: in the button component (packages/design-system/src/components/button/index.tsx), the children filte...
Learnt from: HarrySeop
PR: What-Today-FE/What-Today#53
File: packages/design-system/src/components/button/index.tsx:63-70
Timestamp: 2025-07-15T16:38:40.310Z
Learning: In the Button component (packages/design-system/src/components/button/index.tsx), the children filtering logic that only allows strings and Icon components is intentional design decision by HarrySeop. The validChildren filter is meant to restrict button content to only text strings and Icon components for consistency and to prevent component misuse.
Applied to files:
packages/design-system/src/components/Carousel/NavigationButton.tsx
📚 Learning: in the radiogroup component (packages/design-system/src/components/radiogroup.tsx), the input type s...
Learnt from: Taeil08
PR: What-Today-FE/What-Today#35
File: packages/design-system/src/components/RadioGroup.tsx:0-0
Timestamp: 2025-07-13T13:18:33.545Z
Learning: In the RadioGroup component (packages/design-system/src/components/RadioGroup.tsx), the input type should be 'checkbox' rather than 'radio' to support the intended toggle behavior where users can click a selected option again to deselect it. The handleChange function already implements this toggle logic with `onSelect?.(isSelected ? '' : value);`.
Applied to files:
packages/design-system/src/components/Carousel/NavigationButton.tsx
📚 Learning: in the selectroot component (packages/design-system/src/components/select/selectroot.tsx), myungjiwo...
Learnt from: MyungJiwoo
PR: What-Today-FE/What-Today#57
File: packages/design-system/src/components/select/SelectRoot.tsx:37-38
Timestamp: 2025-07-17T01:20:26.915Z
Learning: In the SelectRoot component (packages/design-system/src/components/select/SelectRoot.tsx), MyungJiwoo questioned the need for implementing controlled component pattern. The current implementation only handles internal→external state changes via onChangeValue callback, but doesn't handle external→internal changes when the value prop is updated, which breaks the typical React controlled component contract.
Applied to files:
packages/design-system/src/components/Carousel/NavigationButton.tsxpackages/design-system/src/components/Carousel/Carousel.tsx
📚 Learning: in the radiogroup component (packages/design-system/src/components/radiogroup.tsx), when using type=...
Learnt from: Taeil08
PR: What-Today-FE/What-Today#35
File: packages/design-system/src/components/RadioGroup.tsx:0-0
Timestamp: 2025-07-13T13:33:19.860Z
Learning: In the RadioGroup component (packages/design-system/src/components/RadioGroup.tsx), when using type="checkbox" for toggle behavior, adding role="radio" maintains proper semantic meaning for screen readers while preserving the desired UX functionality where users can click to deselect options.
Applied to files:
packages/design-system/src/components/Carousel/NavigationButton.tsx
📚 Learning: popovertrigger component in controlled mode (when open and onopenchange props are provided to popove...
Learnt from: MyungJiwoo
PR: What-Today-FE/What-Today#117
File: apps/what-today/src/components/notification/NotificationPopover.tsx:21-21
Timestamp: 2025-07-24T08:18:09.297Z
Learning: PopoverTrigger component in controlled mode (when open and onOpenChange props are provided to PopoverRoot) does not automatically toggle the popover state on click. The developer must provide a manual onClick handler to manage the state toggle, as the internal handleClick only works when !isControlled.
Applied to files:
packages/design-system/src/components/Carousel/NavigationButton.tsx
📚 Learning: kjhyun0830은 what-today 프로젝트의 마이페이지(apps/what-today/src/pages/mypage/main/index.tsx)에서 다음 브랜치에 스켈레톤 u...
Learnt from: kjhyun0830
PR: What-Today-FE/What-Today#219
File: apps/what-today/src/pages/mypage/main/index.tsx:108-157
Timestamp: 2025-08-03T00:45:03.763Z
Learning: kjhyun0830은 What-Today 프로젝트의 마이페이지(apps/what-today/src/pages/mypage/main/index.tsx)에서 다음 브랜치에 스켈레톤 UI 작업과 함께 로딩 상태 처리를 구현할 계획이라고 언급함.
Applied to files:
apps/what-today/src/pages/main/index.tsxpackages/design-system/src/components/Carousel/Carousel.tsxpackages/design-system/src/components/MainPageSkeleton/MainPageSkeleton.tsx
📚 Learning: user kjhyun0830 follows an incremental development approach in what-today project, implementing ui f...
Learnt from: kjhyun0830
PR: What-Today-FE/What-Today#77
File: apps/what-today/src/pages/mypage/manage-activities/index.tsx:50-63
Timestamp: 2025-07-19T01:23:56.149Z
Learning: User kjhyun0830 follows an incremental development approach in What-Today project, implementing UI first and adding functionality in later iterations, as confirmed in PR #77 for the experience management page.
Applied to files:
apps/what-today/src/pages/main/index.tsx
📚 Learning: kjhyun0830 프로젝트에서 @what-today/design-system 패키지의 reservationstatus 타입이 calendar/index.ts에서 re-export...
Learnt from: kjhyun0830
PR: What-Today-FE/What-Today#91
File: apps/what-today/src/pages/mypage/reservations-status/index.tsx:2-2
Timestamp: 2025-07-22T03:59:52.657Z
Learning: kjhyun0830 프로젝트에서 @what-today/design-system 패키지의 ReservationStatus 타입이 calendar/index.ts에서 re-export되지 않아 메인 엔트리 포인트에서 접근할 수 없는 문제가 있음. DayCell.tsx에서 정의된 타입들을 calendar 모듈에서 명시적으로 export해야 함.
Applied to files:
apps/what-today/src/pages/main/index.tsx
🧬 Code Graph Analysis (2)
apps/what-today/src/pages/main/index.tsx (1)
packages/design-system/src/components/Carousel/Carousel.tsx (1)
Carousel(8-94)
packages/design-system/src/components/Carousel/Carousel.tsx (2)
packages/design-system/src/components/Carousel/NavigationButton.tsx (1)
NavigationButton(32-44)packages/design-system/src/components/MainCard/index.ts (1)
MainCard(5-9)
🔇 Additional comments (18)
packages/design-system/src/components/MainCard/Image.tsx (1)
11-11: 반응형 브레이크포인트 조정이 적절합니다.이미지 높이 브레이크포인트를
lg에서xl로 변경한 것이 다른 컴포넌트들과 일관성을 유지하며, 전체적인 반응형 디자인 개선에 기여합니다.packages/design-system/src/components/MainCard/Content.tsx (1)
27-27: 패딩 조정이 반응형 디자인 개선에 적합합니다.중간 브레이크포인트에서 패딩을 줄이고
xl브레이크포인트로 변경한 것이 카드 컨텐츠의 시각적 균형을 개선합니다.packages/design-system/src/components/Carousel/NavigationButton.tsx (2)
21-24: className 속성 추가가 적절합니다.컴포넌트의 재사용성과 유연성을 높이는 좋은 개선사항이며, JSDoc 문서화도 잘 되어있습니다.
32-37: className 속성 구현이 올바릅니다.템플릿 리터럴을 사용한 클래스 병합 방식이 깔끔하며, 기본값 설정도 적절합니다.
apps/what-today/src/pages/main/index.tsx (6)
29-29: 함수명과 주석이 명확합니다.
getCount함수의 용도를 명확히 하는 주석이 추가되어 코드 가독성이 향상되었습니다.
37-46: 인기 체험용 반응형 로직이 잘 구현되었습니다.별도의 함수로 분리하여 관심사를 명확히 구분했으며, 브레이크포인트 상수 정의와 함께 유지보수성이 좋습니다.
51-51: 상태 관리가 적절합니다.
popularPerPage상태를 별도로 관리하여 각 캐러셀의 독립적인 반응형 동작을 보장합니다.
58-62: resize 핸들러 업데이트가 올바릅니다.두 캐러셀의 반응형 상태를 모두 업데이트하도록 핸들러가 적절히 수정되었습니다.
182-186: 동적 itemsPerPage 적용이 적절합니다.인기 체험 캐러셀에
popularPerPage상태를 적용하여 반응형 동작이 올바르게 구현되었습니다.
173-173: CSS 클래스(mt-40) 제거 여부 확인 필요
apps/what-today/src/pages/main/index.tsx (173번째 줄)에서mt-40클래스가 삭제되었습니다. 의도된 마진 조정인지 확인 부탁드립니다.
- 변경 전/후 비교:
- <div className='relative z-10 flex h-auto flex-col gap-60 mt-40'> + <div className='relative z-10 flex h-auto flex-col gap-60'>
- 다른 문서 페이지에서
mt-40사용 예시:
- packages/design-system/src/pages/RadioGroupDoc.tsx (
<h2 className='mt-40 text-2xl'>…)- packages/design-system/src/pages/ExperienceImageUploadDoc.tsx (
<h2 className='mt-40 text-2xl font-semibold'>…)위 클래스를 제거해도 레이아웃이 의도한 대로 유지되는지 재검토 부탁드립니다.
packages/design-system/src/components/MainPageSkeleton/MainPageSkeleton.tsx (5)
15-15: 브레이크포인트 일관성이 향상되었습니다.스켈레톤의 높이 브레이크포인트를
xl로 변경하여 실제 MainCard 컴포넌트와 일치시킨 것이 좋습니다.
20-21: 패딩 값이 실제 컴포넌트와 일치합니다.MainCard/Content.tsx의 패딩 변경사항과 동일하게 적용하여 스켈레톤과 실제 컴포넌트 간의 일관성을 보장합니다.
23-36: 스켈레톤 레이아웃 구조가 개선되었습니다.중첩된 flex 컨테이너와 적절한 gap 값으로 실제 카드 구조를 더 정확하게 반영하도록 개선되었습니다.
85-85: 상수 분리로 코드 가독성이 향상되었습니다.
itemWidthPercent상수를 도입하여 인라인 계산을 제거하고 실제 Carousel 컴포넌트와의 일관성을 높였습니다.
102-103: 템플릿 리터럴 사용이 더 깔끔합니다.
twMerge대신 템플릿 리터럴과 모듈로 연산을 사용한 것이 코드를 단순화하고 성능도 향상시킵니다.packages/design-system/src/components/Carousel/Carousel.tsx (3)
28-34: 모션 애니메이션 구현이 적절함데스크탑/태블릿 뷰에서 페이지네이션 기반 슬라이딩 애니메이션이 잘 구현되었습니다.
pointerEvents: 'auto'설정으로 애니메이션 중에도 상호작용이 가능하도록 했습니다.
79-79: 모바일에서만 이미지 필터 적용하는 이유 확인 필요모바일 뷰에서만
brightness-90 contrast-125필터가 적용되고 데스크탑에서는 적용되지 않습니다. 이는 의도된 디자인인지 확인이 필요합니다.디자인 시스템의 일관성을 위해 다음을 확인해주세요:
- 모바일과 데스크탑에서 다른 이미지 스타일이 의도된 것인지
- 브랜드 가이드라인에 따른 것인지
- 사용자 경험 측면에서 적절한지
만약 일관성이 필요하다면 데스크탑에도 동일한 필터를 적용하거나, 모바일에서 필터를 제거하는 것을 고려해보세요.
35-54: 카드 간격 로직: 정상 동작 확인itemsPerPage가 4일 때 테스트한 결과,
idx % itemsPerPage !== itemsPerPage - 1조건이 각 페이지의 마지막 아이템(예: idx 3, 7)에만 오른쪽 패딩을 제거하도록 의도대로 작동함을 확인했습니다.
해당 로직은 그대로 유지하셔도 됩니다.
|
🚀 오늘뭐해 Preview Deploy 완료! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 1
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
packages/design-system/src/components/MainSearchInput/MainSearchInput.tsx(1 hunks)
🧰 Additional context used
🧠 Learnings (6)
📓 Common learnings
Learnt from: kjhyun0830
PR: What-Today-FE/What-Today#77
File: apps/what-today/src/pages/mypage/manage-activities/index.tsx:50-63
Timestamp: 2025-07-19T01:23:56.149Z
Learning: User kjhyun0830 follows an incremental development approach in What-Today project, implementing UI first and adding functionality in later iterations, as confirmed in PR #77 for the experience management page.
Learnt from: HarrySeop
PR: What-Today-FE/What-Today#89
File: packages/design-system/src/components/bottomsheet/hooks/index.ts:44-51
Timestamp: 2025-07-21T04:36:28.477Z
Learning: HarrySeop encountered a scroll restoration issue in the useBodyScrollLock hook where the base page jumps to the top during mount/unmount of the bottom sheet component. They tried adding isLocked check in cleanup function and ref-based approaches but both failed to resolve the issue. They decided to defer this fix to a later refactoring.
Learnt from: Taeil08
PR: What-Today-FE/What-Today#150
File: apps/what-today/src/pages/main/index.tsx:45-50
Timestamp: 2025-07-28T00:26:02.960Z
Learning: Taeil08은 What-Today 프로젝트에서 로딩 및 에러 상태 처리와 같은 UX 관련 사항은 팀원들과 회의를 통해 결정한 후 구현하는 접근 방식을 선호한다.
Learnt from: Taeil08
PR: What-Today-FE/What-Today#107
File: apps/what-today/src/pages/main/index.tsx:13-158
Timestamp: 2025-07-24T04:47:25.214Z
Learning: Taeil08은 What-Today 프로젝트에서 API 연결 예정인 임시 더미 데이터의 경우, 나중에 삭제될 예정이므로 데이터 품질 개선을 하지 않는 접근법을 선호한다.
📚 Learning: the mainpage component in apps/what-today/src/pages/main/index.tsx contains placeholder/example code...
Learnt from: MyungJiwoo
PR: What-Today-FE/What-Today#43
File: apps/what-today/src/pages/main/index.tsx:7-7
Timestamp: 2025-07-14T13:36:17.941Z
Learning: The MainPage component in apps/what-today/src/pages/main/index.tsx contains placeholder/example code that will be modified later, including the fixed height class 'h-1400' which the user indicated is temporary.
Applied to files:
packages/design-system/src/components/MainSearchInput/MainSearchInput.tsx
📚 Learning: in the selectroot component (packages/design-system/src/components/select/selectroot.tsx), myungjiwo...
Learnt from: MyungJiwoo
PR: What-Today-FE/What-Today#57
File: packages/design-system/src/components/select/SelectRoot.tsx:37-38
Timestamp: 2025-07-17T01:20:26.915Z
Learning: In the SelectRoot component (packages/design-system/src/components/select/SelectRoot.tsx), MyungJiwoo questioned the need for implementing controlled component pattern. The current implementation only handles internal→external state changes via onChangeValue callback, but doesn't handle external→internal changes when the value prop is updated, which breaks the typical React controlled component contract.
Applied to files:
packages/design-system/src/components/MainSearchInput/MainSearchInput.tsx
📚 Learning: packages/design-system/src/components/datepicker.tsx에서 taeil08은 sr-only 클래스를 가진 div 요소가 달력 트리거 버튼의 세...
Learnt from: Taeil08
PR: What-Today-FE/What-Today#125
File: packages/design-system/src/components/DatePicker.tsx:25-28
Timestamp: 2025-07-24T13:33:33.202Z
Learning: packages/design-system/src/components/DatePicker.tsx에서 Taeil08은 sr-only 클래스를 가진 div 요소가 달력 트리거 버튼의 세로 정렬에 필요하다고 설명했음. 이 요소를 제거하면 버튼 정렬이 깨지는 레이아웃 의존성이 있음.
Applied to files:
packages/design-system/src/components/MainSearchInput/MainSearchInput.tsx
📚 Learning: in the button component (packages/design-system/src/components/button/index.tsx), the children filte...
Learnt from: HarrySeop
PR: What-Today-FE/What-Today#53
File: packages/design-system/src/components/button/index.tsx:63-70
Timestamp: 2025-07-15T16:38:40.310Z
Learning: In the Button component (packages/design-system/src/components/button/index.tsx), the children filtering logic that only allows strings and Icon components is intentional design decision by HarrySeop. The validChildren filter is meant to restrict button content to only text strings and Icon components for consistency and to prevent component misuse.
Applied to files:
packages/design-system/src/components/MainSearchInput/MainSearchInput.tsx
📚 Learning: in packages/design-system/src/components/button/index.tsx, harryseop uses handleclick wrapper for se...
Learnt from: HarrySeop
PR: What-Today-FE/What-Today#53
File: packages/design-system/src/components/button/index.tsx:32-41
Timestamp: 2025-07-16T06:51:15.152Z
Learning: In packages/design-system/src/components/button/index.tsx, HarrySeop uses handleClick wrapper for security purposes to prevent execution when users remove disabled attributes via developer tools. The onClick handler should be extracted from rest props before spreading to avoid being overwritten.
Applied to files:
packages/design-system/src/components/MainSearchInput/MainSearchInput.tsx
packages/design-system/src/components/MainSearchInput/MainSearchInput.tsx
Outdated
Show resolved
Hide resolved
|
🚀 오늘뭐해 Preview Deploy 완료! |
🧩 관련 이슈 번호
📌 작업 내용
✅ 체크리스트
📷 UI 변경 사항 (선택)
2025-08-04.1.07.51.mov
2025-08-04.1.07.13.mov
2025-08-04.1.06.44.mov
❓무슨 문제가 발생했나요? (선택)
💬 기타 참고 사항 (선택)
Summary by CodeRabbit
신규 기능
스타일
버그 수정
기타