Refactor: 커뮤니티 게시글 생성 오류 수정 및 수정 / 삭제 권한 ui 적용#49
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
Summary of Changes
Hello @FlashingFuture, I'm Gemini Code Assist1! 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은 커뮤니티 기능의 안정성과 사용자 경험을 향상시키기 위한 여러 개선 사항을 포함합니다. 게시글 생성 시 발생하던 오류를 해결하고, 게시글과 댓글에 대한 수정/삭제 권한을 작성자에게만 부여하여 데이터 무결성을 강화했습니다. 또한, 댓글 목록 로딩 방식을 커서 기반 페이징으로 전환하여 성능을 최적화하고, 댓글 액션 버튼의 UI를 현대적으로 업데이트했습니다. 마지막으로, 오류 메시지를 더 유용하게 개선하여 문제 해결에 도움을 줍니다.
Highlights
- 게시글 생성 오류 수정: 게시글 생성 시 발생할 수 있는
TypeError를 수정하여,authorInfo.nickname이 없을 경우에도 안전하게 처리되도록 개선했습니다. - 게시글 수정/삭제 권한 UI 적용: 게시글의 수정 및 삭제 버튼이 해당 게시글의 작성자에게만 보이도록 UI 로직을 적용했습니다.
- 댓글 수정/삭제 권한 UI 및 UI 변경: 댓글의 수정 및 삭제 버튼이 해당 댓글의 작성자에게만 보이도록 권한 로직을 적용하고, 버튼 UI를 아이콘 기반으로 변경하여 시각적으로 개선했습니다.
- 댓글 API 커서 기반 페이징으로 전환: 댓글 목록을 불러오는 API를 기존 페이지 기반에서 커서 기반 페이징으로 전환하여, 더 효율적인 데이터 로딩과 무한 스크롤 구현을 지원하도록 변경했습니다.
- 오류 메시지 개선: 알 수 없는 오류 발생 시, 디버깅에 도움이 되도록 실제 오류 객체를 메시지에 포함하도록
getReadableUserError및getReadablePostError함수를 개선했습니다.
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 in your pull request via creating an issue comment (i.e. comment on the pull request page) using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands.
| 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 issue 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
-
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. ↩
| return '요청 처리에 실패했습니다. 잠시 후 다시 시도해 주세요.'; | ||
| } | ||
| return '알 수 없는 오류가 발생했습니다.'; | ||
| return `알 수 없는 오류가 발생했습니다. ${e}`; |
There was a problem hiding this comment.
getReadableUserError 함수는 사용자에게 보여줄 오류 메시지를 생성하는 것으로 보입니다. 하지만 알 수 없는 오류 발생 시 원본 오류 객체 e를 그대로 노출하고 있습니다. 1 이는 사용자에게 혼란을 줄 수 있으며, 의도치 않게 내부 구현이나 데이터가 노출될 수 있는 보안 취약점이 될 수 있습니다. 원본 오류는 별도의 로깅 시스템(예: Sentry)으로 보내 개발자가 확인하도록 하고, 사용자에게는 "알 수 없는 오류가 발생했습니다. 잠시 후 다시 시도해주세요."와 같은 일반적인 메시지를 보여주는 것이 좋습니다.
| return `알 수 없는 오류가 발생했습니다. ${e}`; | |
| return '알 수 없는 오류가 발생했습니다.'; |
Style Guide References
Footnotes
-
에러 처리 시 사용자 친화적인 메시지를 제공해야 합니다. 원본 오류 객체를 그대로 노출하는 것은 사용자 친화적이지 않으며, 잠재적인 보안 위험을 가질 수 있습니다. ↩
| } | ||
| } | ||
| return '알 수 없는 오류가 발생했습니다.'; | ||
| return `알 수 없는 오류가 발생했습니다. ${e}`; |
There was a problem hiding this comment.
getReadablePostError 함수에서 알 수 없는 오류 발생 시 원본 오류 객체 e를 그대로 노출하고 있습니다. 1 이는 사용자 경험을 해치고, 내부 구현 상세를 노출하여 보안상 위험할 수 있습니다. apps/web/src/api/mypage.ts 파일의 동일한 패턴에 남긴 코멘트처럼, 실제 오류는 개발자가 확인할 수 있도록 로깅하고 사용자에게는 일반적인 안내 메시지를 표시하는 것을 권장합니다.
| return `알 수 없는 오류가 발생했습니다. ${e}`; | |
| return '알 수 없는 오류가 발생했습니다.'; |
Style Guide References
Footnotes
-
에러 처리 시 사용자 친화적인 메시지를 제공해야 합니다. 원본 오류 객체를 그대로 노출하는 것은 사용자 친화적이지 않으며, 잠재적인 보안 위험을 가질 수 있습니다. ↩
|
|
||
| // 현재 사용자 ID (RN → Web 브리지) | ||
| const myIdRaw = useNativeBridgeStore((s) => s.init?.user?.id ?? null); | ||
| const toStr = (v: unknown) => (v == null ? null : String(v)); |
There was a problem hiding this comment.
toStr 헬퍼 함수가 컴포넌트 내부에 정의되어 있어 매 렌더링마다 재생성됩니다. 이 함수는 상태에 의존하지 않으므로 useCallback으로 감싸 메모이제이션하면 불필요한 함수 생성을 막을 수 있습니다. 1 또는, 컴포넌트 외부 스코프로 함수를 옮기는 것도 좋은 방법입니다.
| const toStr = (v: unknown) => (v == null ? null : String(v)); | |
| const toStr = useCallback((v: unknown) => (v == null ? null : String(v)), []); |
Style Guide References
Footnotes
-
useCallback,useMemo를 적절히 사용해 불필요한 re-render를 방지합니다. ↩
| setPost((p) => | ||
| p ? { ...p, commentsCount: Math.max(0, p.commentsCount - 1) } : p, | ||
| p | ||
| ? { ...p, commentsCount: Math.max(0, (p.commentsCount ?? 1) - 1) } | ||
| : p, | ||
| ); |
There was a problem hiding this comment.
댓글 삭제 시 commentsCount를 업데이트하는 로직이 댓글 생성 시의 로직과 일관성이 부족해 보입니다. 댓글 생성 시에는 (p.commentsCount ?? 0) + 1로 commentsCount가 null 또는 undefined일 경우 0을 기본값으로 사용하는데, 여기서는 (p.commentsCount ?? 1) - 1로 1을 기본값으로 사용하고 있습니다. 코드를 더 예측 가능하고 일관성 있게 유지하기 위해 댓글 생성 로직과 동일하게 ?? 0을 사용하는 것을 제안합니다.
| setPost((p) => | |
| p ? { ...p, commentsCount: Math.max(0, p.commentsCount - 1) } : p, | |
| p | |
| ? { ...p, commentsCount: Math.max(0, (p.commentsCount ?? 1) - 1) } | |
| : p, | |
| ); | |
| setPost((p) => | |
| p | |
| ? { ...p, commentsCount: Math.max(0, (p.commentsCount ?? 0) - 1) } | |
| : p, | |
| ); |
작업 내용