feat: 설정 페이지 UI 및 기능 추가

[kimsuyeon0916]

변경 사항

• 설정 페이지 UI 스타일링
• 회원 정보 수정, 회원 정보 조회, 비밀번호 수정, 가족 그룹 생성, 가족 등록, 가족 멤버 조회, 가족 그룹 조회, 로그아웃, 회원 탈퇴 api 함수 및 커스텀 훅 추가
• 설정 및 로그인 페이지 fetch 적용
• 여러개의 바텀시트를 관리할 수 있는 useBottomSheet 공통 커스텀 훅 추가
• Button 컴포넌트 onClick 이벤트가 발생하지 않는 이슈 해결
• BottomSheet, BottomNav 스크롤 생겨도 화면 하단에 고정되도록 변경
• User 타입 내 ownerName(계정 소유자) 프로퍼티 추가 및 적용
  • useUserStore 내 defaultState 변경
  • MainHeader, ClinicClientPage 컴포넌트 내 프로필 이름값 user.name -> user.onwerName 변경
• mypage -> setting 타입 파일명 변경 및 적용
• MainHeader, ClinicClientPage 컴포넌트 내 프로필 클릭 시, 설정 페이지로 이동

리뷰 필요

• 서비스 로직이 크지 않아서 hook로 별도로 분리하지 않고, 각 옵션 별 바텀시트 내에 배치했습니다.
• 쿠키에 리프레시 토큰이 없어서 로그아웃, 회원 탈퇴가 동작하지 않는 이슈가 있습니다. 이 부분은 도메인 일치시키고 추후에 다시 확인하겠습니다.
• 서버분들과 논의 후 추후에 다시 확인해야 하는 사항들이 존재합니다‼️
  • 현재 UI 상으로는 가족 그룹 탈퇴 및 가족 그룹 삭제가 존재하지만 api가 존재하지 않습니다.
  • 현재 UI 상으로는 가족 코드를 입력하면, 그룹 초대자의 이름을 반환하는 api가 필요합니다.
  • 가족 그룹 생성하는 코드를 발급할때마다, 다른 사람이 코드를 등록하지 않아도 본인 포함 가족 그룹이 무한 생성되는 이슈가 있습니다. 멤버가 2명 이상일 때만 DB 상에 저장되도록 해야 할 듯 합니다.
  • 가족 그룹 조회 시, 서버에서 응답 데이터 내 familyCode랑 familyName이 서로 바뀌어서 오는 이슈가 있습니다.
  • (추가) 본인이 생성한 가족 코드를 등록했을 때, 자기 자신도 무한으로 추가되는 이슈가 있습니다.
• 디자인과 관련하여 UX 측면에서 고민되는 사항들이 존재합니다. 다른분들의 의견이 궁금합니다!🤔
  • 설정 페이지는 가족 프로필로 변경하여도 본인의 설정페이지여야 합니다. 따라서 MainHeader 내 최상단은 계정 소유자의 이름으로 뜨도록 변경하였는데 이부분이 자연스러운지 궁금합니다.
  • 가족 코드 등록 시, 모달뿐만 아니라 바텀 시트도 닫는 것을 고려중입니다.
  • 회원 탈퇴시에도 모달이 존재해야 할 것 같습니다.

제가 놓친게 있으면 말씀 부탁드립니다!

close #111

[G0MTENG]

수고 많으셨습니다 :D useBottomSheet 훅으로 복잡한 바텀시트 상태들을 잘 관리한거 같아요!

[github-actions]

🚀 storybook: https://66ab96a8c9b121191190be86-iwuetqkizc.chromatic.com/