[x] 수정된 사용자 정보 patch API 필드명 적용 (nickname -> nickName)
📝 작업 상세 내용
1️⃣ 중복 제거
MyPage/Diary.tsx에 있는 TCreateMarpkup 타입 제거
TCreateMarpkup 가 types/diary.ts와 MyPage/Diary.tsx 2곳에 중복 선언되어 있어 MyPage/Diary.tsx에 있는 TCreateMarpkup을 제거했습니다.
2️⃣ Pick/Omit 기능 사용
// Setting Page updateProfile Type 수정 전
interface IUpdateProfile {
nickname?: string;
profileIntro?: string;
}
// 수정 후
type pickProfileImageURL = Pick<IProfile, 'profileImageURL'>;
// Setting Page updateProfile Type
type omitProfileImageURL = Omit<IProfile, 'profileImageURL'>;
IUpdateProfile를 Omit 기능을 사용하여 omitProfileImageURL로 수정했습니다.
Pick 기능을 사용하여 profileImageURL만 선택한 pickProfileImageURL을 생성했습니다.
Partial 기능을 이용하고 있던 부분을 생성한 omit/pickProfileImageURL로 변경했습니다.
Partial 유틸리티 기능은 코드의 복잡성을 제거해주고 객체의 타입을 유연하게 만든다는 장점이 있습니다. Pick/Omit 기능을 이용하면 타입의 명확성이 높아지고 코드의 의도 파악이 쉽다는 장점이 있습니다. 사실 어떤걸 써도 상관없을 것 같다 생각하지만 프로필만 업데이트하는 경우, 닉네임/소개글을 업데이트하는 경우 2가지로 명확히 구분되어있어 타입 명확성을 높이고자 Pick/Omit 타입으로 수정했습니다.
Pick/Omit 타입으로 수정하면서 IProfile의 해당 속성이 선택적임을 뜻하는 ?는 제거해주었습니다.
profileSelector에서 memberId가 falsy 값일 경우, useProfile의 profile은 undefiend 값을 가지게 됩니다. profile이 undefined일 경우, || 논리합 연산자로 인해 두번째 피연산자 값인 profileFromAtom 값을 가져옴으로써 profileAtom의 기본값을 사용합니다. 수정 전에는 {}를 반환했습니다. 기본값을 사용함으로써 useProfile은 언제나 string을 반환하게 됩니다.
수정함으로써 아래 타입 에러를 해결했습니다.
Setting 페이지
Profile 컴포넌트
useProfile이 profileAtom의 기본값을 반환할 경우 마이페이지는 이렇게 나타납니다.
{} 였을 때는 profileURL, nickname, info 모두 아무것도 없는 상태로 나타났습니다.
추후 recoil -> zustand로 바뀔 예정이긴하지만 조금 다듬어 봤습니다! 😄
4️⃣ nickname -> nickName
사용자 정보 patch api의 닉네임 필드명은 nickname, 멤버의 기본 프로필 정보 api의 닉네임 필드명은 nickName으로 깔끔한 타입 정리를 위해 통일이 필요했습니다. 백엔드로 수정 요청하였고 예슬님께서 수정해주셔서 적용 완료했습니다!
✅ 체크리스트
📝 작업 상세 내용
1️⃣ 중복 제거
2️⃣ Pick/Omit 기능 사용
?
는 제거해주었습니다.3️⃣ useProfile 수정 사항
수정 전
수정 후
profileAtom의 기본값은 아래와 같이 전부 '' 문자열로 되어있습니다.
profileSelector에서 memberId가 falsy 값일 경우, useProfile의 profile은 undefiend 값을 가지게 됩니다. profile이 undefined일 경우, || 논리합 연산자로 인해 두번째 피연산자 값인 profileFromAtom 값을 가져옴으로써 profileAtom의 기본값을 사용합니다. 수정 전에는 {}를 반환했습니다. 기본값을 사용함으로써 useProfile은 언제나 string을 반환하게 됩니다.
수정함으로써 아래 타입 에러를 해결했습니다.
Setting 페이지
Profile 컴포넌트
useProfile이 profileAtom의 기본값을 반환할 경우 마이페이지는 이렇게 나타납니다.
{} 였을 때는 profileURL, nickname, info 모두 아무것도 없는 상태로 나타났습니다.
추후 recoil -> zustand로 바뀔 예정이긴하지만 조금 다듬어 봤습니다! 😄
4️⃣ nickname -> nickName
사용자 정보 patch api의 닉네임 필드명은 nickname, 멤버의 기본 프로필 정보 api의 닉네임 필드명은 nickName으로 깔끔한 타입 정리를 위해 통일이 필요했습니다. 백엔드로 수정 요청하였고 예슬님께서 수정해주셔서 적용 완료했습니다!
🚨 버그 발생 이유 (선택 사항)
🔎 후속 작업 (선택 사항)
🤔 질문 사항 (선택 사항)
📚 참고 자료 (선택 사항)
추가적인 참고 사항이나 관련된 문서, 링크 등을 제공해주세요.
📸 스크린샷 (선택 사항)
변경 사항에 대한 스크린샷이 있다면 첨부해주세요.
✅ 셀프 체크리스트
이슈 번호: Close #156