[#134] feat(avatar): 고스트 아이콘 폴백이 포함된 Avatar 컴포넌트 추가 및 리팩토링 #142
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
github-actions
bot
requested review from
RumPumpumpum,
stupilman and
suyeon1104
suyeon1104
approved these changes
Nov 19, 2025
There was a problem hiding this comment.
Pull Request Overview
This PR implements a reusable Avatar component to centralize user profile image display logic across the application. The component handles missing user images by displaying a ghost.svg icon as a fallback, replacing scattered inline implementations.
- New Avatar component with automatic fallback to ghost icon
- Added ghost.svg icon asset for fallback display
- Replaced 6 inline avatar implementations with the new component
Reviewed Changes
Copilot reviewed 7 out of 9 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| src/components/Avatar/Avatar.tsx | New Avatar component with fallback to ghost icon |
| src/assets/icons/ghost.svg | New ghost icon asset for default avatar |
| src/features/minihome/post/detail/CommentItem.tsx | Replaced inline avatar rendering with Avatar component |
| src/features/minihome/home/HomePage.tsx | Replaced profile image rendering with Avatar component, removed fixed width |
| src/features/minihome/gallery/GalleryDetailPanel.tsx | Replaced inline avatar rendering with Avatar component |
| src/features/friends/search/Search.tsx | Replaced inline avatar rendering with Avatar component |
| src/features/friends/request/Request.tsx | Replaced inline avatar rendering with Avatar component |
| src/features/friends/list/List.tsx | Replaced inline avatar rendering with Avatar component |
| package-lock.json | Added use-sync-external-store dependency |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
sageherb
changed the title
- 사용자 이미지가 없을 때 ghost.svg 아이콘을 표시하는 Avatar 컴포넌트 구현 - ghost.svg 아이콘 에셋 신규 추가 - 이미지 로딩 실패 시 자동으로 폴백 아이콘 표시되도록 처리
- 친구 목록, 친구 요청, 사용자 검색, 갤러리 상세, 홈 화면, 댓글 아이템 등에서 사용하던 개별 <img> 및 폴백 처리 로직을 Avatar 컴포넌트로 일원화 - 중복된 아바타 렌더링 코드를 제거하여 유지보수성과 UI 일관성 개선 - 이미지 로딩 실패 시 Avatar 컴포넌트의 공통 폴백 아이콘이 자동 적용되도록 변경
sageherb
force-pushed
the
feature/avatar
branch
from
5bd4f57 to
2ff618d
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
📖 개요
고스트 아이콘 폴백이 포함된 Avatar 컴포넌트 추가 및 리팩토링
✅ 관련 이슈
🛠️ 상세 작업 내용
📸 스크린샷
N/A
👥 리뷰 확인 사항
N/A