✨ Follow 기능 구현

[Legitgoons]

작업 이유

• Follow 기능 구현
• Follow 기능 Test 코드 작성

작업 사항

1️⃣ Follow 기능 구현

• 팔로우와 언팔로우, 팔로우 취소 기능을 구현했습니다.
  
• updateRelationshipStatus 함수를 사용해 낙관적 업데이트를 구현했습니다.
  • 에러가 발생할 경우, 기존의 값으로 되돌아가고 handleMutationError를 사용해 에러 토스트가 출력되게 했습니다.
• 팔로우 요청, 언팔로우 / 팔로우 취소 API의 경우 적절한 응답 값이 있을 때, 불필요한 api 호출을 줄일 수 있다는 것을 고려해 다음과 같이 응답 값을 수정했습니다.
  • 이에 따라 wiki도 수정되었습니다.

interface Response {
  code: '2000';
  // data: {}; 기존 값
  data: {
    relationshipStatus: "self" | "following" | "none" | "pending"; // 수정된 값
  };
}

2️⃣ ProfileFollowButton 구현 및 ProfileUser에 적용

• useGetRelationshipStatus 함수로 relationshipStatus를 가져오도록 했습니다.
• ProfileUser에서 relationshipStatusData만을 가져오는데 실패했을 경우, NetworkError 페이지를 출력하고 해당 데이터를 다시 가져오도록 했습니다.
• relationshipStatus에 따라 switch/case문을 사용해 적절한 버튼을 출력하도록 했습니다.
  • 버튼을 나누고, 각 상황에 맞게 ProfileUser에서 사용하는 방안도 고려했으나, 상위 컴포넌트에서 이미 relationshipLoading 상태와 self 여부까지 고려해서 분기처리 중이기에, 버튼 분기처리까지 진행할 경우 가독성이 떨어진다고 판단했습니다.

3️⃣ 기타 작업

• fetchUser 함수의 경우 범용적으로 사용될 수 있다고 생각해 shared/axios/user로 이동하였습니다.
• IPhoneLayout의 사이즈가 지나치게 작다고 느껴져 확대했습니다.
• SkeletonProfileUser의 오타를 수정했습니다.

리뷰어가 중점적으로 확인해야 하는 부분

• 팔로우와 언팔로우/팔로우 취소 기능이 낙관적으로 작동하는지
• follow/unfollow 반환값에 data가 추가된 것을 인지했는지
• 코드의 가독성이 떨어지는 부분은 없는지

발견한 이슈

#94 이슈를 추가했습니다. 해당 이슈와 #93 #92 이슈의 경우 모두 긴급하지 않은 이슈로 판단되어, 추후에 fix 브랜치를 생성해 한번에 처리하고자 합니다.

[aws-amplify-ap-northeast-2]

This pull request is automatically being deployed by Amplify Hosting (learn more).

Access this pull request here: https://pr-95.d37mn03xh3qyyz.amplifyapp.com

[psychology50]

이거 아마 사용자 상태 때문에 차이가 있는 걸 수도 있긴 한데
예를 들어 주원님 프로필을 조회하면 "대기중"이었다가, 취소하고 다시 누르면 "팔로잉"으로 바로 넘어가는 문제가 있거든요
그런데 애초에 "대기중"이 뜨는 거면, 해당 사용자가 프로필 비공개를 했다는 건데 피드가 조회되는 게 이상한 거기도 하구요.

아마도 Mock 데이터가 잘못 설정되어 있겠다는 생각이 들어서 이 부분 확인 부탁드리겠습니다!
추가 작업이 있다고 하셔서 일단 approve 안 하고 comment로 남겨둘게용

[psychology50]

팔로우 낙관적 업데이트 되는 것까지 확인했습니다!
몇 가지 궁금한 게 있어서 질문 + 의견 제시 해봤어욤