Closed wzrabbit closed 6 days ago
resolves #26
본 PR에서는 회의 나가기 / 회의 종료 기능 사용을 원하는 사용자가 조작할 수 있는 회의 종료 메뉴 컴포넌트를 구현했습니다. — <MeetingExitMenu>
<MeetingExitMenu>
이 메뉴 컴포넌트는 3개의 하위 컴포넌트로 이루어져 있으며, 이 중 모달 컴포넌트는 이미 #31 에서 구현했습니다.
<MeetingExitBtn>
<MeetingExitOptionsBubble>
<ConfirmMeetingEndModal>
구현 중 아래의 두 로직이 필요했으며, 이를 위해 각각의 커스텀 훅으로 분리해 두었습니다. 간략한 주석을 작성하였습니다만 궁금하신 점이 있으면 말씀해 주세요!
useAnimatedModalClose
useClickOutside
ref
https://github.com/user-attachments/assets/0c874a0e-576c-42d2-beb3-ad1c888aa4f3
이런, 실수로 브랜치명에 feat를 붙이는 걸 깜박했네요. 죄송합니다 — 앞으로는 조심하겠습니다.
feat
머지 진행할게요! ✅
이슈 번호
작업 요약
본 PR에서는 회의 나가기 / 회의 종료 기능 사용을 원하는 사용자가 조작할 수 있는 회의 종료 메뉴 컴포넌트를 구현했습니다. —
<MeetingExitMenu>
이 메뉴 컴포넌트는 3개의 하위 컴포넌트로 이루어져 있으며, 이 중 모달 컴포넌트는 이미 #31 에서 구현했습니다.
<MeetingExitBtn>
<MeetingExitOptionsBubble>
<ConfirmMeetingEndModal>
구현 중 아래의 두 로직이 필요했으며, 이를 위해 각각의 커스텀 훅으로 분리해 두었습니다. 간략한 주석을 작성하였습니다만 궁금하신 점이 있으면 말씀해 주세요!
useAnimatedModalClose
: 모달이 닫힐 때, 애니메이션 구현 등을 이유로 지연되어 닫히는 경우가 필요할 수 있습니다. 이 기능 구현을 위한 커스텀 훅입니다.useClickOutside
: 이 커스텀 훅은ref
를 반환하는데, 이ref
를 원하는 컴포넌트에 부착해 주면, 해당 컴포넌트 바깥의 요소가 클릭되었을 경우 이를 알려줍니다.참고/인용 자료
https://github.com/user-attachments/assets/0c874a0e-576c-42d2-beb3-ad1c888aa4f3