Conversation
Walkthrough이 변경사항은 여러 페이지와 컴포넌트에 "사용법" 외부 링크 버튼(플로팅 버튼)을 추가하고, 메뉴 버튼 타입에 url 지원을 도입하며, 이벤트 카드와 슬라이더의 스타일을 조정합니다. 또한 FloatingButton 컴포넌트가 새롭게 도입되었습니다. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant FloatingButton
participant Browser
User->>FloatingButton: 클릭(사용법 버튼)
FloatingButton->>Browser: window.open(Notion URL, '_blank')
sequenceDiagram
participant User
participant MenuButton
participant MenuPage
participant Browser
User->>MenuButton: 클릭(사용법 메뉴 버튼)
MenuButton->>MenuPage: handleIconClick 호출(navigate, path, url)
alt url이 있음
MenuPage->>Browser: window.open(url, '_blank')
else path만 있음
MenuPage->>MenuPage: navigate(path)
end
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (3)
🚧 Files skipped from review as they are similar to previous changes (3)
✨ Finishing Touches
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
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 4
🧹 Nitpick comments (2)
src/pages/menu/ui/MenuPage.tsx (1)
8-14: 외부 URL 지원 구현이 잘 되어 있습니다.함수 시그니처와 로직이 적절하게 구현되어 있고, 새 탭에서 외부 링크를 여는 것도 좋은 UX입니다.
예외 상황 처리를 추가하는 것을 고려해보세요:
const handleIconClick = (navigate: (path: string) => void, path: string, url?: string) => { if (url) { window.open(url, '_blank'); } else if (path) { navigate(path); + } else { + console.warn('No URL or path provided to handleIconClick'); } };src/shared/types/menuType.ts (1)
7-7: 기존 코드의 경로 오타 수정 필요import 경로에 불필요한 슬래시가 있습니다.
-import SelectedEvent from '../../..//design-system/icons/SelectedEvent.svg'; +import SelectedEvent from '../../../design-system/icons/SelectedEvent.svg';
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (3)
public/assets/menu/SelectedManual.svgis excluded by!**/*.svgpublic/assets/menu/help.svgis excluded by!**/*.svgpublic/assets/menu/manual.svgis excluded by!**/*.svg
📒 Files selected for processing (7)
src/features/home/ui/EventSliderSection.tsx(3 hunks)src/pages/home/ui/MainPage.tsx(3 hunks)src/pages/menu/ui/MenuPage.tsx(2 hunks)src/pages/menu/ui/myHost/MyHostPage.tsx(2 hunks)src/shared/types/menuType.ts(2 hunks)src/shared/ui/EventCard.tsx(1 hunks)src/shared/ui/FloatingButton.tsx(1 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
src/features/home/ui/EventSliderSection.tsx (1)
src/entities/event/model/eventDetail.ts (1)
EventItem(30-34)
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: storybook
🔇 Additional comments (11)
src/shared/ui/FloatingButton.tsx (1)
18-32: 접근성과 애니메이션 구현이 잘 되어 있습니다.framer-motion을 사용한 애니메이션 효과와 aria-label을 통한 접근성 지원이 적절하게 구현되어 있습니다. 컴포넌트 구조도 재사용 가능하도록 잘 설계되었습니다.
src/shared/ui/EventCard.tsx (1)
46-46: 종횡비 조정이 적절합니다.작은 화면에서의 이벤트 카드 종횡비를
3/4.5에서3/5로 조정한 것은 합리적인 UI 개선입니다.src/features/home/ui/EventSliderSection.tsx (3)
52-52: 레이아웃 센터링 개선이 좋습니다.
justify-center클래스 추가로 이벤트 카드들이 더 균형있게 배치됩니다.
57-64: 반응형 스타일링이 개선되었습니다.더 구체적인 반응형 클래스들을 사용하여 다양한 화면 크기에서 더 나은 레이아웃을 제공합니다.
94-94: 빈 함수 포맷팅이 정리되었습니다.빈 onClick 핸들러에 공백 추가로 코드 가독성이 향상되었습니다.
src/pages/menu/ui/MenuPage.tsx (1)
30-30: 버튼 클릭 핸들러 업데이트가 올바릅니다.
button.url을 세 번째 파라미터로 전달하여 외부 URL 지원이 제대로 연결되었습니다.src/pages/home/ui/MainPage.tsx (3)
16-17: 새로운 컴포넌트 import가 올바르게 추가되었음FloatingButton 컴포넌트와 manualIcon 아이콘의 import가 적절하게 추가되었습니다.
39-39: 플로팅 버튼 배치를 위한 레이아웃 조정이 적절함루트 컨테이너에
relative클래스를 추가하여 플로팅 버튼의 absolute/sticky 포지셔닝을 지원하도록 한 것이 올바른 접근입니다.
45-45: onChange 핸들러 포맷팅 개선빈 onChange 핸들러의 포맷팅이 개선되었습니다.
src/shared/types/menuType.ts (2)
12-13: 새로운 아이콘 import가 적절하게 추가됨Manual과 SelectedManual 아이콘들이 올바르게 import되었습니다.
20-20: 인터페이스 확장이 적절함외부 URL 지원을 위한 optional
url속성 추가가 올바른 접근입니다.
2 participants
메인 페이지 floating button - 사용자 매뉴얼
내 호스트 페이지 floating button - 호스트 매뉴얼
메뉴 - 사용자 매뉴얼
메인페이지 및 이벤트카드 반응형 구현
Summary by CodeRabbit
신규 기능
UI/스타일 개선
버그 수정