-
Notifications
You must be signed in to change notification settings - Fork 1
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
사용자 프로필 편집 페이지 구현 #16
Merged
Merged
Conversation
This file contains 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
- `getProfile`: API를 사용하여 사용자 프로필 정보를 호출 - `useEffect`: 훅을 사용하여 컴포넌트가 마운트 될 때 API 호출 수행 - `useState`: 훅을 사용하여 사용자 정보 상태 관리
- `ProfileContainer`: 루트 레이아웃입니다.
- `Header`: 뒤로가기 버튼이 존재하는 헤더 컴포넌트입니다.
- `CoverImage`: 사용자 커버 이미지 컴포넌트입니다. - `DetailSection`: 사용자 프로필 이미지와 편집 버튼을 포함하는 컴포넌트입니다.
- `UserProfileInfo`: 사용자 이름, 닉네임, 온라인 여부, 이메일 그리고 팔로우 컴포넌트를 포함합니다.
- `ButtonContainer`: 상호작용 버튼을 감싸는 루트 컴포넌트입니다. - `ChatButton`: 채팅 버튼입니다. - `FollowButton`: 팔로우 버튼입니다.
- `PostSection`: 전체 포스트를 담고 있는 루트 레이아웃입니다. - `PostList`: 종류별 포스트들을 담고 있는 컴포넌트입니다. - `PostTitle`: 어떤 종류의 포스트인지 명시하는 제목 컴포넌트입니다.
- 가독성을 개선하고 중복을 최소화하기 위해, 좋아요한 포스트와 작성한 포스트를 분리했습니다. - 어떤 포스트인지 listTitle prop으로 구분할 수 있습니다.
- 가독성을 위해 컴포넌트로 분리했습니다.
- 헤더는 프로필 편집 페이지에서도 사용됩니다.
- 하드코딩된 경로를 미리 지정한 경로로 수정했습니다.
- `FollowButtons`: FollowButton과 유사하여 삭제했습니다. ButtonContainer로 대체했습니다. - ButtonContainer의 스타일을 수정하여, 중복을 최소화했습니다.
- 내 프로필인지에 따라 특정 버튼을 활성화, 비활성화합니다.
- 커버, 프로필 이미지는 isCover의 값에 따라 달라집니다. - type에 따라 사용되는 곳이 달라집니다.
- svg를 jsx로 반환합니다.
- 컴포넌트를 분리하여 코드의 가독성을 높였습니다.
- 나의 프로필 정보를 불러와서 해당 유저를 팔로우 하는지 확인합니다. - 팔로우 버튼을 클릭하여 팔로우, 팔로우 취소할 수 있게 했습니다.
- 팔로우하지 않을 경우 아이콘의 너비와 높이를 팔로우 했을 경우 아이콘의 너비와 높이로 통일 했습니다.
- id인자를 추가하여, 특정 id를 가진 유저의 프로필 정보를 가져올 수 있습니다.
- 프로필 페이지에서는 사용하지 않는 이미지 업로드 버튼을 삭제했습니다.
- 프로필 편집 페이지에 사용되는 컴포넌트와 구분하기 위해, profile 폴더로 컴포넌트의 위치를 변경했습니다.
- 데이터 바인딩이 되지 않은 임시 컴포넌트 입니다.
- label의 이름을 의미가 명확하게 변경했습니다. - toggleDrawer의 이름에 handle prefix를 추가했습니다.
- 3개의 input 필드를 form으로 관리합니다. - 수정 버튼을 form의 submit을 수행하는 버튼으로 변경했습니다.
- 사용자 프로필 정보를 기존 state에서 zustand로 관리하도록 변경했습니다.
- 컨벤션에 따라 import 순서를 수정했습니다.
- 공통 컴포넌트(ProfileImage)로 분리함에 따라 사용하지 않습니다.
- ProfileImage, CoverImage를 공통 컴포넌트로 분리했습니다.
- 분기 처리가 없으면, DrawerSide와 겹쳐져서 이전 버튼이 동작하지 않았습니다.
- 변경이 된 후, 사용자가 페이지를 빠져나갈 수 있도록 합니다.
JuJangGwon
approved these changes
Jan 2, 2024
lja0395
reviewed
Jan 2, 2024
src/pages/Profile/components/profile-edit-drawer/ProfileNameForm.tsx
Outdated
Show resolved
Hide resolved
Yoonkyoungme
reviewed
Jan 2, 2024
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
apis 디렉토리에 profile, updateName, updatePassword, uploadImage가 나뉘어 있네요.
깔끔하고, 가독성이 좋은 장점이 있지만, 나중에 단일 파일들이 많아질 것 같다는 생각이 듭니다🤔 항상 이건 딜레마인 것 같아요.. 1 ~ 2개의 파일로 나눌지 쪼갤지😭
- 프로필 관련 API 요청 함수를 profile 폴더 내로 옮겼습니다.
- 기존 인라인으로 작성한 스타일을 tw-macro 방식으로 변경했습니다.
Yoonkyoungme
approved these changes
Jan 2, 2024
- `Commnet`를 `Comment`로 수정
- 화살표 함수로 통일성을 부여했습니다.
lja0395
approved these changes
Jan 3, 2024
This was
linked to
issues
Jan 3, 2024
Open
Open
Open
Closed
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.
관련 이슈
작업 내용
2024-01-01.21.39.43.mov
특이 사항
리뷰 요구사항 (선택)