[fix] 프로필 페이지 개선#488
Merged
Merged
Conversation
Contributor
검토자 가이드이 PR은 프로필 페이지를 개선합니다. 편집 양식(탐색, 로더, 스타일링)을 리팩토링하고, SVG 유효성 검사 및 토스트 메시지 추가로 이미지 업로더를 강화하며, 표시 구성 요소에서 아바타 폴백을 표준화하고, 데이터 액션에서 일관된 오류 발생을 적용하고, 불필요한 코드를 정리합니다. 업데이트된 ProfileCard 및 ProfileImage 컴포넌트의 클래스 다이어그램classDiagram
class ProfileCard {
- nickname: string
- profileImg: string
- location: string | null
- children: React.ReactNode
- className: string
}
class ProfileImage {
- src: string
- alt: string
- size: 'small' | 'medium' | 'large'
- className: string
- priority: boolean
}
ProfileCard --> ProfileImage: uses
토스트 유효성 검사가 포함된 ProfileImageUploader 클래스 다이어그램classDiagram
class ProfileImageUploader {
- defaultImage: string
- onChange: (e: React.ChangeEvent<HTMLInputElement>) => void
- preview: string
- fileInputRef: React.RefObject<HTMLInputElement>
- showToast: function
+ handleFileChange(e)
}
ProfileImageUploader --> ToastStore: uses showToast
파일 수준 변경 사항
연결된 이슈에 대한 평가
관련 가능성이 있는 이슈
팁 및 명령어Sourcery와 상호 작용하기
경험 사용자 정의대시보드에 접속하여 다음을 수행할 수 있습니다:
도움 받기Original review guide in EnglishReviewer's GuideThis PR enhances the profile page by refactoring the edit form (navigation, loaders, styling), strengthening the image uploader with SVG validation and toasts, standardizing avatar fallbacks in display components, enforcing consistent error throwing in data actions, and cleaning up redundant code. Class diagram for updated ProfileCard and ProfileImage componentsclassDiagram
class ProfileCard {
- nickname: string
- profileImg: string
- location: string | null
- children: React.ReactNode
- className: string
}
class ProfileImage {
- src: string
- alt: string
- size: 'small' | 'medium' | 'large'
- className: string
- priority: boolean
}
ProfileCard --> ProfileImage: uses
Class diagram for ProfileImageUploader with toast validationclassDiagram
class ProfileImageUploader {
- defaultImage: string
- onChange: (e: React.ChangeEvent<HTMLInputElement>) => void
- preview: string
- fileInputRef: React.RefObject<HTMLInputElement>
- showToast: function
+ handleFileChange(e)
}
ProfileImageUploader --> ToastStore: uses showToast
File-Level Changes
Assessment against linked issues
Possibly linked issues
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
![sourcery-ai[bot]](https://avatars.githubusercontent.com/in/48477?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
안녕하세요 @dolmeengii - 변경 사항을 검토했으며 아주 좋습니다!
Prompt for AI Agents
Please address the comments from this code review:
## Individual Comments
### Comment 1
<location> `apps/web/src/lib/data/user.ts:28` </location>
<code_context>
}
return profile;
} catch (error) {
- console.error('내 프로필 조회 에러:', error);
- return null;
</code_context>
<issue_to_address>
Suppressing the error object in the catch block may hinder debugging.
Consider logging the error or storing it for diagnostics to help with issue tracking in production environments.
</issue_to_address>
### Comment 2
<location> `apps/web/src/components/common/profile/edit/profile-image-uploader.tsx:44` </location>
<code_context>
const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+ const file = e.target.files?.[0];
+ if (file?.type === 'image/svg+xml') {
+ showToast({
+ status: 'notice',
+ title: 'svg 파일 제한',
+ subtext: '다른 확장 파일로 다시 시도해주세요.',
+ autoClose: true,
+ });
+ return;
+ }
+
</code_context>
<issue_to_address>
SVG file restriction is enforced, but user experience could be improved.
Consider clearing the file input value after showing the toast, so users can immediately re-select a file without extra steps.
</issue_to_address>
<suggested_fix>
<<<<<<< SEARCH
if (file?.type === 'image/svg+xml') {
showToast({
status: 'notice',
title: 'svg 파일 제한',
subtext: '다른 확장 파일로 다시 시도해주세요.',
autoClose: true,
});
return;
}
=======
if (file?.type === 'image/svg+xml') {
showToast({
status: 'notice',
title: 'svg 파일 제한',
subtext: '다른 확장 파일로 다시 시도해주세요.',
autoClose: true,
});
e.target.value = '';
return;
}
>>>>>>> REPLACE
</suggested_fix>Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Original comment in English
Hey @dolmeengii - I've reviewed your changes and they look great!
Prompt for AI Agents
Please address the comments from this code review:
## Individual Comments
### Comment 1
<location> `apps/web/src/lib/data/user.ts:28` </location>
<code_context>
}
return profile;
} catch (error) {
- console.error('내 프로필 조회 에러:', error);
- return null;
</code_context>
<issue_to_address>
Suppressing the error object in the catch block may hinder debugging.
Consider logging the error or storing it for diagnostics to help with issue tracking in production environments.
</issue_to_address>
### Comment 2
<location> `apps/web/src/components/common/profile/edit/profile-image-uploader.tsx:44` </location>
<code_context>
const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+ const file = e.target.files?.[0];
+ if (file?.type === 'image/svg+xml') {
+ showToast({
+ status: 'notice',
+ title: 'svg 파일 제한',
+ subtext: '다른 확장 파일로 다시 시도해주세요.',
+ autoClose: true,
+ });
+ return;
+ }
+
</code_context>
<issue_to_address>
SVG file restriction is enforced, but user experience could be improved.
Consider clearing the file input value after showing the toast, so users can immediately re-select a file without extra steps.
</issue_to_address>
<suggested_fix>
<<<<<<< SEARCH
if (file?.type === 'image/svg+xml') {
showToast({
status: 'notice',
title: 'svg 파일 제한',
subtext: '다른 확장 파일로 다시 시도해주세요.',
autoClose: true,
});
return;
}
=======
if (file?.type === 'image/svg+xml') {
showToast({
status: 'notice',
title: 'svg 파일 제한',
subtext: '다른 확장 파일로 다시 시도해주세요.',
autoClose: true,
});
e.target.value = '';
return;
}
>>>>>>> REPLACE
</suggested_fix>Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
…ader.tsx Co-authored-by: sourcery-ai[bot] <58596630+sourcery-ai[bot]@users.noreply.github.com>
miniseung
approved these changes
Aug 5, 2025
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
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.
🚀 풀 리퀘스트 제안
📋 작업 내용
closes #478
🔧 변경 사항
주요 변경 사항을 요약해 주세요.
📸 스크린샷 (선택 사항)
수정된 화면 또는 기능을 시연할 수 있는 스크린샷을 첨부해 주세요.
📄 기타
추가적으로 전달하고 싶은 내용이나 특별한 요구 사항이 있으면 작성해 주세요.
Sourcery 요약
편집 폼 UX 개선, 아바타 처리 강화 및 에러 관리 표준화를 통해 프로필 페이지 경험을 향상합니다.
버그 수정:
개선 사항:
imageprop을 필수로 지정하고 공유 아바타 에셋을 임포트하여 기본 아바타 사용을 통일Original summary in English
Summary by Sourcery
Enhance profile page experience by improving edit form UX, enforcing avatar handling, and standardizing error management
Bug Fixes:
Enhancements: