Skip to content

Refactor: 커뮤니티 게시글 생성 오류 수정 및 수정 / 삭제 권한 ui 적용#49

Merged
FlashingFuture merged 3 commits into
mainfrom
refactor/community
Sep 15, 2025
Merged

Refactor: 커뮤니티 게시글 생성 오류 수정 및 수정 / 삭제 권한 ui 적용#49
FlashingFuture merged 3 commits into
mainfrom
refactor/community

Conversation

@FlashingFuture

Copy link
Copy Markdown
Contributor

작업 내용

  • 글 생성 시 typeError로 생성은 잘 되지만 에러가 생기던 문제 수정
  • 글 수정 / 삭제 버튼이 작성자에게만 나오도록 적용
  • 댓글 수정 / 삭제 ui 변경 및 작성자에게만 나오도록 적용

@vercel

vercel Bot commented Sep 15, 2025

Copy link
Copy Markdown

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

Project Deployment Preview Comments Updated (UTC)
runova-web Ready Ready Preview Comment Sep 15, 2025 3:22am

@gemini-code-assist gemini-code-assist Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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를 기존 페이지 기반에서 커서 기반 페이징으로 전환하여, 더 효율적인 데이터 로딩과 무한 스크롤 구현을 지원하도록 변경했습니다.
  • 오류 메시지 개선: 알 수 없는 오류 발생 시, 디버깅에 도움이 되도록 실제 오류 객체를 메시지에 포함하도록 getReadableUserErrorgetReadablePostError 함수를 개선했습니다.
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

  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 gemini-code-assist Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

이번 PR은 커뮤니티 게시글 상세 페이지의 TypeError를 수정하고, 댓글에 커서 기반 페이지네이션을 도입하며, 게시글과 댓글의 수정/삭제 권한 UI를 적용하는 리팩토링을 성공적으로 수행했습니다. 특히 커서 기반 페이지네이션으로의 전환과 댓글 액션 UI 개선이 잘 이루어졌습니다. 코드의 오류 처리 방식, 일관성 및 유지보수성을 향상시킬 수 있는 몇 가지 제안 사항을 코멘트로 남겼습니다.

Comment thread apps/web/src/api/mypage.ts Outdated
return '요청 처리에 실패했습니다. 잠시 후 다시 시도해 주세요.';
}
return '알 수 없는 오류가 발생했습니다.';
return `알 수 없는 오류가 발생했습니다. ${e}`;

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

high

getReadableUserError 함수는 사용자에게 보여줄 오류 메시지를 생성하는 것으로 보입니다. 하지만 알 수 없는 오류 발생 시 원본 오류 객체 e를 그대로 노출하고 있습니다. 1 이는 사용자에게 혼란을 줄 수 있으며, 의도치 않게 내부 구현이나 데이터가 노출될 수 있는 보안 취약점이 될 수 있습니다. 원본 오류는 별도의 로깅 시스템(예: Sentry)으로 보내 개발자가 확인하도록 하고, 사용자에게는 "알 수 없는 오류가 발생했습니다. 잠시 후 다시 시도해주세요."와 같은 일반적인 메시지를 보여주는 것이 좋습니다.

Suggested change
return `알 수 없는 오류가 발생했습니다. ${e}`;
return '알 수 없는 오류가 발생했습니다.';

Style Guide References

Footnotes

  1. 에러 처리 시 사용자 친화적인 메시지를 제공해야 합니다. 원본 오류 객체를 그대로 노출하는 것은 사용자 친화적이지 않으며, 잠재적인 보안 위험을 가질 수 있습니다.

Comment thread apps/web/src/api/posts.ts Outdated
}
}
return '알 수 없는 오류가 발생했습니다.';
return `알 수 없는 오류가 발생했습니다. ${e}`;

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

high

getReadablePostError 함수에서 알 수 없는 오류 발생 시 원본 오류 객체 e를 그대로 노출하고 있습니다. 1 이는 사용자 경험을 해치고, 내부 구현 상세를 노출하여 보안상 위험할 수 있습니다. apps/web/src/api/mypage.ts 파일의 동일한 패턴에 남긴 코멘트처럼, 실제 오류는 개발자가 확인할 수 있도록 로깅하고 사용자에게는 일반적인 안내 메시지를 표시하는 것을 권장합니다.

Suggested change
return `알 수 없는 오류가 발생했습니다. ${e}`;
return '알 수 없는 오류가 발생했습니다.';

Style Guide References

Footnotes

  1. 에러 처리 시 사용자 친화적인 메시지를 제공해야 합니다. 원본 오류 객체를 그대로 노출하는 것은 사용자 친화적이지 않으며, 잠재적인 보안 위험을 가질 수 있습니다.


// 현재 사용자 ID (RN → Web 브리지)
const myIdRaw = useNativeBridgeStore((s) => s.init?.user?.id ?? null);
const toStr = (v: unknown) => (v == null ? null : String(v));

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

toStr 헬퍼 함수가 컴포넌트 내부에 정의되어 있어 매 렌더링마다 재생성됩니다. 이 함수는 상태에 의존하지 않으므로 useCallback으로 감싸 메모이제이션하면 불필요한 함수 생성을 막을 수 있습니다. 1 또는, 컴포넌트 외부 스코프로 함수를 옮기는 것도 좋은 방법입니다.

Suggested change
const toStr = (v: unknown) => (v == null ? null : String(v));
const toStr = useCallback((v: unknown) => (v == null ? null : String(v)), []);

Style Guide References

Footnotes

  1. useCallback, useMemo를 적절히 사용해 불필요한 re-render를 방지합니다.

Comment on lines 231 to 235
setPost((p) =>
p ? { ...p, commentsCount: Math.max(0, p.commentsCount - 1) } : p,
p
? { ...p, commentsCount: Math.max(0, (p.commentsCount ?? 1) - 1) }
: p,
);

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

댓글 삭제 시 commentsCount를 업데이트하는 로직이 댓글 생성 시의 로직과 일관성이 부족해 보입니다. 댓글 생성 시에는 (p.commentsCount ?? 0) + 1commentsCountnull 또는 undefined일 경우 0을 기본값으로 사용하는데, 여기서는 (p.commentsCount ?? 1) - 1로 1을 기본값으로 사용하고 있습니다. 코드를 더 예측 가능하고 일관성 있게 유지하기 위해 댓글 생성 로직과 동일하게 ?? 0을 사용하는 것을 제안합니다.

Suggested change
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,
);

@FlashingFuture FlashingFuture merged commit 0976866 into main Sep 15, 2025
3 checks passed
@FlashingFuture FlashingFuture deleted the refactor/community branch September 15, 2025 04:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant