fix: 드로워 드래그 영역을 핸들로만 제한하여 스크롤 충돌 해결

[2YH02]

변경 사항

모바일 UX 개선

• 문제: 전체 영역에서 드래그 감지로 인해 콘텐츠 스크롤 시 드로워가 의도치 않게 움직임
• 해결: 드래그 핸들(회색 바)에만 드래그 기능 제한
• 접근성 개선
  • 커서 피드백 추가 (cursor-grab / cursor-grabbing)
  • ARIA 속성 추가 (스크린 리더 지원)
  • 키보드 포커스 가능 (tabIndex={0})
• 불필요한 코드 제거
  • 콘텐츠 영역 stopPropagation 제거
  • 사용하지 않는 data-type 속성 제거
  • dragable=false 시 핸들 렌더링 생략

[vercel]

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

1 Skipped Deployment

Project	Deployment	Review	Updated (UTC)
k-pullup	Ignored		Dec 13, 2025 1:30pm

[gemini-code-assist]

Summary of Changes

Hello @2YH02, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

이 PR은 모바일 환경에서 드로워(drawer) 컴포넌트의 사용자 경험을 개선하기 위해 드래그 동작 방식을 수정합니다. 기존에는 드로워 전체 영역에서 드래그가 감지되어 콘텐츠 스크롤 시 원치 않는 드로워 움직임이 발생했지만, 이제는 드로워 상단의 특정 핸들 영역에서만 드래그가 가능하도록 변경되었습니다. 이는 스크롤 충돌 문제를 해결하고, 접근성 기능을 추가하여 전반적인 사용성을 향상시킵니다.

Highlights

• 모바일 UX 개선: 드로워의 드래그 감지 영역을 핸들(회색 바)로만 제한하여, 콘텐츠 스크롤 시 드로워가 의도치 않게 움직이는 문제를 해결했습니다.
• 접근성 강화: 드래그 핸들에 "cursor-grab" 및 "cursor-grabbing" 커서 피드백을 추가하고, ARIA 속성 ("role="button"", "aria-label") 및 키보드 포커스 ("tabIndex={0}")를 지원하여 접근성을 개선했습니다.
• 코드 정리: 불필요한 "stopPropagation" 코드와 사용되지 않는 "data-type" 속성을 제거했으며, "dragable=false"일 경우 핸들 렌더링을 생략하도록 변경했습니다.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

이 PR은 드로워의 드래그 영역을 핸들로 제한하여 모바일에서 콘텐츠 스크롤 시 드로워가 움직이는 문제를 해결합니다. 또한 커서 피드백, ARIA 속성 추가 등 접근성 개선과 불필요한 코드 제거를 포함하고 있습니다. 전반적으로 좋은 개선입니다. 한 가지 추가적인 접근성 개선을 위해, 키보드 사용자가 화살표 키로 드로워 높이를 조절할 수 있도록 onKeyDown 핸들러를 추가하는 것을 제안합니다.

[gemini-code-assist]

Code Review

이번 PR은 드로워의 드래그 영역을 핸들로 제한하여 모바일 환경에서의 스크롤 충돌 문제를 해결하고 접근성을 개선하는 중요한 변경 사항을 담고 있습니다. 전체적인 코드 변경 방향은 매우 긍정적입니다. 몇 가지 추가 개선 사항을 제안합니다. 첫째, 드래그 이벤트를 처리하는 방식에서 발생할 수 있는 잠재적인 버그를 수정하고 코드 안정성을 높이기 위해 addEventListener를 사용하도록 리팩토링하는 것을 제안합니다. 둘째, 접근성 향상을 위해 추가된 드래그 핸들에 키보드 조작 기능을 추가하여 키보드 사용자도 높이를 조절할 수 있도록 개선하는 것이 좋겠습니다. 자세한 내용은 각 파일의 주석을 참고해주세요.