refactor: 반려동물 정보 등록, 수정 관련 리팩터링 #360
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
- PetProfileProvider > PetAdditionProvider로 변경 - PetProfileContext > PetAdditionContext로 변경
- usePetProfileAddition 생성
- usePetProfileStep - usePetProfileValidation - usePetProfileAddition
n0eyes
requested changes
Aug 24, 2023
Comment on lines
51
to
67
| placeholder="여기를 눌러 아이의 이름을 입력해주세요." | ||
| maxLength={10} | ||
| isValid | ||
| onChange={onChangeName} | ||
| design="underline" | ||
| fontSize="1.3rem" | ||
| /> | ||
| <ErrorCaption> | ||
| {isValidNameInput | ||
| ? '' | ||
| : '아이의 이름은 1~10글자 사이의 한글, 영어, 숫자만 입력 가능합니다.'} | ||
| </ErrorCaption> | ||
| </div> | ||
| <div> | ||
| <InputLabel htmlFor="pet-age">나이 선택</InputLabel> | ||
| <PetAgeSelect id="pet-age" onChange={onChangeAge} initialAge={pet.age} /> | ||
| <ErrorCaption>{isValidAgeSelect ? '' : '나이를 선택해주세요!'} </ErrorCaption> |
| key={size} | ||
| role="radio" | ||
| text={size} | ||
| onClick={() => onChangePetSize(size)} |
|
|
||
| export const PetProfileProvider = ({ children }: { children: ReactNode }) => { | ||
| export const PetAdditionProvider = ({ children }: { children: ReactNode }) => { |
There was a problem hiding this comment.
PropsWithChildren이란 타입도 있어요!
Comment on lines
93
to
113
| addPetProfileMutation | ||
| .addPetProfile(petProfile) | ||
| .then(async res => { | ||
| const userInfo = JSON.parse(localStorage.getItem('userInfo')!); | ||
|
|
||
| const userPetBreed = breedList?.find(breed => breed.name === petProfile.breed); | ||
| const petProfileWithId = { | ||
| ...petProfile, | ||
| id: 1, | ||
| petSize: userPetBreed?.name === MIXED_BREED ? petProfile.petSize : PET_SIZES[0], | ||
| } as PetProfile; | ||
|
|
||
| updatePetProfileInHeader(petProfileWithId); | ||
|
|
||
| localStorage.setItem('userInfo', JSON.stringify({ ...userInfo, hasPet: true })); | ||
|
|
||
| alert('반려동물 정보 등록이 완료되었습니다.'); | ||
| }) | ||
| .catch(error => { | ||
| alert('반려동물 정보 등록에 실패했습니다.'); | ||
| }); |
There was a problem hiding this comment.
mutation구조를 수정하고 onSuccess , onError 라이프사이클을 활용해보면 어떨까요?
현재는 너무 명령적인 것 같아요!
localStorage.setItem('userInfo', JSON.stringify({ ...userInfo, hasPet: true }));위 부분도 유저 정보 조회를 invalidate시키는 것으로 대체할 수 있을 것 같아요!
There was a problem hiding this comment.
mutation구조를 수정하고 onSuccess , onError 라이프사이클을 활용하도록 수정했습니다!
그런데 아래 부분은 반영하지 못했습니다🥲
유저 정보 조회를 invalidate해도 auth만 재요청하고 auth/login은 재요청을 하지 않아서
const { mutate: loginZipgo, ...loginRestMutation } = useMutation({
mutationFn: loginZipgoAuth,
onSuccess({ accessToken, authResponse }) {
zipgoLocalStorage.setTokens({ accessToken });
zipgoLocalStorage.setUserInfo(authResponse);
queryClient.invalidateQueries([QUERY_KEY.authenticateUser]);
navigate(routerPath.home());
},
});여기 onSuccess에 있는 로직이 실행되지 않기 때문에 로컬스토리지 내용을 갱신할 수가 없더라구요..?
뭔가 크게 로직을 수정하기에는 너무 오래 걸릴 것 같아서 일단 보류했습니다.
| alert('반려동물 정보 등록에 실패했습니다.'); | ||
| }); | ||
|
|
||
| navigate(routerPath.home()); |
There was a problem hiding this comment.
useEasyNavigate의 goHome 함수를 사용하면 좋을 것 같아요!
Comment on lines
41
to
42
| if (isValidName(petName)) setIsValidNameInput(true); | ||
| if (!isValidName(petName)) setIsValidNameInput(false); |
There was a problem hiding this comment.
Suggested change
| if (isValidName(petName)) setIsValidNameInput(true); | |
| if (!isValidName(petName)) setIsValidNameInput(false); | |
| setIsValidNameInput(isValidName(petName)); |
은 어떤가요!?
- onSuccess, onError 라이프 사이클 활용
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.
📄 Summary
반려동물 정보 등록, 수정 기능 관련하여 리팩터링을 진행했습니다.
🙋🏻 More